/* mechanics App HTML Template*/

@media only screen and (max-width: 5000px) {
   .page-wrapper {
      overflow: hidden;
   }
}

@media only screen and (max-width: 1600px) {
}

@media (min-width: 1580px) and (max-width: 1700px) {
   .main-slider .slide {
      background-size: 100% auto;
   }
}

@media only screen and (max-width: 1340px) {
   .page-wrapper {
      overflow: hidden;
   }
}

@media only screen and (max-width: 1140px) {
   .main-header {
      margin: 0px !important;
   }

   .fluid-section-one .content-column .inner-column {
      padding-left: 20px;
   }

   .grid-view .auto-container {
      padding: 0px 15px;
   }

   .page-wrapper {
      overflow: hidden;
   }

   .main-menu .navigation > li {
      margin-left: 0px;
   }

   .main-header .info-box strong {
      font-size: 13px;
   }

   .main-header .info-box {
      margin-left: 25px;
      display: inline-block;
      float: none;
   }

   .main-header .outer-box,
   .main-slider h3:before,
   .main-slider h3:after,
   .main-header .button-box {
      display: none;
   }

   .main-header .outer-box .buttons-box .theme-btn {
      font-size: 16px;
   }

   .main-header .outer-box .option-box > li {
      margin-left: 15px;
   }

   .sec-title h2 {
      font-size: 30px;
   }

   .services-section .upper-section {
      padding-top: 90px;
      margin-top: 0px;
   }

   .about-section .content-column .inner-column,
   .accordian-section .content-column .inner-column,
   .sidebar-page-container .sidebar-side .sidebar.left-padding,
   .services-section .lower-section .content-column .inner-column {
      padding-left: 0px;
   }

   .services-block-three .inner-box,
   .team-block .inner-box {
      padding: 15px 15px;
   }

   .blog-single .inner-box .image {
      padding: 15px 15px 0px;
   }

   .blog-single .inner-box .lower-content {
      padding: 30px 15px 0px;
   }
}

@media only screen and (min-width: 1025px) {
}

@media only screen and (min-width: 768px) {
   .main-menu .navigation > li > ul,
   .main-menu .navigation > li > ul > li > ul {
      display: block !important;
      visibility: hidden;
      opacity: 0;
   }

   .main-header .header-upper-inner {
      border-radius: 35px;
      padding-inline: 30px 45px;
      /* margin-top: 8px; */
   }
}

@media only screen and (max-width: 1023px) {
   .main-header .main-box .logo-box {
      position: relative;
      left: 0px;
      top: 0px;
      right: 0px;
      bottom: 0px;
      margin: 0px;
      text-align: left;
   }

   .about-section .image-column {
      margin-bottom: 40px;
   }

   .services-section .lower-section .image-column .inner-column .image .icon {
      left: 0px;
      bottom: 0px;
   }

   .clients-section-two h2,
   .map-section h2 {
      font-size: 40px;
   }

   .main-header .header-top .top-right {
      width: 100%;
      text-align: center;
   }

   .main-header .header-top .top-right .links {
      top: 0px;
   }

   .main-header .btn-box {
      display: none;
   }

   .main-header .header-upper-inner {
      padding-left: 15px;
      padding-right: 15px;
   }

   .main-header .header-top .top-right .social-icon-one {
      float: right;
   }

   .main-header .search-box-outer .dropdown-menu {
      top: 48px !important;
   }

   .main-header .nav-toggler {
      display: block;
   }

   .main-slider .tparrows,
   .header-top-two .top-left,
   .fixed-header .sticky-header,
   .main-header .header-top .top-right::before,
   .main-header .header-top .top-right:after,
   .main-header .header-top .top-right .list,
   .main-header .contact-number {
      display: none;
   }

   .main-header .header-top .top-right .social-nav {
      margin-left: 0px;
      width: 100%;
   }

   .main-menu .navigation > li > a {
      font-size: 14px;
   }

   .main-header .options-box {
      margin-top: 0px;
      position: absolute;
      left: 0px;
      top: 25px;
      z-index: 12;
      display: none;
      right: auto;
   }

   .main-header .upper-right {
      padding-top: 0px;
      width: 100%;
      text-align: center;
      padding-bottom: 20px;
   }

   .main-menu .navigation > li {
      margin-right: 25px;
   }

   .main-header .logo-box {
      margin-right: 0px;
      width: auto;
      text-align: center;
   }

   .main-header .outer-container {
      padding: 0px 15px;
   }

   .main-slider h2 {
      font-size: 80px;
      padding-left: 0px;
   }

   .main-slider h3 span {
      font-size: 50px;
   }

   .main-slider h2:before {
      display: none;
   }

   .header-top .top-right {
      display: none;
   }

   .header-top .top-right .social-box {
      width: 100%;
      text-align: center;
   }

   .main-header .support-box {
      margin-top: 10px;
   }

   .main-header .search-box-outer {
      margin-top: 30px;
   }

   .main-slider h2 {
      font-size: 60px;
   }

   .main-slider .text {
      font-size: 16px;
   }

   .fluid-section-one .image-column,
   .fluid-section-one .content-column {
      position: relative;
      width: 100%;
      display: block;
   }

   .fluid-section-one .content-column .inner-column {
      max-width: 100%;
      padding-left: 15px;
      margin-left: 0px;
      padding-right: 15px;
   }

   .fluid-section-one .image-column {
      background-image: none !important;
      margin-left: 0px;
   }

   .fluid-section-one .image-column .image-box {
      display: block;
   }

   .main-footer .footer-nav {
      text-align: center;
   }

   .main-footer .copyright-column .copyright {
      text-align: center;
      margin-top: 6px;
   }
}

@media (max-width: 991px) {
   .card_slider_sec .car_content img {
        width: 130px;
        height: 130px;
        margin: 20px 0px 0px 95px;
   }
}

@media (min-width: 768px) {
   .main-header.in_pages {
      margin-top: 10px;
   }

   .booking-form .form-control {
      font-size: 17px;
   }
   .header-top .top-right .social-icon-one {
      float: left;
      margin-left: 15px;
   }
}

@media only screen and (max-width: 767px) {
   .logo-outer {
      position: relative;
      left: 0px;
      top: 0px;
      right: 0px;
      bottom: 0px;
      width: 100%;
      margin: 0px;
   }

   .main-header {
      position: relative;
      background: #ffffff;
   }

   .main-header .header-top .top-right,
   .main-header .header-top .top-left {
      width: 100%;
   }

   .sec-title h2,
   .blog-single .inner-box .lower-content h2 {
      font-size: 26px;
   }

   .main-menu {
      position: absolute;
      width: 100%;
      display: block;
   }

   .main-menu .navbar-collapse {
      position: relative;
       max-height: 0px; 
      max-width: none;
      overflow-y: scroll;
      /* float: none !important; */
      width: 100% !important;
      padding: 0px 0px 0px;
      border: none;
      margin: 0px 0px 0px;
      -ms-border-radius: 0px;
      -moz-border-radius: 0px;
      -webkit-border-radius: 0px;
      -o-border-radius: 0px;
      border-radius: 0 0 5px 5px;
      box-shadow: none;
      z-index: 5;
   }

   .clients-section-two h2 br {
      display: none;
   }

   .fluid-section-one .content-column .inner-column h2,
   .clients-section-two h2 {
      font-size: 32px;
   }

   .main-menu .navbar-collapse.in,
   .main-menu .collapsing {
      padding: 0px 0px 0px;
      border: none;
      margin: 0px 0px 15px;
      -ms-border-radius: 0px;
      -moz-border-radius: 0px;
      -webkit-border-radius: 0px;
      -o-border-radius: 0px;
      border-radius: 0px;
      box-shadow: none;
   }

   .main-menu .navbar-header {
      position: relative;
      /* float: none; */
      display: block;
      text-align: right;
      width: 100%;
      /* padding: 15px 0px; */
      /* margin-bottom: 10px; */
      right: 0px;
      z-index: 12;
   }

   .main-menu .navbar-header .navbar-toggle {
      display: inline-block;
      z-index: 12;
      border: 1px solid #cc8809;
      float: none;
      margin: 0px 0px 0px 0px;
      border-radius: 0px;
      background: #cc8809;
   }

   .main-menu .navbar-header .navbar-toggle .icon-bar {
      background: #ffffff;
   }

   .main-menu .navbar-collapse > .navigation {
      float: none !important;
      margin: 0px !important;
      width: 100% !important;
      background: #2c2c2c;
      border: 1px solid #ffffff;
      border-top: none;
   }

   .main-menu .navbar-collapse > .navigation > li {
      margin: 0px !important;
      float: none !important;
      padding: 0px !important;
      width: 100%;
   }

   .main-menu .navigation > li > a,
   .main-menu .navigation > li > ul:before {
      border: none;
   }

   .main-menu .navbar-collapse > .navigation > li > a {
      padding: 10px 10px !important;
      border: none !important;
   }

   .main-menu .navbar-collapse > .navigation > li > a.logout_btn {
      display: inline-block;
   }

   .main-menu .navigation li.dropdown > a:after,
   .main-menu .navigation > li.dropdown > a:before,
   .main-menu .navigation > li > ul > li > a::before,
   .main-menu .navigation > li > ul > li > ul > li > a::before {
      color: #ffffff !important;
      right: 15px;
      font-size: 16px;
      display: none !important;
   }

   .main-menu .navbar-collapse > .navigation > li > ul,
   .main-menu .navbar-collapse > .navigation > li > ul > li > ul {
      position: relative;
      border: none;
      float: none;
      visibility: visible;
      opacity: 1;
      display: none;
      margin: 0px;
      left: auto !important;
      right: auto !important;
      top: auto !important;
      padding: 0px;
      outline: none;
      width: 100%;
      background: #2c2c2c;
      -webkit-border-radius: 0px;
      -ms-border-radius: 0px;
      -o-border-radius: 0px;
      -moz-border-radius: 0px;
      border-radius: 0px;
      transition: none !important;
      -webkit-transition: none !important;
      -ms-transition: none !important;
      -o-transition: none !important;
      -moz-transition: none !important;
   }

   .main-menu .navbar-collapse > .navigation > li > ul,
   .main-menu .navbar-collapse > .navigation > li > ul > li > ul {
      border-top: 1px solid rgba(255, 255, 255, 1) !important;
   }

   .main-menu .navbar-collapse > .navigation > li,
   .main-menu .navbar-collapse > .navigation > li > ul > li,
   .main-menu .navbar-collapse > .navigation > li > ul > li > ul > li {
      border-top: 1px solid rgba(255, 255, 255, 1) !important;
      border-bottom: none;
      opacity: 1 !important;
      top: 0px !important;
      left: 0px !important;
      visibility: visible !important;
   }

   .main-menu .navbar-collapse > .navigation > li:first-child {
      border: none;
   }

   .main-menu .navbar-collapse > .navigation > li > a,
   .main-menu .navbar-collapse > .navigation > li > ul > li > a,
   .main-menu .navbar-collapse > .navigation > li > ul > li > ul > li > a {
      padding: 10px 16px !important;
      line-height: 22px;
      color: #ffffff;
      background: #2c2c2c;
      text-align: left;
   }

   .main-menu .navbar-collapse > .navigation > li > a:hover,
   .main-menu .navbar-collapse > .navigation > li > a:active,
   .main-menu .navbar-collapse > .navigation > li > a:focus {
      background: #cc8809;
   }

   .main-menu .navbar-collapse > .navigation > li:hover > a,
   .main-menu .navbar-collapse > .navigation > li > ul > li:hover > a,
   .main-menu .navbar-collapse > .navigation > li > ul > li > ul > li:hover > a,
   .main-menu .navbar-collapse > .navigation > li.current > a,
   .main-menu .navbar-collapse > .navigation > li.current-menu-item > a {
      background: #2c2c2c;
      color: #ffffff !important;
   }

   .main-menu .navbar-collapse > .navigation li.dropdown .dropdown-btn {
      display: block;
   }

   .main-slider .owl-nav,
   .main-slider .schedule-box,
   .main-menu .navbar-collapse > .navigation li.dropdown:after,
   .main-menu .navigation > li > ul:before {
      display: none !important;
   }

   .main-header .btn-outer {
      left: 0px;
      top: 0px;
      right: auto;
      margin-top: 15px;
      text-align: left;
      z-index: 12;
   }

   .main-header .main-box .logo-box {
      float: none;
      text-align: center;
      padding-bottom: 10px;
   }

   .main-header .search-box-outer .dropdown-menu {
      left: 0px;
      top: 47px;
   }

   .main-header .header-top {
      padding: 10px 0px;
   }

   .sidebar-page-container .comments-area .comment-box.reply-comment {
      margin-left: 0px;
   }

   .main-header .info-box {
      padding-left: 0px;
      text-align: center;
      width: 100%;
      margin-left: 0px;
      margin-bottom: 20px;
   }

   .main-header .info-box:last-child {
      margin-bottom: 0px;
   }

   .main-header .info-box .icon-box {
      position: relative;
      margin: 0 auto;
      margin-bottom: 15px;
   }

   .main-header .main-box .outer-container {
      padding: 0px;
   }

   .main-header .header-lower .outer-box {
      position: absolute;
      z-index: 12;
      display: block;
   }

   .main-menu .navbar-header .navbar-toggler {
      position: relative;
      top: -18px;
      display: inline-block;
      z-index: 12;
      width: 50px;
      height: 40px;
      float: none;
      padding: 0px;
      text-align: center;
      border-radius: 0px;
      background: #ee2d50;
      border: 1px solid #ee2d50;
      border-radius: 5px;
   }

   .main-menu .navbar-header .navbar-toggler .icon-bar {
      position: relative;
      background: #ffffff;
      height: 2px;
      width: 26px;
      display: block;
      margin: 0 auto;
      margin: 5px 11px;
   }

   .main-header .nav-outer {
      position: absolute;
      width: 100%;
      margin-top: 0px;
   }

   .main-slider h2 {
      font-size: 60px;
      padding-left: 0px;
   }

   .main-slider h3 {
      font-size: 20px;
   }

   .main-header .header-top,
   .main-menu .navigation > li:after,
   .main-header .outer-box .buttons-box,
   .main-slider .text br {
      display: none;
   }

   .main-slider .content {
      height: 500px;
   }
   .main-slider .slide {
      background-size: cover;
   }

   .main-header .outer-box .option-box > li {
      margin-left: 0px;
      margin-right: 20px;
   }

   .header-top .top-left .text {
      text-align: center;
      padding: 10px 0px;
   }

   .main-header .header-lower .search-box-outer .dropdown-menu {
      left: 0px !important;
   }

   .main-header .support-box {
      position: absolute;
      left: 0px;
      top: 0px;
      z-index: 12;
      margin-left: 0px;
      margin-top: 0px;
   }

   .main-header .search-box-outer {
      position: absolute;
      left: 170px;
      top: 0px;
      z-index: 12;
      margin-top: 20px;
   }

   .main-header .search-box-outer .dropdown-menu {
      top: 51px !important;
      left: 0px;
      right: auto;
   }

   .main-slider h2 {
      font-size: 45px;
   }

   .main-footer .footer-bottom {
      text-align: center;
   }

   .main-footer .footer-bottom .footer-nav {
      text-align: center;
      margin-top: 6px;
   }

   .sidebar-page-container .comments-area .comment-box .author-thumb {
      position: relative;
   }

   .sidebar-page-container .comments-area .comment {
      padding-left: 0px;
   }

   .main-header .header-upper-inner {
      padding: 0px;
      background: none;
   }

   .main-header.fixed-header {
      position: absolute;
      left: 0px;
      top: 0px;
      transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -webkit-transition: all 0.3s ease;
      -ms-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
   }

   .news-block .inner-box .image {
      padding: 15px 15px 0px;
   }

   .map-section h2,
   .news-block .inner-box .lower-content h3,
   .quote-block .inner-box .text,
   .faq-form-section .title-column .inner-column h2,
   .about-section .content-column .inner-column h2,
   .services-section .lower-section .content-column .inner-column h2,
   .accordian-section .content-column .inner-column h2 {
      font-size: 28px;
   }

   .page-title {
      padding: 200px 0px 110px;
   }

   .news-block .inner-box .lower-content {
      padding: 30px 15px 0px;
   }

   .expert-section,
   .services-section-three,
   .clients-section-two,
   .team-section,
   .clients-page-section,
   .faq-form-section,
   .price-page-section,
   .we-do-section,
   .gallery-page-section,
   .blog-page-section,
   .services-section .upper-section {
      padding: 30px 0px;
   }

   .fluid-section-one .content-column .inner-column {
      padding: 80px 15px;
   }

   .map-section {
      padding-top: 66px;
   }
   .accordian-section {
      padding: 60px 0 10px;
   }

   .search_sec {
      padding-block: 100px 35px;
   }

   .search_sec .container {
      max-width: 100%;
      padding-inline: 10px;
   }
}

@media only screen and (max-width: 599px) {
   .header-top .top-outer {
      height: 70px;
   }
   .main-slider .price,
   .main-slider h3.light,
   .blog-single .inner-box .lower-content h2,
   .fluid-section-one .content-column .inner-column h2 {
      font-size: 25px;
   }

   .accordion-style-one .block .acc-btn {
      font-size: 16px;
   }

   .clients-page-section .clients-list li {
      width: 50%;
   }

   .header-top .top-right .social-box li.share {
      font-size: 15px;
   }

   .main-slider .content {
      height: 420px;
   }

   .main-slider h2 {
      font-size: 34px;
   }

   .main-header {
      background-color: #ffffff;
   }

   .main-slider .theme-btn {
      margin-right: 10px;
   }

   .page-title h1 {
      font-size: 30px;
   }

   .main-slider .theme-btn {
      padding: 8px 16px;
      font-size: 12px;
   }

   .map-section h2,
   .sec-title h2,
   .news-block .inner-box .lower-content h3,
   .blog-single .inner-box .lower-content .text h3,
   .services-section .lower-section .content-column .inner-column h2,
   .accordian-section .content-column .inner-column h2 {
      font-size: 24px;
      padding-bottom: 5px;
      margin-bottom: 15px;
   }
   .sec-title h3 {
      font-size: 24px;
      text-align: center;
   }
   .sec-title a {
      display: none;
   }

   .pricing-section {
      padding: 30px 0px 0px;
   }
   .about-section {
      padding: 20px 0px 100px;
   }

   .main-header .logo-box {
      height: 68px;
   }
   .blog-single .lower-content .post-meta {
      margin-left: 10px;
   }
   .blog-single .lower-content .post-meta li::marker {
      color: #000;
      font-size: 18px;
      font-weight: 500;
   }

   .blog-single .lower-content {
      padding: 30px 12px;
   }
   .blog-single .lower-content h2 {
      font-size: 24px;
   }

   .blog-single .lower-content h3 {
      font-size: 20px;
      margin-bottom: 10px;
   }

   .services-section .lower-section .inner-column .animate_serv_img {
      height: 230px;
   }
   .box .booking-form {
      padding: 10px 4px 5px;
   }
   .booking-form .form-btn .submit-btn {
      height: 44px;
      line-height: 40px;
   }

   .search_sec .contents {
      margin-block: 15px 5px;
   }
   .booking-form .form-group {
      padding: 6px 8px;
      border-bottom: 2px solid #eee9;
   }
   .booking-form .form-btn {
      margin-block: 10px;
   }
   .booking-form .form-group:after {
      display: none;
   }

   .daterangepicker .drp-selected {
      display: block;
      font-size: 14px;
      margin-bottom: 5px;
   }
   .banner_sec .sub_ban {
      flex-direction: column;
      height: 300px;
   }
   span > div.text-center {
    display: inline-flex;
       align-items: center;
    justify-content: space-between;
    width: 100%;
   }
   .banner_sec .sub_ban .sub_title {
      /*height: 75px;*/
      padding-top: 20px;
      text-align: center;
   }

   .banner_sec .sub_ban::after {
      border-left: none;
   }
   .banner_sec .sub_ban h4 {
      font-size: 20px;
   }
   .banner_sec .sub_ban h5 {
      font-size: 16px;
   }

   .banner_sec .ban_txt {
      border-radius: 10px;
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      -ms-border-radius: 10px;
      -o-border-radius: 10px;
   }
   .banner_sec .ban_txt.center h4 {
      font-size: 1.2rem;
   }

   .page-title.search_page {
      padding: 25px 0 0;
   }

   .header-top .top-outer {
      justify-content: right;
   }

   .header-top .top-left .links li {
      margin-right: 0px;
      padding-right: 10px;
      line-height: 0;
   }
   .header-top .top-left .links li a {
      font-size: 14px;
   }
   
      .header-top a.text-white {
          font-size: 15px;
      }

   .payment_sec .content .list label {
      height: 50px;
      line-height: 50px;
   }
   .payment_sec .content .slider {
      height: 50px;
   }

   #home:checked ~ .list .slider {
      top: 0;
   }

   #blog:checked ~ .list .slider {
      top: 50px;
   }

   #help:checked ~ .list .slider {
      top: 100px;
   }

   .payment_sec .content .text-content {
      padding: 20px 10px 10px;
   }
   .payment_sec .content .list label img {
      height: 50px;
   }
   .payment_sec .container .text .pay_img {
      height: auto;
   }
   .payment_sec .container .text .pay_img img {
      height: 360px;
   }
   
   .page-title.cont_page {
      padding: 100px 0px 90px;
   }
   .page-title.cont_page2 {
      padding: 50px 0px 50px;
   }
}

@media only screen and (max-width: 479px) {
   .accordion-style-one .block .acc-btn {
      padding: 22px 20px 22px 20px;
   }

   .accordion-style-one .block .acc-btn .icon-outer {
      opacity: 0;
   }

   .services-block .inner-box .content {
      padding: 0px;
   }

   .services-block .inner-box .content .image {
      position: relative;
      width: 100%;
      display: block;
      margin-bottom: 20px;
   }

   .services-block .inner-box .content {
      min-height: auto;
   }

   .main-header .search-box-outer .dropdown-menu {
      top: 44px;
   }

   .main-header .nav-toggler {
      top: 0px;
   }
   .services-section {
      padding-bottom: 32px;
   }
   .pricing-section {
      padding: 30px 0px 0px;
   }
   .about-section {
      padding: 33px 0px 31px;
   }
   .services-page-section {
      padding-top: 17px;
   }
   .services-section-two {
      padding: 100px 0px 0px;
   }
   .sidebar-page-container {
      padding: 33px 0px 0px;
   }
   .sidebar-page-container .auto-container {
      padding: 0 8px;
   }
   .news-block {
      margin-bottom: 34px;
   }
   .sidebar-page-container .content-side,
   .sidebar-page-container .sidebar-side {
      margin-bottom: 0px;
   }
   .services-block {
      margin-bottom: 28px;
   }
   .services-section-two {
      position: relative;
      padding: 70px 0px 0px;
   }
   .quote-block {
      margin-bottom: 30px;
   }
   .contact-form-section {
      padding: 21px 0px 22px;
   }
   .auto-container {
      padding: 5px 15px;
   }
   .card_slider_sec .car_content .car_info {
      padding: 5px 12px 10px;
   }
   .map-content-box .contact_info {
      padding: 0;
   }
   
.main-footer .widgets-section .footer-column:last-of-type ul li {
    width: 49%;
    display: inline-block;
}
   
   .footer-bottom p {
       font-size: 15px;
       line-height: 1.6em;
       margin-bottom: .6rem;
   }
}

@media (max-width: 400px) {
   .main-slider .content {
      height: 340px;
   }
   .payment_tbl tr td,
   .payment_tbl tr th {
      width: 100%;
      padding: 9px 4px;
   }
   .lower-content.car_detail {
      padding: 30px 10px 10px;
   }
   
   .main-footer .footer-column li,
.main-footer .footer-column li a {
    font-size: 15px;
}
   
   .main-footer .widgets-section h2 {
       font-size: 20px;
   }
}