body{
font-family: 'Roboto', sans-serif;
font-family: 'Prompt', sans-serif;
}
*.container{
    max-width: 1240px;
}

.carousel-inner img {
  width: 100%;
  height: 600px;
}
.img-promotion:hover {
  box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
  opacity: 1;
}
.group-img {
  display: inline-block;
  overflow: hidden;
  padding: 10px;
  width: 277px;
}
.group-img img {
  width: 100%;
}
.waitget-brand {
  display: block;
  background-color: aliceblue;
}
.boximg {
  display: block;
  overflow: hidden;
  padding-top: 40px;
  padding-bottom: 40px;
}

pagination.pagination-custom li.page-item a.page-link {
  color: #00c7ce;
  border-color: #00c7ce;
  min-width: 40px;
  text-align: center;
}

pagination.pagination-custom li.page-item.disabled a.page-link {
  color: #ababab;
  border-color: #00c7ce;
}

pagination.pagination-custom li.page-item.active a.page-link {
  color: #ffffff;
  border-color: #00c7ce;
  background-image: linear-gradient(to bottom, #00c7ce, #00c7ce);

  /* background-image: linear-gradient(to bottom, black, black); */
}


@media screen and (max-width: 750px) {
  .boximg  .group-img {
    display: inline-block;
    overflow: hidden;
    padding: 5px;
    width: 163px;
  }
}
@media screen and (max-width: 950px) {
 .group-img {
    display: inline-block;
    overflow: hidden;
    padding: 10px;
    width: 277px;
  }
}


/* ----navbar------ */

.bg-dark-air {
    box-shadow: 0px 8px 15px -5px rgba(2, 2, 2, 0.43);
    background-color: #fff !important;
    padding-top: 20px;
    padding-bottom: 25px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }
  .navbar-nav .nav-link {
    color: rgb(22, 21, 21);
    padding-right: 45px;
  }
  
  .logo {
    display: inline-block;
    overflow: hidden;
  }
  .logo img {
    width: 158px;
  }
  .head-air {
    background-image: url("../../../../assets/img/line-footer.png"),
      linear-gradient(270deg, #58cefc, #9a9db83d);
    background-repeat: repeat;
    display: block;
    overflow: hidden;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .box-nav {
    display: inline-block;
    overflow: hidden;
    padding-bottom: 30px;
  }
  .air-service {
    display: inline-block;
    overflow: hidden;
    padding-left: 19px;
    text-align: center;
  }
  .air-service h1 {
    display: block;
    font-size: 24px;
  }
  .air-service strong {
    display: block;
    font-weight: inherit;
  }
  .air-prot {
    display: inline-block;
    overflow: hidden;
  }
  .air-prot ul {
    display: block;
  }
  .air-prot ul li {
    display: inline-block;
    padding-right: 16px;
  }
  .air-prot ul li strong img {
    display: inline-block;
    width: 30px;
    padding-right: 5px;
  }
  .air-prot ul li strong {
    display: block;
    font-weight: inherit;
  }
  .air-prot ul li p {
    display: block;
    margin-bottom: 0;
  }
  .nav-link .icon-nav {
    width: 30px;
    padding-right: 5px;
  }
  .nav-link {
    padding-right: 30px;
  }

  
  .carousel-caption {
    position: absolute;
    right: 55%;
    bottom: 15px;
    left: 15%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: center;
    top: 20%;
  }
  .navbar-dark .navbar-text {
    margin-left: 260px;
  }
  .navbar-brand {
    display: none;
  }
  .text-head-nav {
    color: brown;
  }
  
  /* mobile device */
  
  .text-head-nav {
    color: aliceblue;
    font-size: 30px;
    text-shadow: 2px 2px 3px black !important;
  }
  *.carousel-inner .carousel-item .icon-nav {
    width: 35px;
    overflow: hidden;
  }
  .carousel-caption {
    display: block;
    overflow: hidden;
  }
  .menu-nav-p {
    font-size: 20px;
    text-shadow: 2px 2px 3px black !important;
    text-align: left;
  }
  
  .carousel-caption .img-check {
    width: 30px;
    height: 30px;
    overflow: hidden;
  }
  .navbar-toggler {
    background-color: #63d0fb;
  }
  
  .navbar-toggler-icon {
    margin-top: 6px;
  }
  /* mobile device */
  @media screen and (max-width: 750px) {
    .logo {
      display: block;
      overflow: hidden;
      padding-bottom: 7px;
    }
    .logo img {
      display: block;
      margin: auto;
    }
    .air-service {
      padding-left: 0px;
    }
    .air-prot {
      padding-top: 8px;
    }
    .air-prot ul {
      display: block;
      padding-left: 0;
      text-align: center;
    }
    .air-prot ul li {
      display: inline-block;
      padding-right: 50px;
      padding-top: 10px;
    }
    .navbar-dark .navbar-toggler {
      color: blueviolet;
      border-color: rgb(236, 49, 49);
      background-color: black;
      float: right;
    }
    .navbar-brand {
      display: block;
    }
    .navbar-brand img {
      width: 75px;
    }
    .bg-dark-air {
      padding-top: 0px;
      padding-bottom: 0px;
    }
    .navbar-dark .navbar-text {
      margin-left: 0;
    }
    .mb-2,
    .my-2 {
      margin-top: 5px;
    }
    .carousel-inner img {
      width: 100%;
      height: 250px;
    }
  }
  /* ipad */
  @media screen and (max-width: 950px) {
    .text-head-nav {
      font-size: 13px;
    }
    .carousel-caption .img-check {
      height: 100%;
      width: 15px;
    }
    .carousel-caption {
      top: 7%;
    }
    .menu-nav-p {
      font-size: 13px;
    }
  }
  @media screen and (max-width: 950px) {
    .logo {
      display: block;
    }
    .logo img {
      display: block;
      margin: auto;
    }
    .navbar-dark .navbar-text {
      margin-left: 0;
    }
    .navbar-dark .navbar-nav .nav-link {
      padding-right: 2px;
    }
    .nav-link .icon-nav {
      width: 23px;
      padding-right: 5px;
    }
    .box-nav {
      text-align: center;
    }
  }
  
  ngx-select {
    width: 200px;
  }
  /* ------ end navbar -------- */

/* 
  <-----home------> */
  .home-air {
    display: block;
    box-shadow: 0px -5px 8px -7px black;
  }
  .vertical-menu {
    width: 100%;
  }
  
  .vertical-menu a {
    background-color: #eee;
    color: black;
    display: block;
    padding: 12px;
    text-decoration: none;
  }
  
  .vertical-menu a:hover {
    background-color: #ccc;
  }
  
  .vertical-menu a.active {
    background-color: #00c7ce;
    color: white;
  }

  .head-text {
    display: block;
    background-color: #00c7ce;
    color: white;
    padding: 12px;
    text-align: center;
  }
  /* .head-text h1,
  h2,
  strong {
    font-size: 25px;
  } */
  .wall {
    padding-top: 30px;
  }
  .wall-contant {
    display: inline-block;
    position: relative;
    width: 225px;
  }
  .wall-contant .box-air {
    display: inline-block;
  }
  .wall-contant .box-air .img-product {
    width: 100%;
    height: 220px;
  }
  .wall-contant .box-air-contant {
    display: block;
    width: 100%;
  }
  .wall-contant .box-air-contant .head-contant {
    font-size: 15px;
    font-weight: initial;
    /* width: 200px;
    height: 45px; */
    overflow: hidden;
    margin-bottom: 10px;
  }
  .wall-contant .box-air-contant .text-contant {
    display: inline-block;
    color: crimson;
    font-weight: bold;
    font-size: 5px;
    margin-bottom: 0;
    border: 1px solid !important;
    padding: 2px;
    border-radius: 10px;
  }
  .wall-brand {
    padding-top: 45px;
    padding-bottom: 45px;
    display: block;
    background-color: #f1f6fbb3;
  }
  .wall-brand .box-brand {
    display: inline-block;
  }
  .wall-brand .box-brand img {
    width: 100%;
  }
  .vertical-menu a {
    color: #2d7a7e;
  }
  
  /* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
  .dropdown-container {
    display: none;
    background-color: #262626;
    padding-left: 8px;
    transition-duration: 5s;
  }
  .dropdown-content {
    transition: width 2s;
    transition-timing-function: linear;
  }
  
  /* Optional: Style the caret down icon */
  .fa-caret-down {
    float: right;
    padding-right: 8px;
  }
  .img-promotion:hover {
    box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
    opacity: 1;
  }
  
  /* Some media queries for responsiveness */
  @media screen and (max-height: 450px) {
    .sidenav {
      padding-top: 15px;
    }
    .sidenav a {
      font-size: 18px;
    }
    .mobile-menu {
      display: none;
    }
    
  }
  .active {
    background-color: crimson;
  }
  
  @media screen and (max-width: 750px) {
    .wall-contant {
      width: 165px;
    }
    .wall-contant .box-air-contant .head-contant {
      font-size: 11px;
    }
    .wall-brand .box-brand {
      width: 192px;
      padding: 10px;
    }
  }
  @media screen and (max-width: 950px) {
    .head-text strong {
      font-size: 18px;
    }
    /* .wall-contant {
      width: 192px;
    } */
  }
  
  /* #wrapper {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
  } */
  
  /* #sidebar-wrapper .sidebar-nav {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  
  #sidebar-wrapper .sidebar-nav li ul.panel-collapse {
    list-style: none;
    -moz-padding-start: 0;
    -webkit-padding-start: 0;
    -khtml-padding-start: 0;
    -o-padding-start: 0;
    padding-start: 0;
    padding: 0;
  } */
  
  .nav-second-level {
    list-style: none;
    -moz-padding-start: 0;
    -webkit-padding-start: 0;
    -khtml-padding-start: 0;
    -o-padding-start: 0;
    /* padding-start: 0; */
    padding: 0;
  }
  
  .text-sub {
    padding-left: 8px;
    background-color: gray;
    cursor: pointer;
  }
  

  /* -----endhome------ */
  

  /* -------footer------- */
  .air-footer {
    background-image: url("../../../../assets/img/line-footer.png"),
      linear-gradient(270deg, #c5dcff, #e4e4f1);
    background-repeat: repeat;
    display: block;
    overflow: hidden;
    padding-top: 35px;
    /* padding-bottom: 35px; */
    font-family: "Kanit", sans-serif;
  }
  .footer .img-footer {
    width: 250px;
  }
  .service-menu {
    display: block;
    padding-left: 0;
  }
  .service-menu .list-menu {
    display: inline-block;
    margin-bottom: 10px;
    margin-right: 46px;
  }
  .service-menu .list-menu a {
    display: inline-block;
    border: 1px solid !important;
    padding: 10px;
    border-radius: 10px;
    text-decoration: none;
  }
  .footer-wall {
    overflow: hidden;
    background-color: #164873;
    padding: 15px;
    text-align: center;
    color: deeppink;
  }
  .footer-wall a {
    color: aqua;
    text-decoration: none;
  }
  
  .group-img {
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    -o-transition: 0.5s all;
    transition: 0.5s all;
  }
  .group-img:hover {
    -ms-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -ms-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
  
    box-shadow: 0 40px 79px -20px rgb(0 0 10 / 20%),
      0 30px 50px -30px rgb(0 0 0 / 40%);
  }
  
  /* ---------end footer-------- */



  /* air detail  */

  .card-body {
    padding: 0;
  }
  .air {
    display: block;
  }
  .air .head-h1 {
    display: block;
    background-color: #00c7ce;
    color: white;
    padding: 12px;
    text-align: center;
    margin-bottom: 25px;
  }
  .air .head-h1 {
    font-size: 22px;
    font-weight: bold;
  }
  .air .head-air {
    display: block;
    background-color: #00c7ce;
    color: white;
    padding: 12px;
    text-align: center;
  }
  .air .head-air .head-h2 {
    font-size: 22px;
    font-weight: bold;
  }
  
  .table thead th {
    font-size: 15px;
  }
  
  .articles-text {
    overflow: hidden;
    text-overflow: ellipsis;
    height: 150px;
    text-indent: 50px;
    color: black;
    font-size: 14px;
  }
  .card-img-top {
    height: 100%;
  }
  
  .box-type {
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    -o-transition: 0.5s all;
    transition: 0.5s all;
    overflow: hidden;
    margin-bottom: 40px;
    display: inline-block;
    width: 33%;
    padding: 10px;
  }
  
  .box-type:hover {
    -ms-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -ms-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
  
    box-shadow: 0 40px 79px -20px rgb(0 0 10 / 20%),
      0 30px 50px -30px rgb(0 0 0 / 40%);
  }
  a:hover {
    text-decoration: none;
  }
  .head-h2{
    font-size: 20px;
    color: darkred;
  }
.text-detail{
  color: #212323;
  text-indent: 50px;
}
  /* end airdetail */




  /* contact */
  .contact-air{
    padding-top: 30px;
    position: relative;
    overflow: hidden;
}
.contact-air h1{
    text-align: center;
    font-size: 25px;
    content: "";
    color: chocolate;
}
.contact-air p{
    text-align: center;
}
.social{
display: block;
padding-top: 20px;
padding-bottom: 20px;
}
.social .box-social{
    display: block;
    text-align: center;
}
.social .box-social li{
    display: inline-block;
}
.social .box-social li a{
    display: block;
border-radius: 22px;
border: 1px solid white;
background: white;
padding: 10px;
margin-right: 30px;
box-shadow: 0px 0px 12px -8px black;
}
@media screen and (max-width: 800px) {
  .box-type {
    margin-bottom: 0px;
    display: inline-block;
    width: 184px;
    padding: 5px;
  }
}
@media screen and (max-width: 750px) {
  .head-h2 {
    font-size: 15px;
    color: rgb(94, 79, 79);

}
.text-detail {
  color: #212323;
  text-indent: 50px;
  font-size: 12px;
}
.box-type {
  margin-bottom: 0px;
  display: inline-block;
  width: 184px;
  padding: 5px;
}
}
  /* end contact */


  /* view air */
  .box-detail {
    display: block;
    overflow: hidden;
    padding-top: 55px;
  }
  .wall-detail {
    display: block;
    overflow: hidden;
  }
  .form-img {
    display: block;
    overflow: hidden;
    float: left;
  }
  .img-detail {
    width: 185px;
    height: 100%;
  }
  .box-img {
    display: block;
    /* float: left; */
  }
  #top {
    width: 370px;
    overflow: hidden;
  }
  .img-target {
    width: 100%;
    display: block;
    overflow: hidden;
    height: 51px;
  }
  .item-target {
    width: 50px;
    overflow: hidden;
    /* position: absolute; */
    /* top: -48px; */
    height: 100%;
  }
  .img-slide {
    width: 100%;
    height: 258px;
  }
  .sup-head {
    display: block;
    text-align: center;
    overflow: hidden;
    /* border: 1px solid #58cefc; */
    background: linear-gradient(270deg, #58cefc, #9a9db83d);
    border-radius: 15px;
    margin-bottom: 15px;
  }
  .head-h1 {
    overflow: hidden;
  }
  
  .vertical-menu {
    width: 100%;
  }
  
  .vertical-menu a {
    background-color: #eee;
    color: black;
    display: block;
    padding: 12px;
    text-decoration: none;
  }
  
  .vertical-menu a:hover {
    background-color: #ccc;
  }
  
  .vertical-menu a.active {
    background-color: #00c7ce;
    color: white;
  }
  .head-text {
    display: block;
    background-color: #00c7ce;
    color: white;
    padding: 12px;
    text-align: center;
  }
  
  .free-ml {
    display: block;
  }
  .free-ml .head-free {
    display: inline-block;
    font-size: 33px;
    border-bottom: 4px solid burlywood;
  }
  .free-ml .img-free {
    overflow: hidden;
    display: inline-block;
  }
  .free-ml .img-free img {
    overflow: hidden;
    display: inline-block;
    width: 163px;
    padding-right: 35px;
  }
  
  *.thead-light {
    background-color: #00c7ce;
  }
  .table .thead-light th {
    background-color: #00c7ce;
  }
  *.caro-indi {
    bottom: -20px;
    height: 60px;
    /* width: 100%; */
  }
  .box-culu {
    display: block;
    margin: auto;
    padding-bottom: 15px;
  }
  
  /* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */
  .dropdown-container {
    display: none;
    background-color: #262626;
    padding-left: 8px;
    transition-duration: 5s;
  }
  .dropdown-content {
    transition: width 2s;
    transition-timing-function: linear;
  }
  
  /* Optional: Style the caret down icon */
  .fa-caret-down {
    float: right;
    padding-right: 8px;
  }
  .img-promotion:hover {
    box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
    opacity: 1;
  }
  *.carousel  .carousel-indicators li{
    width: 80px;
height: 50;
  }
  
  /* Some media queries for responsiveness */
  @media screen and (max-height: 450px) {
    .sidenav {
      padding-top: 15px;
    }
    .sidenav a {
      font-size: 18px;
    }
  }
  
  .nav-second-level {
    list-style: none;
    -moz-padding-start: 0;
    -webkit-padding-start: 0;
    -khtml-padding-start: 0;
    -o-padding-start: 0;
    padding-start: 0;
    padding: 0;
  }
  
  .text-sub {
    padding-left: 8px;
    background-color: gray;
    cursor: pointer;
  }
  @media screen and (max-width: 450px) {
  .mobile-menu{
  display: none;
  }
  }
  
  /* end view air */

/* clean air */
.head-h1{
  display: block;
  background-color: #00C7CE;
  color: white;
  padding: 12px;
  text-align: center; 
  margin-bottom: 25px;
  font-size: 22px;
  font-weight: bold;
}
.head-air-clean{
  overflow: hidden;
}
.img-clean{
  overflow: hidden;
  width: 100%;
}

/* end clean air */


/* install air */

.head-h1{
  display: block;
  background-color: #00C7CE;
  color: white;
  padding: 12px;
  text-align: center; 
  margin-bottom: 25px;
  font-size: 22px;
  font-weight: bold;
}
.head-air-clean{
  overflow: hidden;
}
.img-clean{
  overflow: hidden;
  width: 100%;
}
.boximg{
  display: block;
  overflow: hidden;
  padding-top: 40px;
  padding-bottom: 40px;
}
*.head-free{
  display: inline-block;
font-size: 33px;
border-bottom: 4px solid burlywood;
}
.img-free{
  overflow: hidden;
  display: inline-block;
}
.img-free img{
  overflow: hidden;
  display: inline-block;
  width: 222px;
  padding-right: 35px;
}
.group-img{
  overflow: hidden;
  display: inline-block;
}
.group-img img{
  overflow: hidden;
  display: inline-block;
  width: 100%;
  /* padding-right: 35px; */
}
/* end install air */

/* repair air */
.head-h1{
  display: block;
  background-color: #00C7CE;
  color: white;
  padding: 12px;
  text-align: center; 
  margin-bottom: 25px;
  font-size: 22px;
  font-weight: bold;
}
.head-air-clean{
  overflow: hidden;
}
.img-clean{
  overflow: hidden;
  width: 100%;
}
.boximg{
  display: block;
  overflow: hidden;
  padding-top: 40px;
  padding-bottom: 40px;
}
/* end repair air */

/* move air */
.head-h1{
  display: block;
  background-color: #00C7CE;
  color: white;
  padding: 12px;
  text-align: center; 
  margin-bottom: 25px;
  font-size: 22px;
  font-weight: bold;
}
.head-air-clean{
  overflow: hidden;
}
.img-clean{
  overflow: hidden;
  width: 100%;
}
.boximg{
  display: block;
  overflow: hidden;
  padding-top: 40px;
  padding-bottom: 40px;
}
/* end move air */
/* pagination */
.pagin{
  display: flex;
  justify-content: center;
  margin-top: 30px;
}
.pagin .pagination{
  overflow: hidden;

}
.pagin .pagination li a{
  color: #3d45b2;
}
.pagin .pagination li{
  border: 1px solid #aac8f7;
padding: 10px;
border-radius: 11px;
background-image: linear-gradient(270deg, #a1dbf1, #9a9db83d);
margin-right: 2px;
}