/*
Theme Name: qiao
Theme URI: https://qiao.com.hk/wp-content/themes/qiao
Description: Main theme of Sessia
Author: Dmitry Titov
Author URI: https://firemarketing.ru
Version: 1.0.0
License: GNU General Public License v2 or later
*/
@font-face {
  font-family: "Montserrat";
  src: url("/wp-content/themes/qiao/assets/css/Montserrat/Montserrat-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Montserrat-Bold";
  src: url("/wp-content/themes/qiao/assets/css/Montserrat/Montserrat-Bold.ttf") format("truetype");
}
@font-face {
  font-family: "Oswald";
  src: url("/wp-content/themes/qiao/assets/css/Oswald/Oswald-Regular.ttf") format("truetype");
}
:root {
  --color-red: #D11952;
  --color-grey: #E5E5E5;
  --color-dark-grey: #5E5E5E;
  --color-mid-grey: #9E9E9E;
  --color-blue-link: #383c73;
  --color-blue: #393C72;
}
body {
  font-family: "Montserrat" !important;
  font-size: 20px;
  color: #000;
  line-height: 28px;
}
/* Utilities */
.text_red {
  color: var(--color-red) !important;
}
.text_white {
  color: #fff;
}
.text_black {
  color: #000;
}
.text_grey {
  color: var(--color-grey) !important;
}
.text_dark_grey {
  color: var(--color-dark-grey) !important;
}
.text_blue_link {
  color: var(--color-blue-link) !important;
}
.text_blue {
  color: var(--color-blue);
}
.bg_grey {
  background-color: var(--color-grey) !important;
}
.bg_dark_grey {
  background-color: var(--color-dark-grey) !important;
}
.bg_mid_grey {
  background-color: var(--color-mid-grey) !important;
}
.bg_white {
  background-color: #fff !important;
}
.bg_blue {
  background-color: var(--color-blue);
}
.montserrat_bold {
  font-family: "Montserrat-Bold";
}
.pointer {
  cursor: pointer;
}
.desktop {
  display: block;
}
.mobile {
  display: none;
}
.filter_blur {
  filter: blur(5px);
}
.filter_unset {
  filter: unset;
}
/* Elements */
.header {
  background-color: #F1F1F1;
}
#header_mobile {
  display: none;
}
.lang_icon {
  height: 35px;
  width: auto;
}
.logo {
  width: 170px;
  height: auto;
}
.nav_links {
  padding-left: 1.5rem;
}
.nav_link {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.5rem;
  font-size: 18px;
  text-decoration: none;
  color: #000;
  line-height: 44px;
}
.nav_link:hover {
  text-decoration: none;
}
.nav_link:not(.active):hover {
  color: var(--color-red);
  background-color: #fff;
  cursor: pointer;
}
.nav_links .active { 
  background-color: #fff;
}
.nav_links .active:hover { 
  color: #000;
  cursor: default;
}
.nav_lang {
  display: flex;
  justify-content: center;
  align-items: center;
   padding: 1.5rem;
  font-size: 20px;
}
.nav_lang:hover {
  color: var(--color-red);
  cursor: pointer;
}
.header_hr {
  height: 5px;
  background-color: var(--color-red);
  margin: 0;
}
.main_wrapper {
  width: 100%;
  height: 95vh;
  display: flex;
  align-items: start;
  justify-content: start;
  /* background-image: url('/wp-content/themes/qiao/assets/images/qiao_main_bg.jpg'); */
  background-image: url('/wp-content/themes/qiao/assets/images/header-pictures-1.jpg') !important;
  background-position: center;
  background-size: cover;
  color: white;
}
.main_wrapper_2 {
    /* background-image: url('/wp-content/themes/qiao/assets/images/qiao_main_bg_2.jpg') !important; */
    background-image: url('/wp-content/themes/qiao/assets/images/header-pictures-2.jpg') !important;
}
.main_wrapper_text {
  width: 40%;
  padding-top: 9%;
}
.carousel-item {
  height: 95vh;
}
.main_pl {
  padding-left: 8%;
}
.main_pr {
  padding-right: 8%;
}
.main_title {
  font-size: 70px;
  line-height: 123%;
  text-transform: uppercase;
  font-family: "Oswald";
  display: flex;
  flex-direction: column;
}
.main_wrapper_text > p {
  text-transform: uppercase;
  color: black;
}
.main_wrapper_text_2 > p {
   color: #fff !important; 
}
.carousel-control-prev {
  width: 5% !important;
  background-color: unset !important;
  border: 0px solid white;
}
.carousel-control-next {
  width: 5% !important;
  background-color: unset !important;
  border: 0px solid white;
}
.carousel-control-prev-icon {
  /* background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%B61F18' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E"); */
  /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23B61F18' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E"); */
  background-image: url('/wp-content/themes/qiao/assets/images/arrow_right.svg');
  transform: rotate(180deg);
  width: 40px;
  height: 40px;
  min-width: 25px;
  margin-left: 0.5rem;
  cursor: pointer;
}
.carousel-control-next-icon {
  /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23B61F18' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E"); */
  background-image: url('/wp-content/themes/qiao/assets/images/arrow_right.svg');
  width: 40px;
  height: 40px;
  min-width: 25px;
  margin-right: 0.5rem;
  cursor: pointer;
}
.body_wrapper {
  padding: 1.5rem;
}
.dropdown_item {
}
.dropdown_item_wrapper {
  border-radius: 19px;
}
.arrow_down_icon {
  height: 75px;
  width: auto;
  margin-left: -5px;
}
.circle_icon_wrapper {
  min-width: 70px;
  display: flex;
  justify-content: center;
  padding-right: 5px;
}
.dropdown_item_img {
  width: 100%;
  border-top-right-radius: 19px;
  border-bottom-right-radius: 19px;
}
.dropdown_item_bg {
  border-top-right-radius: 19px;
  border-bottom-right-radius: 19px;
  background-position: center; 
  background-size: cover;
}
.dropdown_item_ellipse {
  width: 30px;
  height: 30px;
}
.ofc_bg {
  background-image: url('/wp-content/themes/qiao/assets/images/structure_bg.jpg');
  background-size: cover;
  background-position: center;
}
.disclaimer_title {
  font-family: "Oswald";
  text-transform: uppercase;
  font-size: 24px;
  line-height: 19px;
}
.disclaimer_text {
  font-size: 16px;
  line-height: 19px;
}
.disclaimer_text > p {
  margin-bottom: 0px !important;
}
.footer_text {
  font-size: 22px;
}
.dropdown_item_text {
  text-transform: uppercase;
}
@media (max-width: 1650px) {
    .main_title {
      font-size: 35px;
    }
}

/* Bootstrap desktop */
@media (max-width: 1440px) {

}

@media (max-width: 1340px) {
   .main_wrapper_text {
      width: 45%;
  }
}

/* Bootstrap xl */
@media (max-width: 1200px) {
  .nav_link {
    font-size: 14px;
  }
  .nav_lang {
    font-size: 17px;
  }
  .main_wrapper_text {
      width: 50%;
  }
}

@media (max-width: 1050px) {
  .main_wrapper_text {
      padding-top: 15%;
      width: 60%;
  }
}

/* Bootstrap lg */
@media (max-width: 992px) {
  .desktop {
    display: none;
  }
  .mobile {
    display: block;
  }
  #header_desktop {
    display: none !important;
  }
  #header_mobile {
    display: block !important;
  }
  .nav_link {
    padding: 0.5rem;
  }
  .main_wrapper_text {
      width: 70%;
  }
  .dropdown_item_bg {
    min-height: 450px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 19px;
    border-bottom-left-radius: 19px;
  }
  .dropdown_item_wrapper {
    flex-direction: column;
  }
  .dropdown_item_left {
    width: 100% !important;
    max-width: 100%;
  }
  .dropdown_item_right {
    width: 100% !important;
    max-width: 100%;
  }
  .dropdown_item_text {
    padding-left: 1.5rem !important;
  }
  .dropdown_item_ellipse {
    margin-left: -10px;
  }
  .circle_icon_wrapper {
    padding-right: 0px;
  }
}

/* Bootstrap md */
@media (max-width: 768px) {
    .main_title {
      font-size: 55px;
    }
    .main_wrapper_text {
      padding-top: 25%;
      width: 90%;
    }
}

/* Bootstrap sm */
@media (max-width: 576px) {
    .logo {
      width: 135px;
    }
    .main_wrapper_text {
      padding-top: 25%;
    }
    .main_title {
      font-size: 40px;
    }
    .main_wrapper {
      height: 80vh;
    }
    .arrow_down_icon {
      height: 60px;
      margin-left: 0px;
    }
    .disclaimer_text {
      font-size: 14px;
    }
    .footer_text {
      font-size: 14px;
      flex-direction: column;
      line-height: 20px;
    }
    .dropdown_item_text {
      padding-left: 1rem !important;
    }
}

@media (max-width: 420px) {
  .main_title {
    font-size: 30px;
    padding-left: 0.5rem !important;
  }
  .arrow_down_icon {
    height: 45px;
  }
  .main_wrapper_text > p {
    line-height: 22px;
  }
  .footer_text {
    font-size: 12px;
  }
  .carousel-control-prev {
    width: 8% !important;
  }
  .carousel-control-next {
    width: 8% !important;
  }
}
@media (max-width: 370px) {
  body {
    font-size: 17px;
  }
  .main_title {
    font-size: 28px;
  }
  .arrow_down_icon {
    height: 32px;
  }
  .carousel-control-prev {
    width: 10% !important;
  }
  .carousel-control-next {
    width: 10% !important;
  }

}