*{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:0rem 0;
    background-color: #f5f4f4;
   
}

.top-bar-cover {
    background-color: #f5f4f4;  
}


.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(255, 0, 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(243, 171, 38);
}

.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(53, 165, 34);
    text-decoration: none;
    font-weight: 500;
  
    padding: 0.5rem 0.8rem;
    border-radius: 0.2rem;
    transition: 0.5s;
}

.footer-quote1 {
    background-color: rgb(238, 67, 67);
}

.quote-request:hover {
    color:white;
    background-color: rgb(14, 83, 18);
}

.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;
    }

    .top-bar-cover{
        padding-bottom: 2rem;
    }


}













    

    





.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: #059c2b;
   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(245, 222, 118);
}

.footer-copy-center a {
    color:rgb(250, 30, 30);
    text-decoration: none;
}

.footer-copy-center a:hover {
    color:rgb(248, 122, 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: #08360a;
}

.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: 15rem;
    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(245, 243, 159);
}

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




.footer-link-a{
    text-decoration: none;
    color:rgb(238, 235, 146);
    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;
                    
          }

          
  
          
          .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;
}
.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: flex-start;

    background-color: rgb(27, 173, 27);
    width: 90%;
    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:#f8f081;
    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:30rem;
    object-fit: cover;
}

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

.vision-slide {
    height: 50vh;
}

.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;
    display:none;
}

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

.slide-h1 {
    /*background-color: rgba(216, 214, 213, 0.746);*/
    position: absolute;
    top:-15rem;
    padding: 1rem 0;
    color: rgb(250, 36, 36);
    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(19, 19, 19);
    letter-spacing: 0rem;
}


.slide-p {
    position: absolute;
    top: -8rem;
    font-size: 2.3rem;
    font-weight: 600;
    text-shadow: 0.1rem 0 0.1rem black;
    text-align: left;
    color:rgb(72, 255, 0);
    line-height: 1.6rem;
 
}

.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: #0e4b09;
     width:100%;
     border-top: 0.2rem solid rgb(255, 0, 0);
     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: #ff7000;
    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:840px){
     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(216, 255, 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;
 }

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

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

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



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

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


}
 
 
 /**********************/
   /*--CONTACT FORM--**/
   /*********************/
  .contact-form {
    background:linear-gradient(rgba(16, 122, 34, 0.774),rgba(10, 10, 10, 0.555)), url('pexels-photo-164755.jpeg');
    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: 0.95rem;
     }

     .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-cover{
    background-color: rgb(229, 241, 228);
}
.intro{
    width:90%;
    margin: 0 auto;
    padding: 3rem 0;
}

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

.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-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}


.intro-h3 {
    margin: 1rem 0;
    letter-spacing: 0;
    font-size: 1.6rem;
    color:rgb(0, 140, 255);
    
}

.intro-about-h3 {
    color:rgb(255, 30, 30);
    text-shadow: 0.1rem 0 0.1rem black;
}

.intro-p, .intro-about-p {
    color: rgb(57, 143, 35);
    font-size: 1.1rem;
    text-align: justify;
}

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

.intro-readmore{
    display: flex;
    color:rgb(255, 21, 0);
    font-weight: 800;
}

.intro-readmore a {
    text-decoration: none;
    color:rgb(255, 21, 0);
}

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

/*********************/
/*-PROPOSITION-------**/
/*********************/
.proposition{
    
    background:linear-gradient(rgba(0, 0, 0, 0.637), rgba(0, 0, 0, 0.644)) ,url('pexels-photo-270288.jpeg');
    width: 100%;
    padding: 3rem 0;
    background-position: center;
    background-attachment: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
}

.proposition-h2{
    color:white;
    font-size: 2.5rem;
    text-shadow: 0.2rem 0 0.1rem red;
}

.proposition-center{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    max-width: 55rem;
    position: relative;
}

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

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

.left-quote{
    color:white;
    font-size: 6rem;
    position: absolute;
    left: 0;
    top:1.8rem;
    text-shadow: 0.3rem 0 0.1rem rgb(255, 0, 0);
    
}


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

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

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

.core-services-line{
    width: 75%;
    background-color: orangered;
    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(0, 140, 255);
    margin-left: 1rem;
}

.core-services-contents {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    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 orange;
    border-bottom: 0.3rem solid orange;
    padding:1rem;
    flex: 1 22rem;
}

.core-services-h4{
    color:rgb(0, 140, 255);
    font-size: 1.2rem;
}

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

.core-services-icon .material-icons{
    color:rgb(0, 140, 255);
    font-size: 2.8rem;  
}

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

.core-services-content:hover .core-services-icon .material-icons{
    color:rgb(30, 66, 133);
}


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

.home-counter{
    background: linear-gradient(rgba(8, 8, 44, 0.527), rgba(13, 13, 42, 0.534)), url('CUSTOMS.jpeg');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    width: 100%;
    height: 20rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.home-counter-boxes{
    background-color: rgba(255, 255, 255, 0.849);
    width:70%;
    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: orangered;
}

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

.home-counter-box p {
    color: rgb(0, 89, 255);
    font-size: 1.2rem;
    font-weight: 600;
}

.home-counter-box1{
    border-right: 0.1rem dashed blue;
    
}

.home-counter-box3{
    border-left: 0.1rem dashed blue;
    
}

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

    .home-counter{
        height: 30rem;
    }
.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(229, 229, 238);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.services-h1, .services-h2{
    color:rgb(24, 57, 110);
}

.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-us-header{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    width:90%;
    margin:0 auto;
    padding:3rem 0;
    background-color: rgb(218, 251, 203);
}

.about-title, .about-slides{
    flex: 1 25rem;
}

.about-title{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(218, 251, 203);
}

.about-us-header .d-block {
    height:23rem;
    border-radius: 0.3rem;
    
}

.about-us-header .carousel-caption{
    display: none!important;
}

.about-us-header-container {
    background-color: rgb(218, 251, 203);
}

.about-h1 {
    color:rgb(22, 144, 22);
    text-shadow:0.1rem 0 0.1rem red;
    font-size: 3rem;
}

@media screen and (max-width:910px){
    .about-title, .about-slides{
        max-width: 30rem;
    }

    .about-h1 {
       padding: 3rem 0;
    }
}

.about-content{
    margin: 0 auto;
    padding: 3rem 0;
    width: 90%;
    padding: 3rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.664);
    border-radius: 0.3rem;
}

.about-h2{
    text-align: center;
    color:rgb(22, 144, 22);
}

.about-content-container{
    background-color: rgb(218, 251, 203);
    padding-bottom: 3rem;
}

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

.objective{
    display: flex;
    justify-content: flex-start;
    font-size: 1.3rem;
}

.objective-icon{
    margin-right: 0.5rem;
    color: rgb(245, 64, 64);
    text-shadow: 0.1rem 0 0.1rem green;
}

.objective-para{
    color:rgb(72, 141, 16);
}

.tech-details{
    margin-top: 3rem;
}


.tech-para{
    font-size: 1.3rem;
    color:rgb(72, 141, 16);
    text-align: justify;
}

/**************/
/*--PROGRAMS--**/
/***************/

.programs{
    background-color: rgb(218, 251, 203);
    padding: 3rem 0;
}

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

.program{
    display: flex;
    justify-content:space-around ;
    flex-wrap: wrap;
    align-items: center;
    background-color: rgb(255, 255, 255);
    box-shadow: 0rem 0rem 0.5rem rgba(35, 49, 35, 0.835);;
}

.program-info, .program-photo{
    flex: 1 25rem;
    padding: 2rem;
}

.program-info{
    
    text-align: center;
}


.program-image{
    width: 100%;
}

.program-h3{
    color:rgb(44, 189, 44);
}

.program-h4{
    color:rgb(28, 119, 28);
}

.program-p{
    color:rgb(44, 189, 44);
    font-size: 1.2rem;
    text-align: justify;
}

.program-link{
    display: inline-block;
    color:rgb(44, 189, 44);
    text-decoration: none;
    border: 0.2rem solid rgb(44, 189, 44);
    padding: 0.5rem 1.5rem;
    transition: 0.5s;
}

.program-link:hover{
   
    color:white;
    
    border: 0.2rem solid rgb(44, 189, 44);
    background-color: rgb(44, 189, 44);
    
}

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

    .program-info, .program-photo{
       max-width: 25rem;
    }
    
}

.program-odd{
    margin: 2rem 0;
    flex-direction: row-reverse;
}

/**************/
/*--SISIMUKA--**/
/***************/

.programs-details-header{
    width: 100%;
    height: 20rem;
    background: linear-gradient(rgba(4, 47, 4, 0.63), rgba(0, 128, 0, 0.582)), url('MORNING.jpeg');
    background-position: center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    text-align: center;
}

.omwekambi-header{
    width: 100%;
    height: 20rem;
    background: linear-gradient(rgba(4, 47, 4, 0.63), rgba(0, 128, 0, 0.582)), url('business.jpg');
    background-position: center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    text-align: center;
}

.kbs-focus-header{
    width: 100%;
    height: 20rem;
    background: linear-gradient(rgba(4, 47, 4, 0.63), rgba(0, 128, 0, 0.582)), url('pexels-photo-269724.jpeg');
    background-position: center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    text-align: center;
}

.weekend-header{
    width: 100%;
    height: 20rem;
    background: linear-gradient(rgba(4, 47, 4, 0.63), rgba(0, 128, 0, 0.582)), url('pexels-photo-270288.jpeg');
    background-position: center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    text-align: center;
}

.drive-header{
    width: 100%;
    height: 20rem;
    background: linear-gradient(rgba(4, 47, 4, 0.63), rgba(0, 128, 0, 0.582)), url('pexels-stephen-niemeier-63703.jpg');
    background-position: center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    text-align: center;
}

/**************/
/*--TABLES--**/
/***************/


.table-container{
    background-color: rgb(241, 248, 241);
}
.table-section{
    width:90%;
    margin: 0 auto;
    padding: 3rem 0;
    overflow-x: auto;
}

table {
    border-collapse: collapse;
    width: 100%;
    background-color: white;
  }
  
  th, td {
    text-align: left;
    padding: 8px;
  }

  th {
      background-color: rgb(165, 230, 165);
      color: rgb(19, 27, 15);
  }
  
  tr:nth-child(even) {background-color: #d7ffc7;}

  .table-tim {
      min-width: 6rem;
  }

  .table-des {
    min-width: 16rem;
    text-align: justify;
}

.weekly-programs-notice{
    text-align: center;
    color:rgb(32, 165, 32);
    max-width: 40rem;
    margin:0 auto;
    font-size: 1.6rem;
}

.weekend-h2{
    text-align: center;
    padding-top: 3rem;
    color:rgb(21, 170, 21);
    text-shadow: 0.1rem 0 0.2rem red;
    font-size: 2.6rem;
    margin-bottom: -1rem;
}

.sunday{
    padding:0;
    
}
.play{
    display: flex;
    justify-content: center;
    align-items: center;
}

.play p{
    font-weight: 600!important;
    letter-spacing: 0.1rem;
}

.arrow-right{
    color:yellow!important;
    font-size: 1rem!important;
    border:0.1rem solid yellow;
    border-radius: 50%;
}