@charset "utf-8";body{font:115%/1.4 Verdana, Arial, Helvetica, sans-serif;}
body{margin:0 auto; padding:0;  background-color:#F0F8FF; background-image:linear-gradient(to bottom right, #F0F8FF, #F0FFFF);}
h1 {font-size: clamp(1.6rem, 4vw, 3rem); text-align: center; text-wrap:balance; background: #00adef; color: #fff; padding: 20px 20px 20px 20px;  margin-bottom: 0px; margin-top: 0px;}
.bottom-border{border-bottom: 10px solid #fff;}
h2 {font-size: clamp(2.3rem, 4vw, 3rem); text-wrap:balance; background: #00adef; color: #fff; padding: 20px 20px 0px 20px; margin-top: 0px; margin-bottom: -10px}
h3 {font-size: 1.2rem; background: #00adef; color: #fff; padding: 20px; margin-top: 0px; margin-bottom: -10px; font-weight: normal;; text-wrap:balance;}
h4 {font-size: 1.6rem; font-weight: bold; color: #00adef; text-wrap:balance; margin-bottom: 0px; margin-top: 0px;}
h5 {font-size: 1.6rem; font-weight: bold; color: #F15A2A;  margin-top: 30px; text-wrap:balance;}
h6{ background: #00adef; color: #fff; padding: 20px;  border-radius: 20px; text-wrap:balance;}
.subtext {font-size: 1.2rem; background: #00adef; color: #fff; padding: 20px; margin-top: -20px; }
h1, h2, h3 { text-shadow:
    -1px -1px 0 #005F85,
     0   -1px 0 #005F85,
     1px -1px 0 #005F85,
     1px  0   0 #005F85,
     1px  1px 0 #005F85,
     0    1px 0 #005F85,
    -1px  1px 0 #005F85,
    -1px  0   0 #005F85;}
a.anchor {
    display: block;
    position: relative;
    top: -60px;
    visibility: hidden;
}

.page-grid {
  display: grid;
  grid-template-columns: 450px 1fr; 
  grid-template-rows: auto 1fr auto;
  min-height: 100dvh;
}


.header-grid {
	min-height: 81px;
	max-height:81px;
	position: sticky;
	position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
	top:0;
	z-index: 2;
  grid-column: 1 / -1;
  background: #fff;}
.header-grid-mobile {
	top:0;
	z-index: 2;
  grid-column: 1 / -1;
  background: #fff;}

.header-mobile-flexbox-item img{width: 100%; max-height:400px; object-fit: contain;}
.navbar {
	align-content: center;
	align-items: center;
	min-height: 1px;
	max-height:52px;
	position: sticky;
	position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
	top:0;
	z-index: 2;
  grid-column: 1 / -1;
  background: #fff;
margin: 0px; padding: 0px}


.sidebar-grid {
	min-width: 330px;
	align-self: start;
	position: sticky;
	 position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
	
	top:81px;
	z-index:1;	
	 height: calc(100vh - 81px); 
	overflow-y: auto;
	
}
.scrollbar-y{}

.main-grid {margin: 0px; padding: 0px 20px 0px 20px; max-width: 1920px
  ;
}
.main-grid i{color:#00adef;}

.main-grid img{width: 100%; max-height: 70lvh; object-fit: cover;}
.main-grid .white {color:#fff;}

.footer-grid {
  line-height: 2;
  background: #00adef;
  padding: 20px;
  color:#fff;
	
	
}
.footer-grid a:link{color:#fff;text-decoration: none; }
.footer-grid a:visited{color:#fff;text-decoration: none}
.footer-grid a:hover{color:#fff;text-decoration: underline; background: none;}
.footer-grid a:active{color:#fff;text-decoration: none}

.footer-faq {
  line-height: 2;
  background: #00adef;
  padding: 20px;
  color:#fff;
}
.footer-faq a:link{color:#fff;text-decoration: none; }
.footer-faq a:visited{color:#fff;text-decoration: none}
.footer-faq a:hover{color:#fff;text-decoration: underline; background: none;}
.footer-faq a:active{color:#fff;text-decoration: none}


.contact-grid {
  line-height: 2;
  background: #00adef;
  padding: 20px 20px 0px 20px;
  color:#fff;
	font-weight: bold; 
  border-bottom: 10px solid #fff;
}
.contact-grid a:link{color:#fff;text-decoration: none; }
.contact-grid a:visited{color:#fff;text-decoration: none}
.contact-grid a:hover{color:#fff;text-decoration: underline; background: none;}
.contact-grid a:active{color:#fff;text-decoration: none}

.footer-aside-grid	   { 
	background: #00adef;padding: 20px;
}
/* Grid */
.header-grid       { grid-area: header; background: #fff; }
.navbar			  { grid-area: nav; background: #fff}
.sidebar-grid      { grid-area: aside; display: flex; flex-direction: column; line-height: 3rem; }
.main-grid         { grid-area: main;  }
.contact-grid	   { grid-area: contact; }
.footer-grid       { grid-area: footer; }
.footer-aside-grid { grid-area: footer-aside;}
.footer-faq { grid-area: footer-faq;}


/* ---------------------------------------------------- */
/* 1. MOBILE DEFAULT (Screens under 960px wide)         */
/* ---------------------------------------------------- */
.page-grid {
  display: grid;
  grid-template-columns: 1fr; 
  grid-template-areas: 
	"header-mobile"
	"nav"
    "main"
	"contact"
	"aside"
	"footer"
	  "footer-faq";
  min-height: 100dvh;
}


/* Also turn the flexbox columns into a single stacked column on mobile */
@media (max-width: 960px) {
  .main-grid {
    flex-direction: column;
  }
	
	
	.footer-aside-grid{display: none;}
	.header-grid{display: none;}
	.sidebar-grid{overflow:hidden; position: static; height: 100%; 
	overflow-y: none;}
	.scrollbar-y{overflow-y: none;}
	.main-grid img{width: 100%; max-height: 400px; object-fit: cover;}
	
}

/* ---------------------------------------------------- */
/* 2. DESKTOP LAYOUT (Screens 961px and wider)          */  
/* ---------------------------------------------------- */
@media (min-width: 961px) {
  .page-grid {
    grid-template-columns: 1fr 4fr;
    grid-template-rows: auto 1fr auto;
    grid-template-areas: 
      "header  header"
      "aside main"
		"footer-aside contact"
      "footer-aside footer"
		"footer-aside footer-faq";
  }.navbar{display: none;}
   .header-grid-mobile{display: none;}
	.main-aviation-fullscreen{padding-left: 20px; padding-right: 20px;}
}

.header-flexbox {
	display:flex;
	justify-content: center;
    align-items: center;
	gap:20px;
	min-height: 81px;
}
#cargo-butler{margin-left:auto; width: 100%; max-width: 320px}

.header-flexbox a:hover{text-decoration: none; background: none;}
.header-flexbox-item img{width: 70%; min-width: 320px; max-height:81px; object-fit: contain}

.header-nav-flexbox {
	display:flex;
	justify-content: space-around;
    align-items: center;
	align-content: center;
	gap:20px;
	min-height: 52px;
	color: #F1592A;
	padding: 0px;
}


.header-nav-flexbox a:link {color: #00adef} .header-nav-flexbox a:visited {color: #00adef} .header-nav-flexbox a:hover {color: #00adef; background: none} .header-nav-flexbox a:active {color: #00adef}
.header-nav-flexbox img{width: 100%; max-height:52px; text-decoration: none;}

.mobile-menu-home{max-height: 37px; max-width: 37px; text-decoration: none;}
.nav-box { 
    background: orange;
    border-bottom: 10px solid #fff;
    perspective: 2000px; 
}

.nav-box a {
    display: block; 
    position: relative;
    width: 100%; 
    height: 4em; 
    line-height: 4em;
    color: #fff;
    font-weight: bold;
    text-decoration: none; 
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d; 
}

.nav-box a .front, 
.nav-box a .back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
    outline: 1px solid transparent;
    -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); 
}

.nav-box a .front {
    background: orange;
    color: #000;
    z-index: 2;
    transform: rotateX(0deg);
}
.nav-box a .back {
    background: #00adef;
    color: #fff;
    transform: rotateX(180deg);
}
.nav-box a:hover .front {
    transform: rotateX(-180deg);
}
.nav-box a:hover .back {
    transform: rotateX(0deg);
} 
.nav-box a .front { color: #000; }
.nav-box a .back { color: #fff; }

.nav-box a:hover .back .arrow {
    color: #00ADEF;
}
.nav-box a .arrow {
    transition: color 0.3s ease; 
}

@media (prefers-reduced-motion: reduce) {
    .nav-box a:hover .front { display: none; }
    .nav-box a:hover .back { transform: none; }
}

.nav-item {text-decoration: none;}
.white {color: #fff;}

.main-aviation-grid {
  display: grid;
  grid-template-columns: 1fr; 
 
  min-height: 100dvh;
}
@media (min-width: 959px) {
.main-aviation-grid{
	display: grid;
	
	gap: 20px
	}}


.main-aviation-grid img{height: auto; width: 100%; object-fit: cover; margin: 0px; padding: 0px;}
.main-aviation-fullscreen{margin-left: -20px; margin-right: -20px;}



.main-flexbox{display: flex;  flex-wrap: wrap; justify-content: flex-start; gap:20px; align-items: flex-start; padding: 20px; margin-bottom: 20px; max-width: 1980px;}


.main-flexbox-item {}
.main-info{background: #fff; border-left: 10px solid #F15A2A; padding: 20px;  margin-top: 20px; margin-bottom: 20px; font-style: italic; text-wrap:balance;}
.main-info-maxwidth{ max-width: 87ch;}
.wip{background: orange; color: #000; padding: 10px;  margin-top: 0px; margin-bottom: 0px; font-weight: bold; text-align: center}
.number-flexbox{display: flex; flex-wrap: wrap; flex-grow: 1; justify-content: flex-start; align-items: flex-start; gap: 20px; }
.number-flexbox-vert{display: flex; flex-direction: column; flex-grow: 1; width: 200px;   margin-top: 20px; margin-bottom: 20px;}
.number-flexbox-bg{font-size: 1.6rem; font-weight: bold; color: #fff; background: #00adef; width: 3.2rem; height: 3.2rem; border-radius: 50%; display: flex; justify-content: center; align-items: center; }
.xl-blue{font-size: 1.6rem; font-weight: bold; color: #00adef; text-wrap:balance; }
.xl-orange{font-size: 1.6rem; font-weight: bold; color: #F15A2A;  margin-top: 30px}
.xl-white{font-size: clamp(1.3rem, 2.5vw, 1.7rem); font-weight: bold; color: #fff; text-shadow: 1px 2px black }
.orange-box{color: #fff; background-color: #F15A2A; padding: 20px; margin:50px auto; text-align: center; border-radius:10px; border-color: #fff; min-width:320px; width: fit-content; font-size:x-large; font-weight: bold; display: block; text-wrap:balance;}
.orange-box li {padding-bottom: 10px;}
.orange-box i{color: #fff;}
.orange-box:link {color: #fff; text-decoration: none;}
.orange-box:visited {color: #fff; text-decoration: none;}
.orange-box:hover {color: #fff; text-decoration: underline;}
 .orange-box:active {color: #fff; text-decoration: none;}

.orange-box-ul{width: fit-content; color: #fff; background-color: #F15A2A; padding: 10px; margin-top:20px; margin-bottom: 30px;  border-radius:10px; border-color: #fff; min-width:320px; max-width: auto; font-size:x-large; }
.orange-box-ul li {padding-bottom: 10px;}
.orange-box-ul i{color: #fff;}

.main-flexbox-blue{display: flex;  flex-wrap: wrap; justify-content: center; gap:20px; align-items: flex-start; padding: 0px; margin-bottom: 0px; width:100%; max-width: 960px;margin: 0 auto;}
.blue-box {color: #fff; background-color: #00adef; padding:20px 2px; margin:20px 2px; text-align: center; border-radius:10px; border-color: #fff; min-width:320px; width: fit-content; font-size:x-large; font-weight: bold; display: block; text-wrap:balance;}
.blue-box i{color: #fff; margin-right: .3em;}
.blue-box:link {color: #fff;text-shadow:
    -1px -1px 0 #005F85,
     0   -1px 0 #005F85,
     1px -1px 0 #005F85,
     1px  0   0 #005F85,
     1px  1px 0 #005F85,
     0    1px 0 #005F85,
    -1px  1px 0 #005F85,
    -1px  0   0 #005F85;  text-decoration: none;}
.blue-box:visited {color: #fff;text-shadow:
    -1px -1px 0 #005F85,
     0   -1px 0 #005F85,
     1px -1px 0 #005F85,
     1px  0   0 #005F85,
     1px  1px 0 #005F85,
     0    1px 0 #005F85,
    -1px  1px 0 #005F85,
    -1px  0   0 #005F85; text-decoration: none;}
.blue-box:hover {color: #fff;text-shadow:
    -1px -1px 0 #005F85,
     0   -1px 0 #005F85,
     1px -1px 0 #005F85,
     1px  0   0 #005F85,
     1px  1px 0 #005F85,
     0    1px 0 #005F85,
    -1px  1px 0 #005F85,
    -1px  0   0 #005F85; text-decoration: underline;}
.blue-box:active {color: #fff;text-shadow:
    -1px -1px 0 #005F85,
     0   -1px 0 #005F85,
     1px -1px 0 #005F85,
     1px  0   0 #005F85,
     1px  1px 0 #005F85,
     0    1px 0 #005F85,
    -1px  1px 0 #005F85,
    -1px  0   0 #005F85; text-decoration: none;}
.blue-line-box-ul{width: fit-content; color: #000; padding: 10px; background-color: #fff; margin-top:20px; margin-bottom: 30px;  border-radius:10px; border: 2px solid #00adef; min-width:320px; max-width: auto; font-size:x-large; }
.blue-line-box-ul li {padding-bottom: 10px;}
.blue-line-box-ul i{color: #00adef;}

.orange-line-box-ul{width: fit-content; color: #000; padding: 10px; background-color: #fff; margin-top:20px; margin-bottom: 30px;  border-radius:10px; border: 2px solid #000; min-width:320px; max-width: auto; }
.orange-line-box-ul li {padding-bottom: 10px;}
.orange-line-box-ul i{color: #00adef;}


.icon-flexbox{display: flex; flex-wrap: wrap; flex-grow: 1; justify-content: flex-start; align-items: flex-start; gap: 20px; }
.icon-flexbox-vert{display: flex; flex-direction: column; flex-grow: 1; width: 180px; margin-top: 20px; margin-bottom: 20px;}

.airplane-flex {display: flex; justify-content: flex-end; align-items: baseline;}
.footer-flex{ display: flex; justify-content: flex-start; flex-wrap: wrap; gap:20px; }
.footer-flex-item{ width: 320px; flex-grow: 1; }
.footer-flex-right{ display: flex; justify-content: flex-end; flex-wrap: wrap; gap:20px;padding-bottom: 50px;}
.footer-flex-item-right{ }
.footer-member-flexbox {
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
    align-items: center;
	align-content: center;
	gap:20px;
	padding: 0px;
	margin-top:70px;
	margin-bottom:70px;
	
	
}
.border {text-shadow:
    -1px -1px 0 #005F85,
     0   -1px 0 #005F85,
     1px -1px 0 #005F85,
     1px  0   0 #005F85,
     1px  1px 0 #005F85,
     0    1px 0 #005F85,
    -1px  1px 0 #005F85,
-1px  0   0 #005F85;}
.footer-member-flexbox img {
	max-height: 90px;        
	width: auto !important;  
	height: auto !important;
    }
.footer-logo{    display: inline-block;
    max-width: 500px;
    width: 100%;margin-right: 20px; }
.footer-logo img{ width: 100%; height: auto;  display: block;}
.fa-rotate-45 {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);}
.fa-rotate-315 {
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    -ms-transform: rotate(315deg);
    -o-transform: rotate(315deg);
    transform: rotate(315deg);}
.fa-custom-bold {
  -webkit-text-stroke: 1.5px currentColor; 
}
.hr-fff{border: 1px solid #fff;}
.airplane-silhouette{margin-left: auto; margin-right: auto; width: 100%; max-width: 320px}
.copyright{font-size:small; text-align:right;}
.font-size-s{font-size: 0.9rem; text-wrap:balance;}
.runway-container {
  position: relative;
	width: 100%;}
.runway {
  border: none;
  height: 60px;
  width: 100%;
  background-color: #2b2b2b; 
  position: relative;
  margin: 40px 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  
  background-image: 
    linear-gradient(to bottom, orange 4px, transparent 4px),
    linear-gradient(to top, orange 4px, transparent 4px),
    repeating-linear-gradient(to right, transparent, transparent 20px, white 20px, white 40px);
  
  background-size: 100% 4px, 100% 4px, 100% 4px;
  background-position: 0 0, 0 100%, 0 28px;
  background-repeat: no-repeat, no-repeat, repeat-x;
  overflow: visible;
}

.runway::before {
  content: "";
  position: absolute;
  left: 15px;
  top: 8px;
  bottom: 8px;
  width: 30px;
  background: repeating-linear-gradient(to bottom, #fff, #fff 4px, transparent 4px, transparent 8px);
}

.runway::after {
  content: "";
  position: absolute;
  left: 55px;
  top: 55%;
  transform: translateY(-50%) rotate(90deg);
  color: #fff;
  font-family: "Courier New", Courier, monospace;
  font-weight: bold;
  font-size: 18px;
  letter-spacing: 5px;
}


.r-01::after { content: "01"; }
.r-02::after { content: "02"; }
.r-03::after { content: "03"; }
.r-04::after { content: "04"; }
.r-05::after { content: "05"; }
.r-06::after { content: "06"; }
.r-07::after { content: "07"; }

.runway + .plane, .plane {
  position: absolute;
  left: 0%; 
  right: 0px;
  margin-top: -130px; 
  height: 120px; 
  pointer-events: none; 
  
  background-image: url('airplane.png');
  background-repeat: no-repeat;
  background-size: 120px 120px;
}
.p-10 { background-position: 11% center;}   
.p-20 { background-position: 24% center; }
.p-30 { background-position: 37% center; }
.p-40 { background-position: 51% center; }  
.p-50 { background-position: 64% center; }
.p-60 { background-position: 77% center; }
.p-70 { background-position: 91% center;}