/*************** global responsive ****************/
/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {
    font-size: 12px
  }
}
/*@media only screen and (min-width: 1024px) {.navbar{width:100% !important;}}*/
/* mobile and tablet  - min-767px and max*/
@media only screen and (min-width: 768px) and (max-width: 1080px) {
  html {
    font-size: 80%;
    /* 1rem = 10px */
  }
  
  p, a,
  .btn,
  .btn-brown, .outline-btn, li {
    font-size: 1.2rem;
  }
  .navbar-expand-lg>.container,
  .navbar-expand-lg>.container-fluid {
    padding-left: 15px;
    padding-right: 15px;
  }

  .uni-padding {
    padding: 80px 0;
  }
  /* menu */
  .navbar {
    position: fixed;
    background-color:white;
    top: 0;
    right: 0;
    width: 0;
    height: 100vh;
    display: block;
    transition: all 0.5s;
    text-align: right;
    box-shadow: 2px 2px 6px 2px rgb(151 151 151 / 87%);
    z-index: 1;
  }

  .fa-times {
    margin: 20px
  }

  .navbar ul {
    padding: 1rem;
    text-align: left;
  }

  .navbar ul li {
    margin-top: 1rem;
  }

  .navbar .btn-box .btn {
    width: 80%;
    margin-right: 1rem;
    padding: 10px;
    letter-spacing: 0;
  }

  .header-row {
    flex-wrap: wrap;
  }

  .header .fa-bars,
  .header .fa-times {
    display: block;
  }

  .top-bar {
    gap: 1rem;
  }

  .search-bar .input {
    max-width: 140px;
    height: 35px;
  }

  .login-btn {
    padding: 0.4rem 0.6rem;
  }

  .top-bar img {
    width: 1.65rem;
    height: 1.65rem;
  }

  .desktop-btn {
    display: none;
  }

  .mobile-btn {
    display: block;
  }

  .logo-div {
    order: 0;
    padding-top: 1rem;
  }

  #openMenu {
    order: 2
  }

  .top-bar {
    padding: 0;
  }
  .banner-row .content-div{
    margin-top: 25%;
  }
  #features .features-wrapper .feature-col {
    flex-grow: 1;
  }
 
  .charter-buttons-wrapper a,
  .features-wrapper .feature-col {
    padding: 10px 9px;
  }
  #booking-charter .card:after {
    width: 50px;
    height: 50px;
    top: 20%;
    left: 50%;
    transform: translate(-50%, -130%);
  }
  #booking-charter .booking-wrapper .booking-content h2 {
    font-size: 2rem;
  }
  .submenu{width:100%;}
  /* privacy */
  .quick-quote-row, .quick-location-row{width: 90%;}
  .quick-quote-row .content-bar .heading-div, .quick-location-row .content-bar .heading-div{
    min-width: 25%;
  }
  .quick-quote-row .content-bar .para-div, .quick-location-row .content-bar .para-div{
    min-width: 55%;
  }
  .quick-quote-row .content-bar .btn-div, .quick-location-row .content-bar .btn-div{
    min-width: 20%;}
    .quick-quote-row .content-bar .heading-div h2, .quick-location-row .content-bar .heading-div h2{
      font-size: 2rem;
    }
  .card-loc img{max-width: 150px;}
    .quick-quote-row .content-bar .para-div,  .quick-location-row .content-bar .para-div{padding-left: 3%; padding-right: 3%;}
.quick-quote-row .content-bar .heading-div, .quick-location-row .content-bar .heading-div{padding-right: 3%;}
.blog-date{
  bottom: 40%;
    right: 20px;
}
.video-btn svg {
    width: 100px;
    height: 100px;
}
#professional h2 {
    font-size: 2.4rem;
}
.professional-wrapper .ranks .rank-text span{font-size:4rem;}
#booking-charter .card{padding:1rem;}
#booking-charter .card-box{gap:1rem;}
#booking-charter .card svg{width:50px;}
.badge h4{font-size:1.2rem;}
#cooee-content .badge-div .badge svg {
    min-width: 38px;}
    .blog-card{min-height:252px;}
    .services-card-wrapper .services-card{min-height: 305px;padding: 1rem;}
    #about-banner {
    background-size: 80%;
    background-position: 160% 100%;
}
.phone-booking-wrapper .img-div img {
        min-height: 460px;
        object-fit: cover;
    }
    #features .features-wrapper{
        width: 100%;
    }
    .recent-post-bar ul li{    font-size: 1rem;}
    .inner-des2, #blog-about .blog-card-wrapper{gap:1rem;}
    #blog-about .private .blog-card-img{min-height:320px;}
    .blog-quote {
    font-size: 14px;
}
}


/* moblie and tablet (for both) */
@media only screen and (min-width: 300px) and (max-width: 1080px) {
  #header .menu .navbar ul li:not(.submenu li) {
    display: block;
  }

  #header .logo-div img {
    width: 80px;
  }
  .logo-div {
flex-basis: 60%;
}
.header .fa-bars{
  display: block;
  color: var(--white);
}
/* #header .menu .navbar ul li a{
  color: var(--primary);
} */
#serivces-slider .owl-carousel .owl-next{
  right: 0px;
}
#serivces-slider .owl-carousel .owl-prev{
  left: 0px;
}
.header .fa-bars{
  font-size: 22px;
}
#header .menu .navbar ul li a:not(.submenu li a){
  color: var(--primary);
}
.submenu{
  background-color: var(--secondery) !important;
    min-width: 150px;
    position: absolute;
    top: 25px !important;
    display: none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.7s ease-in-out;
    z-index: 1;
}
.submenu li a{
  color: var(--white);
}
.block-submenu{
  column-count: 1;
}
#booking-charter .booking-content{
  flex-basis: 40%;
}
#booking-charter .card-box{
  flex-basis: 60%;
}
.card-loc-wrapper .card-loc-col:first-child>a {
    max-width: 22.6%;
}
.red-sydney .btn-brown{
margin-right:10px;
  }
    #partners .partners-wrapper .partner-col img, #transport-solutions .img-box-container .img-box img{    max-width: 70px;}
    .blog-info h4 a{font-size:14px;
        margin-top:10px;
    }
    .blog-meta span{padding-right:5px;}
    .blog-meta{font-size:12px;}
    .form-group label{    top: -15px;}
    .shadow-effect{min-height:370px;}
    .des2-img-box svg, .services-des2-col-3 .services-content-col svg{max-width: 70px;max-height: 70px;}
    .vacancies-wrapper{padding-left: 15px !important;
    padding-right: 15px !important;}
     .services-card svg {
    max-width: 70px;
    height: 70px;
  }
  #fleets-slider .fleet-slide-card p {
    font-size: 1.3rem;
}
#services-des2 .des2-service-col svg{max-width: 70px;
    max-height: 70px;}
   .contact-content-col .icon-div-col svg {
    max-width: 40px;
    max-height: 40px;
}
.our-fleets-card-sec{padding-right: 0;
    padding-left: 0;}
    .top-header a{font-size:1rem;}
    #our-fleets .our-fleets-row .fleet-card{padding: 2rem;}
}









/* mobile */
@media only screen and (max-width: 767px) {
  html {
    font-size: 80%;
    /* 1rem = 10px */
  }

  .container-fluid,
  .container {
    padding-left: 15px;
    padding-right: 15px;
  }
  p, a,
  .btn,
  .btn-brown, .outline-btn, li {
    font-size: 1.3rem;
  }

  h1,
  h2, .h2-title,
  h3, .h3-title,
  h4, .h4-title,
  h5, .h5-title,
  h6, .h6-title  {
    margin-bottom: 1.2rem;
  }

  h1 {
    font-size: 2.5rem;
  }

  h2, .h2-title {
    font-size: 2rem;
  }

  h3, .h3-title {
    font-size: 1.8rem;
  }

  h4, .h4-title {
    font-size: 1.4rem;
  }

  h5, .h4-title {
    font-size: 1.5rem;
  }

  h6, .h6-title {
    font-size: 1.2rem;
  }

  .uni-padding {
    padding: 60px 0;
  }
  .card-sec-padding {
    padding: 40px 0;
  }

  .pt-6 {
    padding-top: 2rem;
  }

  .mobile-hide {
    display: none;
  }

  .desktop-hide {
    display: block;
    width: max-content;
  }

  #banner .content-div .para, #our-fleets .our-fleets-row .sub-title, .values-wrapper>h2, .values-wrapper>p {
    width: 100%;
  }

  /* menu */
  .navbar {
    position: fixed;
    background-color: var(--white);
    top: 0;
    right: 0;
    width: 0;
    height: 100vh;
    display: block;
    transition: all 0.5s;
    text-align: right;
    box-shadow: 2px 2px 6px 2px rgb(151 151 151 / 87%);
    z-index: 1;
  }
 
  .fa-times {
    margin: 20px
  }

  .navbar ul {
    padding: 10px;
    text-align: left;
  }

  .navbar ul li {
    margin-top: 1rem;
  }

  .navbar .btn-box .btn {
    width: 100%;
    margin-left: 1rem;
    padding: 10px;
    font-size: 1rem;
  }

  .header-row {
    flex-wrap: wrap;
  }

 
  .header .fa-times {
    display: block;
    color: var(--color);
font-size:25px;
  }
  .logo-div {
    order: 1;
    padding-top: 1rem;
      flex-basis: 90%;
  }

  #openMenu {
    order: 2;
font-size:28px;
  }
  .btn,
  .btn-brown {
    padding: 12px 10px;
  }
  .pre-text {
    font-size: 1.2rem;
  }
  .content-wrapper {
    width: 100%;
  }
.btn-box{
  width: 100%;
  gap: 1rem;
  padding-top: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  display: none;
}.banner-row .content-div{
  margin-top: 45%;
  padding: 15px;
}
.left-top-header{
gap: 0;
}
.top-header-wrapper,.booking-wrapper, .cooee-content-wrapper, .badge-div, .card-box,.left-top-header,#luxury .luxury-wrapper, #luxury-gray .luxury-wrapper, #priority .priority-wrapper, .services-content-row, #serivces-slider .head-div, .customers-content-row, .contact-content-wrapper, #services-des2 .des2-service-col, .light-service-col, .col-2-count .des2-50-col, .inner-des2, .professional-wrapper, .about-wrapper, .phone-booking-wrapper{
  flex-direction: column;
}
.luxury-wrapper .img-div, .priority-wrapper .img-div, #customers .img-div, #transport-solutions .solutions-wrapper .img-div, .solutions-wrapper .flex-40{
  order: -1;
  padding-bottom: 2rem;
}

#services .pl-3{
  padding-left: 0rem;
}
.top-header p{
  font-size: 1.1rem;
}
.top-header a{
  vertical-align: 10px;
}
.content-div, .contact-content-col .icon-div, #contact-form .form-group:not(:last-child){
  width: 100%;
  max-width: 100%;
}
.btn, .btn-brown, .outline-btn{
  margin-top: 2rem;
}
#booking-charter .card, .recent-post-bar {
  margin-top: 50px;
}
#booking-charter .card:after{
  top: 50%;
            left: 50%;
            transform: translate(-50%, -130%);
}
  .blog-cta-box{padding-left:0;}
#cooee-content .badge-div .badge, .services-card-wrapper > a {
  flex-basis:100%;
  margin-top: 10px;
  align-items: center;
}
#cooee-content .cooee-content-col p span{
  vertical-align: -10px;
}
#features .features-wrapper{
  flex-wrap: wrap;
}
#features .features-wrapper>div{
  flex-basis: 49%;
  max-width: 32%;
}
.charter-buttons-wrapper {
  animation: none;
  flex-direction: column;
}
.charter-buttons-wrapper a:not(:last-child){
  border-bottom: 1px solid var(--primary);
}
.charter-buttons-row{
  padding: 0 15px;
  border-radius: 10px;
}

/* *******newsletter******** */
.newsletter-form{
  width: 80%;
}
#newsletter {
  margin-bottom: 60px;
  margin-top: 60px;
}
#privacy-banner a, #terms-banner a, #contact-banner a{
  font-size: 1.3rem;
}
.quick-quote-row .content-bar .para-div p, .quick-location-row .content-bar .para-div p{
  text-align: center;
  font-size: 1.3rem !important;
}
.heading-div, .para-div, .btn-div{
  padding: 0;
}
.contact-content-wrapper .form-div{
  border-radius: 10px 10px 100px 10px;
  margin-top: 2rem;
}
.contact-content-wrapper>div:first-child {
  padding-right: 0;
}
#customers .customers-row{
  padding-right: 15px;
}
  .form-group {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .subscribe-btn {
    width: 100%;
  }
  #partners .partners-wrapper .partner-col{
    flex-basis: 30%;
  }
  .quick-quote-row, .quick-location-row{
    padding: 2rem;
  }

  .quick-quote-row .content-bar, .quick-location-row .content-bar, .testimonials-wrapper, #footer .footer-head, .footer-wrapper-col, .footer-bottom-wrapper,  .fleets-content-wrapper, #our-fleets .our-fleets-row .fleet-card, .inner-about-wrapper, .services-des2-content-row, .services-des2-card-wrapper, .solutions-wrapper{
    flex-direction: column;
  }
  .quick-quote-row .content-bar .para-div,.quick-location-row .content-bar .para-div, .quick-quote-row .content-bar .btn-div{
    border-left: none;
    border-right: none;
  }
  .testimonials-wrapper>div{
    flex-basis: 100%;
  }
  #footer .footer-head h3,  #footer .footer-head .h3-title, .wrapper-right{
    margin-top: 2rem;
  }
  #footer .footer-head .social-icons>a {
    flex-basis: 12%;
  }
  .footer-wrapper-col h4 {
    font-size: 1.8rem;
}
  .footer-wrapper-col .wrapper-col .footer-list li{
    font-size: 1.3rem;
  }
  #blog-section .content, #blog-section .news-slider, #features .features-wrapper {
    width: 100%;
  }
    #blog-section .owl-nav{
      bottom: 0;
      left: 40px;
 }
 #features .features-wrapper .feature-col img {
  max-width: 60%;
}
 /* fleets */
 .fleets-content-wrapper .side-list,  .inner-about-wrapper .side-list{
  margin-top: 2rem;}
  .feature-list, .col-cunt-2{
column-count: 1;
  }
  #our-fleets .our-fleets-row .fleet-card .fleet-card-right{
    text-align: left;
  }
  .services-des2-content-row{
    align-items: flex-start;
  }
  .services-des2-card-wrapper{
    gap:1.2rem;
  }
  #fleets-slider .owl-carousel .owl-next{
    right: -35px;
  }
  #fleets-slider .owl-carousel .owl-prev{
    left: -35px;
  }
  #transport-solutions .solutions-wrapper .img-div{
    padding-bottom: 4rem;
  }
  #transport-solutions .solutions-wrapper .img-div::before{
    width: 120px;
    height: 120px;
    right: 20px;
  }
  #services-des2 .des2-service-col:last-child .img-div, #services-light .light-service-col:last-child .img-div, .des2-img-box, .covid-wrapper .img-div, #fun-tours-banner .img-div{order: -1;}
  #services-light .service-box-wrapper .light-service-col:first-child .content-box, #services-light .service-box-wrapper .light-service-col:nth-child(2) .content-box{
    padding: 0;
   }
   #services-light .service-box-wrapper .light-service-col{
   margin-bottom: 2rem;
   }
   .inner-about-wrapper .fleet-col h2, .card-loc-wrapper .card-loc-col:first-child, .card-loc-wrapper .content-column{
    width: 100%;
  }
  .des2-img-box svg{
    width: 80px;
    height: 80px;
  }
/* private */
.inner-des2 .des2-img-box {
  text-align: center;
  padding-bottom: 2rem;
}
#black-cta .black-cta-wrapper, #fun-tours-banner .img-div img {
  width: 80%;
  margin: 0 auto;
}
.black-cta-row {
  background-size: 100%;
  background-position: right bottom;
  padding-bottom: 150px !important;
}
.blank-content-div{
  display: none;
}
#about-banner .about-content-div {
  padding: 200px 30px 100px;
  background-image: none;
}
#about-banner{
  background-size: cover;
  background-color: rgb(1 1 1 / 43%);
  background-blend-mode: overlay;
}
#professional h2 {
  font-size: 2.2rem;
}
.professional-wrapper .ranks .rank-text, .professional-wrapper .ranks .rank-text span {
 font-size: 3rem;}
 .professional-wrapper .ranks .rank-box {
  flex-basis: 33%;
}
.video-btn svg {
  margin-right: -70px;
  max-width: 100px;
  max-height: 100px;
}
.solutions-wrapper .flex-40{
  text-align: center;
}
#transport-solutions{
  padding-top: 0;
}
#phone-booking .img-div, #services-light .light-service-col:first-child .img-div, .locations-dark-wrapper .img-div, .service-box-wrapper .light-service-col:nth-child(3) .img-div, #transport-solutions .flex-45, #bus-buck-dark .img-div{order: -1;}
.blog-about-wrapper, .blog-card-wrapper, .covid-wrapper, .services-des2-col-3, .locations-dark-wrapper, .card-loc-wrapper, .red-cta-wrapper, .blog-content .img-div, #vacancies .vacancies-card, .bus-buck-dark-wrapper{
  flex-direction: column;
}
.blog-content .date-details, #fun-tours-banner .content-div {
  flex-direction: column;
  align-items: flex-start;
}
#footer .white-sec{
  align-items: flex-start;
}
#footer .white-sec img, #bus-buck-dark .img-div img{
  margin-bottom: 20px;
}
.covid-wrapper .img-div, #fun-tours-banner .img-div img{
  margin-bottom: 2rem;
}
.services-des2-col-3 .services-content-col, .locations-dark-wrapper .location-col:first-child, .card-loc-wrapper .card-loc-col {
  margin-top: 2rem;
}
.card-loc-wrapper .card-loc-col:first-child .card-loc{
  min-width: 12%;
    flex-basis: 30%;
}
#services-des2 .services-content-col svg{
  max-width: 80px;
  height: 80px;
  margin-top: 10px;
}
.blog-content .img-div{
  row-gap: 2rem;
}
.blog-content .img-div img, #transport-solutions .img-box-container, .bus-buck-dark-wrapper .content-box p{
  width: 100%;
}
.values-row .values-card:nth-child(1), .values-row .values-card:nth-child(2), .values-row .values-card:nth-child(3), .values-row .values-card:nth-child(4){
  flex-basis: 100%;
  object-fit: cover;
  min-height: 200px;
}
.career-service{
  padding-top: 4rem;
}
.flex-45 img{
  margin-bottom: 2rem;
}
#vacancies .vacancies-card{
  width: 80%;
  margin: 0 auto;
  padding: 2rem 1rem;
  margin-top: 2rem;
  text-align: center;
}
#job .mt-subsc {
    margin-top: -312px;
        left: 51%;
}
#job .width-65 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 98.5%;
}
.img-div img{
  width:100%;
}
  .submenu{width:100%;}
#bus-buck-dark .bus-buck-dark-wrapper>div h3{
  font-size: 2.2rem;
}
  #transport-solutions .solutions-wrapper .solutions-col img, .col-2-count{margin-top:2rem;}
  #contact-form .form-group label, #job .form-group input, #job .form-group input::placeholder, textarea::placeholder, #job .checkbox-box p, #job .checkbox-box a, #job .checkbox-box label{font-size:1.3rem;}
  .footer-list li a{
    font-size: 1.2rem;
  }
      #our-fleets {
        padding-right: 40px;
        padding-left: 40px;
    }
    #professional {
    padding-bottom: 60px;
}
.services-card-wrapper .services-card {
    min-height: 240px;}
    #customers .img-div img{
            margin-right: -15px;
    }
    #job .form-group:not(:last-child){
        max-width: 48%;
    }
    #our-fleets .our-fleets-row .fleet-card .fleet-card-left .list{column-count:1;}
    .fleet-card-right{order:-1;padding-bottom: 20px;}
   
    .social-div .icon-div a svg{width: 40px;
    height: 40px;}
    #blog-about .icon-div{gap:4%;}
    #fleets-slider .owl-carousel .item {
    min-height: 650px;
    }
    #luxury-gray .arrow-list{margin-inline-start: 0;}
    #blog-inner-banner .breadcrumb ul{    flex-wrap: wrap;}
    #blog-about .blog-card-wrapper{height: unset}
}