/*
Theme Name: Trucking Services Pro
Theme URI: https://www.theclassictemplates.com/products/warehouse-company-wordpress-theme
Author: Theclassictemplates
Author URI: https://theclassictemplates.com/
Description:  The Warehouse Company WordPress Theme is a premium template designed specifically for dry cleaners and laundry services looking to establish a professional online presence. This theme is professionally crafted to offer the best user experience, ensuring that your customers can easily navigate through your website and find the information they need. This theme also offers a Services section, which provides detailed descriptions of all the services your dry cleaning business offers, other sections of the theme includes Pricing Section, allowing customers to view transparent pricing tables for each service, ensuring clarity and trust. The How It Works section guides customers through the process of using your services, presented in an easy-to-understand, step-by-step format. 
Version: 0.0.1
Requires at least: 5.0
Tested up to: 6.0
Requires PHP: 5.6
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: trucking-services-pro
Tags: one-column, right-sidebar, custom-menu, editor-style, featured-images, full-width-template, sticky-post, theme-options, threaded-comments

Trucking Services Pro WordPress Theme has been created by Classic Template(Classic Template.net), 2018.
Trucking Services Pro WordPress Theme is released under the terms of GNU GPL

/* Basic Style */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Pridi:wght@200;300;400;500;600;700&display=swap');
.bypostauthor {
  font-weight: 600;
}
.wpcf7-spinner {
  display: none;
}

/*.sticky{
    position: unset;
}*/
/*--------- Site Loader --------------*/
#bottomlogo .wpcf7-not-valid-tip{
  color: #fff;
}
.preloader{
  display: flex;
  background: #fc7c15;
  height: 100%;
  width: 100%;
  left: 0;
  bottom: 0;
  top: 0;
  position: fixed;
  z-index: 99999;
}
.preloader .loading-dot{
    width: 15px;
    height: 15px;
    margin: auto;
    border-radius: 50%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    box-shadow: 0px 40px 0px 0px #fff,0px -40px 0px 0px #fff,40px 0px 0px 0px #fff,-40px 0px 0px 0px #fff,
                40px 40px 0px 0px #fff,-40px -40px 0px 0px #fff,40px -40px 0px 0px #fff,-40px 40px 0px 0px #fff;
    animation: load 3s infinite linear;
}
@keyframes load{
    0% {
        transform: rotate(0deg); 
        box-shadow: 0px 40px 0px 0px #fff,0px -40px 0px 0px #fff,40px 0px 0px 0px #fff,-40px 0px 0px 0px #fff,
                    40px 40px 0px 0px #fff,-40px -40px 0px 0px #fff,40px -40px 0px 0px #fff,-40px 40px 0px 0px #fff;
    }
    25%{
        box-shadow: 0px 40px 0px 0px #fff,0px -40px 0px 0px #fff,40px 0px 0px 0px #fff,-40px 0px 0px 0px #fff,
                    -40px -40px 0px 0px #fff,40px 40px 0px 0px #fff,-40px 40px 0px 0px #fff,40px -40px 0px 0px #fff;
    }
    50%{
        box-shadow: 0px -40px 0px 0px #fff,0px 40px 0px 0px #fff,-40px 0px 0px 0px #fff,40px 0px 0px 0px #fff,
                    -40px -40px 0px 0px #fff,40px 40px 0px 0px #fff,-40px 40px 0px 0px #fff,40px -40px 0px 0px #fff;
    }
    70%{
        box-shadow: 0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,
                    0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff;
    }
    75%{
        width:10px;
        height:10px;
        box-shadow: 0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,
                    0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff;
    }
    80%{
        background-color: #fff;
        width:40px;
        height:40px;
        transform: rotate(360deg); 
        box-shadow: 0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,
                    0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff;
    }
    85%{
        background-color: #fff; 
        width:40px;
        height:40px;
        transform: rotate(360deg);
        box-shadow: 0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,
                    0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff;
    }
    90%{
        background-color: #fff; 
        width:10px;
        height:10px;
        transform: rotate(360deg); 
        box-shadow: 0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,
                    0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff,0px 0px 0px 0px #fff;
    }
    95%{
        box-shadow: 0px 40px 0px 0px #fff,0px -40px 0px 0px #fff,40px 0px 0px 0px #fff,-40px 0px 0px 0px #fff,
                    40px 40px 0px 0px #fff,-40px -40px 0px 0px #fff,40px -40px 0px 0px #fff,-40px 40px 0px 0px #fff;
    }
    100%{
        transform: rotate(360deg);
        box-shadow: 0px 40px 0px 0px #fff,0px -40px 0px 0px #fff,40px 0px 0px 0px #fff,-40px 0px 0px 0px #fff,
                    40px 40px 0px 0px #fff,-40px -40px 0px 0px #fff,40px -40px 0px 0px #fff,-40px 40px 0px 0px #fff;
    }
}

    /* ----------- Spinner ------------- */

.spinner-loading-box{
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #1A83EA;
  cursor: pointer;
  z-index: 9999;
}
.spinner-loading-box .lds-ellipsis {
  display: inline-block;
  width: 80px;
  height: 80px;
  position: absolute;
  left: 50%;
  top:50%;
  transform: translateY(-50%);
}
.spinner-loading-box .lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #fff;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.spinner-loading-box .lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}
.spinner-loading-box .lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
}
.spinner-loading-box .lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
}
.spinner-loading-box .lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}

    



 .right-div{
  position: relative;
}

 .right-div h5{
  font-family: Poppins;
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
  color: #000;
  padding-top: 25px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
}
 .right-div h5 a{
  color: #000;
  text-transform: capitalize;
}
 .blog-content p{
  font-family: Poppins;
  font-size: 15px;
  font-weight: 400;
  line-height: 26px;
  color: #000;

}
 .outer-blog:hover .date{
  background-color: #1A83EA;
}
 .outer-blog:hover h5 a{
  color: #1A83EA;
}
 .outer-blog:hover .arrow-paading i{
  color: #1A83EA;
}
 .date{
  background-color: #000;
  border-radius: 5px;
  padding: 10px 12px;
  font-family: Poppins;
  font-size: 16px;
  font-weight: 400;
  line-height: 16px;
  text-align: center;
  color: #fff;
  width: 191px;
  margin-top: -50px;
  position: absolute;
  top: 9px;
  left: 52px;
}
 .date i{
  padding-right: 5px;
  font-size: 18px;
}
 .right-div{
  padding-left: 10px;
  padding-right: 10px;
}
 .metafiled{
  font-family: Poppins;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #000;
  padding-bottom: 20px;
  display: flex;
  text-transform: capitalize;
}
 .metafiled i{
  margin-right: 5px;
  font-size: 24px;
}

 .metafiled .author{
  padding-right: 30px;
}
 .metafiled span{
  padding-right: 30px;
  display: flex;
  width: fit-content;
  align-self: center;
}
 .arrow-paading i {
  width: 35px;
  height: 35px;
  line-height: 35px;
  border-radius: 50%;
  text-align: center;
  color: #fff;
  background-color: #000;
  display: inline-block;
}














 








/***********  our services section ************/
#our-services.our-service_pages .sec_small_heading,#our-services.our-service_pages .sec_main_heading{
  color: #000;
}
.service-overlay-box {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #282828F2;
  opacity: 95%;
  z-index: 0;
}
#our-services.our-service_pages .service-box{
  position: relative;
  margin-bottom: 58px;
}
#our-services.our-service_pages .sericon {
  position: absolute;
  margin-top: -53px;
  left: 20px;
  background: #1A83EA;
  border-radius: 50%;
  padding: 20px;
}
#our-services.our-service_pages .sericon img{
  width: auto;
}
#our-services.our-service_pages .hover-title{
  padding: 0px 0px 0px 20px;
}
#our-services.our-service_pages .service-title{
  font-family: Poppins;
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
  color: #000;
  margin-top: 50px;
  margin-bottom: 0px;
}
#our-services.our-service_pages .service-title a {
  color: #000;
}
#our-services.our-service_pages .descp{
  font-family: Poppins;
  font-size: 15px;
  font-weight: 400;
  line-height: 26px;
  color: #000;
}
#our-services.our-service_pages .arrow-paading i{
  /* padding-top: 11px; */
}
#our-services.our-service_pages .arrow-paading{
  width: 35px;
  height: 35px;
  border-radius: 50%;
  text-align: center;
  color: #fff;
  background-color: #000;
  display: inline-block;
  margin: auto;
}
.common-page-template-box{
  padding-bottom: 5%;
}


#our-services .arrow-paading i

#our-services .service-box:hover .service-title a{
  color: #1A83EA;
}


#our-services .service-box:hover .arrow-paading i{
  color: #1A83EA;
}

/*------ search bar ----------*/
.search-container{
  display: none;
  position: absolute;
  bottom: -100px;
  z-index: 999;
  padding: 0px;
  right: 10%;
  width: auto !important;
  border: none;
  border-radius: 8px;
}
.search-container [type=search] {
  color: #000 !important;
  position: relative;
  padding: 15px 65px 15px 10px;
  width: auto;
  outline: none;
  background: var(--pink);
  font-size: 15px;
  border: 1px solid #fff;
  border-radius: 10px;
  background-color: #fff;
  font-family: 'Inter';
  box-shadow: 0px 0px 6px 0px #e1e1e1;
}
.header-nav [type="submit"] {
  display: inline-block;
  overflow: hidden;
  font-size: 0;
}
.header-nav [type="submit"] {
  position: absolute;
  right: 0px;
  top: 0%;
  padding: 8px 4px;
  background: #A01B30;
  border: inherit;
  color: #fff;
  cursor: pointer;
  border: none;
  border-radius: 0;
}
.search-container .search-icon i {
  font-size: 18px;
  color: #fff;
  position: absolute;
  line-height: 54px;
  padding: 0;
  width: 55px;
  height: 55px;
  text-align: center;
  background: #1A83EA;
  right: 0;
  top: 0;
  border-radius: 0px 10px 10px 0px;
}
.search-icon{
  cursor: pointer;
  border: none;
  background: transparent;
}
.search-icon i{
  font-size: 20px;
  color: #000;
}
.search-container form .search-icon {
  border: none;
  border-radius: 0px;
  position: absolute;
  right: 0;
  /* color: red; */
  width: 54px;
  /* background: red; */
  height: 54px;
}
.common-page-template-box #about .btn-padd{
  display: none;
}


.jointext ::-webkit-input-placeholder {
  color: #fff !important;
  font: 400 16px/16px inter !important;
}










/***************** Testimonials section***********/
#testimonial .testibox{
  background: #FFFFFF;
  margin-left: 55px;
  margin-right: 55px;
  margin-bottom: 100px;
  margin-top: 38px;
  }
  #testimonial .main-testimonial{
    box-shadow: 0px 4px 54px rgba(0, 0, 0, 0.14);
    box-shadow: 0px 4px 54px rgba(0, 0, 0, 0.17);
    padding: 60px 60px;
    position: relative;
    border-radius: 20px;
  }
  #testimonial .sec_main_heading{
    color: #000;
  }
  #testimonial .main-testimonial::after {
      content: "";
      bottom: 0;
      right: 53px;
      width: 0;
      height: 0;
      border-left: 8px solid transparent;
      border-right: 38px solid transparent;
      border-top: 50px solid #fff;
      overflow: visible;
      /* z-index: 9999; */
      position: absolute;
      bottom: -40px;
  }
  #testimonial .testi-imagebg{
    position: absolute;
    top: 133px;
    left: -55px;
    bottom: 0px;
    margin: auto;
  }
  #testimonial .testi-imagebg img{
    width: 130px;
    height: 130px;
    border: 1px solid #1A83EA;
    border-radius: 50%;
    padding: 9px;
  
  }
  #testimonial .right-div h5{
    font-family: Poppins;
    font-size: 24px;
    font-weight: 600;
    line-height: 36px;
    color: #1A83EA;
    margin-bottom: 0px;
    padding-bottom: 0px;
  
  
  }
  #testimonial .right-div h5 a{
    font-family: Poppins;
    font-size: 24px;
    font-weight: 600;
    line-height: 36px;
    color: #000;
    text-transform: capitalize;
  }
  #testimonial .main-testimonial:hover .right-div h5 a{
    color: #fff;
  }
  #testimonial .main-testimonial:hover p{
    color: #fff;
  }
  #testimonial .main-testimonial:hover{
    background: #282828;
  }
   #testimonial .main-testimonial:hover::after{
    border-top: 50px solid #282828;
  }
  #testimonial .team-location{
    font-family: Poppins;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    color: #626B7D;
    text-transform: capitalize;
  }
  #testimonial .content{
    font-family: Poppins;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    text-align: left;
    color: #626B7D;
    padding-bottom: 0px;
  }
  
  #testimonial .right-div{
    padding-left: 30px;
  }
  
  #testimonial .small-icon{
    width: 65px;
      /* text-align: right; */
      float: inline-end;
      margin-top: -31px;
  }
  #testimonial .owl-dots{
    text-align: center;
    margin-top: -48px;
    margin-bottom: 79px;
  }
  #testimonial .owl-dot{
    padding: 5px;
    border-radius: 20px;
    border: 1px solid #282828;
    margin: 0 5px;
    outline: 0px solid red;
    width: 15px; 
    height: 15px;
    background: #282828;
  }
  #testimonial .owl-dot.active span{
    border: 1px solid #1A83EA;
    background: #1A83EA;
    width: 15px; 
    height: 15px;
    display: inline-block;
    border-radius: 50%;
  }
  #testimonial .owl-dot.active{
    border: 1px solid #1A83EA;
    background-color: #fff;
    width: 30px;
    height: 30px;
    padding-top: 5px !important;
  }
  #latest-news .owl-nav {
    display: none;
}