@import url('https://fonts.googleapis.com/css2?family=Saira:ital,wght@0,100..900;1,100..900&display=swap');
*{padding:0;margin:0;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}
.autoOpenPopup { position:fixed; top:0; left:0; width:100%; height:100%; z-index:100000000; display:none;}
.autoOpenPopup > div { position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:rgba(0, 0, 0, 0.7); }
.autoOpenPopup > div > div { width:648px; display:flex; flex-wrap:wrap; background:white; transform-origin:bottom; -webkit-transform-origin:bottom; transition:all 0.5s; -webkit-transition:all 0.5s; border-radius: 10px;-webkit-border-radius: 10px;-moz-border-radius: 10px; border-bottom: 6px solid #FF5722; -webkit-border: 2px solid #FF5722; -moz-border: 2px solid #FF5722;}
.autoOpenPopup div > div.active { transition:all 0.5s; -webkit-transition:all 0.5s; position: relative;}
.autoOpenPopup > div > div > i.fa-times {z-index: 9; position:absolute; top:15px; right:15px;width:35px; height:35px;font-size:20px; border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px; display:flex; justify-content:center; align-items:center; cursor:pointer; transition: 0.2s linear;-webkit-transition: 0.2s linear;-moz-transition: 0.2s linear;background: #eee;}
.autoOpenPopup div.main_popup{width:100%;float:left;padding:20px 30px 20px 20px;}
.autoOpenPopup .TopModal {text-align: center;}
.autoOpenPopup .TopModal h3{font-size: 20px; font-family: "Saira", sans-serif; font-optical-sizing: auto; font-weight: 700; margin-top: 10px;}
.autoOpenPopup .TopModal p{margin-bottom: 20px; color: #666; font-family: "Saira", sans-serif; font-optical-sizing: auto; font-weight: 600;}
.autoOpenPopup .ModalBottomIcon ul li{list-style: none; position: relative; color: #555; float: left; width: 50%; text-align: center; font-size: 13px; line-height: 24px; font-family: "Saira", sans-serif; font-optical-sizing: auto; margin: 5px 0px; font-weight: 600;}
.autoOpenPopup .ModalBottomIcon ul li img{width: 23px;}
.autoOpenPopup .ModalBottomIcon ul li span.disc{background: #555; position: absolute; height: 4px; width: 4px; margin: 10px 0px 0px -10px;}



@media (min-width:768px) and (max-width:991px){
    .autoOpenPopup div.main_popup{width:100%;padding:30px 10px;}  
}
@media (max-width:767px){
    .autoOpenPopup > div > div { width:310px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;}
    .autoOpenPopup .TopModal p{font-size: 10px; margin-bottom: 20px;}
    .autoOpenPopup .TopModal h3{font-size: 13px;}
    .autoOpenPopup div.main_popup{padding: 35px 10px 0px 10px;}
}

.airline-card {
  border-radius: 6px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  padding: 15px;
  border: 1px solid #e8e8e8;
  background-color: #fff;
  text-align: left;
  font-family: Arial, sans-serif;
  transition: transform 0.3s ease;
}

.airline-card:hover {
  transform: translateY(-5px);
  background: #fafafa;
}

.airline-code {
  font-size: 14px;
  color: #888;
  margin-bottom: 10px;
  text-align: left;
}

.airline-code span {
  color: #1a73e8;
  font-weight: 600;
  float: right;
}

.airline-card h3.sitenames {
  font-size: 15px;
  font-weight: 600;
  color: #333;
  padding-bottom: 7px;
  margin: 3px 0px 5px 0px;
  border-bottom: 1px solid #e8e8e8;
}

.read-more a {
  color: #2196f3;
  text-decoration: none;
  font-size: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.read-more a:hover {
  text-decoration: underline;
}
.TopAirline .airline_list ul{list-style: none;}
.TopAirline .airline_list ul li{width: 20%; float: left; padding: 0 5px 10px;}
.airline-card:hover .airline-name{color: #2196f3;}

.BottomPopupFixed {
  width: 1026px;
  position: fixed;
  background: #fff;
  bottom: 18px;
  left: 50%;
  z-index: 999;
  background-size: cover;
  background-position: right;
  border: 1px solid #dedede;
  border-bottom: 6px solid #FF5722;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  transform: translateX(-50%) translateY(0px);
  display: block;
  transition: all 0.3s ease-in-out;
  animation: bottomup 0.3s ease-in-out;
  padding: 20px;
  font-family: "Saira", sans-serif; 
  font-optical-sizing: auto;
}
@media screen and (max-width: 580px) {
  .BottomPopupFixed {
    width: 95%;
    bottom: 10px;
    padding: 15px 10px 5px 10px;
    background-position: center;
  }
}
@media screen and (max-width: 992px) {
  .BottomPopupFixed {
    width: 96%;
    bottom: 4px;
    z-index: 99999;
  }
}
@keyframes bottomup {
  0% {
    transform: translateX(-50%) translateY(150px);
  }
  100% {
    transform: translateX(-50%) translateY(0px);
  }
}

 .ModalBottom{margin-top: 0px;}
 .ModalBottom h3 {
  font-size: 20px;
  font-weight: 700;
  margin: 8px 0px 8px 0px;
  text-align: center;
}
 .ModalBottom p {
  color: #666;
  font-weight: 600;
  font-size: 14px;
  text-align: center;
  font-family: "Saira", sans-serif; 
  font-optical-sizing: auto;
  margin-bottom: 0px;
}
 .ModalBottom .ListBottom li {
  width: 100%;
  margin-left: 5px;
  float: left;
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 10px;
  padding: 5px 0px;
  font-size: 14px;
  color: #fff;
}

@media screen and (max-width: 992px) {
.ModalBottom .ListBottom li {font-size: 12px;}
 .ModalBottom h3{font-size: 16px;}
}
@media screen and (max-width: 768px) {
.ModalBottom .ListBottom li {font-size: 10px;}
.ModalBottom h3{font-size: 13px;}
}
 .ModalBottom .ListBottom li img {width: 30px;}
 .topCenterRight .HeadingCenter {padding-left: 10px;}
@media screen and (max-width: 580px) {
 .topCenterRight .HeadingCenter {padding-left: 0px; text-align: center;}
}
 .topCenterRight .HeadingCenter h3 {
  font-size: 24px;
  color: #daad1d;
  font-weight: 600;
  margin: 8px 0px 8px 0px;
}
@media screen and (max-width: 580px) {
 .topCenterRight .HeadingCenter h3 {font-size: 16px; margin-bottom: 2px;}
}
 .topCenterRight .HeadingCenter p {color: #fff;}
@media screen and (max-width: 580px) {
.topCenterRight .HeadingCenter p {font-size: 9px; margin-bottom: 10px;}
}
.topCenterRight {background: #242524; border-radius: 0px 10px 10px 0px; -webkit-border-radius: 0px 10px 10px 0px; -moz-border-radius: 0px 10px 10px 0px; padding: 5px; position: relative; display: flex; align-items: center; justify-content: space-between;}
.autoOpenPopup .topCenterRight{margin-left: 10px; z-index: 0; margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between;}
.autoOpenPopup .topCenterRight::before {
  position: absolute; content: ""; bottom: -4.6px; border: 2px solid #242524; right: -5px; padding: 28px; border-radius: 0px 16px 16px 0px; width: 98.5%; z-index: -1;
}

.topCenterRight::after{position: absolute; content: ""; height: 120%; width: 6px; left: -1px; background: #FF5722; top: -5px; border-radius: 2px;}
.topCenterRight .phoneNumber {margin-bottom: 0px; padding-left: 5px;}
.topCenterRight .phoneNumber a {display: flex; align-items: center; gap: 5px; padding: 3px 12px; color: #fff; font-size: 24px; font-weight: 600; border-radius: 5px; font-family: "Saira", sans-serif; font-optical-sizing: auto;}
.topCenterRight .phoneNumber a:hover {color: #FF5722; text-decoration: none;}
.BootomTFn .phoneNumber a{font-size: 17px; }
.BootomTFn{margin-top: 9px; position: relative;}
.BootomTFn::before{position: absolute; content: ""; bottom: -4.2px; border: 2px solid #242524; right: -5px; padding: 25px; border-radius: 0px 16px 16px 0px; width: 98.5%; z-index: -1;}

@media screen and (max-width: 992px) {
 .topCenterRight .phoneNumber a {font-size: 12px;}
  .topCenterRight{margin-top: 15px;}
  .topCenterRight::after{height: 115%;}
  .ModalBottom{margin-top: 15px;}
  .BootomTFn::before{padding: 19px;}
  .autoOpenPopup .topCenterRight::before{padding: 28px;}
  .autoOpenPopup .PopupBtn a{font-size: 24px;} 
  .TopAirline .airline_list ul li{width: 50%;}
}
@media screen and (max-width: 767px) {
   .topCenterRight .phoneNumber a {font-size: 16px;}
   .topCenterRight{width: max-content; display: block; margin: 0 auto;}
   .autoOpenPopup .topCenterRight{display: block; margin: 0 auto; margin-bottom: 25px;}
   .topCenterRight::after{height: 115%;}
   .ModalBottom{margin-top: 15px;}
   .BootomTFn::before{padding: 37px;}
   .autoOpenPopup > div > div > i.fa-times{top: 10px; right: 10px; width: 26px; height: 26px; font-size: 16px;}
   .autoOpenPopup .topCenterRight::before{padding: 37px;}
   .TopAirline .airline_list ul li{width: 50%;}
  }
@media screen and (max-width: 580px) {
  .topCenterRight .phoneNumber a {padding: 3px 24px; font-size: 18px;}
  .topCenterRight{width: max-content; display: block; margin: 0 auto;}
  .topCenterRight::after{height: 115%;}
  .ModalBottom{margin-top: 15px;}
  .BootomTFn::before{padding: 40px;}
  .autoOpenPopup .topCenterRight::before{padding: 40px;}
  .TopAirline .airline_list ul li{width: 100%;}
   
}
 .topCenterRight .phoneNumber a img {width: 25px; height: 17px; border-radius: 3px;}
