#section-home-top

{

    height: 900px; 

    position: relative;

}



#section-home-top .colonne:nth-child(1)

{

    position: relative;

    width: 62%;

    height: 950px;

    background-size: cover;

}



#section-home-top .voile-animation

{

    height: 100%;

}

#section-home-top .slide
{
	height: 100%;
	background-size: cover;
	background-position: center;
}




#section-home-top .colonne:nth-child(2)

{

    width: 38%;

    height: 950px;

    background-color: #eee;

}



#section-home-top .colonne:nth-child(2) .introduction

{

    position: relative;

    left: 0px;

    background-color: #eee;

    text-align: right;

    width: 770px;

    padding-left: 60px;

    padding-bottom: 25px;

    padding-top: 90px;

    margin-top: 75px;

    transition: left 0.4s 0.8s ease;

}



#section-home-top.visible .colonne:nth-child(2) .introduction

{

    transition: left 0.4s 0.8s ease;

    left: -120px;

    z-index: 50;

}



#section-home-top .colonne:nth-child(2) .introduction > *

{

    transition: 0.2s ease opacity;

}



#section-home-top .introduction h2

{

    text-transform: uppercase;

}



#section-home-top .introduction h1

{

    text-transform: uppercase;

    font-size: 65px;

    line-height: 72px;

    font-weight: 600;

}



#section-home-top .introduction h1 span

{

    text-transform: uppercase;

    font-size: 105px;

    line-height: 104px;

    font-weight: 800;

}



#section-home-top .introduction .texte-base

{

    margin: 45px 0;

}



#section-home-top .introduction .bouton-plus 

{

    margin-left: auto;

}



#section-home-top .navigation-slider {

    background: transparent;

    bottom: 177px;

}



#section-home-top .slick-slider

{

    background-color: white;

}



#section-home-top .slick-slider,

#section-home-top .slick-track,

#section-home-top .slick-list,

#section-home-top .slick-slide div

{

    height: 100%;

    width: 100%;

}



#section-home-top .slick-slide div

{

    background-size: cover;

    background-position: center;

}



#navigation-home 

{

    background-color: #eee;

}



#navigation-home .container

{

    position: relative;

    padding-bottom: 105px;

    margin-top: -177px;

    overflow: hidden;

    height: 600px;

}



#navigation-home .container .item

{

    float: left;

    width: 486px;

    margin: 0 10px;

    z-index: 10;

}



#navigation-home .container .item .titre

{

    position: relative;

    padding: 25px;

    font-size: 30px;

    line-height: 36px;

    font-weight: 800;

}



#navigation-home .container .item .gap_home_nav

{

    padding-right: 100px;

}



#navigation-home .container .item .bouton-plus

{

    position: absolute;

    right: 25px;

    top: 50%;

    transform: translateY(-50%);

}



#navigation-home .container .item:nth-child(1),

#navigation-home .container .item:nth-child(3)

{

    position: relative;

    padding-bottom: 0px;

    top: 239px;

}



#navigation-home.visible .container .item:nth-child(1),

#navigation-home.visible .container .item:nth-child(3)

{

    top: 105px;

    padding-bottom: 480px;

    transition: 0.4s ease top, 0.4s 0.4s ease padding, 0.4s ease transform;

}



#navigation-home .container .item:nth-child(2),

#navigation-home .container .item:nth-child(4)

{

    position: relative;

    padding-top: 0px;

    top: 239px;

}



#navigation-home.visible .container .item:nth-child(2),

#navigation-home.visible .container .item:nth-child(4)

{

    top: 0px;

    padding-top: 480px;

    transition: 0.4s ease top, 0.4s 0.4s ease padding , 0.4s ease transform;

}



#navigation-home .container .item:nth-child(1)

{

    background-image: url(../images/home/navigation/chauffage.jpg);  

    background-position: bottom center;

}



#navigation-home .container .item:nth-child(2)

{

    background-image: url(../images/home/navigation/panneaux.jpg);

    background-position: top center;

}



#navigation-home .container .item:nth-child(3)

{

    background-image: url(../images/home/navigation/sanitaires.jpg);

    background-position: bottom center;

}



#navigation-home .container .item:nth-child(4)

{

    background-image: url(../images/home/navigation/piscine.jpg);

    background-position: top center;

}



#navigation-home .container .item

{

    background-position: center bottom;

    background-size: 100%;

    cursor: pointer;

}





#navigation-home.visible .container .item:nth-child(1)::before, 

#navigation-home.visible .container .item:nth-child(2)::before, 

#navigation-home.visible .container .item:nth-child(3)::before, 

#navigation-home.visible .container .item:nth-child(4)::before 

{

    content: "";

    position: absolute;

    top: 0; bottom: 0;

    left: 0 ;right: 0;

    opacity: 0;

    transition: 0.2s ease opacity;

}



#navigation-home.visible .container .item:nth-child(1):hover::before, 

#navigation-home.visible .container .item:nth-child(2):hover::before, 

#navigation-home.visible .container .item:nth-child(3):hover::before, 

#navigation-home.visible .container .item:nth-child(4):hover::before 

{

    transition: 0.2s ease opacity;

    opacity: 1;

}

#navigation-home.visible .container .item:hover
{
    top: 52px;
}

#navigation-home.visible .container .item:nth-child(1)::before{background-color: rgba(255,6,19,0.25);}
#navigation-home.visible .container .item:nth-child(2)::before{ background-color: rgba(255,82,91,0.25);}
#navigation-home.visible .container .item:nth-child(3)::before{ background-color: rgba(0, 115, 112,0.25);}
#navigation-home.visible .container .item:nth-child(4)::before{ background-color: rgba(0, 178, 172,0.25);}



/* ABOUT */


#about-home
{
    padding: 240px 0;
    background-color: #eee;
}



#about-home .description

{

    padding-left: 180px;

    padding-right: 180px;

}



#about-home .description .texte-base

{

    margin: 50px 0;

}



#about-home .panel-colonne .colonne:nth-child(2) img 

{

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    opacity: 0.1;

    width: 870px;

}



#about-home .panel-colonne .colonne:nth-child(2)

{

    position: absolute;

    right: 0;

    height: 100%;

}





@media screen and (max-width: 2200px) 

{



    #section-home-top,

    #section-home-top .colonne:nth-child(1), 

    #section-home-top .colonne:nth-child(2) 

    {

        height: 705px;

    }



    #section-home-top .colonne:nth-child(2) .introduction 

    {

        width: 570px;

        padding-left: 45px;

        padding-bottom: 20px;

        padding-top: 65px;

        margin-top: 55px;

    }



    .bouton-plus {

        width: 65px;

        height: 38px;

    }



    .bouton-plus p 

    {

        font-size: 27px;

        line-height: 38px;

        font-weight: 600;

        margin-left: 15px;

        text-align: left;

        transition: 0.2s ease margin-left;

    }



    .declencheur:hover .bouton-plus p, 

    .bouton-plus:hover p 

    {

        margin-left: 37px;

        transition: 0.2s ease margin-left;

    }



    .texte-base 

    {

        font-size: 18px;

        line-height: 28px;

        font-weight: 400;

    }



    #section-home-top .introduction .texte-base 

    {

        margin: 33px 0;

    }

    .titre-2 

    {

        font-size: 25px;

        line-height: 40px;

        font-weight: 800;

    }



    #section-home-top.visible .colonne:nth-child(2) .introduction 

    {

        left: -90px;

    }



    #section-home-top .introduction h1 

    {

        font-size: 46px;

        line-height: 52px;

    }



    #section-home-top .introduction h1 span 

    {

        display: block;

        font-size: 76px;

        line-height: 82px;

    }





    /* 

    *

    * = NAVIGATION HOME 

    *

    */



    #navigation-home .container .item 

    {

        float: left;

        width: 355px;

        margin: 0 10px;

    }



    #navigation-home .container .item .gap_home_nav

    {

        padding-right: 80px;

    }



    #navigation-home .container .item .titre 

    {

        padding: 20px;

        font-size: 21px;

        line-height: 25px;

    }



    #navigation-home .container 

    {

        height: 440px;

        position: relative;

        padding-bottom: 78px;

        margin-top: -156px;

    }



    #navigation-home.visible .container .item:nth-child(1):hover,
    #navigation-home.visible .container .item:nth-child(2):hover,
    #navigation-home.visible .container .item:nth-child(3):hover,
    #navigation-home.visible .container .item:nth-child(4):hover
    {
        top: 39px;
    }



    #section-home-top .navigation-slider 

    {

        bottom: 156px;

    }



    #navigation-home.visible .container .item:nth-child(1), 

    #navigation-home.visible .container .item:nth-child(3) 

    {

        padding-bottom: 355px;

        top: 78px;

    }



    #navigation-home.visible .container .item:nth-child(2), 

    #navigation-home.visible .container .item:nth-child(4) 

    {

        padding-top: 355px;

    }





    #navigation-home .container .item:nth-child(1),

    #navigation-home .container .item:nth-child(2),

    #navigation-home .container .item:nth-child(3),

    #navigation-home .container .item:nth-child(4)

    {

        top: 214px;

    }



    /*

    *

    * = ABOUT

    *

    */



    #about-home .description 

    {

        padding-left: 135px;

        padding-right: 135px;

    }



    #about-home .description .texte-base 

    {

        margin: 37px 0;

    }



    #about-home .panel-colonne .colonne:nth-child(2) img

    {

        width: 645px;

    }



    #about-home 

    {

        padding: 177px 0;

    }



    

}





@media screen and (max-width: 1700px) 

{



    #section-home-top,

    #section-home-top .colonne:nth-child(1), 

    #section-home-top .colonne:nth-child(2) 

    {

        height: 565px;

    }



    #section-home-top .colonne:nth-child(2) .introduction 

    {

        width: 455px;

        padding-left: 35px;

        padding-bottom: 20px;

        padding-top: 50px;

        margin-top: 45px;

    }



    .bouton-plus 

    {

        width: 50px;

        height: 30px;

    }



    .bouton-plus p 

    {

        font-size: 22px;

        line-height: 30px;

        font-weight: 600;

        margin-left: 10px;

        text-align: left;

        transition: 0.2s ease margin-left;

    }



    .declencheur:hover .bouton-plus p, 

    .bouton-plus:hover p 

    {

        margin-left: 30px;

        transition: 0.2s ease margin-left;

    }



    .texte-base 

    {

        font-size: 16px;

        line-height: 26px;

        font-weight: 400;

    }



    #section-home-top .introduction .texte-base 

    {

        margin: 25px 0;

    }



    .titre-2 

    {

        font-size: 21px;

        line-height: 32px;

        font-weight: 800;

    }



    #section-home-top.visible .colonne:nth-child(2) .introduction 

    {

        left: -70px;

    }



    #section-home-top .introduction h1 

    {

        font-size: 37px;

        line-height: 43px;

    }



    #section-home-top .introduction h1 span 

    {

        font-size: 62px;

        line-height: 66px;

    }



    



    /* 

    *

    * = NAVIGATION HOME 

    *

    */



    #navigation-home .container .item 

    {

        float: left;

        width: 280px;

        margin: 0 10px;

        z-index: 10;

    }



    #navigation-home .container .item .titre 

    {

        padding: 15px;

        font-size: 16px;

        line-height: 21px;

    }



    #navigation-home .container .item .gap_home_nav

    {

        padding-right: 70px;

    }



    #navigation-home .container 

    {

        height: 350px;

        padding-bottom: 62px;

        margin-top: -124px;

    }





    #navigation-home.visible .container .item:nth-child(1):hover, 

    #navigation-home.visible .container .item:nth-child(2):hover, 

    #navigation-home.visible .container .item:nth-child(3):hover,

    #navigation-home.visible .container .item:nth-child(4):hover

    {

        top: 31px;

    }



    #section-home-top .navigation-slider 

    {

        bottom: 124px;

    }



    #navigation-home.visible .container .item:nth-child(1), 

    #navigation-home.visible .container .item:nth-child(3) 

    {

        padding-bottom: 280px;

        top: 62px;

    }



    #navigation-home.visible .container .item:nth-child(2), 

    #navigation-home.visible .container .item:nth-child(4) 

    {

        padding-top: 280px;

    }



    #navigation-home .container .item:nth-child(1), 

    #navigation-home .container .item:nth-child(2), 

    #navigation-home .container .item:nth-child(3), 

    #navigation-home .container .item:nth-child(4) 

    {

        top: 170px;

    }



    /*

    *

    * = ABOUT

    *

    */



    #about-home .description 

    {

        padding-left: 108px;

        padding-right: 108px;

    }



    #about-home .description .texte-base 

    {

        margin: 30px 0;

    }



    #about-home .panel-colonne .colonne:nth-child(2) img

    {

        width: 515px;

    }



    #about-home 

    {

        padding: 140px 0;

    }



    

}



@media screen and (max-width: 1280px) 

{



    #section-home-top,

    #section-home-top .colonne:nth-child(1), 

    #section-home-top .colonne:nth-child(2) 

    {

        height: 535px; /* 355 */

    }



    #section-home-top .colonne:nth-child(2) .introduction 

    {

        width: 380px;

        padding-left: 30px;

        padding-bottom: 40px;

        padding-top: 40px;

        margin-top: 35px;

    }



    #navigation-home .container .item .gap_home_nav

    {

        padding-right: 20px;

    }



    .bouton-plus 

    {

        width: 50px;

        height: 30px;

    }



    .bouton-plus p 

    {

        font-size: 22px;

        line-height: 30px;

        font-weight: 600;

        margin-left: 10px;

        text-align: left;

        transition: 0.2s ease margin-left;

    }



    .declencheur:hover .bouton-plus p, 

    .bouton-plus:hover p 

    {

        margin-left: 30px;

        transition: 0.2s ease margin-left;

    }



    .texte-base 

    {

        font-size: 16px;

        line-height: 26px;

        font-weight: 400;

    }



    #section-home-top .introduction .texte-base 

    {

        margin: 30px 0;

    }



    #section-home-top .introduction .texte-base br

    {

        display: none;

    }



    #section-home-top.visible .colonne:nth-child(2) .introduction 

    {

        left: -55px;

    }



    #section-home-top .introduction h1 

    {

        font-size: 24px;

        line-height: 40px;

    }



    #section-home-top .introduction h1 span 

    {

        font-size: 42px;

        line-height: 45px;

    }



    

    /* 

    *

    * = NAVIGATION HOME 

    *

    */



    #navigation-home .container .item 

    {

        float: left;

        width: 240px;

        margin: 0 5px;

    }



    #navigation-home .container .item .titre 

    {

        padding: 15px;

        font-size: 16px;

        line-height: 18px;

    }



    #navigation-home .container .item .bouton-plus

    {

        display: none;

    }



    #navigation-home .container 

    {

        height: 290px;

        padding-bottom: 64px;

        margin-top: -104px;

    }



    #navigation-home.visible .container .item:nth-child(1):hover,
    #navigation-home.visible .container .item:nth-child(2):hover,
    #navigation-home.visible .container .item:nth-child(3):hover,
    #navigation-home.visible .container .item:nth-child(4):hover
    {
        top: 32px;
    }

    



    #section-home-top .navigation-slider 

    {

        bottom: 104px;

    }



    #navigation-home.visible .container .item:nth-child(1), 

    #navigation-home.visible .container .item:nth-child(3) 

    {

        padding-bottom: 235px;

        top: 52px;

    }



    #navigation-home.visible .container .item:nth-child(2), 

    #navigation-home.visible .container .item:nth-child(4) 

    {

        padding-top: 235px;

    }



    #navigation-home .container .item:nth-child(1), 

    #navigation-home .container .item:nth-child(2), 

    #navigation-home .container .item:nth-child(3), 

    #navigation-home .container .item:nth-child(4) 

    {

        top: 138px;

    }



    /*

    *

    * = ABOUT

    *

    */



    #about-home .description 

    {

        padding-left: 0;

        padding-right: 90px;

    }



    #about-home .description .texte-base 

    {

        margin: 25px 0;

    }



    #about-home .panel-colonne .colonne:nth-child(2) img

    {

        width: 425px;

    }



    #about-home 

    {

        padding: 110px 0;

    }



    

}





@media screen and (max-width: 1024px) 

{



    #section-home-top,

    #section-home-top .colonne:nth-child(1), 

    #section-home-top .colonne:nth-child(2) 

    {

        height: 535px; /* 355 */

    }



    #section-home-top .colonne:nth-child(2) .introduction 

    {

        width: 305px;

        padding-left: 25px;

        padding-bottom: 35px;

        padding-top: 35px;

        margin-top: 30px;

    }



    .bouton-plus 

    {

        width: 50px;

        height: 30px;

    }



    .bouton-plus p 

    {

        font-size: 22px;

        line-height: 30px;

        font-weight: 600;

        margin-left: 10px;

        text-align: left;

        transition: 0.2s ease margin-left;

    }



    .texte-base 

    {

        font-size: 16px;

        line-height: 26px;

        font-weight: 400;

    }



    #section-home-top .introduction .texte-base 

    {

        margin: 25px 0;

    }



    #section-home-top .introduction .texte-base br

    {

        display: none;

    }



    .titre-2 

    {

        font-size: 16px;

        line-height: 22px;

        font-weight: 800;

    }



    #section-home-top.visible .colonne:nth-child(2) .introduction 

    {

        left: -45px;

    }



    #section-home-top .introduction h1 

    {

        font-size: 24px;

        line-height: 40px;

    }



    #section-home-top .introduction h1 span 

    {

        font-size: 40px;

        line-height: 45px;

    }



    

    /* 

    *

    * = NAVIGATION HOME 

    *

    */



    

    #navigation-home .container .item .gap_home_nav

    {

        padding-right: 0px;

    }



    #navigation-home .container .item 

    {

        float: left;

        width: 190px;

        margin: 0 5px;

    }



    #navigation-home .container .item .titre 

    {

        padding: 15px;

        font-size: 16px;

        line-height: 18px;

    }



    #navigation-home .container .item .bouton-plus

    {

        display: none;

    }



    #navigation-home .container 

    {

        height: 255px;

        padding-bottom: 41px;

        margin-top: -82px;

    }



    #navigation-home.visible .container .item:nth-child(1), 

    #navigation-home.visible .container .item:nth-child(3) 

    {

        padding-bottom: 188px;

        top: 41px;

    }



    #navigation-home.visible .container .item:nth-child(2), 

    #navigation-home.visible .container .item:nth-child(4) 

    {

        padding-top: 188px;

    }



    #navigation-home .container .item:nth-child(1), 

    #navigation-home .container .item:nth-child(2), 

    #navigation-home .container .item:nth-child(3), 

    #navigation-home .container .item:nth-child(4) 

    {

        top: 115px;

    }



    /*

    *

    * = ABOUT

    *

    */



    #about-home .description 

    {

        padding-left: 0;

        padding-right: 72px;

    }



    #about-home .description .texte-base 

    {

        margin: 20px 0;

    }



    #about-home .panel-colonne .colonne:nth-child(2) img

    {

        width: 340px;

    }



    #about-home 

    {

        padding: 90px 0;

    }



    

}





@media screen and (max-width: 850px) 

{

	#navigation-home.visible .container .item:nth-child(1):hover,
	#navigation-home.visible .container .item:nth-child(2):hover,
	#navigation-home.visible .container .item:nth-child(3):hover,
	#navigation-home.visible .container .item:nth-child(4):hover
	{
		top: 0px;
	}

    #section-home-top,

    #section-home-top .colonne:nth-child(1), 

    #section-home-top .colonne:nth-child(2) 

    {

        height: auto;

        float: none;

    }



    #section-home-top .colonne:nth-child(1)

    {

        width: 100%;

        height: 71vw;

        float: none;

    }



    #section-home-top .colonne:nth-child(2)

    {

        width: 100%;

        padding-bottom: 25px;

        position: relative;

    }





    #section-home-top .colonne:nth-child(2)::before

    {

        content: "";

        padding-bottom: 25px;

        position: absolute;

        background-color: #eee;

        top: -40px;

        width: calc(50% + 250px);

        height: 40px;

        right: 0;

        z-index: 50;

    }



    #section-home-top .colonne:nth-child(2) .introduction 

    {

        width: 100%;

        padding: 0;

        margin-top: 0;

        left: inherit;

        right: 50px;

        width: 500px;

        margin: 0 auto;

        transition: right 0.4s 0.8s ease;

    }



    #section-home-top.visible .colonne:nth-child(2) .introduction 

    {

        left: inherit;

        right: 0;

        transition: right 0.4s 0.8s ease;

        top: -25px;

        background: transparent;

    }



    #section-home-top .introduction .texte-base 

    {

        margin: 25px 0;

        width: 75%;

        margin-left: auto;

    }



    /*

    *

    * = NAVIGATION HOME

    *

    */



    #navigation-home .container .item 

    {

        float: none;

        width: 100%;

        margin: 0;

    }



    #navigation-home .container 

    {

        padding-top: 0;

        margin-top: 0;

        height: auto;

    }



    #navigation-home.visible .container .item:nth-child(1), 

    #navigation-home .container .item:nth-child(1), 

    #navigation-home.visible .container .item:nth-child(2), 

    #navigation-home .container .item:nth-child(2), 

    #navigation-home.visible .container .item:nth-child(3), 

    #navigation-home .container .item:nth-child(3), 

    #navigation-home.visible .container .item:nth-child(4), 

    #navigation-home .container .item:nth-child(4) 

    {

        bottom: 0;

        top: 0;

        padding-top: 0;

        padding-bottom: 0;

        height: 225px;

        transform: none;

        transition: 0s ease top, 0s ease padding;

    }



    #navigation-home .container .item:nth-child(1) .titre, 

    #navigation-home .container .item:nth-child(3) .titre 

    {

        padding: 25px;

        font-size: 16px;

        line-height: 18px;

        position: absolute;

        width: calc(100% - 50px);

        height: calc(100% - 50px);

        left: 0;

        transition: width 0.4s cubic-bezier(0.77,0,0.175,1);

    }



    #navigation-home .container .item:nth-child(2) .titre, 

    #navigation-home .container .item:nth-child(4) .titre 

    {

        padding: 25px;

        font-size: 16px;

        line-height: 18px;

        position: absolute;

        width: calc(100% - 50px);

        height: calc(100% - 50px);

        right: 0;

        transition: width 0.4s cubic-bezier(0.77,0,0.175,1);

    }





    #navigation-home.visible .container .item:nth-child(1) .titre, 

    #navigation-home.visible .container .item:nth-child(2) .titre, 

    #navigation-home.visible .container .item:nth-child(3) .titre, 

    #navigation-home.visible .container .item:nth-child(4) .titre

    {

        width: calc(55% - 50px);

        transition: width 0.4s cubic-bezier(0.77,0,0.175,1);

    }



    #navigation-home.visible .container .item:nth-child(1) .titre{transition-delay: 0.15s;}

    #navigation-home.visible .container .item:nth-child(2) .titre{transition-delay: 0.3s;} 

    #navigation-home.visible .container .item:nth-child(3) .titre{transition-delay: 0.45s;} 

    #navigation-home.visible .container .item:nth-child(4) .titre{transition-delay: 0.6s;}

    



    #navigation-home .container .item .titre::after

    {

        content: "+";

        color: white;

        position: absolute;

        bottom: 16px;

        right: 25px;

    }



    #navigation-home.visible .container .item:nth-child(1), 

    #navigation-home.visible .container .item:nth-child(3)

    {

        background-size: 50%;

        background-position: right;

    }

 

    #navigation-home.visible .container .item:nth-child(2), 

    #navigation-home.visible .container .item:nth-child(4) 

    {

        background-size: 50%;

        background-position: left;

    }



    #navigation-home .container .item:nth-child(1) .titre, 

    #navigation-home .container .item:nth-child(2) .titre, 

    #navigation-home .container .item:nth-child(3) .titre, 

    #navigation-home .container .item:nth-child(4) .titre 

    {

        font-size: 26px;

        line-height: 32px;

    }



    #navigation-home .container .item .titre .couleur-0

    {

        max-width: 275px;

    }





    /*

    *

    * = ABOUT

    *

    */



    #about-home 

    {

        padding: 70px 0;

    }



    #about-home .titre-2 

    {

        font-size: 20px;

        line-height: 26px;

        font-weight: 800;

    }



    #about-home .panel-colonne .colonne:nth-child(1),

    #about-home .panel-colonne .colonne:nth-child(2)

    {

        width: 100%;

        position: relative;

    }



    #about-home .panel-colonne .colonne:nth-child(2) 

    {

        display: none;  

    }



    #about-home .description 

    {

        padding-right: 0;

    }



    

}



@media screen and (max-width: 600px) 

{ 

    .titre-2 

    {

        font-size: 16px;

        line-height: 20px;

    }



    #section-home-top .introduction h1 

    {

        font-size: 24px;

        line-height: 29px;

    }



    #section-home-top .introduction h1 span 

    {

        font-size: 36px;

        line-height: 40px;

    }



    #section-home-top .colonne:nth-child(2) .introduction 

    {

        right: 50px;

        width: 100%;

    }



    #section-home-top.visible .colonne:nth-child(2) .introduction 

    {

        right: 30px;

        transition: right 0.4s 0.4s ease;

    }



    #section-home-top .colonne:nth-child(2)::before 

    {

        content: "";

        padding-bottom: 25px;

        position: absolute;

        background-color: #eee;

        top: -45px;

        width: calc(100% - 30px);

        height: 45px;

        right: 0;

    }



    #section-home-top .colonne:nth-child(2) .introduction 

    {

        top: -10px;

    }



    /*

    *

    * = NAVIGATION HOME

    *

    */



    #navigation-home .container

    {

        width: calc(100% - 60px);

    }



    #navigation-home .container .item:nth-child(1) .titre, 

    #navigation-home .container .item:nth-child(2) .titre, 

    #navigation-home .container .item:nth-child(3) .titre, 

    #navigation-home .container .item:nth-child(4) .titre 

    {

        font-size: 20px;

        line-height: 20px;

        padding: 15px;  

    }



    #navigation-home.visible .container .item:nth-child(1), 

    #navigation-home .container .item:nth-child(1), 

    #navigation-home.visible .container .item:nth-child(2), 

    #navigation-home .container .item:nth-child(2), 

    #navigation-home.visible .container .item:nth-child(3), 

    #navigation-home .container .item:nth-child(3), 

    #navigation-home.visible .container .item:nth-child(4), 

    #navigation-home .container .item:nth-child(4) 

    {

        bottom: 0;

        top: 0;

        padding-top: 0;

        padding-bottom: 0;

        height: 39.62vw;

        transform: none;

    }



    #navigation-home .container .item:nth-child(1) .titre, 

    #navigation-home .container .item:nth-child(3) .titre, 

    #navigation-home .container .item:nth-child(2) .titre, 

    #navigation-home .container .item:nth-child(4) .titre 

    {

        height: calc(39.62vw - 30px);

        width: calc(100% - 30px);

    }





    #navigation-home.visible .container .item:nth-child(1) .titre, 

    #navigation-home.visible .container .item:nth-child(2) .titre, 

    #navigation-home.visible .container .item:nth-child(3) .titre, 

    #navigation-home.visible .container .item:nth-child(4) .titre

    {

        width: calc(55% - 30px);

        transition: width 0.4s cubic-bezier(0.77,0,0.175,1);

    }



    #navigation-home.visible .container .item:nth-child(1) .titre{transition-delay: 0.15s;}

    #navigation-home.visible .container .item:nth-child(2) .titre{transition-delay: 0.3s;} 

    #navigation-home.visible .container .item:nth-child(3) .titre{transition-delay: 0.45s;} 

    #navigation-home.visible .container .item:nth-child(4) .titre{transition-delay: 0.6s;}

    



    #navigation-home .container .item .titre::after

    {

        content: "+";

        color: white;

        position: absolute;

        bottom: 7px;

        right: 15px;

    }







    #navigation-home .container .item .titre .couleur-0

    {

        max-width: 145px;

    }



    /*

    *

    * = ABOUT

    *

    */



    #about-home 

    {

        padding: 50px 0;

    }



    #about-home .container

    {

        width: calc(100% - 60px);

    }



    #about-home .panel-colonne .colonne:nth-child(2) 

    {

        display: none;  

    }

}



#eno_home #section-enoprimes 

{

    background-color: white;

}
