

@media only screen and (min-width: 1291px){
        .containerSections{
            position: relative;
            height: 3560px;
        }
        .containerService{
            position: relative;
            width: 100%;
            height: 500px;
            overflow:hidden;
        }
        .serviceFreight,.serviceTraining{
            height: 630px;
        }
        .backHidden{
            display: none;
        }
        .details{
            
            position: absolute;
            top: 0;
            width: 50%;
            height: 100%;
            z-index: 2;
            background-color: #FFFFFF;

        }
        .sectionLeft{
        left: 0;
        }
        .sectionRight{
            right: 0;
        }
        .imageSection{
            position: absolute;
            top: 0;
            width: 52%;
            height: 100%;
            margin: 0;
            z-index: 0;
            
        }
        .imgLeft{
            left: 0;
        }
        .imgRight{
            right: 0;
        }
        .imageSection img{

            position: absolute;
            height: 100%;
            top: 0;
            z-index: 0;
            opacity: 0.9;
            overflow:hidden;
            transition:all 1s ease-in-out;

        }
        .imgLeft img{
            left: 0;
        }
        .imgRight img{
            right: 0;
        }

        .tittleService{
            position: absolute;
            width: 90%;
            right: 0;
            height: 20%;
            margin: 20% 5%;
            font-family: sans-serif,Verdana,Tahoma;
            text-align: center;
            z-index: 1;
            
        }
        .tittleService h1{
            font-size: 70px;
            color: #FFFFFF;
            overflow:hidden;
            transition:all .5s ease-in-out;
        }
        .descriptionService{
            position: relative;
            width: 90%;
            height: auto;
            margin: 2% auto;
            text-align: justify;
            font-family: sans-serif,Verdana,Tahoma;
            
        }
        .serviceCenter{
            margin-top: 10%;
        }
        .sectionButtons{
            position: absolute;
            bottom: 20px;
            width: 50%;
            height: 70px;
            margin: 2% 25%;
        }

        .serviceFreight .sectionButtons,.serviceTraining .sectionButtons{
            bottom: 0;
        }

        .btnAdd{
            position: absolute;
            background-color: #11131d;
                border: 0;
                height: 40px;
                width: 140px;
                color: #EEEEEE;
                border-radius: 5px;
                bottom: 10px;
                
        }
        .btnAdd a{
            text-decoration: none !important;
            color: #EEEEEE;
        }
        .btnLeft{left: 5%;}
        .btnRight{right: 5%;}
        .btnCenter{margin-left: 30%;}
        .btnAdd:hover{
            background-color: #6B6D6F;
        }
        .serviceTrucking:hover > .imageSection img{
            -webkit-transform:scale(1.3);transform:scale(1.3);} 
        .serviceFreight:hover > .imageSection img{
            -webkit-transform:scale(1.3);transform:scale(1.3);
        } 
        .serviceTraining:hover > .imageSection img{
            -webkit-transform:scale(1.3);transform:scale(1.3);
        }
        .serviceWarehousing:hover > .imageSection img{
            -webkit-transform:scale(1.3);transform:scale(1.3);
        }
        .serviceClearance:hover > .imageSection img{
            -webkit-transform:scale(1.3);transform:scale(1.3);
        }
        .serviceInsurance:hover > .imageSection img{
            -webkit-transform:scale(1.3);transform:scale(1.3);
        }

}
@media only screen and (min-width: 1050px)and (max-width: 1290px){
    .containerSections{
        height: 3750px;
        position: relative;
    }
    .containerService{
        position: relative;
        width: 100%;
        height: 500px;
        overflow:hidden;
    }
    .backHidden{
        display: none;
    }
    .serviceFreight{
        height: 750px;
    }
    .serviceTraining{
        height: 700px;
    }

    .details{
        
        position: absolute;
        top: 0;
        width: 50%;
        height: 100%;
        z-index: 2;
        background-color: #FFFFFF;

    }
    .sectionLeft{
    left: 0;
    }
    .sectionRight{
        right: 0;
    }
    .imageSection{
        position: absolute;
        top: 0;
        width: 52%;
        height: 100%;
        margin: 0;
        z-index: 0;
        
    }
    .imgLeft{
        left: 0;
    }
    .imgRight{
        right: 0;
    }
    .imageSection img{

        position: absolute;
        height: 100%;
        top: 0;
        z-index: 0;
        opacity: 0.9;
        overflow:hidden;
        transition:all 1s ease-in-out;

    }
    .imgLeft img{
        left: 0;
    }
    .imgRight img{
        right: 0;
    }

    .tittleService{
        position: absolute;
        width: 80%;
        right: 0;
        height: 20%;
        margin:40% 10%;
        font-family: sans-serif,Verdana,Tahoma;
        text-align: center;
        z-index: 1;
    }
    .tittleService h1{
        font-size: 50px;
        color: #FFFFFF;
        overflow:hidden;
        transition:all .5s ease-in-out;
    }
    .descriptionService{
        position: relative;
        width: 90%;
        height: auto;
        margin: 2% auto;
        text-align: justify;
        font-family: sans-serif,Verdana,Tahoma;
        
    }
    .serviceCenter{
        margin-top: 10%;
    }
    .sectionButtons{
        position: absolute;
        bottom: 20px;
        width: 70%;
        height: 70px;
        margin: 1% 15%;
    }

    .serviceFreight .sectionButtons,.serviceTraining .sectionButtons{
        bottom: 0;
    }

    .btnAdd{
        position: absolute;
        background-color: #11131d;
            border: 0;
            height: 40px;
            width: 140px;
            color: #EEEEEE;
            border-radius: 5px;
            bottom: 10px;
            
    }
    .btnAdd a{
        text-decoration: none !important;
        color: #EEEEEE;
    }
    .btnLeft{left: 5%;}
    .btnRight{right: 5%;}
    .btnCenter{margin-left: 30%;}
    .btnAdd:hover{
        background-color: #6B6D6F;
    }
    .serviceTrucking:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);} 
    .serviceFreight:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    } 
    .serviceTraining:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceWarehousing:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceClearance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceInsurance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }

}

@media only screen and (min-width: 992px)and (max-width: 1049px){
    .containerSections{
        height: 3830px;
        position: relative;
    }
    .containerService{
        position: relative;
        width: 100%;
        height: 500px;
        overflow:hidden;
    }
    .serviceFreight,.serviceTraining{
        height: 740px;
    }
    .backHidden{
        display: none;
    }
    .details{
        
        position: absolute;
        top: 0;
        width: 50%;
        height: 100%;
        z-index: 2;
        background-color: #FFFFFF;

    }
    .sectionLeft{
    left: 0;
    }
    .sectionRight{
        right: 0;
    }
    .imageSection{
        position: absolute;
        top: 0;
        width: 52%;
        height: 100%;
        margin: 0;
        z-index: 0;
        
    }
    .imgLeft{
        left: 0;
    }
    .imgRight{
        right: 0;
    }
    .imageSection img{

        position: absolute;
        height: 100%;
        top: 0;
        z-index: 0;
        opacity: 0.9;
        overflow:hidden;
        transition:all 1s ease-in-out;

    }
    .imgLeft img{
        left: 0;
    }
    .imgRight img{
        right: 0;
    }

    .tittleService{
        position: absolute;
        width: 80%;
        right: 0;
        height: 20%;
        margin:40% 10%;
        font-family: sans-serif,Verdana,Tahoma;
        text-align: center;
        z-index: 1;
    }
    .tittleService h1{
        font-size: 50px;
        color: #FFFFFF;
        overflow:hidden;
        transition:all .5s ease-in-out;
    }
    .descriptionService{
        position: relative;
        width: 90%;
        height: auto;
        margin: 2% auto;
        text-align: justify;
        font-family: sans-serif,Verdana,Tahoma;
        
    }
    .serviceCenter{
        margin-top: 10%;
    }
    .sectionButtons{
        position: absolute;
        bottom: 20px;
        width: 70%;
        height: 70px;
        margin: 1% 15%;
    }

    .serviceFreight .sectionButtons,.serviceTraining .sectionButtons{
        bottom: 0;
    }

    .btnAdd{
        position: absolute;
        background-color: #11131d;
            border: 0;
            height: 40px;
            width: 140px;
            color: #EEEEEE;
            border-radius: 5px;
            bottom: 10px;
            
    }
    .btnAdd a{
        text-decoration: none !important;
        color: #EEEEEE;
    }
    .btnLeft{left: 5%;}
    .btnRight{right: 5%;}
    .btnCenter{margin-left: 30%;}
    .btnAdd:hover{
        background-color: #6B6D6F;
    }
    .serviceTrucking:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);} 
    .serviceFreight:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    } 
    .serviceTraining:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceWarehousing:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceClearance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceInsurance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }

}
@media only screen and (min-width: 740px)and (max-width: 991px){
    .containerSections{
        position: relative;
        height: 3750px;
    }
    .containerService{
        position: relative;
        width: 100%;
        height: 500px;
        overflow:hidden;
    }
    .serviceFreight,.serviceTraining{
        height: 700px;
    }
    .backHidden{
        display: block;
        position: absolute;
        top: 0;
        background-color: #11131d;
        opacity: 0.3;
        height: 100%;
        width: 100%;
        z-index: 1;
    }
    .details{
        
        position: relative;
        top: 0px;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 2;


    }
    .sectionLeft{
    left: 0;
    }
    .sectionRight{
        right: 0;
    }
    .imageSection{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        z-index: 0;
        
    }
    .imgLeft{
        left: 0;
    }
    .imgRight{
        right: 0;
    }
    .imageSection img{

        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 0;
        opacity: 0.9;
        overflow:hidden;
        transition:all 1s ease-in-out;

    }
    .imgLeft img{
        left: 0;
    }
    .imgRight img{
        right: 0;
    }

    .tittleService{
        position: absolute;
        top: 0;
        width: 80%;
        right: 0;
        height: auto;
        margin:1% 10%;
        font-family: sans-serif,Verdana,Tahoma;
        text-align: center;
        z-index: 10;
    }
    .serviceTraining .tittleService{
        width: 90%;
        margin:1% 5%;
    }
    /* .tittleVisible{
        display: none;
    }
    .tittleHidden{
        display: block;
        opacity: 1;
    } */

    .tittleService h1{
        font-size: 50px;
        color: #FFFFFF;
        overflow:hidden;
        transition:all .5s ease-in-out;
        z-index: 3;
    }
    
    .descriptionService{
        position: absolute;
        width: 90%;
        top: 100px;
        height: auto;
        margin: 2% 5%;
        text-align: justify;
        font-family: sans-serif,Verdana,Tahoma;
        color: #FFFFFF;
    }
    .serviceTraining p{
        margin-top: 3%;
    }
    .serviceCenter{
        margin-top: 10%;
    }
    .sectionButtons{
        position: absolute;
       bottom:  20px;
        width: 60%;
        height: 70px;
        margin: 0 20%;
        z-index: 2;
    }

    /* .serviceFreight .sectionButtons,.serviceTraining .sectionButtons{
        bottom: 0;
    } */

    .btnAdd{
        position: absolute;
        background-color: #11131d;
            border: 0;
            height: 40px;
            width: 140px;
            color: #EEEEEE;
            border-radius: 5px;
            bottom: 10px;
            
    }
    .btnAdd a{
        text-decoration: none !important;
        color: #EEEEEE;
    }
    .btnLeft{left: 5%;}
    .btnRight{right: 5%;}
    .btnCenter{margin-left: 35%;}
    .btnAdd:hover{
        background-color: #6B6D6F;
    }
    .serviceTrucking:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);} 
    .serviceFreight:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    } 
    .serviceTraining:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceWarehousing:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceClearance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceInsurance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }

}

@media only screen and (min-width: 440px)and (max-width: 739px){
    .containerSections{
        position: relative;
        height: 4400px;
    }
    .containerService{
        position: relative;
        width: 100%;
        height: 550px;
        overflow:hidden;
    }
    .serviceFreight,.serviceTraining{
        height: 890px;
    }
    .backHidden{
        display: block;
        position: absolute;
        top: 0;
        background-color: #11131d;
        opacity: 0.4;
        height: 100%;
        width: 100%;
        z-index: 1;
    }
    .details{
        
        position: relative;
        top: 0px;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 2;


    }
    .sectionLeft{
    left: 0;
    }
    .sectionRight{
        right: 0;
    }
    .imageSection{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        z-index: 0;
        
    }
    .imgLeft{
        left: 0;
    }
    .imgRight{
        right: 0;
    }
    .imageSection img{

        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 0;
        opacity: 0.9;
        overflow:hidden;
        transition:all 1s ease-in-out;

    }
    .imgLeft img{
        left: 0;
    }
    .imgRight img{
        right: 0;
    }

    .tittleService{
        position: absolute;
        top: 0;
        width: 80%;
        right: 0;
        height: auto;
        margin:2% 10%;
        font-family: sans-serif,Verdana,Tahoma;
        text-align: center;
        z-index: 10;
    }
    /* .tittleVisible{
        display: none;
    }
    .tittleHidden{
        display: block;
        opacity: 1;
    } */

    .tittleService h1{
        font-size: 30px;
        color: #FFFFFF;
        overflow:hidden;
        transition:all .5s ease-in-out;
        z-index: 3;
    }
    .descriptionService{
        position: absolute;
        width: 90%;
        top: 90px;
        height: auto;
        margin: 0% 5%;
        text-align: justify;
        font-family: sans-serif,Verdana,Tahoma;
        color: #FFFFFF;
        font-size: 16px;
    }
    .serviceTraining .tittleService{
        width: 90%;
        margin:2% 5%;
    }
    .serviceCenter{
        margin-top: 10%;
    }
    .sectionButtons{
        position: absolute;
       bottom:  20px;
        width: 80%;
        height: 70px;
        margin: 0 10%;
        z-index: 2;
    }

    /* .serviceFreight .sectionButtons,.serviceTraining .sectionButtons{
        bottom: 0;
    } */

    .btnAdd{
        position: absolute;
        background-color: #11131d;
            border: 0;
            height: 40px;
            width: 140px;
            color: #EEEEEE;
            border-radius: 5px;
            bottom: 10px;
            
    }
    .btnAdd a{
        text-decoration: none !important;
        color: #EEEEEE;
    }
    .btnLeft{left: 5%;}
    .btnRight{right: 5%;}
    .btnCenter{margin-left: 30%;}
    .btnAdd:hover{
        background-color: #6B6D6F;
    }
    .serviceTrucking:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);} 
    .serviceFreight:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    } 
    .serviceTraining:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceWarehousing:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceClearance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceInsurance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }

}

@media only screen  and (max-width: 439px){
    .containerSections{
        position: relative;
        height: 4800px;
    }
    .containerService{
        position: relative;
        width: 100%;
        height: 550px;
        overflow:hidden;
    }
    .serviceFreight,.serviceTraining{
        height: 1050px;
    }
    .serviceWarehousing{
        height: 600px;
    }
    .backHidden{
        display: block;
        position: absolute;
        top: 0;
        background-color: #11131d;
        opacity: 0.4;
        height: 100%;
        width: 100%;
        z-index:1;
    }
    .details{
        
        position: relative;
        top: 0px;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 2;


    }
    .sectionLeft{
    left: 0;
    }
    .sectionRight{
        right: 0;
    }
    .imageSection{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        z-index: 0;
        
    }
    .imgLeft{
        left: 0;
    }
    .imgRight{
        right: 0;
    }
    .imageSection img{

        position: absolute;
        height: 100%;
        width: 150%;
        top: 0;
        left: -25%;
        z-index: 0;
        opacity: 0.9;
        overflow:hidden;
        transition:all 1s ease-in-out;

    }
    .imgLeft img{
        left: 0;
    }
    .imgRight img{
        right: 0;
    }

    .tittleService{
        position: absolute;
        top: 0;
        width: 80%;
        right: 0;
        height: auto;
        margin:2% 10%;
        font-family: sans-serif,Verdana,Tahoma;
        text-align: center;
        z-index: 2;
    }
    /* .tittleVisible{
        display: none;
    }
    .tittleHidden{
        display: block;
        opacity: 1;
    } */

    .tittleService h1{
        font-size: 30px;
        color: #FFFFFF;
        overflow:hidden;
        transition:all .5s ease-in-out;
        z-index: 3;
    }
    .serviceTraining p{
        margin-top: 10%;
    }
    .descriptionService{
        position: absolute;
        width: 90%;
        top: 90px;
        height: auto;
        margin: 0% 5%;
        text-align: justify;
        font-family: sans-serif,Verdana,Tahoma;
        color: #FFFFFF;
        font-size: 16px;
    }
    .serviceCenter{
        margin-top: 10%;
    }
    .sectionButtons{
        position: absolute;
       bottom:  20px;
        width: 100%;
        height: 70px;
        margin: 0%;
        z-index: 2;
    }

    /* .serviceFreight .sectionButtons,.serviceTraining .sectionButtons{
        bottom: 0;
    } */

    .btnAdd{
        position: absolute;
        background-color: #11131d;
            border: 0;
            height: 40px;
            width: 140px;
            color: #EEEEEE;
            border-radius: 5px;
            bottom: 10px;
            
    }
    .btnAdd a{
        text-decoration: none !important;
        color: #EEEEEE;
    }
    .btnLeft{left: 5%;}
    .btnRight{right: 5%;}
    .btnCenter{margin-left: 30%;}
    .btnAdd:hover{
        background-color: #6B6D6F;
    }
    .serviceTrucking:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);} 
    .serviceFreight:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    } 
    .serviceTraining:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceWarehousing:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceClearance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }
    .serviceInsurance:hover > .imageSection img{
        -webkit-transform:scale(1.3);transform:scale(1.3);
    }

}

#SectionOne{
    z-index: 9;
}




