/*
 * Theme Name: tcmcom_2024
 * Description: tcmcom_2024
 * Theme URI: https://timchuyenbay.com.vn/
 * Version: 1.0
 * Author: ducpham
 * Author URI: https://timchuyenbay.com.vn/
 * Tags: ve may bay gia re, ve may bay khuyen mai
 * Textdomain: https://timchuyenbay.com.vn/
 */


/* ==================== CSS FOR NEW VERSION ==================== */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain).scroll-to-top
*/
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}

ol,
ul {
  list-style: none;
  margin-bottom: 0;
  padding: 0;
}

a {
  text-decoration: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

@font-face {
  font-family: Mt;
  src: url(fonts/Mt/Mt-Regular.otf);
  font-display: swap;
}

@font-face {
  font-family: Mt-SemiBold;
  src: url(fonts/Mt/Mt-SemiBold.otf);
  font-display: swap;
}

@font-face {
  font-family: Mt-Bold;
  src: url(fonts/Mt/Mt-Bold.otf);
  font-display: swap;
}

* {
  box-sizing: inherit;
  margin: 0;
  padding: 0;
}

html {
  font-size: 62.5%;
  line-height: 1.6rem;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

body {
  font-family: Mt, -apple-system, BlinkMacSystemFont, sans-serif !important;
  /* font-family: Arial, Helvetica, sans-serif; */
  overflow-x: hidden;
}


/* =================== SCROLLBAR ================ */
::-webkit-scrollbar,
.popup__wrap::-webkit-scrollbar {
  width: 1rem;
  background-color: var(--scroll-bar-color);
}

::-webkit-scrollbar-thumb,
select::-webkit-scrollbar-thumb,
.popup__wrap::-webkit-scrollbar-thumb {
  background-color: var(--scroll-thumb-color);
}

::-webkit-scrollbar-thumb:hover,
select::-webkit-scrollbar-thumb:hover,
.popup__wrap::-webkit-scrollbar-thumb:hover {
  background-color: var(--text-color-light);
}

select::-webkit-scrollbar {
  width: 0.7rem;
  background-color: var(--scroll-bar-color);
}

/* ================ END SCROLLBAR =============== */


/* ================ SELECTION ================== */
::selection {
  background: var(--redvj-color);
  color: var(--white-color);
}

/* ================ END SELECTION =============== */


/* =================== AMINATION ================ */
@keyframes line-animation {
  0% {
    width: 0;
    opacity: 1;
  }

  99% {
    width: 100%;
    opacity: 1;
  }

  100% {
    width: 100%;
    opacity: 0;
  }
}

@keyframes open-animation {
  0% {
    height: 0;
    top: 50%;
  }

  100% {
    height: 100vh;
    top: 0;
  }
}

@keyframes fade {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes growth {
  from {
    transform: scale(var(--growth-from));
  }

  to {
    transform: scale(var(--growth-to));
  }
}

.global-wrap {
  overflow: hidden;
}

.rotate-90 {
  transform: rotate(90deg);
}

/* .pass {color: var(--green-color);} */
.menu-swiper-mobile {
  display: none;
}


/* ================== Button style ================= */
.btn {
  min-width: 124px;
  text-decoration: none;
  border: none;
  border-radius: 0.375rem;
  font-size: 1.5rem;
  padding: 15px 8px;
  outline: none;
  cursor: pointer;
  color: var(--text-color);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  line-height: 1.6rem;
}

/* row reverse */
.flex-direction-column {
  flex-direction: column !important;
}

.row-reverse {
  flex-direction: row-reverse;
}

/* text color */
.text-white {
  color: var(--white-color);
}

.text-green {
  color: var(--green-color) !important;
}

.text-orange {
  color: var(--orange-color) !important;
}

.text-blue-sky {
  color: #51ade5 !important;
}

.text-default {
  color: var(--text-color) !important;
}

/* background color */
.background-white {
  background-color: var(--white-color);
}

.background-yellow {
  background-color: #ffd205;
}

.background-pink {
  background-color: #f76570;
}

.background-purple {
  background-color: #ba71da;
}

.background-green {
  background-color: #1bbc9b;
}

.background-blue-sky {
  background-color: #51ade5;
}

/* Btn color */
.btn-yellow {
  background-color: #ffd205;
}

.btn-pink {
  background-color: #f76570;
}

.btn-purple {
  background-color: #ba71da;
}

.btn-blue-sky {
  background-color: #51ade5;
}

.btn-orange {
  background-color: #f3a46b;
}

.btn-white {
  background-color: var(--white-color);
}

/* Btn gradient */
.btn-yellow-g {
  background: linear-gradient(to right, #ffd205 0%, #ff9b05 100%);
}

.btn-purple-g {
  background: linear-gradient(to right, #ba71da 0%, #da717b 100%);
}

.btn-pink-g {
  background: linear-gradient(to right, #f76570 0%, #f78d65 100%);
}

.btn-green-g {
  background: linear-gradient(to right, #1bbc9b 0%, #1bbc63 100%);
}

.btn-orange-g {
  background: linear-gradient(to right, #f3a46b 0%, #f3c96b 100%);
}

.btn-blue-sky-g {
  background: linear-gradient(to right, #51ade5 0%, #14d5b1 100%);
}

.btn-green-sky-g {
  background: #00917c;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #54777d, #00917c);
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #54777d, #00917c);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.btn-green-sky-g:hover {
  background: #00917c;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #00917c, #54777d);
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #00917c, #54777d);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.btn-red-g {
  background: var(--saphire-color);
}

.btn-red-g:hover {
  background: var(--bgtitle-color);
}

.btn-blue-g {
  background: linear-gradient(to right, #4facfe 0%, #51ade5 100%);
}

/* Btn hover */
.btn-white:hover {
  background: linear-gradient(to right, #edc3ff 0%, #ffd7db 100%);
}

.btn-yellow:hover {
  background: linear-gradient(to left bottom, #ffd205 0%, #ff9b05 100%);
}

.btn-pink:hover {
  background: linear-gradient(to left bottom, #f76570 0%, #f75c2d 100%);
}

.btn-purple:hover {
  background: linear-gradient(to left bottom, #ba71da 0%, #da717b 100%);
}

.btn-blue-sky:hover {
  background: linear-gradient(to left bottom, #51ade5 0%, #14d5b1 100%);
}

.btn-orange:hover {
  background: linear-gradient(to left bottom, #f3a46b 0%, #ff792c 100%);
}


/* ==================== Canh lề ================= */
.mt-6 {
  margin-top: 6px;
}

.mb-6 {
  margin-bottom: 6px;
}

.mt-15 {
  margin-top: 15px;
}

.mt-25 {
  margin-top: 25px;
}

.mt-32 {
  margin-top: 32px;
}

.mb-32 {
  margin-bottom: 32px;
}

.pdr-32 {
  padding-right: 32px;
}

.no-wrap {
  flex-wrap: nowrap;
}

.m0-auto {
  margin: 0 auto !important;
}

.form-group {
  margin-bottom: 15px;
}


/* ================= TOGGLE SWICHES ============= */
.toggle-switches {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.toggle-direction {
  position: relative;
  display: block;
  width: 40px;
  height: 20px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transform: translate3d(0, 0, 0);
}

.toggle-direction:before {
  content: "";
  position: relative;
  top: 3px;
  left: 3px;
  width: 34px;
  height: 14px;
  display: block;
  background: #9a9999;
  border-radius: 10px;
  transition: background 0.2s ease;
}

.toggle-direction span {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  display: block;
  background: white;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(154, 153, 153, 0.5);
  transition: all 0.2s ease;
}

.toggle-direction span:before {
  content: "";
  position: absolute;
  display: block;
  margin: -18px;
  width: 56px;
  height: 56px;
  background: var(--bgdecs-color);
  border-radius: 50%;
  transform: scale(0);
  opacity: 1;
  pointer-events: none;
}

#cbx:checked+.toggle-direction:before {
  background: #ff8787;
}

#cbx:checked+.toggle-direction span {
  background: var(--saphire-color);
  transform: translateX(20px);
  transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease;
  box-shadow: 0 3px 8px rgba(79, 46, 220, 0.2);
}

#cbx:checked+.toggle-direction span:before {
  transform: scale(1);
  opacity: 0;
  transition: all 0.4s ease;
}


/* ================= Breadcumb ================== */
#progressbar {
  overflow: hidden;
  margin-bottom: 20px;
  overflow: hidden;
  counter-reset: step;
  /* box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px,
    rgb(209, 213, 219) 0px 0px 0px 1px inset; */
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  padding: 20px;
  border-radius: var(--border-radius);
  background: var(--white-color);
}

#progressbar li {
  list-style-type: none;
  color: #808080;
  float: left;
  position: relative;
  text-align: center;
  width: 25%;
  font-size: 14px;
}

#progressbar li::before {
  content: counter(step);
  counter-increment: step;
  width: 20px;
  line-height: 20px;
  display: block;
  font-size: 12px;
  color: #333;
  background: rgba(203, 203, 203, 0.2);
  border-radius: 3px;
  text-align: center;
  margin: auto;
  margin-bottom: 5px;
}

#progressbar li::after {
  content: "";
  width: 71%;
  height: 2px;
  background: #dbdbdb;
  position: absolute;
  right: 65%;
  top: 9px;
}

#progressbar li:first-child:after {
  content: none;
}

#progressbar li.current:before {
  background: var(--main-color);
  color: var(--white-color);
  z-index: 5;
  margin-bottom: 5px;
}

#progressbar li.current span {
  color: var(--main-color);
  font-weight: bold;
}

#progressbar li.current:after,
#progressbar li.pass:before,
#progressbar li.pass:after {
  background: var(--succsess-color);
  color: var(--white-color);
  z-index: 5;
  margin-bottom: 5px;
}

#progressbar li.pass a {
  color: var(--succsess-color);
  font-weight: normal;
}

#progressbar li.pass:hover a {
  text-decoration: underline;
}


/* ================= Scroll to top ============== */
.scroll-to-top {
  position: fixed;
  right: 35px;
  bottom: 50px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: all 0.3s ease;
  display: none;
  cursor: pointer;
  z-index: 10;
  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
  background-color: var(--white-color);
}

#return-to-top {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.scroll-to-top svg {
  position: absolute;
  font-size: 22px;
  font-weight: 700;
  transition: transform 0.5s ease-in;
  fill: #333;
}

.scroll-to-top:hover svg {
  transform: rotate(360deg);
}

/* =========== End Scroll to top ========= */

/* =========== ZALO support ============== */
.btn-support__contact.btn-hotline-visible,
.btn-support__contact.btn-zalo-visible {
  visibility: visible
}


.btn-support__contact {
  position: fixed;
  visibility: hidden;
  cursor: pointer;
  z-index: 50 !important;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  transition: visibility .5s;
  right: 5px;
  bottom: 100px;
  background-color: transparent;
  width: 80px;
  height: 80px
}

.btn-support__contact.btn-hotline-blue {
  bottom: 170px;
}

.btn-zalo-circle {
  top: 5px;
  left: 5px;
  position: absolute;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  border: 2px solid #2962ff;
  -webkit-animation: btn-zalo-circle-animation 1.2s ease-in-out infinite;
  animation: btn-zalo-circle-animation 1.2s ease-in-out infinite;
  transition: all .5s;
  transform-origin: 50% 50%;
  opacity: .5
}

.btn-hotline-blue .btn-zalo-circle {
  border: 2px solid #008d0b;
}

.btn-zalo-circle-fill {
  width: 60px;
  height: 60px;
  top: 10px;
  left: 10px;
  position: absolute;
  border-radius: 100%;
  border: 2px solid transparent;
  opacity: .1;
  -webkit-animation: btn-zalo-circle-fill-animation 2.3s ease-in-out infinite;
  animation: btn-zalo-circle-fill-animation 2.3s ease-in-out infinite;
  transition: all .5s;
  transform-origin: 50% 50%;
  background-color: #61c5ff;
  opacity: .75 !important
}

.btn-hotline-blue .btn-zalo-circle-fill {
  background-color: #aaffb0;
}


.btn-zalo-img-circle {
  width: 40px;
  height: 40px;
  top: 20px;
  left: 20px;
  background-size: 30px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: 50%;
  border-radius: 100%;
  border: 2px solid transparent;
  /* opacity: .7; */
  opacity: 1;
  -webkit-animation: btn-zalo-img-circle-animation 1s ease-in-out infinite;
  animation: btn-zalo-img-circle-animation 1s ease-in-out infinite;
  transform-origin: 50% 50%;
  background-image: url('./images/icon-zalo.svg');
  background-color: #2962ff;
}

.btn-zalo-img-circle.btn-hotline-img-circle {
  background-image: url('./images/icon-hotline.svg');
  background-color: #2bb741;
}

@-webkit-keyframes btn-zalo-circle-animation {
  0% {
    transform: rotate(0) scale(.5) skew(1deg);
    opacity: .1
  }

  30% {
    transform: rotate(0) scale(.7) skew(1deg);
    opacity: .5
  }

  to {
    transform: rotate(0) scale(1) skew(1deg);
    opacity: .1
  }
}

@keyframes btn-zalo-circle-animation {
  0% {
    transform: rotate(0) scale(.5) skew(1deg);
    opacity: .1
  }

  30% {
    transform: rotate(0) scale(.7) skew(1deg);
    opacity: .5
  }

  to {
    transform: rotate(0) scale(1) skew(1deg);
    opacity: .1
  }
}

@-webkit-keyframes btn-zalo-img-circle-animation {
  0% {
    -webkit-transform: rotate(0) scale(1) skew(1deg)
  }

  10% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
  }

  20% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg)
  }

  30% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
  }

  40% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg)
  }

  50% {
    -webkit-transform: rotate(0) scale(1) skew(1deg)
  }

  to {
    -webkit-transform: rotate(0) scale(1) skew(1deg)
  }
}

@keyframes btn-zalo-img-circle-animation {
  0% {
    -webkit-transform: rotate(0) scale(1) skew(1deg)
  }

  10% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
  }

  20% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg)
  }

  30% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
  }

  40% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg)
  }

  50% {
    -webkit-transform: rotate(0) scale(1) skew(1deg)
  }

  to {
    -webkit-transform: rotate(0) scale(1) skew(1deg)
  }
}

@-webkit-keyframes btn-zalo-circle-fill-animation {
  0% {
    transform: rotate(0) scale(.7) skew(1deg);
    opacity: .2
  }

  50% {
    transform: rotate(0) scale(1) skew(1deg);
    opacity: .2
  }

  to {
    transform: rotate(0) scale(.7) skew(1deg);
    opacity: .2
  }
}

@keyframes btn-zalo-circle-fill-animation {
  0% {
    transform: rotate(0) scale(.7) skew(1deg);
    opacity: .2
  }

  50% {
    transform: rotate(0) scale(1) skew(1deg);
    opacity: .2
  }

  to {
    transform: rotate(0) scale(.7) skew(1deg);
    opacity: .2
  }
}

/* ==================== Toast =================== */
.toast-warning {
  min-width: 400px;
  max-width: 500px;
  background-color: var(--white-color);
  color: var(--black-color);
  z-index: 1010;
  padding: 10px;
  font-size: 14px;
  position: fixed;
  top: 20%;
  right: 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-left: 4px solid var(--main-color);
  box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px,
    rgba(17, 17, 26, 0.05) 0px 8px 32px;
  transition: all linear 0.3s;
}

.toast-content {
  padding: 10px 0;
  width: 100%;
}

.toast-warning .progress {
  height: 4px;
  margin-bottom: 0;
  width: 100%;
}

.toast-warning .progress-bar {
  background-color: var(--main-color);
}

.toast-flight_depart .progress-bar,
.toast-flight_return .progress-bar {
  background-color: var(--blue-color);
}

.toast-flight_depart,
.toast-flight_return {
  border-left-color: var(--blue-color);
}

.toast-passenger,
.toast-location,
.toast-flight_depart,
.toast-flight_return,
.toast-changedate-desdate,
.toast-changedate-depdate,
.toast-flight_empty {
  transform: translateX(115%);
}

.toast-changedate-desdate span,
.toast-changedate-depdate span,
.toast-location span,
.toast-flight_depart span,
.toast-flight_return span,
.toast-flight_empty span {
  /* .toast-warning span { */
  flex: 1;
  text-align: left;
}

.toast-changedate-desdate.active,
.toast-changedate-depdate.active,
.toast-passenger.active,
.toast-location.active,
.toast-flight_depart.active,
.toast-flight_return.active,
.toast-flight_empty.active {
  /* .toast-warning.active { */

  transform: translateX(0);
}

.toast-warning svg {
  color: var(--main-color);
  font-size: 24px;
  margin: 0 10px;
  cursor: pointer;
}

/* =============== End Toast =================*/


/* =============== Button Tìm chuyến bay =============== */
.button-gradient {
  display: block;
  width: 320px;
  max-width: 100%;
  margin-bottom: 0;
  overflow: hidden;
  position: relative;
  transform: translatez(0);
  text-decoration: none;
  box-sizing: border-box;
  font-size: 22px;
  font-weight: normal;
  border: none;
}

.button-gradient.continue {
  width: 250px;
}

.button-gradient.sidebar-continue,
.button-gradient.home {
  width: 100%;
  /* margin-top: 10px; */
  font-size: 20px;
}

.button-gradient.book {
  width: 270px;
  margin: auto 0 auto auto;
}

.instagram {
  text-align: center;
  border-radius: 50px;
  padding: 10px;
  color: var(--white-color);
  background: var(--saphire-color);
  /* background: var(--bgtitle-color); */
  /* transition: all 0.2s ease-out 0s; */
  font-weight: bold;
  width: 100%;
}

button.instagram {
  text-align: center;
  border-radius: 50px;
  padding: 10px;
  color: var(--white-color);
  background: var(--saphire-color);
  font-weight: bold;
  width: 100%;
  transform: none;
}

button.instagram:hover {
  background: var(--main-color);
}

.instagram.book {
  padding: 12px;
}

a.instagram:hover {
  color: var(--black-color);
}

.gradient {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  bottom: auto;
  margin: auto;
  z-index: -1;
  background: radial-gradient(90px circle at top center,
      rgb(161 45 202 / 80%) 30%,
      rgba(255, 255, 255, 0));
  transition: all 0s ease-out 0s;
  transform: translatex(-140px);
  animation: 18s linear 0s infinite move;
}

@keyframes move {
  0% {
    transform: translatex(-140px);
  }

  25% {
    transform: translatex(140px);
    opacity: 0.3;
  }

  50% {
    transform: translatex(140px);
    opacity: 1;
    background: radial-gradient(90px circle at bottom center,
        rgb(161 45 202 / 80%) 30%,
        rgba(255, 255, 255, 0));
  }

  75% {
    transform: translatex(-140px);
    opacity: 0.3;
  }

  100% {
    opacity: 1;
    transform: translatex(-140px);
    background: radial-gradient(90px circle at top center,
        rgb(161 45 202 / 80%) 30%,
        rgba(255, 255, 255, 0));
  }
}

/* icon */
.svg-plane {
  fill: var(--saphire-color) !important;
  margin-bottom: 4px;
  transform: rotate(180deg);
}

.journey-line {
  border-left: 1px solid var(--saphire-color);
  height: 132px;
  padding-bottom: 24px;
  width: 1px;
  padding-top: 4px;
}


/* =============== TITLE =============== */
.section-title {
  margin-bottom: 10px;
  font-size: 30px;
  line-height: 30px;
  color: var(--title-color);
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  position: relative;
  z-index: 0;
  /* text-transform: uppercase; */
  letter-spacing: 2px;
}

.section-title a {
  color: var(--saphire-color);
}

.box-title {
  position: absolute;
  left: 0;
  bottom: 0;
  color: var(--white-color);
  width: 100%;
  /* height: 70px; */
  display: flex;
  padding: 60px 0 15px 15px;
  font-size: 18px;
  /* background: linear-gradient(180deg,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.7) 100%); */
  background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
  align-items: flex-end;
  font-weight: 600;
  line-height: 24px;
  border-radius: 0px 0px 8px 8px;
}

.swiper-wrapper .box-title {
  border-radius: 0;
  padding: 0 0;
  margin: 0;
  text-align: center;
  display: block;
  height: 55px;
  font-size: 18px;
}

.box-heading {
  font-size: 16px;
  line-height: 20px;
  font-weight: 600;
  color: var(--title-color);
  margin-bottom: 12px;
  line-height: 20px;
  text-transform: uppercase;
}

.box-subheading {
  font-size: 16px;
  line-height: 20px;
  font-weight: 600;
  margin: 0;
}

.box-heading-h6,
.thead-title,
.name__passenger--title {
  font-size: 14px;
  font-weight: 600;
  line-height: 16px;
  color: var(--title-color);
  margin-bottom: 0;
}

.title-input,
.title-select,
.caption-details,
.caption-birthday {
  color: var(--title-color);
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
  margin-bottom: 5px;
}

.box-subheading-span,
.tbody-title {
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--text-color);
}


/* =============== BREADCRUMB =============== */
.breadcrumb__list {
  display: flex;
  align-items: center;
  margin-top: 25px;
}

.breadcrumb__list li#breadcrumbs {
  margin: auto 0;
  font-size: 14px;
  color: var(--text-color);
}

.breadcrumb__list li#breadcrumbs a {
  color: var(--text-color);
}

.breadcrumb__list li#breadcrumbs:hover a {
  color: var(--saphire-color);
}

li.breadcrumb__item {
  position: relative;
  display: flex;
  align-items: center;
}

li.breadcrumb__item:hover a {
  color: var(--saphire-color);
}

li.breadcrumb__item a {
  font-size: 14px;
  line-height: 20px;
  margin-right: 10px;
  color: var(--title-color);
}

li.breadcrumb__item span {
  font-size: 16px;
  font-weight: 400;
  color: var(--text-color);
}

li.breadcrumb__item.current a {
  color: var(--saphire-color);
}

/* CSS FOR ERR */
.err__name {
  margin-top: 5px;
  font-size: 14px;
  color: var(--redvj-color);
}

/* Position */
.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-right {
  display: flex;
  justify-content: right;
  align-items: center;
}

.cursor-pointer {
  cursor: pointer;
}

/* Menu table and tablet */
.menu-control__tablet-wrap,
.menu-control__mobile-wrap {
  display: none;
}

/* Check box */
.form-control:disabled {
  background-color: transparent;
  cursor: default !important;
}

.form-group {
  cursor: pointer;
}


/* =============== CUSTOM DATEPICKER =============== */
#ui-datepicker-div {
  padding: 10px !important;
  border-radius: 0.375rem !important;
  width: 28em;
  box-shadow: rgb(0 0 0 / 5%) 0px 0px 0px 1px,
    rgb(209 213 219) 0px 0px 0px 1px inset !important;
}

#ui-datepicker-div .ui-datepicker-header {
  background: none;
  padding: 0;
  border: 0;
}

.ui-datepicker-year {
  color: var(--title-color);
  font-size: 16px;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  width: 40px !important;
  height: 22px !important;
  top: 0 !important;
}

.ui-datepicker-month {
  font-size: 16px;
  color: var(--saphire-color);
  margin-right: 5px;
}

/* custome price ticket */
.ui-datepicker td a[title]:hover::after {
  content: attr(title);
  position: absolute;
  background-color: white;
  border: 1px solid black;
  padding: 5px;
  z-index: 9999;
  left: 0;
  top: 100%;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  cursor: pointer;
}

.ui-datepicker th {
  font-size: 13px;
}

table.ui-datepicker-calendar tbody tr td a.ui-state-default {
  border: 1px solid #ccc;
  font-size: 15px;
  color: var(--saphire-color);
  font-weight: 600;
}

table.ui-datepicker-calendar tbody tr td {
  position: relative;
  width: 14.2857%;
  line-height: 0;
  padding-top: 5px;
  height: 45px;
  border: 1px solid var(--border-color);
  background: var(--white-color);
  padding: 7px;
  color: var(--black-color);
  text-align: center;
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
}

table.ui-datepicker-calendar tbody tr td.ui-state-disabled {
  background-color: #dbdbdb;
}

table.ui-datepicker-calendar tbody tr td a {
  padding: 7px 0 7px 2px !important;
  text-align: left;
}

table.ui-datepicker-calendar tbody tr td.ui-datepicker-current-day {
  background-color: var(--saphire-color) !important;
}

.ui-datepicker table.ui-datepicker-calendar td a span.ui-datepicker-lunar {
  display: block;
}

.ui-datepicker .ui-state-highlight span.ui-datepicker-lunar {
  color: #333;
}

.ui-datepicker .ui-state-active span.ui-datepicker-lunar {
  color: #333;
}

table.ui-datepicker-calendar .ui-state-default,
.ui-widget-content table.ui-datepicker-calendar .ui-state-default,
.ui-widget-header table.ui-datepicker-calendar .ui-state-default {
  border-radius: 0;
  border: none;
  background: none;
}

table.ui-datepicker-calendar>thead>tr>th:nth-child(6)>span {
  color: var(--saphire-color);
}

table.ui-datepicker-calendar>thead>tr>th:nth-child(7)>span {
  color: var(--redvj-color);
}

table.ui-datepicker-calendar td.ui-datepicker-current-day a.ui-state-active {
  background-color: var(--saphire-color) !important;
  font-size: 13px;
}

.ui-datepicker table.ui-datepicker-calendar td a:hover span.ui-datepicker-day {
  color: #333;
}

.ui-datepicker table.ui-datepicker-calendar td a:hover span.ui-datepicker-lunar {
  color: #333;
}

.ui-datepicker table.ui-datepicker-calendar td a:hover {
  background: var(--white-color) !important;
  color: #333;
  border: 0;
}

.ui-datepicker table.ui-datepicker-calendar td:nth-child(6) .ui-datepicker-day {
  color: #158cb3 !important;
}

.ui-datepicker table.ui-datepicker-calendar td:nth-child(7) .ui-datepicker-day {
  color: var(--redvj-color) !important;
}

.ui-datepicker .ui-datepicker-lunar {
  text-align: right;
  font-size: 13px;
  font-weight: 400;
  line-height: 100%;
  color: var(--text-color);
  padding: 4px 4px 0 0;
}

.ui-datepicker td a span.ui-datepicker-day {
  text-align: left;
}

.ui-datepicker table.ui-datepicker-calendar td span.ui-datepicker-day {
  padding: 7px 0 7px 2px !important;
  text-align: left;
}

.ui-datepicker table.ui-datepicker-calendar td span.ui-datepicker-lunar {
  padding-right: 1px !important;
}

.ui-datepicker table.ui-datepicker-calendar a.ui-state-default span.lunar-date-tet {
  color: var(--white-color);
  background: var(--redvj-color);
  padding: 4px 4px 4px 0 !important;
}

.ui-datepicker table.ui-datepicker-calendar a.ui-state-default span.lunar-date-leap {
  color: var(--white-color);
  background: #ffc52a;
  padding: 4px 4px 4px 0 !important;
}

.ui-datepicker table.ui-datepicker-calendar a.ui-state-hover span.lunar-date-tet {
  color: var(--white-color) !important;
}

.ui-datepicker table.ui-datepicker-calendar a.ui-state-hover span.lunar-date-leap {
  color: var(--white-color) !important;
}

table.ui-datepicker-calendar td.ui-datepicker-current-day a.ui-state-active {
  color: var(--white-color);
  font-size: 13px;
}

table.ui-datepicker-calendar td.ui-datepicker-current-day span.ui-datepicker-lunar {
  color: var(--white-color);
}

table.ui-datepicker-calendar td.ui-datepicker-current-day a.ui-state-active.ui-state-hover {
  background-color: var(--saphire-color) !important;
}

.ui-datepicker table.ui-datepicker-calendar span.lunar-date-tet {
  color: var(--white-color);
  background: var(--redvj-color);
  padding: 4px 4px 4px 0 !important;
}

table.ui-datepicker-calendar td.ui-state-disabled span.ui-state-default {
  padding: 7px 0 7px 2px !important;
  text-align: left;
  font-size: 12px;
}

.ui-datepicker table.ui-datepicker-calendar tbody tr td span.ui-datepicker-lunar.lunar-date-tet {
  padding-right: 7px !important;
}

/* =============== END CUSTOM DATEPICKER =============== */


/* =============== HEADER =============== */
.hidden {
  display: none;
  /* Resolve delay css when load page */
}

/*.bg-global {
  background-image: url(images/img/Images-bg/background_home.webp);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;

  background: rgb(255, 240, 255);
  background: linear-gradient(180deg, rgba(255, 240, 255, 1) 0%, rgba(197, 231, 255, 1) 70%, rgba(220, 252, 255, 1) 100%);
}*/

.header {
  z-index: 10;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* padding: 15px; */
  transition: 0.5s ease;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 10px 0px, rgba(0, 0, 0, 0.01) 0px 2px 4px -1px;
}

.header-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header__logo {
  display: flex;
  align-items: center;
  width: 280px;
}

.header__logo--img {
  position: relative;
  display: block;
  width: 25%;
  /* top: -4px; */
  cursor: pointer;
}
.header__logo--text{
	font-size: 16px;
margin: auto;
font-weight: bold;
padding-left: 20px;

}
.header__logo--link {
  cursor: pointer;
  display: flex;
  color: var(--main-color);
  font-size: 18px;
  font-weight: 600;
}

.header__logo--link:hover {
  color: var(--main-color);
}

.header-nav {
  display: flex;
  align-items: center;
  padding: 0 15px;
  list-style: none;
  flex: 1;
}

.nav__item {
  position: relative;
  padding: 15px 0px;
  cursor: pointer;
  margin: 0 15px;
}

/* .nav__item::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0px;
  width: 0%;
  height: 3px;
  background: #0060f0;
  transition: all 0.3s;
  border-radius: 5px;
} */
.nav__item:hover::before {
  width: 100%;
}

.nav__item--link {
  display: block;
  color: var(--black-color);
  font-size: 15px;
  line-height: 18px;
  text-decoration: none;
  letter-spacing: 1px;
  font-weight: 600;
}

.boxes {
  min-width: 10%;
}

.boxes a {
  display: none;
}

.header-phone {
  color: var(--white-color);
  display: flex;
  font-size: 17px;
  margin: 0;
  justify-content: center;
  align-items: center;
}

.header-phone-method {
  color: var(--saphire-color);
  font-weight: 600;
}

.header-phone:hover {
  color: var(--black-color);
}

.accountant-phone {
  display: block;
  text-align: center;
}

.accountant-phone:hover a {
  color: var(--saphire-color);
}

.phone-number {
  font-weight: 600;
}

/* Search */
.search__section {
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.section__decs {
  color: var(--text-color);
  padding: 12px;
  border-bottom: 1px solid rgb(237, 242, 247);
  font-size: 14px;
  background-color: var(--bgdecs-color);
  border-radius: 8px;
  line-height: 22px;
  margin-bottom: 10px;
}

ul.section__decs {
  line-height: 25px;
}

.section__decs strong {
  color: var(--saphire-color);
}

ul.section__decs li {
  display: flex;
  align-items: center;
}

ul.section__decs li p {
  margin: 0;
}

.search__title {
  margin: 0 0 0 10px;
  font-size: 4rem;
  line-height: 20px;
  color: var(--white-color);
  font-weight: bold;
  text-align: center;
  padding: 15px 0;
  margin-bottom: 20px;
}

.form-control {
  padding: 10px;
  font-size: 14px;
  color: var(--text-color);
  appearance: auto;
  border-radius: 10px;
}


/* List dep and list des */
#select-dep,
#select-des {
  display: none;
}


.grid {
  list-style: none;
}

.gc {
  box-sizing: border-box;
  display: inline-block;
  margin-right: -0.25em;
  min-height: 1px;
  vertical-align: top;
}

.gc--1-of-4 {
  width: 25%;
}

.gc--3-of-4 {
  width: 75%;
}

.list__dep--wrap-mobile,
.list__ret--wrap-mobile {
  display: none;
}

.list__dep--wrap,
.list__ret--wrap {
  height: 400px;
  position: absolute;
  top: 75%;
  min-width: 80%;
  padding: 15px;
  border-radius: 8px;
  background: #fff;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  z-index: 10;
}

#listDes .list__ret--wrap {
  left: 15%;
}

.list__dep--wrap .menu div,
.list__ret--wrap .menu div {
  padding: 12px 20px 12px 40px;
  margin-bottom: 10px;
  color: var(--title-color);
  background: var(--white-color);
  box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em,
    rgba(90, 125, 188, 0.05) 0px 0.25em 1em;
  cursor: pointer;
  position: relative;
  vertical-align: middle;
  font-weight: 700;
  transition: 0.5s all cubic-bezier(0.075, 0.82, 0.165, 1);
  text-transform: uppercase;
  font-size: 14px;
}

.menu div:last-child {
  margin-bottom: 0px;
}

.list__dep--wrap .menu div:hover,
.list__ret--wrap .menu div:hover {
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px,
    rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

.list__dep--wrap .menu div span.light,
.list__ret--wrap .menu div span.light {
  height: 10px;
  width: 10px;
  position: absolute;
  top: 17px;
  left: 15px;
  background-color: var(--text-color);
  border-radius: 100%;
  transition: 0.5s all cubic-bezier(0.075, 0.82, 0.165, 1);
}

.list__dep--wrap .menu div.active span.light,
.list__ret--wrap .menu div.active span.light {
  background-color: var(--saphire-color);
  left: 0;
  height: 100%;
  width: 3px;
  top: 0;
  border-radius: 0;
}

.list__dep--wrap .menu div.active,
.list__ret--wrap .menu div.active {
  color: var(--saphire-color);
  padding: 12px 20px;
}

ul.list-area {
  position: relative;
  height: 0px;
  list-style: none;
  margin: 0;
  padding: 0;
  transition: 0.5s all cubic-bezier(0.075, 0.82, 0.165, 1);
}

ul.list-area li {
  opacity: 0;
  list-style: none;
  transition: 0.5s all cubic-bezier(0.075, 0.82, 0.165, 1);
  /* display: none; */
  transform: translateX(50px);
  position: absolute;
}

ul.list-area li.active {
  transition-delay: 0.3s;
  z-index: 2;
  opacity: 1;
  /* display: block; */
  transform: translateX(0px);
}

li.list-area__item.list-destination:not(.active) {
  display: none;
}

.list-area__item {
  display: flex;
  padding: 15px 10px 10px 30px;
}

.list-destination {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.destination-item {
  /* width: 30%;
  cursor: pointer; */
  cursor: pointer;
  color: var(--black-color);
  background-color: #EDF2F7;

  border-radius: 8px;
  padding: 6px 8px;
  width: fit-content;

}

.destination-item:hover {
  color: var(--main-color);
}

.destination-title {
  font-size: 14px;
  text-transform: capitalize;
}

input#search_dep--mobile,
input#search_ret--mobile,
input#search_dep,
input#search_ret {
  width: 100%;
  padding: 8px 13px;
  font-size: 14px;
  margin: 0 10px;
  outline: none;
  border: 1px solid var(--border-color);
  border-radius: 0.375rem;
}

.easy-autocomplete {
  width: auto !important;
}


.result_des--wrap,
.result_dep--wrap {
  position: absolute;
  top: 60px;
  z-index: 101;
  background: var(--white-color);
  left: 26%;
  width: 70%;
  margin: 0 20px;
  max-height: 270px !important;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  padding: 10px;
  border-radius: 8px;
  display: none;
}

.result_des--wrap.active,
.result_dep--wrap.active {
  display: block;
}


ul#result_dep li,
ul#result_ret li,
ul#result_dep--mobile li,
ul#result_ret--mobile li {
  padding: 10px 8px;
  font-size: 12px;
  color: var(--text-color);
  cursor: pointer;
  width: fit-content;
  margin-bottom: 4px;
}

ul#result_dep li:last-child,
ul#result_ret li:last-child {
  margin-bottom: 0px;
}

ul#result_dep li:hover,
ul#result_ret li:hover {
  background: #EDF2F7;
  border-radius: 8px;
}

ul#result_dep .value-dep-location .value-dep,
ul#result_ret .value-des-location .value-des {
  font-size: 14px;
  font-family: 'Mt';
  color: var(--title-color);
  line-height: 25px;
  font-weight: 600;
}

ul#result_dep .value-dep-location .value-dep-country,
ul#result_ret .value-des-location .value-des-country {
  font-size: 13px;
  font-family: 'Mt';
  color: rgba(0, 0, 0, 0.7);
  line-height: 14px;
}


ul#result_dep,
ul#result_ret,
ul#result_dep--mobile,
ul#result_ret--mobile {
  color: var(--title-color);
  display: flex;
  align-items: flex-start;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: flex-start;
  height: auto !important;
}


/* Passenger */
.hide {
  display: none !important;
}

.show {
  display: flex !important;
}

.group-passenger {
  position: relative;
}

.dropdown-box-inner {
  position: absolute;
  /* top: 200%; */
  left: 0;
  background: #fff;
  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
    rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
  width: 200%;
  left: 0;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  z-index: 10;
}

.row-adult,
.row-child,
.row-infant {
  align-items: center;
  padding: 0 0 8px;
  /* border-bottom: 1px solid #ccc; */
}

.row-child {
  padding: 8px 0;
}

.row-infant {
  border-bottom: none;
  padding: 8px 0 0;

}

.row-confirm {
  display: none;
}

.title-people {
  color: #000;
  font-size: 14px;
  font-weight: 400;
  text-transform: capitalize;
}

.btn-group {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.btn-value,
input.input-value {
  color: #000;
  font-weight: 600;
  width: 24px;
  display: flex;
  font-size: 16px;
  line-height: 19px;
  justify-content: center;
  outline: none;
  border: none;
  text-align: center;
}


/* Begin search */
.section__search--wrap {
  width: 100%;
}

.booking-form {
  position: relative;
  background: var(--white-color);
  border-radius: 8px;
  box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px,
    rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px,
    rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;
}

.booking-form .form-btn {
  padding: 15px 5px;
}

.booking-form .submit-btn {
  display: block;
  border: none;
  border-radius: 24px;
  box-shadow: 0 1px 3px 0 rgb(60 64 67 / 30%), 0 4px 8px 3px rgb(60 64 67 / 15%);
  background: var(--main-button-color);
  color: var(--black-color);
  text-transform: capitalize;
  margin: 0 auto;
}

.booking-form .submit-btn:hover {
  box-shadow: 0px 2px 4px -1px rgb(0 0 0 / 20%), 0px 4px 5px 0px rgb(0 0 0 / 14%), 0px 1px 10px 0px rgb(0 0 0 / 12%);
  /* background-color: #F02027; */
}

.booking-form .submit-btn:active {
  box-shadow: 0px 2px 4px -1px rgb(0 0 0 / 20%), 0px 4px 5px 0px rgb(0 0 0 / 14%), 0px 1px 10px 0px rgb(0 0 0 / 12%);
  /* background-color: #F02027; */
  color: #fff;
  transition: border 280ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
  --mdc-ripple-fg-size: 75px;
  --mdc-ripple-fg-scale: 1.89628;
  --mdc-ripple-fg-translate-start: 12.7455px, -6.75775px;
  --mdc-ripple-fg-translate-end: 25.5125px, -17.5px;
}

.booking-form .submit-btn .icon-search {
  margin-right: 5px;
}

.booking-form .submit-btn .icon-search svg {
  width: 2.25rem;
  height: 2.25rem;
  margin-bottom: 3px;
}


.booking-form .form-search-label {
  color: var(--saphire-color);
  display: block;
  font-weight: 600;
  height: 25px;
  line-height: 25px;
  font-size: 14px;
}

.booking-form .form-group {
  position: relative;
  padding: 15px;
  margin-bottom: 0px;
}

.booking-form .form-control,
.count-passenger {
  background-color: transparent;
  border-radius: 0px;
  border: none;
  height: 30px;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 14px;
  color: var(--text-color);
  font-weight: 400;
  padding: 0;
  cursor: pointer;
}

.booking-form .form-control::-webkit-input-placeholder {
  color: #818390;
}

.booking-form .form-control:-ms-input-placeholder {
  color: #818390;
}

.booking-form .form-control::placeholder {
  color: #818390;
}

.booking-form input[type="date"].form-control:invalid {
  color: #818390;
}

#input_from,
#input_to {
  cursor: pointer;
}

.booking-form div.form-control {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.booking-form div.form-control+.select-arrow {
  position: absolute;
  right: 0px;
  bottom: -25px;
  width: 32px;
  line-height: 32px;
  height: 32px;
  text-align: center;
  pointer-events: none;
  color: var(--black-color);
  font-size: 14px;
}

.booking-form div.form-control+.select-arrow:after {
  content: "\279C";
  display: block;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

/* .count-passenger {
  position: absolute;
  top: 50px;
} */

.switch-show-hide {
  display: none;
}


/* input.input-departure:focus,
input.input-departure:active,
input.input-return:focus,
input.input-return:active {
  border-bottom: 2px solid var(--saphire-color);
} */

input.input-departure,
input.input-return {
  text-transform: capitalize;
}

/* =============== END HEADER =============== */

/* SIDEBAR CSS */
#wgsform .box,
.sidebar-filters,
.form-search-sidebar,
.sidebar-filters-price,
.sidebar-sort-price {
  width: 100%;
  box-shadow: var(--box-shadow-2);
  border-radius: var(--border-radius);
  background: var(--white-color);
  margin-bottom: 20px;
  padding: 20px;
}

.form-search-sidebar,
.sidebar-filters-price,
.sidebar-sort-price {
  margin-bottom: 24px;
}

.form-search-sidebar {
  padding-top: 0px;
}

.form-search-sidebar {
  background: #fff;
  box-shadow: var(--box-shadow-2);
  border-radius: var(--border-radius);
  padding-top: 5px;
  margin-top: 0;
}

.sidebar-filters-wrap {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid var(--border-color);
  margin-bottom: 20px;
}

.sidebar__title,
.sidebar__reset {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-color);
  padding: 10px 0;
}

.sidebar__reset {
  color: var(--saphire-color);
  cursor: pointer;
}


.options__price--item {
  margin: 12px 0;
  line-height: 20px;
}

.options__price--item span,
.options__airline--item span {
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--text-color);

  position: absolute;
  width: 200px;
  top: -4px;
  left: 30px;
}

#filter-options__airline {
  list-style: none;
  padding: 0;
  margin: 0;
}

#filter-options__airline li img {
  width: 25px;
  height: 25px;
  object-fit: contain;
  margin-right: 5px;
}

#filter-options__airline li.options__airline--item.al {
  display: none;
}

.filter-brand input[type="checkbox"],
.filter-time input[type="checkbox"],
.filter-transit input[type="checkbox"] {
  display: none;
}

.filter-transit input[type="checkbox"]+label,
.filter-time input[type="checkbox"]+label,
.filter-brand input[type="checkbox"]+label {
  display: flex;
  align-items: center;
  position: relative;
  padding-left: 30px;
  color: var(--text-color);
  cursor: pointer;
  font-size: 14px;
  line-height: 22px;
  font-weight: 400;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.filter-time input[type="checkbox"]+label:before,
.filter-brand input[type="checkbox"]+label:before,
.filter-transit input[type="checkbox"]+label:before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  border: 2px solid var(--main-color);
  position: absolute;
  left: 0;
  opacity: 0.8;
  -webkit-transition: all 0.12s, border-color 0.08s;
  transition: all 0.12s, border-color 0.08s;
}

.filter-time input[type="checkbox"]:checked+label:before,
.filter-brand input[type="checkbox"]:checked+label:before,
.filter-transit input[type="checkbox"]:checked+label:before {
  width: 10px;
  top: -5px;
  left: 5px;
  border-radius: 0;
  opacity: 1;
  border-top-color: transparent;
  border-left-color: transparent;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  pointer-events: none;
}

.filter-time,
.filter-transit {
  margin-top: 20px;
}


.infor-flight-wrap {
  display: none;
}

.sidebar-flight__title {
  font-size: 15px;
  font-weight: 600;
  line-height: 20px;
  color: var(--text-color);
  margin-bottom: 10px;
  position: relative;
}


.radio-input {
  display: none;
}

.radio-label {
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  background-color: var(--white-color);
  display: inline-block;
  cursor: pointer;
  margin: 0 1rem;
  transition: all 0.25s linear;
  position: relative;
  box-shadow: 0 0 0 4px var(--white-color), 0 0 0 6px var(--border-color);
  cursor: pointer;
}

.radio-input:checked+.radio-label {
  box-shadow: 0 0 0 4px var(--white-color), 0 0 0 6px var(--main-color);
  background-color: var(--main-color);
}



/* =============== TITLE LIST POST =============== */
.category-wrap,
.fullpage-wrap {
  height: 16vh;
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: center;
  align-items: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 0 5%;
  /* background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.07) 100%); */
  background: transparent;
}

.category__title {
  font-size: 30px;
  font-weight: 600;
  color: var(--black-color);
}

.category__desc {
  font-size: 16px;
  color: var(--black-color);

  padding: 0 20%;
}


/* =============== LIST POST =============== */
.blog-card {
  display: flex;
  background: var(--white-color);
  border-radius: 0.375rem;
  overflow: hidden;
  margin-bottom: 20px;
  line-height: 2;
  box-shadow: rgb(60 64 67 / 30%) 0px 1px 2px 0px,
    rgb(60 64 67 / 15%) 0px 2px 6px 2px;
}

.blog-card a {
  color: inherit;
  line-height: 25px;
}

.blog-card a:hover {
  color: var(--saphire-color);
}

.blog-card:hover .photo {
  transform: scale(1.3) rotate(3deg);
}

.blog-card .meta {
  position: relative;
  z-index: 0;
  /* height: 250px; */
  flex-basis: 40%;
}

.blog-card .photo {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.2s;
}

.blog-card .description {
  padding: 2rem;
  background: var(--white-color);
  position: relative;
  /* z-index: 1; */
  flex-basis: 60%;
}

.blog-card .description h2 {
  line-height: 1;
  margin: 0;
  font-size: 20px;
  color: var(--saphire-color);
  font-weight: 600;
}

.blog-card p {
  position: relative;
  margin: 1rem 0 0;
  font-size: 14px;
  text-align: justify;
}

/* 
.blog-card p:first-of-type {
  margin-top: 1.25rem;
} */

.content__card_mobile {
  display: none;
}


/* =============== PAGINATION =============== */
.post-panigation {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.wp-pagenavi .last,
.wp-pagenavi span.pages {
  display: none;
}

.wp-pagenavi a,
.wp-pagenavi span.current,
.wp-pagenavi span.extend {
  font-weight: 700;
  font-size: 1.7rem !important;
  line-height: 3.2rem;
  display: inline-block;
  padding: 0.2rem 1.3rem !important;
  height: 3.6rem;
  margin: 0.2rem 0.7rem;
  color: var(--black-color) !important;
  transition: all, 0.3s, ease-in-out;

  text-shadow: none !important;
  border: none !important;
  background: none !important;
  box-shadow: none !important;
}

.wp-pagenavi span.current {
  background-color: var(--black-color) !important;
  color: var(--white-color) !important;
}

.wp-pagenavi a:hover {
  background: #d3d3d3 !important;
  cursor: pointer;
}


/* =============== FULLPAGE =============== */
.fullpage__title {
  font-size: 30px;
  font-weight: 600;
  color: var(--black-color);
}

.section__category,
.section__fullpage {
  margin-top: 80px;
}


/* =============== SINGLE =============== */
.infor__single-wrap,
.infor__fullpage-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.infor__single-wrap {
  margin-top: 8px;
}

.block-infor {
  display: flex;
  align-items: center;
  margin: 0 10px;
}

.block-infor span {
  font-size: 14px;
  color: var(--black-color);
  line-height: 16px;
  font-weight: 600;
  margin-left: 5px;
}

.block-infor a {
  color: var(--black-color);
}

.content__post-wrap {
  padding: 12px 0;
}

.content__post-wrap .content {
  background: #fff;
  padding-top: 20px;
  padding-bottom: 20px;
}

.single__social--title {
  font-size: 14px;
  line-height: 20px;
  color: var(--text-color);
  letter-spacing: 2px;
  text-transform: uppercase;
}

.single__social--list {
  display: flex;
  align-items: center;
}

.single__social--wrap {
  display: flex;
  align-items: center;
}

li.post__social--item {
  margin: 0 10px;
}

li.post__social--item:last-child {
  margin-right: 0;
}

li.post__social--item img {
  object-fit: cover;
  width: 40px;
  height: 40px;
}

.post__content,
.post__discuss {
  padding: 0 3%;
}

.post__content iframe {
  margin: 0 auto;
  display: block;
}

.post__content a,
.post__discuss a {
  color: #0c60dd;
}

.post__content p {
  font-size: 14px;
  color: var(--text-color);
  line-height: 30px;
  text-align: justify;
  margin-bottom: 10px;
}

.post__content span {
  font-family: 'Mt', sans-serif !important;
}

.post__content img,
.post__content .wp-caption img {
  display: block;
  margin: 10px auto;
  max-width: 100%;
  width: auto;
  height: auto;
}

.post__content .wp-caption {
  margin: 0 auto;
}

.post__content .wp-element-caption {
  text-align: center;
  font-size: 13px;
  margin: 0 0 1em;
}

h1.category__title {
  font-size: 2.2rem;
  line-height: 3rem;
}

.post__content h1 {
  font-size: 2.2rem;
  line-height: 3rem;
}

.post__content h2 {
  color: var(--saphire-color);
  font-weight: 600;
  margin: 3px 0 0px;
  line-height: 3rem;
  font-size: 2rem;
}

.post__content h3 {
  font-weight: 600;
  font-size: 1.75rem;
  color: var(--saphire-color);
  margin: 10px 0;
  line-height: 3rem;
  /*  text-transform: capitalize;*/
}

.post__content h3.none-content {
  text-align: center;
}

.post__content table {
  border: 1px solid var(--black-color);
  margin: 10px auto;
  font-size: 14px;
  width: 100%;
}

.post__content tbody,
.post__content tr,
.post__content td {
  border: 1px solid var(--black-color);
}

.post__content td {
  padding: 10px;
}

.post__content ul {
  list-style: square;
  margin-left: 20px;
  margin-bottom: 20px;
  color: var(--text-color)
}

.post__content li {
  font-size: 14px;
  line-height: 24px;
}

.single__pagenav {
  margin-top: 15px;
  padding: 2rem 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  position: relative;

  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
}

.single__nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* text-align: center; */
  /* padding-right: 2rem; */
}

.single__nav a {
  font-size: 16px;
  color: var(--title-color);
  line-height: 20px;
}

.single__nav span {
  display: block;
  font-weight: 400;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: var(--text-color);
  margin-bottom: 1.6rem;
  transition: all 0.3s;
}

.single__prev,
.single__next {
  flex: 1;
}

.single__prev {
  padding-left: 4%;
}

.single__next {
  text-align: right;
  padding-right: 4%;
}

.single__title {
  margin-top: 30px;
}


/* =============== Bài viết liên quan =============== */
/*proposal-item*/
.proposal-item__img {
  position: relative;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 100%;
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}

.proposal-item__img-content {
  color: var(--white-color);
  text-shadow: 0 0 2px rgb(0 0 0 / 35%);

  position: absolute;
  left: 0;
  width: 100%;
  bottom: 0;
  height: 70px;
  display: flex;
  background: linear-gradient(180deg,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.7) 100%);
  align-items: flex-end;
  line-height: 26px;
}

.proposal-item__img-heading {
  position: absolute;
  top: 20px;
  left: 10px;
  font-size: 15px;
  line-height: 18px;
  font-weight: 600;
  margin-bottom: 18px;
  color: var(--white-color);
}

.single__post-relation {
  padding: 0 4%;
}


/* =============== CONTENT =============== */
a.add_tag_2 {
  color: var(--saphire-color);
}

#cb-previous-next-links {
  width: 100%;
  overflow: hidden;
  text-align: center;
  color: #999999;
  padding: 0px 0px 20px 0px;
  border-top: 1px solid #dbdbdb;
  border-bottom: 1px solid #dbdbdb;
}

#cb-previous-next-links p {
  font-size: 14px;
  color: var(--text-color);
  line-height: 24px;
}


/* =============== PAGE TÌM CHUYẾN BAY =============== */
.options__airline--item {
  display: flex;
  align-items: center;
}

.options__airline--item span {
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--text-color);
  margin-left: 10px;
}

#filter-options__airline li img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  margin-left: 4px;
}

.filter-flight__title {
  font-size: 14px;
  font-weight: 600;
  line-height: 16px;
  color: var(--text-color);
  margin-bottom: 10px;
}


/* =============== Checkboxes styles =============== */
.filter-flight__transit {
  margin-top: 20px;
  border-top: 1px solid var(--border-color);
  padding-top: 20px;
}

.options__transit--item,
.options__airline--item {
  margin-bottom: 8px;
}

.options__transit--item:last-child,
.options__airline--item:last-child {
  margin-bottom: 0px;
}

.sidebar-filters input[type="checkbox"] {
  display: none;
}

.sidebar-filters input[type="checkbox"]+label {
  display: block;
  position: relative;
  padding-left: 30px;
  color: var(--text-color);
  cursor: pointer;
  font-size: 14px;
  line-height: 22px;
  font-weight: 400;

  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.sidebar-filters input[type="checkbox"]+label:before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  border: 2px solid var(--saphire-color);
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.6;
  -webkit-transition: all 0.12s, border-color 0.08s;
  transition: all 0.12s, border-color 0.08s;
}

.sidebar-filters input[type="checkbox"]:checked+label:before {
  width: 10px;
  top: -5px;
  left: 5px;
  border-radius: 0;
  opacity: 1;
  border-top-color: transparent;
  border-left-color: transparent;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


/* =============== SIDEBAR INFOR JOURNEY =============== */
.sidebar-journey,
.sidebar-table__prices,
.sidebar-journey-popup {
  border-radius: var(--border-radius);
  background: var(--white-color);
  margin: 25px 0 0 20px;
  padding: 20px;
  box-shadow: rgb(0 0 0 / 5%) 0px 0px 0px 1px,
    rgb(209 213 219) 0px 0px 0px 1px inset;
}

.sidebar-table__prices,
.sidebar-journey {
  margin: 0 0 20px 0;
}

.journey-infor__title {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}

.journey-infor__title label,
.infor-ticket-title label {
  background: var(--bgtitle-color);
  color: var(--white-color);
  width: 80px;
  text-align: center;
  padding: 8px;
  border-radius: 4px;
  margin-right: 8px;
  font-weight: 600;
  line-height: 15px;
  font-size: 12px;
  text-transform: capitalize;
}

.journey-infor__title span {
  font-weight: 600;
  line-height: 20px;
  font-size: 15px;
  color: var(--text-color);
}

.infor-ticket-title {
  text-align: center;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--white-color);
  font-weight: 600;
  background: var(--saphire-color);
  padding: 5px;
  border-radius: 0.375rem;
}

.journey-infor__datetime {
  font-size: 13px;
  font-weight: 400;
  line-height: 22px;
  margin-bottom: 12px;
}

.journey-details .journey-line {
  height: 120px;
}

.hr-line-1 {
  margin-top: 12px;
  height: 1px;
  color: var(--saphire-color);
}

.infor-journey-wrap {
  display: flex;
  flex: 1.5 1 0%;
  min-height: 200px;
}

.journey-timeline {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  /* padding-bottom: 10px; */
}

.journey-citypair {
  display: flex;
  flex-direction: column;
  /* height: 100%; */
  justify-content: space-between;
  margin-left: 8px;
}

.citypair-arrive h6 {
  margin-top: 16px;
}

.journey-infor-plane {
  display: flex;
  align-items: center;
}

.infor-price__body tr:last-child {
  border-top: 1px solid var(--border-color);
}

.infor-price table {
  width: 100%;
}

.infor-price th,
.infor-price td {
  padding: 7px;
  text-align: right;
  /* letter-spacing: 1px; */
}

.infor-price tr td:first-child {
  text-align: left;
}

.infor-price strong {
  color: var(--black-color);
  font-weight: 600;
}

td.total_amount,
.infor-price {
  color: var(--redvj-color);
  font-weight: 600;
  font-size: 18px;
}

td.included_taxfee {
  text-align: right !important;
  font-style: italic;
  font-size: 14px;
  font-weight: 600;
}

.infor-journey__transit,
.infor-citypair__transit {
  display: flex;
  /* height: 100%; */
  justify-content: space-between;
  flex-direction: column;
}

.journey-datetime__transit-1,
.journey-citypair__transit-1,
.journey-datetime__transit-2,
.journey-citypair__transit-2,
.journey-datetime__transit-3,
.journey-citypair__transit-3 {
  height: 185px;
}

.location__transit h6 {
  margin-left: 8px;
  color: var(--saphire-color);
}

.location__transit {
  position: relative;
}

.location__transit::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: -50px;
  width: 120%;
  height: 1px;
  background: var(--saphire-color);
}

.select-flight__dep input[type="radio"] {
  /* display: none; */
  cursor: pointer;
}

.journey-datetime {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.journey-datetime .datetime-depart,
.journey-datetime .datetime-arrive {
  display: flex;
  flex-direction: column;
  min-width: 80px;
  margin-right: 8px;
  text-align: end;
}

.datetime-duration {
  text-align: right;
}

.journey-ret-wrap {
  margin-top: 20px;
}

.section__infor--flight .journey-ret-wrap {
  margin-top: 0px;
}


/* =============== LIST FLIGHT =============== */
.flight-item {
  box-shadow: 0px 1px 1px rgb(0 0 0 / 5%);
  box-sizing: border-box;
  border-radius: 8px;
  background: var(--white-color);
  padding: 15px;
  margin-bottom: 16px;
}

.flight-item:hover {
  border: 1px solid var(--saphire-color);
}

.flight-infor {
  display: flex;
  align-items: center;
  /* border-bottom: 1px solid var(--border-color); */
}

.infor-time__depart,
.infor-time__destination {
  text-align: center;
}

.infor-plane {
  display: flex;
  justify-content: center;
  align-items: center;
}

.infor-brand {
  display: flex;
  align-items: center;
  /* margin-right: 8px; */
}

.flight-transit-1 .infor-brand {
  margin-right: 0;
}

.infor-plane__name {
  display: flex;
  overflow: hidden;
  margin-left: 8px;
  flex-direction: column;
}

.flight-details {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
}

.flight-details .flightno,
.flight-details-inter .flightno {
  opacity: 0;
}

.flight-details .details {
  background: var(--bgsection-color);
  border-radius: 20px;
  padding: 5px 10px;

  display: flex;
  align-items: center;
  cursor: pointer;
}

.flight-details .details:active {
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px,
    rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

.flight-details .details svg {
  margin-right: 5px;
}

.flight-details button {
  border-radius: 8px;
  color: var(--white-color);
  font-weight: 600;
  font-size: 16px;
}

.flight-details:hover button {
  color: var(--white-color);
}

.infor-brand img {
  width: 50px;
  height: 50px;
  object-fit: cover;
}

.infor-duration {
  display: flex;
  flex-direction: column;
  flex: 15%;
  align-items: center;
}

.infor-price {
  flex: 20%;
  font-size: 18px;
  justify-content: flex-end;
}


/* =============== BẢNG GIÁ =============== */
.sidebar-table__prices table {
  width: 100%;
}

.sidebar-table__prices caption {
  font-size: 16px;
  /* margin-top: 10px; */
  color: var(--saphire-color);
  font-weight: 600;
  line-height: 20px;
}

.table__price--ret {
  margin-top: 10px;
}

.total_amount--dep,
.total_amount--ret {
  font-size: 16px;
  color: var(--black-color);
  font-weight: 600;
}

.total__price-wrap {
  display: flex;
  justify-content: space-between;
  background-color: var(--bgdecs-color);
  padding: 15px;
  color: var(--saphire-color);
  /* margin-top: 10px; */
  align-items: center;
}

.total__price-title h6 {
  font-size: 18px;
  text-transform: uppercase;
  line-height: 22px;
  font-weight: 600;
  color: var(--title-color);
}

.total__price-title p {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  margin: 0;
  color: var(--text-color);
  font-style: italic;
}

.total__price {
  font-size: 20px;
  line-height: 22px;
  font-weight: 600;
  color: var(--redvj-color);
}

.section__infor--prices-mobile {
  display: none;
}

/* =============== SIDEBAR POST XEM NHIỀU NHẤT =============== */
.sidebar-widget {
  margin: 15px 0;
  box-shadow: rgb(60 64 67 / 30%) 0px 1px 2px 0px,
    rgb(60 64 67 / 15%) 0px 1px 3px 1px;
  padding: 20px 20px 10px 20px;
  border-radius: 5px;
  background: var(--white-color);
}

.sidebar-widget .news-post {
  color: var(--white-color);
  text-align: center;
  padding: 10px;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 16px;
  background: var(--bgheading-color);
  margin: 0;
}

.card-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.card-post {
  display: flex;
  background: var(--white-color);
  max-height: 16rem;
  border-bottom: 1px solid var(--bgheading-color);
}

li.card-post:last-child {
  border-bottom: none;
}

.image-data {
  /* height: 28rem; */
  position: relative;
  z-index: 1;
  overflow: hidden;
  flex-basis: 35%;
  height: unset;
}

.image-data img {
  width: 100%;
  /* height: 75%; */
  position: absolute;
  left: 0;
  top: 0;
  transform: translateY(15%);
  object-fit: cover;
  z-index: -1;
}

.post-data {
  background: var(--white-color);
  padding: 1.5rem 0rem 1.5rem 1rem;
  position: relative;
  flex: 1;
}

.post-data__title a {
  font-size: 14px;
  line-height: 20px;

  color: var(--saphire-color);
  font-weight: 600;
}

.post-data__desciption {
  position: relative;
  text-align: justify;

  color: var(--text-color);
  font-size: 13px;
  line-height: 20px;

  font-weight: 400;
  margin-top: 5px;
}

.post-data-desciption::first-letter {
  margin-left: 1rem;
}

.post-data-desciption::before {
  content: "";
  position: absolute;
  top: 1px;
  left: 0;
  width: 0.5rem;
  height: 2rem;
  background: var(--saphire-color);
  border-radius: 2rem;
}

.post-data .post-data__title {
  line-height: 20px;
}

.cta {
  text-align: right;
  font-weight: bold;
  margin-top: 1rem;
}

.cta a {
  background: var(--black-color);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  position: relative;

  font-size: 14px;
}

.cta a::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.5rem;
  width: 100%;
  height: 3px;
  background: var(--saphire-color);
  transform: scale(0);
  transform-origin: left;
  transition: transform 0.5s;
}

.cta a:hover::before {
  transform: scale(1);
  background: var(--saphire-color);
}

.cta a:hover {
  color: var(--saphire-color);
}

/* =============== END SIDEBAR POST XEM NHIỀU NHẤT ===============*/


/* =============== FORM SEARCH =============== */
.form-search-sidebar h2 {
  text-align: center;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--main-color);
  font-weight: 600;
  padding: 10px;
  border-radius: 0.375rem;
}

.wgquantity {
  padding: 0 5px !important;
}

.wgquantity label,
.form-group-icon-left label {
  font-size: 13px;
  font-weight: 600;
  color: var(--title-color);
  line-height: 16px;
  text-transform: capitalize;
  margin-bottom: 3px;
}

.direction-sidebar-wrap {
  display: inline-flex;
  height: 80px;
  width: 300px;
  align-items: center;
  justify-content: space-evenly;
  border-radius: 5px;
  padding: 20px 15px 20px 0;
}

.direction-sidebar-wrap .option-label {
  background: var(--white-color);
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  /* border-radius: 0.357rem; */
  border-radius: 10px;
  cursor: pointer;
  padding: 0 5px;
  border: 2px solid lightgrey;
  transition: all 0.3s ease;
  margin: 0;
}

.direction-sidebar-wrap .option__oneway {
  margin-right: 20px;
}

.direction-sidebar-wrap .option-label .dot {
  height: 20px;
  width: 20px;
  background: #d9d9d9;
  border-radius: 50%;
  position: relative;
}

.direction-sidebar-wrap .option-label .dot::before {
  position: absolute;
  content: "";
  top: 4px;
  left: 4px;
  width: 12px;
  height: 12px;
  background: var(--saphire-color);
  border-radius: 50%;
  opacity: 0;
  transform: scale(1.5);
  transition: all 0.3s ease;
}

.direction-sidebar-wrap input[type="radio"] {
  display: none;
}

#wgoneway:checked:checked~.option__oneway,
#wgroundtrip:checked:checked~.option__roundtrip {
  /* background: var(--bgtitle-color); */
  background: var(--white-color);
  border-color: var(--main-color);
}

#wgoneway:checked:checked~.option__oneway .dot,
#wgroundtrip:checked:checked~.option__roundtrip .dot {
  background: #fff;
}

#wgoneway:checked:checked~.option__oneway .dot::before,
#wgroundtrip:checked:checked~.option__roundtrip .dot::before {
  opacity: 1;
  transform: scale(1);
}

.direction-sidebar-wrap .option-label span {
  font-size: 14px;
  color: #808080;
}

#wgoneway:checked:checked~.option__oneway span,
#wgroundtrip:checked:checked~.option__roundtrip span {
  /* color: var(--white-color); */
  color: var(--main-color);
}


/* =============== SIDEBAR FILTER PRICE =============== */
input#amount {
  border: 0;
  color: var(--saphire-color);
  font-weight: bold;
  width: 100%;
  font-size: 14px;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
  outline: none;
  height: 15px;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover,
.ui-slider-horizontal .ui-slider-range {
  background: var(--saphire-color) !important;
}

.section-heading {
  margin-bottom: 28px;
  font-size: 1.4rem;
  line-height: 1.4rem;
  letter-spacing: 2px;
  color: var(--text-color);
  font-weight: normal;
  text-align: center;
}

.section__title {
  font-size: 18px;
  font-weight: 600;
  color: var(--title-color);
  line-height: 22px;
  margin-bottom: 10px;
}

/* Icon reset key search */
.reset-search {
  position: absolute;
  top: 22px;
  right: 15px;
  cursor: pointer;
}


/* LOADING WAITING */
.preloader {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  background: rgba(0, 0, 0, 0.25);
  display: none;
}

.preloader .loader {
  display: flex;
  align-items: center;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(0%, -50%);
}

.preloader .loader .bar {
  display: inline-block;
  width: 3px;
  height: 30px;
  background-color: rgba(255, 255, 255, 1);
  border-radius: 10px;
  animation: scale-up4 1s linear infinite;
}

.preloader .loader .bar:nth-child(2) {
  height: 45px;
  margin: 0 5px;
  animation-delay: 0.25s;
}

.preloader .loader .bar:nth-child(3) {
  animation-delay: 0.5s;
}

@keyframes scale-up4 {
  20% {
    background-color: var(--white-color);
    transform: scaleY(1.5);
  }

  40% {
    transform: scaleY(1);
  }
}

/* =============== HOME =============== */
.home-search {
  position: relative;
  width: 100%;
  min-height: 60vh;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.home-search:before {
  content: "";
  position: absolute;
  background: rgba(3, 96, 251, 0.3);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;

  display: none;
}

.home-search img.home-image {
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 20%;
  object-fit: cover;
}

.home-search h1 {
  font-size: 3em;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 5px;
  line-height: 75px;
  margin-bottom: 20px;
  z-index: 0;
  color: var(--white-color);
}


/* =============== FOOTER =============== */
.footer {
  background: transparent;
  box-shadow: inset 0px 11px 8px -10px #fff, inset 0px -11px 8px -10px #fff;
  padding: 30px 0;
  padding-bottom: 10px;
  padding-top: 0;
  /* background: url(images/footer_bg.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; */
}

.company-menu-wrap {
  padding: 10px 0 0;
}

.company-menu-wrap-2nd {
  padding-top: 0;
}

.company-menu-wrap .company-menu__item:hover .company-menu__link {
  color: var(--main-color);
}

.contact-menu__item a,
.contact-menu__item li,
.company-menu a,
.company-menu li {
  font-size: 1.4rem;
  line-height: 3.5rem;
  letter-spacing: 1px;
  color: var(--text-color);
  cursor: pointer;
}

.company-menu img {
  width: 100%;
  object-fit: cover;
}

.company-menu__title {
  color: var(--saphire-color);
  text-transform: capitalize;
  font-size: 22px;
  font-weight: 600;
  padding: 5px 0;
}

.contact-menu__item li:hover a {
  color: var(--saphire-color);
}

.footer-contact {
  padding-bottom: 0;
  padding-top: 0;
}

.contact-menu-wrapper {
  margin-top: 15px;
}

.contact-menu__item h6 {
  margin-bottom: 10px;
  font-size: 1.4rem;
  line-height: 1.4rem;
  letter-spacing: 2px;
  color: var(--title-color);
  font-weight: bold;
  text-transform: uppercase;
}

.contact-menu__item ul {
  padding-top: 4px;
  list-style: none;
}


/* =============== BEST PROMOTION =============== */
.list-deal-home {
  width: 100%;
}

.margin-bottom-20 {
  margin-bottom: 20px;
}

.slider-ads {
  width: 100%;
  padding-bottom: 35px;
}

.text-red {
  color: var(--saphire-color);
}

.list-airlines-v2 {
  display: flex;
}

.list-airlines-v2 .row-air {
  display: flex;
  flex-wrap: wrap;
}

.list-airlines-v2 .col-text {
  width: 36%;
  padding-right: 40px;
  padding-top: 0;
}

.list-airlines-v2 .col-text p {
  font-size: 14px;
  font-family: 'Mt';
  color: var(--text-color);
}

.list-airlines-v2 .col-logo {
  width: 64%;
}

.list-airlines-v2 .title {
  font-size: 18px;
  font-weight: 700;
  margin-top: 15px;
  margin-bottom: 20px;
}

.list-airlines-v2 .col-logo .col-air .icon-air-v201:hover {
  border: 1px solid var(--saphire-color);
  border-radius: 8px;
}

.list-airlines-v2 .col-logo .col-air .icon-air-v201 {
  border: 1px solid var(--white-color);
}

.list-airlines-v2 .col-logo .col-air {
  width: 25%;
  height: 76px;
  text-align: center;
  margin-bottom: 20px;
}

.list-airlines-v2 .col-logo .col-air img {
  width: auto;
}

.best-promotion .list-deal-home h1 {
  font-weight: bold;
  margin: 0 0 10px;
}

.best-promotion .list-deal-home p {
  font-size: 14px;
  margin-bottom: 10px;
}

.best-promotion {
  /* margin: 20px 0 0px; */
  /* background: var(--bgsection-color); */
  padding: 20px 0 0;
}


/* =============== ul-list-how-to-book =============== */
/* NHỮNG CÁCH ĐẶT VÉ */
.cat-box-item-default.cat-box-flight h2 {
  margin-top: 30px;
}

ul.ul-list-how-to-book {
  width: 100%;
  margin: 0px;
  padding: 0px;
  display: flex;
  flex-wrap: wrap;
}

ul.ul-list-how-to-book li {
  list-style: none;
  display: block;
  flex: 1;
  padding: 10px;
}

ul.ul-list-how-to-book li .box-item-inner {
  background: var(--white-color);
  text-align: center;
  border-radius: 0.375rem;
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}

ul.ul-list-how-to-book li .box-item-inner .box-img {
  margin-bottom: 25px;
  padding-top: 25px;
}

ul.ul-list-how-to-book li .box-item-inner .box-img img {
  height: 100%;
  width: auto;
}

ul.ul-list-how-to-book li .box-item-inner .description {
  font-size: 14px;
  color: var(--text-color);
  margin-bottom: 8px;
}

ul.ul-list-how-to-book li .box-item-inner .title {
  padding-bottom: 25px;
  font-weight: bold;
  font-size: 14px;
}

.type-how-to-book-vjwebsite {
  margin-bottom: 30px;
}

/* =============== DESTINATION DOMESTIC =============== */
figure.card__domestic {
  color: #fff;
  position: relative;
  overflow: hidden;
  margin: 10px auto;
  min-width: 220px;
  max-width: 310px;
  width: 100%;
  background-color: #ffffff;
  color: #000000;
  text-align: left;
  font-size: 16px;
  /* box-shadow: rgb(0 0 0 / 2%) 0px 1px 3px 0px, rgb(27 31 35 / 15%) 0px 0px 0px 1px; */
  box-shadow: var(--box-shadow);
  border-radius: 8px;
}

figure.card__domestic * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

figure.card__domestic img {
  max-width: 100%;
  vertical-align: top;
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;

  height: 250px;
  min-height: 200px;
  width: 100%;
  object-fit: cover;
}

figure.card__domestic figcaption {
  padding: 14px;
  position: relative;
  min-height: 140px;
}

figure.card__domestic .date,
figure.card__domestic i {
  background-color: var(--saphire-color);
  top: 25px;
  color: #fff;
  left: 25px;
  min-height: 60px;
  min-width: 60px;
  position: absolute;
  text-align: center;
}

figure.card__domestic .date {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
}

figure.card__domestic .date span {
  display: block;
  line-height: 30px;
}

figure.card__domestic .date .month {
  font-size: 16px;
  background-color: rgba(0, 0, 0, 0.1);
}

figure.card__domestic i {
  line-height: 60px;
  font-size: 30px;
  -webkit-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

figure.card__domestic h3,
figure.card__domestic p {
  margin: 0;
  padding: 0;
}

figure.card__domestic h3 a {
  margin-bottom: 10px;
  display: inline-block;
  font-weight: 600;
  color: #333333;
}

figure.card__domestic p {
  /* font-size: 0.8em; */
  font-size: 14px;
  /* margin-bottom: 20px; */
  /* line-height: 1.6em; */
  line-height: 20px;
  text-align: justify;
}

.card__domestic--button,
.button_cat {
  background: var(--saphire-color);
  border: none;
  color: #ffffff;
  cursor: pointer;
  display: inline-block;
  font-size: 1em;
  font-size: 14px;
  line-height: 1em;
  outline: none;
  padding: 12px 40px 10px;
  position: relative;
  text-transform: uppercase;
  font-weight: 700;
}

.button_cat {
  float: right;
}

.card__domestic--button:before,
.card__domestic--button:after,
.button_cat::before,
.button_cat::after {
  border-color: transparent;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
  border-style: solid;
  border-width: 0;
  content: "";
  height: 24px;
  position: absolute;
  width: 24px;

}

.card__domestic--button:before,
.button_cat:before {
  border-image-source: linear-gradient(to right, #fcb045, #C779D0, #4BC0C8);
  border-image-slice: 1;

  border-left-width: 2px;
  border-top-width: 2px;
  left: -5px;
  top: -5px;
}

.card__domestic--button:after,
.button_cat::after {
  border-bottom-width: 2px;
  border-image-source: linear-gradient(to right, #fcb045, #C779D0, #4BC0C8);
  border-image-slice: 1;

  border-right-width: 2px;
  bottom: -5px;
  right: -5px;
}

.card__domestic--button:hover,
.button_cat:hover {
  background: var(--bgtitle-color);
}

.card__domestic--button:hover:before,
.card__domestic--button:hover:after,
.button_cat:hover::before,
.button_cat:hover::after {
  height: 100%;
  width: 100%;
}

figure.card__domestic:hover img,
figure.card__domestic.hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

figure.card__domestic:hover .date,
figure.card__domestic.hover .date {
  -webkit-transform: rotateY(90deg);
  transform: rotateY(90deg);
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

figure.card__domestic:hover i,
figure.card__domestic.hover i {
  -webkit-transform: rotateY(0);
  transform: rotateY(0);
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

figure.card__domestic:hover button,
figure.card__domestic.hover button {
  background-color: var(--saphire-color);
}

/* =============== END DESTINATION DOMESTIC =============== */


/* =============== DESTINATION INTER =============== */
.destination__inter--wrap {
  padding: 10px 0 20px;
}

.destination__inter {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 250px 250px;
  grid-gap: 10px;
}

.destination__inter--item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.destination__inter--item {
  overflow: hidden;
  border-radius: 8px;
  position: relative;
  cursor: pointer;
}

.destination__inter--item:hover .box-title {
  padding-bottom: 25px;
  transition: all .2s ease-in-out;
}

.destination__inter--item:first-child {
  grid-column: 1/2;
  grid-row: 1/3;
}

.destination__inter--item:nth-child(2) {
  grid-column: 2/3;
  grid-row: 1/2;
}

.destination__inter--item:nth-child(3) {
  grid-column: 3/4;
  grid-row: 1/3;
}

.destination__inter--item:nth-child(4) {
  grid-column: 4/5;
  grid-row: 1/2;
}

.destination__inter--item:nth-child(5) {
  grid-column: 2/3;
  grid-row: 2/3;
}

.destination__inter--item:nth-child(6) {
  grid-column: 4/5;
  grid-row: 2/3;
}

.destination__inter--item:nth-child(7) {
  grid-column: 4/6;
  grid-row: 2/3;
}

.destination__inter--item:nth-child(8) {
  grid-column: 1/2;
  grid-row: 3/4;
}

.destination__inter--item:nth-child(9) {
  grid-column: 2/3;
  grid-row: 3/4;
}

.destination__inter--item:nth-child(10) {
  grid-column: 3/5;
  grid-row: 3/4;
}

.destination__inter--item:nth-child(11) {
  grid-column: 5/6;
  grid-row: 3/4;
}


/* =============== EMPTY =============== */
.empty-title {
  font-size: 20px;
  font-weight: 600;
  color: var(--redvj-color);
  text-align: center;
  margin-bottom: 20px;
}

.bg-empty {
  background-image: url(images/no_flight.svg);
  background-size: cover;
  width: 450px;
  height: 350px;
  background-position: center;
  display: block;
  margin: 0 auto;
}

.btn-empty-flight {
  color: var(--white-color);
  margin: 0 auto;
  display: block;
  margin-bottom: 15px;
  max-width: 120px;
}

.btn-empty-flight:hover {
  color: var(--white-color);
}


/* =============== 404 PAGE =============== */
@keyframes rocket-movement {
  100% {
    transform: translate(1200px, -600px);
  }
}

@-moz-keyframes rocket-movement {
  100% {
    -moz-transform: translate(1200px, -600px);
  }
}

@-webkit-keyframes rocket-movement {
  100% {
    -webkit-transform: translate(1200px, -600px);
  }
}

@keyframes spin-earth {
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    transition: transform 20s;
  }
}

@-webkit-keyframes spin-earth {
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    transition: transform 20s;
  }
}

@-moz-keyframes spin-earth {
  100% {
    -moz-transform: rotate(-360deg);
    transform: rotate(-360deg);
    transition: transform 20s;
  }
}

@keyframes move-astronaut {
  100% {
    transform: translate(-160px, -160px);
  }
}

@-moz-keyframes move-astronaut {
  100% {
    -moz-transform: translate(-160px, -160px);
  }
}

@-webkit-keyframes move-astronaut {
  100% {
    -webkit-transform: translate(-160px, -160px);
  }
}

@keyframes rotate-astronaut {
  100% {
    -webkit-transform: rotate(-720deg);
    transform: rotate(-720deg);
  }
}

@-webkit-keyframes rotate-astronaut {
  100% {
    -webkit-transform: rotate(-720deg);
  }
}

@-moz-keyframes rotate-astronaut {
  100% {
    -moz--transform: rotate(-720deg);
  }
}

@-moz-keyframes glow-star {
  40% {
    -moz-opacity: 0.3;
  }

  90%,
  100% {
    -moz-opacity: 1;
    -moz-transform: scale(1.3);
  }
}

@-webkit-keyframes glow-star {
  40% {
    -webkit-opacity: 0.3;
  }

  90%,
  100% {
    -webkit-opacity: 1;
    -webkit-transform: scale(1.2);
  }
}

@keyframes glow-star {
  40% {
    -webkit-opacity: 0.3;
    opacity: 0.3;
  }

  90%,
  100% {
    -webkit-opacity: 1;
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    border-radius: 999999px;
  }
}

.page-404-container {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  margin: 0;
  background: #3e3162;
  background: -webkit-linear-gradient(to right, #3e3162, #5e346a, #3f3162);
  background: linear-gradient(to right, #3e3162, #5e346a, #3f3162);
  -webkit-user-select: none;
  /* Safari 3.1+ */
  -moz-user-select: none;
  /* Firefox 2+ */
  -ms-user-select: none;
  /* IE 10+ */
  user-select: none;
  /* Standard syntax */
}

.page-404-container__wrap {
  background: url(http://salehriaz.com/404Page/img/overlay_stars.svg);
  background-repeat: repeat;
  background-size: contain;
  background-position: left top;
}

.page-404__central-body {
  padding: 5%;
  text-align: center;
}

.page-404__central-body .btn-go-home {
  position: relative;
  margin: 15px auto;
  width: 200px;
  padding: 10px 15px;
  border-radius: 20px;
  border: 1px solid #fff;
  display: block;
  font-weight: 400;
  text-decoration: none;
  font-size: 12px;
  letter-spacing: 1px;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease-in;
  -moz-transition: all 0.3s ease-in;
  -ms-transition: all 0.3s ease-in;
  -o-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  font-family: "Mt", sans-serif;
}

.page-404__central-body .btn-go-home:hover {
  background: #42275a;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #734b6d, #42275a);
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #734b6d, #42275a);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  color: #fff;
  transform: scale(1.05);
  box-shadow: 0px 20px 20px rgba(0, 0, 0, 0.1);
}

.page-404__objects .box_astronaut {
  position: absolute;
  top: 60%;
  right: 20%;
  will-change: transform;
  animation: move-astronaut 50s infinite linear both alternate;
}

.page-404__objects .object__rocket {
  width: 40px;
  pointer-events: none;
  animation: rocket-movement 30s linear infinite both running;
}

.page-404__objects .object__earth {
  width: 100px;
  animation: spin-earth 30s linear infinite both;
  position: absolute;
  top: 20%;
  left: 15%;
}

.page-404__objects .object__moon {
  width: 80px;
  position: absolute;
  top: 12%;
  left: 25%;
}

.page-404__objects .object__astronaut {
  width: 140px;
  animation: rotate-astronaut 200s infinite linear both alternate;
}

.page-404__glowing-stars .star {
  position: absolute;
  border-radius: 100%;
  background-color: #fff;
  width: 3px;
  height: 3px;
  opacity: 0.3;
  will-change: opacity;
}

.page-404__glowing-stars .star:nth-child(1) {
  top: 80%;
  left: 25%;
  animation: glow-star 2s infinite ease-in-out alternate 1s;
}

.page-404__glowing-stars .star:nth-child(2) {
  top: 20%;
  left: 40%;
  animation: glow-star 2s infinite ease-in-out alternate 3s;
}

.page-404__glowing-stars .star:nth-child(3) {
  top: 25%;
  left: 15%;
  animation: glow-star 2s infinite ease-in-out alternate 5s;
}

.page-404__glowing-stars .star:nth-child(4) {
  top: 75%;
  left: 80%;
  animation: glow-star 2s infinite ease-in-out alternate 7s;
}

.page-404__glowing-stars .star:nth-child(5) {
  top: 90%;
  left: 50%;
  animation: glow-star 2s infinite ease-in-out alternate 9s;
}

.page-404__image {
  position: relative;
  pointer-events: none;
  width: 500px;
}


/* =============== LIBRARY SELECT2 =============== */
.select2-container {
  width: 100% !important;
}

.select2-results {
  box-shadow: rgb(50 50 93 / 25%) 0px 13px 27px -5px,
    rgb(0 0 0 / 30%) 0px 8px 16px -8px;
}

.select2-container .select2-selection--single {
  height: 40px !important;
}

.select2-container--default .select2-selection--single {
  border: 1px solid var(--border-color) !important;
  border-radius: 0.375rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  font-size: 14px;
  padding: 7px 15px;
  line-height: 24px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 50% !important;
  right: 5px !important;
  transform: translate(0, -50%);
}

.select2-container--open .select2-dropdown {
  top: 5px;
  border: 1px solid var(--border-color) !important;
  border-radius: 0.375rem;
}

.select2-container--open .select2-dropdown--below {
  border-top-left-radius: 0.375rem !important;
  border-top-right-radius: 0.375rem !important;
}

.select2-container--default .select2-results__group {
  font-size: 12px;
  color: var(--saphire-color);
  text-align: center;
}

.select2-container--default .select2-results__option .select2-results__option {
  font-size: 12px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--saphire-color) !important;
}

.select2-search--dropdown .select2-search__field {
  padding: 8px !important;
  outline: none;
  font-size: 12px;
}

.form-search-sidebar .btn-search-sidebar {
  display: block;
  width: 25rem;
  overflow: hidden;
  position: relative;
  background: var(--main-button-color);
  color: var(--black-color);
  text-decoration: none;
  text-align: center;
  box-sizing: border-box;
  font-size: 20px;
  font-weight: bold;
  border: none;
  border-radius: 50px;
  padding: 10px;
  margin: 0 auto;
}

.form-search-sidebar .btn-search-sidebar:hover {
  box-shadow: var(--box-shadow-hover);
}

.form-search-sidebar .btn-search-sidebar:active {
  box-shadow: var(--box-shadow-hover);
  color: var(--white-color);
}

/* div.wp-caption.aligncenter {width: 100%; height: 100%} */

/* PAGE KIỂM TRA ĐƠN HÀNG */
.check-order .title-checkorder {
  text-align: center;
  padding: 10px 0;
}

.check-order .title-checkorder a {
  font-size: 26px;
  color: var(--main-color);
  text-decoration: none;
}

.check-order p {
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 10px;
  color: var(--text-color);
}

.check-order img {
  margin: 0 auto;
  display: block;
}

#frm_checkbooking label {
  font-size: 14px;
  line-height: 20px;
}

#frm_checkbooking input[name=sm-frmrechech-booking] {
  padding: 8px 12px;
  min-width: 120px;
  background: var(--main-button-color);
  border: none;
  outline: none;
  color: #000;
  font-size: 14px;
}

.result_check {
  font-size: 14px;
  line-height: 20px;
  padding: 20px 10px;
}

/* BỘ LỌC */
.label-sort,
.label-filter,
.close-sort-flight,
.close-filter-flight {
  display: none;
}

/* TEST HOME */
.news-slider .swiper-pagination-bullet-active {
  background: var(--saphire-color) !important;
}

.news-slider .swiper {
  width: 100%;
  height: 100%;
  margin: 20px auto;
  padding-bottom: 40px !important;
  z-index: 0;
}

.news-slider .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: transparent;
  width: auto;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
  border-radius: var(--border-radius);
}

.news-slider .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.news-slider .swiper-button-next,
.news-slider .swiper-button-prev {
  color: var(--white-color) !important;
}

.news-slider .swiper-button-next:after,
.news-slider .swiper-button-prev:after {
  font-size: 30px !important;
  font-weight: 600 !important;
}

.icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
}

.news-slider {
  z-index: 2;
  margin-left: auto;
  margin-right: auto;
  margin-top: 60px;
}

@media screen and (max-width: 576px) {
  .news-slider {
    margin-top: 45px;
  }
}

.news-slider__item.swiper-slide {
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s;
}

.news-slider__item.swiper-slide-active,
.news-slider__item.swiper-slide-prev,
.news-slider__item.swiper-slide-next {
  opacity: 1;
  pointer-events: auto;
}

.news-slider__ctr {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 12;
}

.news-slider__arrow {
  background: #fff;
  border: none;
  display: inline-flex;
  width: 50px;
  height: 50px;
  justify-content: center;
  align-items: center;
  box-shadow: 0 6px 26px 6px rgba(0, 0, 0, 0.25);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  z-index: 12;
  cursor: pointer;
  outline: none !important;
}

.news-slider__arrow:focus {
  outline: none !important;
}

.news-slider__arrow .icon-font {
  display: inline-flex;
}

.news-slider__arrow.news-slider-prev {
  left: 15px;
  transform: translateY(-50%);
}

.news-slider__arrow.news-slider-next {
  right: 15px;
  transform: translateY(-50%);
}

.news-slider__pagination {
  text-align: center;
  margin: 20px auto 30px;
}

.news-slider__pagination .swiper-pagination-bullet {
  width: 25px;
  height: 4px;
  display: inline-block;
  background: var(--subheading-color);
  opacity: 0.2;
  margin: 0 5px;
  border-radius: 20px;
  transition: opacity 0.5s, background-color 0.5s, width 0.5s;
  transition-delay: 0.5s, 0.5s, 0s;
}

.news-slider__pagination .swiper-pagination-bullet-active {
  opacity: 1;
  background: #ffffff;
  width: 40px;
  transition-delay: 0s;
}

.news__item {
  color: var(--title-color);
  border-radius: 10px;
  display: block;
  transition: all 0.3s;
}

.news__content {
  padding: 12px 15px;
  text-align: left;
  padding-top: 0;
}

.news__item:hover {
  transition-delay: 0.1s;
}

.news__item:hover .news-date,
.news__item:hover .news__title,
.news__item:hover .news__txt,
.news__item.active .news-date,
.news__item.active .news__title,
.news__item.active .news__txt {
  opacity: 1;
  transition-delay: 0.1s;
}

.news__item:hover .news__img,
.news__item.active .news__img {
  box-shadow: none;
}

.news__item.active {
  color: var(--title-color);
}

.news__title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
  transition: opacity 0.3s;
  border-bottom: 2px solid currentColor;
  padding-top: 10px;
  padding-bottom: 10px;

}

@media screen and (max-width: 576px) {
  .news__title {
    font-size: 22px;
    margin-bottom: 10px;
  }

  .news__item {
    padding: 0 10px;
  }

  .news-slider__pagination {
    text-align: center;
    margin: 10px auto;
  }

  .news-slider__arrow {
    width: 35px;
    height: 35px;
  }

  .news-slider__arrow.news-slider-prev,
  .news-slider__arrow.news-slider-next {
    transform: translateY(-70%);
  }

  .header__logo--img {
    width: auto;
  }

}

.news__txt {
  margin: 10px 0;
  line-height: 1.6em;
  font-size: 13px;
  transition: opacity 0.3s;
  text-align: justify;
}

.news__img {
  border-radius: 10px;
  height: 230px;
  width: 100%;
  transition: all 0.3s;
  transform-origin: 0% 0%;
}

.news__img img {
  max-width: 100%;
  border-radius: 10px 10px 0 0;
  height: 100%;
  width: 100%;
}

/* CSS 25012024 */
.footer-section-content ul.gov-dmca {
  display: flex;
}

.footer-section-content .li-gov {
  margin-left: -8px;
}

.footer-section-content .li-gov img {
  margin-right: 10px;
}

.section__category .col-left-single-news,
.devvn-col-box-line {
  border-radius: 0;
  box-shadow: 0px 1px 0px rgba(67, 67, 67, 0.20);
}

.devvn-col-box-line {
  margin-bottom: 20px;
}

/* Partner */
.devvn-list-airlines h2.title-main {
  font-size: 20px;
  font-weight: 700;
  margin-top: 15px;
  margin-bottom: 10px;
}

.devvn-list-airlines .title-description {
  margin-bottom: 12px;
  font-size: 14px;
}

.devvn-list-airlines .devvn-col-logo .devvn-col-air .devvn-icon-air:hover {
  border: 1px solid #ed3f37;
  border-radius: 8px;
}

.devvn-list-airlines .devvn-col-logo .devvn-col-air {
  width: 16.66666667%;
  float: left;
  height: 76px;
  text-align: center;
  margin-bottom: 25px;
}

@media (max-width: 768px) {
  .devvn-list-airlines .devvn-col-logo .devvn-col-air {
    width: 50%;
  }
}

/* FAQ */
.SeoContentBlocks__block .Seo-Common-Layout-Faqs-FrontDoorFaqs .FrontDoorFaqs__column {
  flex: 1 1 50%;
}

.SeoContentBlocks__blockl .Seo-Common-Layout-Faqs-FrontDoorFaqs .FrontDoorFaqs__wrapper {
  padding: 0 8px;
  padding-left: 0;
  margin-bottom: 12px;
}

.SeoContentBlocks__block .accordion-wrapper {
  position: relative;
  margin-bottom: 0.5rem;
}

.SeoContentBlocks__block .acc-head {
  position: relative;
  font-size: 15px;
  padding-left: 0;
  padding-top: 10px;
  padding-bottom: 5px;
}

.SeoContentBlocks__block .acc-head::after {
  content: "\276F";
  position: absolute;
  right: 16px;
  color: #000;
  transform: rotate(90deg);
  transition: 0.4s;
  font-weight: bold;
  cursor: pointer;
}

.SeoContentBlocks__block .acc-head.active::after {
  content: "\276F";
  position: absolute;
  right: 16px;
  color: #000;
  transform: rotate(-90deg);
  transition: 0.4s;
  font-weight: bold;
  cursor: pointer;
}

.SeoContentBlocks__block .acc-body {
  display: none;
  font-size: 14px;
  line-height: 25px;
  text-align: justify;
  padding-top: 10px;
  padding-right: 10px;
}

.SeoContentBlocks__block .acc-body ul {
  list-style: disc;
  margin-left: 20px;
  margin-top: 5px;
}

.SeoContentBlocks__block .acc-body ul li {
  margin-bottom: 5px;
}

.SeoContentBlocks__block .Seo-Common-Layout-Faqs-FrontDoorFaqs .FrontDoorFaqs__item {
  border-bottom: 1px solid #e5ebf0;
}

.SeoContentBlocks__block .Seo-Common-Layout-Faqs-FrontDoorFaqs .FrontDoorFaqs__wrapper {
  padding: 0 8px;
  margin-bottom: 12px;
  padding-left: 0;
}

.SeoContentBlocks__block .FrontDoorFaqs--desktop {
  display: flex;
}

h2.FrontDoorFaqs__header {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
}

/* 26122023 by ancao */
.block-title a {
  color: var(--main-color)
}

.product-item {
  box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .1), 0 2px 6px 2px rgba(60, 64, 67, .15);
  border-radius: 10px;
  overflow: hidden;
  transition: all .3s;
  background: #fff;
  margin-bottom: 20px
}

.product-item img.box-image {
  width: auto;
  max-height: 100%;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  will-change: opacify;
  transform: scale(1);
  transition: all 0.5s ease;
}

.product-item a {
  color: #000;
}

.ratio3by2 {
  padding-top: 133.33333333333331%
}

.product-item .product-info .product-name {
  font-size: 15px;
  font-weight: bold;
  margin-bottom: 12px
}

.text2line {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: black
}

.product-item .product-info .product-meta {
  flex-wrap: wrap;
  margin-bottom: 12px;
  display: flex
}

.product-item .product-info .product-meta span span {
  color: #76809B;
  margin-right: 5px
}

.section_flash .product-item .product-info .product-meta .time {
  margin-left: auto
}

.position-relative {
  position: relative !important
}

.section_flash img.icon-img-flight {
  width: 30px;
  height: 30px;
  transform: translate(0, 0%)
}

.section_flash img,
.section_cate img {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: auto
}

.position-absolute {
  position: absolute !important
}

.p-lg-3 {
  padding: 1rem !important
}

.product-item .product-info .price-box {
  font-size: 18px;
  color: rgb(1, 148, 243);
  font-weight: bold
}

.section_cate {
  margin-bottom: 30px
}

.bg-gray {
  background: #f9fcff;
  padding: 60px 0
}

.block-desc {
  color: #99A2BC;
  font-size: 15px
}

.section_cate .banner {
  margin-bottom: 20px;
  border-radius: 8px;
  overflow: hidden
}

.banner {
  position: relative;
  display: block
}

.ratio1by1 {
  padding-bottom: 100%
}

.banner:before {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out
}

img.lazyload.loaded {
  opacity: 1
}

.section_cate .banner span {
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  color: #FFF;
  width: 90%;
  z-index: 9
}

.section_cate .banner:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.05) 57.92%, #000 100%)
}

.banner:after {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out
}

.section_cate .banner:hover:before {
  right: 50%;
  left: 50%;
  width: 0;
  background: rgba(255, 255, 255, 0.3)
}

.section_cate .banner:hover:after {
  height: 0;
  top: 50%;
  bottom: 50%;
  background: rgba(255, 255, 255, 0.3)
}

.section_cate .banner b {
  font-size: 22px
}

.see-more a {
  border-radius: 50px;
  height: 40px;
  background: linear-gradient(279deg, #ffd600 0%, #ffc300 100%);
  color: #000;
}

.see-more a:hover {
  background: linear-gradient(135deg, #ffd600 0%, #ffc300 100%);
  color: #ff0202;
}

.tabs {
  display: flex;
  border-bottom: none;
  padding-bottom: 16px;
  padding-top: 16px
}

.tabs .tab.active {
  border-bottom: none;
  border-right: none;
  border-left: none;
  color: #000
}

.tabs .tab.active a {
  color: #0770cd
}

.tabs .tab {
  padding: 5px 5px;
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
  text-align: center;
  margin-right: 10px;
  font-size: 20px;
  font-weight: bold
}

.tab-content-item.active {
  display: block
}

.tab-content-item {
  display: none
}

.list-new-journey .swiper-container .swiper-button-prev {
  border-radius: 0 100px 100px 0;
  left: 0;
  padding-right: 10px
}

.list-new-journey .swiper-container .swiper-button-next {
  border-radius: 100px 0 0 100px;
  padding-left: 10px;
  right: 0
}

.list-new-journey .swiper-container .swiper-button-next,
.list-new-journey .swiper-container .swiper-button-prev {
  align-items: center;
  background: #fff;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, .2);
  display: flex;
  font-size: 1.8rem;
  height: 60px;
  justify-content: center;
  opacity: .8;
  outline: none;
  top: 40%;
  transition: .3s;
  width: 30px
}

.list-new-journey .swiper-container .swiper-button-next:after,
.list-new-journey .swiper-container .swiper-button-prev:after {
  color: #3a3a3a;
  font-size: 24px;
  font-weight: 600
}

.list-new-journey .swiper-container .swiper-button-disabled {
  display: none
}

.product-item .justify {
  text-align: justify;
  font-size: 12px
}

.block-title {
  margin-bottom: 10px;
  font-size: 22px;
  font-weight: bold
}

/* Footer v2 */
.devvn-footer {
  margin-bottom: 15px;
}

.devvn-footer .footer-contact ul {
  margin-left: 0;
}

.f-devvn-links-wrapper.f-devvn-mod-columns-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.f-devvn-links-wrapper.f-devvn-mod-variant-text {
  grid-column-gap: 40px;
}

.f-devvn-links-wrapper {
  display: grid;
  grid-auto-flow: row;
}

.P_Ok-wrapper {
  border-bottom: 1px solid #e5ebf0;
  width: 100%;
  margin-bottom: 12px;
}

.P_Ok-header {
  margin-bottom: 3px;
}

.P_Ok-wrapper .P_Ok-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.P_Ok-wrapper .P_Ok-container .P_Ok-title {
  font-weight: 600;
  font-size: 15px;
  line-height: 20px;
  font-feature-settings: 'liga' 0;
  margin: 0;
  cursor: pointer;
}

.P_Ok-wrapper .P_Ok-main-link {
  color: #212a30;
  text-decoration: none;
}

.P_Ok-wrapper .P_Ok-main-link:hover {
  color: #212a30;
  text-decoration: underline;
}

.P_Ok-chevron {
  transition: transform 250ms ease;
  cursor: pointer;
  background: inherit;
  display: flex;
  position: relative;
}

.P_Ok-content.P_Ok-mod-collapsed {
  transition: max-height 250ms ease, opacity 250ms ease, margin-bottom 250ms ease, visibility 0s 250ms;
  opacity: 0;
  max-height: 0;
  visibility: hidden;
}

.P_Ok-content {
  margin-bottom: 10px;
  overflow: hidden;
}

.P_Ok-sublink-item .P_Ok-sublink-link {
  color: #647582;
  font-size: 13px;
  line-height: 24px;
  padding: 0 2px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.P_Ok-sublink-item .P_Ok-sublink-text {
  color: #647582;
  padding-right: 1em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.P_Ok-sublink-item .P_Ok-sublink-price {
  white-space: nowrap;
}

.P_Ok-content.P_Ok-mod-expanded {
  overflow: hidden;
  transition: max-height 250ms ease, opacity 250ms ease, margin-bottom 250ms ease;
  opacity: 1;
  margin-bottom: 10px;
  visibility: visible;
}

.P_Ok-chevron::before {
  height: 7px;
  width: 7px;
  content: "";
  position: absolute;
  right: 5px;
  bottom: auto;
  transition: .5s all;
  transform: rotate(45deg);
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
}

.button_P_Ok-content {
  padding: 0;
  color: inherit;
  border: 0;
  background: none;
  outline: inherit;
  overflow: visible;
  text-overflow: inherit;
  white-space: normal;
  text-decoration: inherit;
  line-height: normal;
  letter-spacing: normal;
  word-spacing: normal;
}

.P_Ok-chevron.expanded::before {
  transform: rotate(-135deg);
  transition: max-height 250ms ease, opacity 250ms ease, margin-bottom 250ms ease;
  margin-bottom: 8px;
  overflow: hidden;
}

h2.f-devvn-mod-variant-text {
  font-weight: 700;
  color: #000;
  margin-top: 15px;
  margin-bottom: 15px;
  font-size: 20px;
}

p.f-devvn-text {
  margin: 0 0 1em;
  text-align: justify;
  font-size: 14px;
  line-height: 26px;
}

/**/
.section__search--thumb {
  margin-top: 12vh;
  width: 30%;
}

.search-form__content__right {
  display: flex;
  flex-direction: column;
  justify-content: flex-end
}

.search-form__content__cheapest {
  padding: 0 0 15px;
  height: auto;
}

.search-form__content__cheapest {
  padding: 8px;
  text-align: center;
  font-size: 14px;
  color: #444;
  display: flex;
  justify-content: center;
  align-items: center;
}

.input-switch .switch-label {
  position: relative;
  display: inline-block;
  width: 39px;
  height: 24px;
  margin-bottom: 0;
}

.search-form__content__cheapest label {
  margin-right: 5px;
}

.input-switch .switch-label input {
  opacity: 0;
  width: 0;
  height: 0;
}

.input-switch .slider.round {
  border-radius: 34px;
}

.input-switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #c5c5c5;
  -webkit-transition: .4s;
  transition: .4s;
}

.input-switch .slider.round:before {
  border-radius: 50%;
}

.input-switch .slider:before {
  position: absolute;
  content: "";
  height: 22px;
  width: 22px;
  left: 1px;
  bottom: 1px;
  background-color: #fff;
  -webkit-transition: .4s;
  transition: .4s;
}

.input-switch input:checked+.slider {
  background-color: #fa8401
}

.input-switch input:focus+.slider {
  box-shadow: 0 0 1px #fa8401
}

.input-switch input:checked+.slider:before {
  -webkit-transform: translateX(15px);
  -ms-transform: translateX(15px);
  transform: translateX(15px);
  background-color: #fff
}

.input-switch .slider.round {
  border-radius: 34px
}

.input-switch .slider.round:before {
  border-radius: 50%
}

/* Hide for mobile */
@media only screen and (max-width: 767px) {
  .desktop-only {
    display: none;
  }

  .btn-support__contact.btn-hotline-blue {
    bottom: 35px;
  }

  .img-fluid {
    transform: scale(1.3);
    max-width: 100%;
  }
}

/* Hide for desktop */
@media only screen and (min-width: 768px) {
  .mobile-only {
    display: none;
  }
}

.ui-datepicker-price {
  margin-top: 11px;
  text-align: center !important;
  font-size: 12px;
  position: absolute;
}

.ui-state-default {
  font-weight: 700;
  font-size: 14px;
  width: 40%;
  padding: 0;
  margin: 0;
  height: 20px;
  position: absolute;
  top: 4px;
  left: 4px;
}

.ui-datepicker-lunar {
  font-size: 11px;
  width: 50%;
  padding: 0;
  margin: 0;
  position: absolute;
  right: 3px;
  top: 2px;
}

.ui-state-active {
  font-size: 15px;
}

.ui-datepicker-current-day .ui-datepicker-price {
  color: white;
}