*{margin:0;
  padding:0;
  box-sizing: border-box;
}

body {
    font-family: lato, sans-serif;
   
    
}



html {
    scroll-behavior: smooth;
  }

/**************/
/****TOP BAR***/
/**************/


.top-bar {
    
    width: 90%;
    margin:0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    padding: 0.3rem 0;
   
    
    
}


.company-logo {

    flex:1 10rem;
}


.contact-time-email{
    flex: 3 10rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
   
}



.contact-time-email span {
    margin-right: 0.5rem;
    color: rgb(51, 255, 0);
}
.contact, .time, .email, .quote {
    flex:1 5rem;
    
}

.quote {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.contact-title-p, .time-title-p, .email-title-p{
    color:rgb(18, 75, 11);
}

.contact-title, .time-title, .email-title{
    display: flex;
    justify-content: flex-start;
  
    
}

.contact-number, .time, .email {
    color: black;
    font-weight: 500;
    line-height: 1.3rem;
}


.quote-request{
    display: inline-block;
    color:white;
    background-color: rgb(43, 139, 30);
    text-decoration: none;
    font-weight: 500;
  
    padding: 0.5rem 0.8rem;
    border-radius: 0.2rem;
    transition: 0.5s;
}

.quote-request:hover {
    color:white;
    background-color: rgb(46, 235, 71);
}

.footer-quote-request{
    background-color: yellow;
    color: green;
    margin-top: -2rem;
}

.brand-logo{
    width: 8rem;
}


@media screen and (max-width:1140px){
    .contact-time-email{
        flex-direction: column;
    }

  

    .top-bar{
        flex-direction: column;
    }

    .company-logo{
        align-self: flex-start;
    }


}













    

    





.banner{
    text-align: center;
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
     
    
}



h1, h2,h3 {
    letter-spacing: 0.1rem;
}

.banner-h1 {
    text-transform: uppercase;
    font-size: 3rem;
   
    animation: slideFromRight ease-in-out 5s 1;
   
}

.banner-h2 {
    margin-top: 1rem;
    animation: slideFromLeft ease-in-out 5s 1;
    color: white;
    text-shadow: 0 0 0.3rem rgb(6, 6, 80);
    font-style: italic;
    font-size: 2rem;

}



.banner-link {
    text-decoration: none;
    margin-top: 1.5rem ;
    display: inline-block;
    color: whitesmoke;
    padding: 0.8rem 1rem;
    background-color: #a56a0c;;
    box-shadow: 0.2rem 0.1rem 0.3rem black;
    animation: show 5s linear 1;
    transition: 1s all;
    
}

.banner-link:hover {
  
    background-color: rgb(207, 177, 45);
    
}


   

    .banner-h1 { 
        margin-top: 3rem;
        font-size: 2rem;    
    }

    .banner-h2 { 
        font-size: 0.95rem;    
    }

    .banner-link {
       
        padding: 0.5rem 1rem;
       
    }



@media  screen and (min-width:481px)  and (max-width:767px){

    .banner-h1 { 
        font-size: 3rem;    
    }

    .banner-link {
       
        padding: 0.6rem 1rem;
       
    }
}

@media  screen and (min-width:768px)  and (max-width:1023px){

    .banner-h1 { 
        font-size: 3.5rem;    
    }

    .banner-link {
       
        padding: 0.7rem 1rem;
       
    }
}





  
  /*********************/
/*----FOOTER----**/
/********************/

.footer {
    padding: 3rem 0;
    background-color: #1b5f12;
   padding-bottom: 0;
}

.footer-copy-center{
   
    width: 90%;
    margin: 0 auto;
    display: flex;
    padding-top: 1rem;
    justify-content: space-between;
    flex-wrap: wrap;
}

.footer-copy-center p {
    color:rgb(255, 255, 255);
}

.footer-copy-center a {
    color:rgb(248, 236, 122);
    text-decoration: none;
}

.footer-copy-center a:hover {
    color:rgb(248, 162, 122);
}

@media screen and (max-width:550px){
    .footer-copy-center{
        flex-direction: column;
        align-items: center;
    }

}

.footer-copyright {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    background-color: #0a2905;
}

.footer-divs {
    width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
    align-items:flex-start;
    flex-wrap: wrap;
}

.footer-about, .footer-services, .footer-quote, .footer-facebook {
    flex: 1 15rem;
    max-width: 20rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 2rem;
}


.footer-h3 {
    color:white;
    font-size: 1.3rem;
}

.footer-p {
    color:rgb(255, 245, 160);
    text-align: center;
}

.footer-services-links{
    list-style: none;
  
 
    
}




.footer-link-a{
    text-decoration: none;
    color:rgb(255, 245, 160);
    display: flex;
}

.footer-link-a:hover{
    color:orange;
}

.footer-link-a p {
    line-height: 1.2rem;
}





/*PARTNERS*/

.partners-section{
    background-color: rgb(255, 255, 255);
    padding: 3rem 0;
    text-align: center;

}

.all-partners{
    width: 85%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
}



.partner-image {
  width: 10rem; 
}

.partner-logo{
    width: 100%;
}

.partner {
    flex: 1 20rem;
    max-width: 20rem;
    margin:1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.partner-name{
    color: rgb(47, 108, 165);
    text-transform: uppercase;
    text-align: center;
}



      

        #preloader{
            background: rgb(255, 255, 255) url('loading.gif');
            background-position: center;
            background-repeat: no-repeat;
            background-size: 20rem;
            width: 100%;
            height: 100vh;
            position: fixed;
            z-index: 3;
        }

       



     


          
  

          .section-center {
                    padding:3.5rem 0; 
                    margin: 0 auto;
                    width: 85%;
                    text-align: center;
                    
          }

          .about-center {
           padding-top: 0;
  }
          
          .who-we-are{
             display: flex;
             flex-direction: column;
             justify-content: center;
             align-items: center;
              
          }

          .who-we-are2{
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            margin-top: -4rem;
             
         }

          .audience {
            text-align: center; 
          }

         
.wwa-link {
    text-decoration: none;
    margin-top: 1.5rem ;
    display: inline-block;
    color: #0c5ba5;
    font-size: 1.3rem;
    padding: 0.3rem 0.8rem;
    background-color: #0c5ba500;
    border: 0.2rem solid #0c5ba5;
    box-shadow: 0.2rem 0.1rem 0.3rem black;
    transition: 1s all;
    border-radius: 2rem;
    
}

.wwa-link:hover {
  
    background-color: #0c5ba5;
    color:#ffffff;
    
}











.welcome-p{
    color:#0b70b3;
    font-size: 1.2rem;
    
    line-height: 1.7rem;
    text-align: justify;
    margin-top: 2rem;
    font-family: 'Poppins', sans-serif;
}

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





/**********************/
/*--CONTACT--**/
/*********************/
.contact-us-details{
    padding: 3rem 0;
background-color: rgb(250, 250, 186);
    
}
.contact-section{
    padding: 3rem 0;
    width:85%;
    margin: 0 auto;
    text-align: center;
    padding-top: 0;
}

.contact-details {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;

    background-color: rgb(30, 54, 27);
    width:100%;
    margin: 0 auto;
    
    padding-bottom: 1.5rem;
}

.contact-detail {
    flex: 1 20rem;
    max-width: 20rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    margin-top: 2rem;
}




.contact-h3{
    font-size: 1.4rem;
    letter-spacing: 0.1rem;
    color:#d6961f;
    margin-bottom: 1rem;
}

.contact-p {
    font-size: 1.3rem;
    color: #ffffff;
    font-size: 1.2rem;
    text-align: center;
}









/**********************/
   /*--HEADER SLIDER--**/
/*********************/

header {
    z-index: -1;
    position: relative;
}
.d-block{
    height:28.5rem;
    object-fit: cover;
}

.project-1-slide {
    height: 70vh;
}



.slide-link {
   /* background-color:rgb(108, 235, 35) ;*/
    background-color:rgb(255, 255, 255) ;
    color: rgb(90, 90, 90);
   border-radius: 0.1rem;
    display: inline-block;
    padding: 0.65rem 0.9rem;
   
    box-shadow: 0.1rem 0.2rem 0.3rem black;
    text-decoration: none;
    position: absolute;
    left:0rem;
    top: -2rem;
    
}

.slide-link:hover {
    background-color:rgb(21, 50, 179);
    color:white;
}

.slide-h1 {
    background-color: rgba(255, 255, 255, 0.746);
    position: absolute;
    top:-17rem;
    padding: 1rem 0.5rem;
    color: rgb(29, 194, 23);
    font-family: 'Lexend Deca', sans-serif;
    font-weight: 700;
    font-size: 2.7rem;
    text-align: left;
    text-shadow: 0.1rem 0.1rem 0.2rem rgb(255, 235, 122);
    letter-spacing: 0rem;
}


.slide-p {
    position: absolute;
    top: -8rem;
    font-size: 1.9rem;
    font-weight: 600;
    /*text-shadow: 0.1rem 0 0.1rem rgb(248, 215, 27);*/
    text-align: left;
    color: rgb(29, 194, 23);
    line-height: 1.6rem;
    background-color: #ffffffd3;
    padding: 1rem 0.5rem;
 
}

.carousel-indicators{
    color: rgb(133, 202, 30) !important;
    display: none !important;
}

.carousel-control-prev, .carousel-control-next{
    display: none !important;
}



@media screen and (max-width:1023px){
.slide-h1 {
    font-size: 2.5rem;
    line-height: 2.9rem;
   
}

.slide-p{
    font-size: 1.5rem;
    line-height: 1.8rem;
}

}


@media screen and (max-width:480px){
    .slide-h1-2, .slide-h1-3, .slide-h1-4 {
        font-size: 2rem;
        line-height: 2.5rem;
    }
}

@media screen and (max-width:720px){
.slide-h1 {
    background-color: rgba(255, 255, 255, 0.548);
    font-size: 2rem;
    padding: 0 0.5rem;
    margin-top: -5rem;
}

.slide-p {
    margin-top: -2rem;
}

.slide-p2 {
    margin-top: 0;
}

.slide-link{
    margin-top: 1rem;
}

.d-block{
    height:30rem;
}
}
  

/**********************/
   /*--NAV BAR--**/
   /*********************/
 nav {
     background-color: #0d7a2e;
     width:100%;
     border-top: 0.2rem solid #ffe600;
     position: sticky;
     top:0;
    z-index: 9999999999;
    
    
 }

 .nav-content{
     width: 90%;
     margin: 0 auto;
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 0.5rem 0;

 }



 .nav-links {
     margin-bottom: 0rem;
     display: flex;
     justify-content: space-between;
     align-items: center;
  
     align-self: center;
     
     
    
 }

 .nav-link{
     margin: 0 0.3rem;
     line-height: 1.3rem;
     
 }

 .nav-link-item {
     text-decoration: none;
     color:white;
     font-size: 1.3rem;
     display: inline-block;
  
     padding: 0.3rem 0.8rem;
     position: relative;
 }

 .nav-link-item:hover {
     color:white;
 }
 .nav-link-item::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 0.3rem;
    top: 150%;
    left: 0;
    background: #ffe600;
    transition: transform 0.5s;
    transform: scaleX(0);
    transform-origin: left;
  }
 

  .nav-link-item:hover::after {
    transform: scaleX(1);
    
  }


 .facebook-icon1{
     cursor: pointer;
 }
 .facebook-icon1:hover{
    opacity: 0.8;
 }

 .facebook-icon{
    width: 2.5rem;
}


 .drop-down-service{
     position: relative;
 }

 .drop-down-ul {
     position: absolute;
     z-index: 1;
     background-color: rgb(255, 255, 255);
     min-width: 19rem;
     list-style: none;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: flex-start;
     top:3.2rem;
     display: none;
     box-shadow: 0.1rem 0.1rem 0.3rem  black;
 }

 .drop-down-service:hover .drop-down-ul{
     display: block;
 }
 
 .drop-down-li{
     border-top: 0.1rem solid gainsboro;
     width: 15rem;
 }

 .drop-down-a{
     text-decoration: none;
     display: inline-block;
     padding: 0.5rem 0;
     color: rgb(95, 94, 94);
     font-weight: 500;
 }

 .drop-down-a:hover {
     color:rgb(12, 11, 11);
 }
 

 @media screen and (max-width:1080px){
     nav {
         display: none;
     }


 }

 /*MOBILE MENU*/

 .menu-open-button{
    position: absolute;
    top: 3rem;
    right:3rem;
    cursor: pointer;
 }

 .menu-open{
     width: 4rem;
     display: none;
 }

 /* MOBILE NAV*/

 .mobile-nav-container{
     position: absolute;
     background-color: rgb(255, 247, 179);
     z-index: 3;
     margin: 0 auto;
     width:100%;
     display: flex;
     justify-content: center;
     align-items: center;
     padding: 4rem 0;
     height: 100vh;
     transition: 0.5s all;
     transform: translateX(-110%);
     
 }

 

 .mobile-nav-links,.mobile-drop-down-ul{
     list-style: none;
 } 

 .mobile-drop-down-service{
     position: relative;
 }

 .mobile-drop-down-ul {
     background-color: white;
     display: none; 
     
   
 }

 .mobile-drop-down-service:hover .mobile-drop-down-ul{
     display: block;
     
 }

 

 .mobile-nav-link{
     margin: 1.5rem 0;
 }

 .mobile-drop-down-li{
     line-height: 2rem;
     margin-right: 1.5rem;
 }

 .mobile-nav-link-item{
     color: rgb(22, 92, 19);
     font-size: 1.4rem;
     font-weight: 500;
     text-decoration: none;
     
 }

 .mobile-nav-link-item:hover{
    color: rgb(41, 180, 36);
  
    
}

 .mobile-drop-down-a {
     text-decoration: none;
     color:green;

 }

 .mobile-drop-down-a:hover {
    text-decoration: none;
    color:rgb(23, 189, 23);
    
}

 
 .mobile-nav-close{
     width: 4rem;
     position: absolute;
    top:3rem;
    right:3rem;
 }
 
 .mobile-close-btn{
     width: 100%;
     cursor: pointer;
 }



 
 @media screen and (max-width:1080px){
    .menu-open{
       
        display: block;
    }

    .mobile-nav-container.show{
        transform: translateX(0);
    }
     


}
 
 
 /**********************/
   /*--CONTACT FORM--**/
   /*********************/
  .contact-form {
    background:linear-gradient(rgba(41, 122, 16, 0.774),rgba(25, 58, 9, 0.808)), url('env.jpg');
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 100%;
    background-attachment: fixed;
    
 }
 
 
 
 
 
 
 
 form {
 display: flex;
 flex-direction: column;
 padding:3rem 0;
 
 
 }
 
 .form-control {
     width: 25rem;
    
     font-size: 1.5rem;
     outline: none;
     border: none;
     box-shadow: 0 0 0.4rem rgb(63, 62, 61);
     border-radius: 0.2rem;
     
     padding: 0.5rem 0;
     padding-left: 0.5rem;
     color:rgb(146, 81, 7);
 }
 
 .submit{
     border:none;
     background-color: rgb(146, 81, 7);
     color:rgb(255, 255, 255);
     padding: 0.8rem 0;
     border:0.2rem solid rgb(146, 81, 7);
     font-size: 1.3rem;
     transition: 0.5s all;
     
 }
 
 .submit:hover {
     border:0.2rem solid rgb(146, 81, 7);
     color: rgb(146, 81, 7);
     background-color: transparent; 
 }
 
 @media screen and (max-width:507px){
     .form-control {
         width: 100%;
        
     }
 
     form {
         padding-left:0.5rem;
         padding-right:0.5rem;
     }
 
 }

 @media screen and (max-width:480px){
     .contact-email {
         font-size: 1.1rem;
     }

     .contact-section{
      
        width:95%;
        
    }


    




 }
 
 
 

  /**********************/
   /*--POP UP--**/
   /*********************/
.lightbox {
   
    padding-top: 2rem;
    display: none;
    
}

.popup-h2 {
    text-align: center;
    letter-spacing: 0.1rem;
    color: rgb(56, 133, 21);
    margin-bottom: 1rem;
}

.popup-p {
    text-align: justify;
    font-size: 1.1rem;
}
.popup-p, .lightbox ol, .lightbox ul{
    color: rgb(12, 82, 15);
    line-height: 1.5rem;
    font-size: 1.1rem;
}

.lightbox ol, .lightbox ul {
    width:60%;
    margin: 0 auto;
}
 











/*INTRO*/
.intro{
    width:90%;
    margin: 0 auto;
    padding: 3rem 0;
}

@media screen and (max-width:480px){
    .intro{
        width:100%;
        
    }  
}

.intro-content{
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    flex-wrap: wrap;
}

.intro-about-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 2rem;
}

.intro-photo{
    width: 100%;
    transition: 0.5s;
}

.intro-photo:hover {
    transform: scale(1.1);
    opacity: 0.6;
}

.intro-about, .intro-logistics, .intro-freight, .intro-warehousing{
    flex: 1 17.5rem;
    margin: 0.5rem;
    max-width: 17.5rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    margin-top: 1.5rem;
}

.intro-about{
    max-width: 100%;
    
}

.intro-h3 {
    margin: 1rem 0;
    letter-spacing: 0;
    font-size: 1.3rem;
    color:rgb(57, 173, 22);
    
    
}

.intro-about-h3 {
    color:rgb(15, 187, 15);
    font-size: 2.3rem;
}

.intro-p, .intro-about-p {
    color: rgb(12, 109, 12);
    font-size: 1.2rem;
    text-align: justify;
    padding: 0 0.5rem;
}

.intro-image {
    overflow: hidden;
    background-color: rgb(30, 133, 35);
}

.intro-readmore{
    display: flex;
    color:rgb(15, 221, 25);
    font-weight: 800;
}

.intro-readmore a {
    text-decoration: none;
    color:rgb(15, 221, 25);
}

.intro-readmore a:hover {
    color:rgb(23, 90, 21);
}

.intro-services{
    display: flex;
    flex-direction: column;
   justify-content: center;
   align-items: center;
   padding-top: 0;
   
  
}

.general-home-services{
    background-color: rgb(228, 255, 236);
    padding: 3rem 0.5rem;
    padding-bottom: 0;
}

/*********************/
/*-PROPOSITION-------**/
/*********************/
.proposition{
    
    background:linear-gradient(rgba(20, 82, 9, 0.835), rgba(31, 100, 22, 0.829)) ,url('Networking.jpeg');
    width: 100%;
    background-position: center;
    background-attachment: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem 0;
}

.proposition-h2{
    color:white;
    font-size: 2.5rem;
}

.proposition-center{
    width:90%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    
}

.proposition-p{
    font-size: 1.3rem;
    color:white;
    padding: 0.5rem 1rem;
    line-height: 2rem;
    margin-top: 1rem;
}

.underline{
    background-color: rgb(255, 238, 0);
    height:0.2rem;
    width: 15rem;
}

.underline2{
    margin:0 auto;
    width:10rem;
}

.commitment {
    display: flex;
    color: white; 
    font-size: 1.2rem; 
    justify-content:flex-start;
    text-align: left;
}

.commitments {
    margin-top: -0.5rem;
}

.commitment-icon{
    margin-right: 0.5rem;
    
}

/*********************/
/*--CORE SERVICES----**/
/*********************/

.core-services{
    padding: 3rem 0;
}

.core-services-center{
    width:90%;
    margin: 0 auto;
}

.core-services-line{
    width: 75%;
    background-color: rgb(255, 230, 0);
    height: 0.1rem;
    margin-right: 1rem;
   
}

.core-services-heading{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.core-services-h3{
    min-width: 12rem;
    font-weight: 800;
    color:rgb(47, 206, 33);
    margin-left: 1rem;
}

.core-services-contents {
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
    align-content:center;
}

.core-services-contents a{
    text-decoration: none;
}

.core-services-content{
    transition: 0.5s all;
    margin: 1rem;
    
    max-width: 22rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 0.1rem solid rgb(217, 255, 0);
    border-bottom: 0.3rem solid rgb(217, 255, 0);
    padding:1rem;
    flex: 1 22rem;
    height: 10.5rem;
}

.core-services-h4{
    color:rgb(34, 230, 27);
    font-size: 1.2rem;
}

.core-services-p{
    color: rgb(39, 143, 56);
}

.core-services-icon .material-icons{
    color:rgb(34, 230, 27);
    font-size: 2.8rem;  
}

.core-services-content:hover {
    box-shadow: 0.1rem 0.1rem 0.3rem rgb(53, 102, 55);
}

.core-services-content:hover .core-services-icon .material-icons{
    color:rgb(29, 75, 18);
}


/*********************/
/*--HOME COUNTER---**/
/*********************/

.home-counter{
    background: linear-gradient(rgba(8, 44, 14, 0.774), rgba(39, 110, 33, 0.781)), url('food.jpg');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    width: 100%;
    height: 20rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.home-counter-boxes{
    background-color: rgba(255, 255, 255, 0.849);
    width:90%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2rem 0;
    padding-top: 2.5rem;
    box-shadow: 0 0 0.4rem black;
    flex-wrap: wrap;
}

.home-counter-box{
    flex: 1 5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.home-counter-icon{
    display: flex;
    justify-content: center;
    align-items: center;
   
}

.home-counter-icon .material-icons, .home-counter-icon .counter {
    font-size: 3rem;
    color: rgb(151, 190, 23);
}

.home-counter-icon .counter {
    color:rgb(24, 189, 46);
    margin-top: -0.4rem;
}

.home-counter-box p {
    color: rgb(19, 124, 15);
    font-size: 1.2rem;
    font-weight: 600;
}

.home-counter-box1{
    border-right: 0.1rem dashed rgb(21, 255, 0);
    
}

.home-counter-box3{
    border-left: 0.1rem dashed rgb(21, 255, 0);
    
}

.counters-h2{
    color:white;
    margin-bottom: 2rem;
}

@media screen and (max-width:1000px){
    .home-counter-boxes{
        flex-direction: column;
        height: 100%;
        width: 90%;
    }

    .home-counter{
        height: 40rem;
    padding-top: 3rem;
    }
.home-counter-box1, .home-counter-box3 {
    border: none;
}

}

/*********************/
/*----CLIENTS----**/
/********************/

.clients{
    padding: 3rem 0;
}

.clients-center{
    width:90%;
    margin: 0 auto;
}

.clients-heading{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.clients-h3{
    min-width: 12rem;
    font-weight: 800;
    color:rgb(0, 140, 255);
    margin-left: 1rem;
}

.clients-line{
    width: 65%;
    background-color: orangered;
    height: 0.1rem;
    margin-right: 1rem;
   
}

.client-logos{
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    margin-top: 1.5rem;
}

.client-logo{
    flex: 1 10rem;
    max-width: 10rem;
    margin: 0.5rem;
}

.client-logo-image{
    width:100%;
}


/**********************/
/*--SERVICES--**/
/*********************/
.services-header{
    height: 9rem;
    background-color: rgb(196, 255, 204);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.services-h1, .services-h2{
    color:rgb(28, 148, 38);
}

.services-h2{
    color:rgb(24, 57, 110);
    font-size: 1.2rem;
}

.services-container{
    width: 90%;
    margin:0 auto;
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    padding: 2.5rem 0;
    
}

.services-links, .services-content, .services-photos{
    flex: 1 10rem;
    margin: 1rem;
    max-width: 25rem;
}

.services-content{
    flex: 2 10rem;
   
}

.service-image{
    width: 100%;
}





.services-links{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.services-h4 {
    color:rgb(33, 49, 138);
    font-size: 1rem;
}



.services-link {
    background-color: rgb(223, 223, 240);
    margin: 0.2rem;
   width: 18rem;
    padding: 0.3rem 1rem;
    border-radius: 0.1rem;
}



.service-photo {
    margin:0.5rem;
    

}

.service-image {
    display: block;
    border-radius: 0.2rem;
}


.services-a {
    text-decoration: none;
}

.services-link{
    transition: 0.5s;
}

.services-a:hover .services-link {
    background-color: #0b70b3;
}


.services-a:hover .services-h4 {
   color: #ffffff;
}


.services-p {
    color: rgb(30, 70, 104);
    font-size: 1.2rem;
    text-align: justify;
    padding-right: 1rem;
    
}

.freight-link{
    background-color: #0b70b3;  
}

.freight-h4  {
    color:white;
}

 
@media screen and (max-width:1023px){
    .services-container{
        flex-direction: column;
        align-items: center;
        
    }

    .services-p {
       
        padding-right: 0;
        
    }

    .services-links{
        order:1;
    }
 

}

@media screen and (max-width:480px){
    .services-link{
        width:15rem;
    }
}

/**************/
/*--ABOUT--**/
/***************/

.about-header{
    background: linear-gradient(rgba(24, 46, 24, 0.842), rgba(10, 42, 10, 0.87)), url('aboutimg1.jpg');
    background-size: cover;
    background-repeat: center;
    background-attachment: fixed;
    width: 100%;
    padding:3rem 0;
}

.about-us-center{
    margin:0 auto;
    width:90%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.about-vision, .about-mission{
    flex:1 30rem;
    color:white;
    text-align: center;
    margin-top: 1.5rem;
    max-width: 30rem;
}

.about-h2{
    font-size: 2.5rem;
}
.about-p{
    font-size: 1.3rem;
    font-style: italic;
  
}

.quote-box{
    position: relative;
}

.left-quote{
    font-size: 8rem;
    left:0rem;
    top:-6.1rem;
    color:rgb(255, 251, 0);
    display: inline-block;
    position: absolute;
}

@media screen and (max-width:400px){
.left-quote{
    font-size:5rem ;
    top: -3.5rem;
    left:-0.5rem;
}

.about-p {
 margin-top: 2rem;   
}

}

.approach-containter{
    padding: 3rem 0;  
    background-color: rgb(231, 240, 231);
    
}

.approach{
    display: flex;
    width: 90%;
    margin: 0 auto;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
   
}

@media screen and (max-width:480px){
    .approach{   
        width: 100%;  
    } 
}

.approach-content, .approach-image{
    flex: 1 30rem;
    max-width: 30rem;
    margin:1rem;
}

.approach-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
   
}




.approach-photo{
    width: 100%;
    display: inline-block;
    border: 0.3rem solid green;
    padding: 0.5rem;
   
}

@media screen and (max-width:480px){

    .approach-photo{
        
        border: none;
        padding: 0;
       
    }

    .approach{
        margin-top: -2rem;
    }

}

.approach-p{
    font-size: 1.2rem;
    color: rgb(37, 63, 37);
    text-align: justify;
}

.approach-h2{
    color:rgb(71, 177, 71);
    text-shadow: 0.1rem 0rem 0rem rgb(231, 231, 76);
    margin-bottom: 1rem;
  text-align: center;
  font-size: 2rem;
}

.approach-container-odd{
    padding: 0;
}

.approach-odd{
    flex-direction: row-reverse;
}

.last-approach{
    padding-bottom: 3rem;
}

.home-p{
    font-size: 1.3rem;
    color:rgb(23, 161, 23);
    text-align: justify;
    width: 96%;
    margin: 0 auto;
    margin-top: 2rem;
}


/*******************************/
/*--ENVIRONMENT CONSERVATION--**/
/*******************************/

.other-headers{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 20rem;
    width:100%;
    background: linear-gradient(rgba(16, 44, 16, 0.623),rgba(11, 31, 11, 0.555)),url('env.jpg');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

.food-header{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 20rem;
    width:100%;
    background: linear-gradient(rgba(16, 44, 16, 0.623),rgba(11, 31, 11, 0.555)),url('food.jpg');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

.financial-header{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 20rem;
    width:100%;
    background: linear-gradient(rgba(16, 44, 16, 0.623),rgba(11, 31, 11, 0.555)),url('SLIDE3c.jpg');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

.wealth-header{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 20rem;
    width:100%;
    background: linear-gradient(rgba(16, 44, 16, 0.623),rgba(11, 31, 11, 0.555)),url('SLIDE4.jpg');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
.other-h1{
    color:white;
    font-family: 'Zen Antique Soft', serif;
    font-size: 2.5rem;
    font-weight: 600;
    text-align: center;
    text-shadow: 0.1rem 0rem 0.2rem rgb(255, 208, 0);
}

.services-main{
    background-color: rgb(215, 233, 215);
    padding: 4rem 0rem;
    text-align: center;

}
.services-h2{
    background-color: rgb(53, 78, 53);
    color: white;
    
    padding: 1rem 1rem;
    
    display: inline-block;
    margin:0 auto;
    font-size: 1.5rem;
    border: 0.5rem solid rgb(157, 255, 0);

}

.services-h2-odd{
    margin-top: 4rem;
}

.services-para{
    background-color: rgba(255, 255, 255, 0.575);
    width: 95%;
    margin:0 auto;
    margin-top: 2rem;
    padding: 1rem;
    color:rgb(36, 61, 36);
    font-size: 1.2rem;
    text-align: justify;
    box-shadow: 0 0 0.6rem rgb(36, 61, 36) ;
   /* border-radius: 0.5rem;*/
}

.other-headers-h2{
    color:rgb(255, 244, 141);
    letter-spacing: 0.1rem;
    font-style: italic;
    text-align: center;
}

.pictorial{
    display: flex;
    justify-content: space-around;
    align-content: center;
    flex-wrap: wrap;
    padding:3rem 0;
    padding-top: 0;
    width:90%;
    margin:0 auto;
    margin-top: -2rem;
    background-color: rgb(215, 233, 215);
}

.pictorial-box{
    width: 35rem;
    background-color: rgb(74, 124, 28);
    margin:1rem 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.pictorial-photo{
    width:100%;
    transition: 0.5s;
}

.pictorial-photo:hover{
    transform: scale(1.1);
opacity: 0.8;
}

.pictorial-h3{
    color:rgb(46, 185, 46);
    font-size: 2.5rem;
    margin-top: 3rem;
}

.pictorial-cover{
    background-color: rgb(215, 233, 215);
}

.pictorial-image{
    background-color: rgb(80, 202, 80);
    overflow: hidden;
}

.pictorial-p{
    color:rgb(255, 255, 255);
    font-size: 1.2rem;
    text-align: center;
    margin:0.5rem;
}

/********************/
/*--TRACK RECORD--**/
/*******************/
.track-record-container{
    background-color: #d8ebde;
    padding:3rem 0;
}

.track-record-content{
    width:90%;
    margin:0 auto;
}

.track-record-p{
    color:white;
    background-color: rgb(38, 56, 38);
    padding:1rem;
    text-align: justify;
    font-size: 1.3rem;
}

.track-record-p-odd{
    margin-top: 4rem;
    text-align: center;
}

/**************/
/*--TABLE--**/
/************/

table {
    border-collapse: collapse;
    width: 100%;
    background-color: white;
  }
  
  th, td {
    text-align: left;
    padding: 8px;
  }
  
  th{
      color:white;
      background-color: rgb(58, 129, 58);
  }
  tr:nth-child(even) {background-color: #f8ee90b9;}

  .category{
      min-width: 20rem;
  }

  .beds{
      min-width: 10rem;
  }

  .assignment{
      min-width: 20rem;
  }
  .period{
    min-width: 10rem;
  }

  .period{
    min-width: 20rem;
  }

  .google-play-icon{
    width:100%;
  }

  .google-play-icon-cover{
    max-width: 10rem;
  }