@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
*{
    margin:0;
    padding:0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}
.container .logo{
    color:#9fb95e;
    padding:2rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.container .logo div{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.container .logo div h6{
    padding-top:1rem;
    color:#838383;
}
.supply .logo{
    color:rgb(23,39,61)
}
.container div ul{
    padding:0;
    border-top:1px solid #EEE;
    list-style-type: none;
    display:flex;
    font-size:1rem;
    position: relative;
    z-index: 2;
}
.container div ul li{
    /* padding:1rem 0; */
    width:100%;
    height: fit-content;
    display: flex;
    flex-direction: column;
    /* align-items: center; */
    transition: all .3s .1s ease;
    color:#6b6b6b;
}
.container div ul li .link{
    text-decoration: none;
}
.container div ul li:hover{
    border-top:4px solid #9fb95e;
    cursor:pointer;
}
.supply div ul li{
    font-size: 1rem;
}
.supply div ul li:hover{
    border-top:4px solid rgb(23,39,61);
    color:rgb(23,39,61);
    cursor:pointer;
}
.container div ul li:not(:last-child){
    border-right:1px solid #EEE;
}
.container div ul li:first-child{
    color:rgb(23,39,61);
}
.container div ul li:first-child, .container div ul li:last-child{
    width:fit-content;
    padding:0rem .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.container div ul li .supply{
    color:rgb(23,39,61);
}






.acceuil{
    height:100vh;
    margin-top:3rem;
    /* background-image: url('photo1.jpg');
    background-size: 100% 100%; */
}
.acceuil2{
    height:90vh;
    background-size: 100% 100%;
    margin-bottom: 3rem;
}
.acceuil .container, .acceuil2 .container{
    z-index: 0;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.acceuil2 .container div:first-child{
    background-image: url('B.jpg');
    background-size: 100% 100%;
    height:90vh;
    width:50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.acceuil .container div:first-child{
    background-image: url('Assetmaintenace.jpg');
    background-size: 100% 100%;
    height:90vh;
    width:50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.acceuil2 .container div:last-child{
    height:90vh;
    width:50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.acceuil .container div:last-child{
    height:90vh;
    width:50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.acceuil .container div h1{
    text-align: center;
    z-index: 1;
    color:white;
    font-weight: bolder;
}
.acceuil2 .container div h1{
    z-index: 1;
    color:white;
    font-weight: bolder;
}
.acceuil .container div p{
    z-index: 1;
    color:white;
    font-size:2.5rem;
    text-align: center;
}
.acceuil2 .container div p{
    z-index: 1;
    color:rgb(23,39,61);
    font-size:5rem;
}
.acceuil2 .container div:first-child p{
    text-align: center;
    z-index: 1;
    color:rgb(23,39,61);
    font-size:5rem;
}
.acceuil .container button{
    background-color: rgb(46, 46, 46);
    padding:.7rem 5rem;
    transition: all .2s .1s ease;
}
.acceuil .container button:hover{
    background-color:#191919;
}
.acceuil .container button a{
    font-weight: 700;
    letter-spacing: 3px;
    text-decoration: none;
    color:#9fb95e;
    transition: all .2s .1s ease;
}
.acceuil .container button a:hover{
    text-decoration: underline;
}


.who-are-we{
    text-decoration: none;
    padding:5rem 0;
    color:#838383;
    display:flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}
.who-are-we img{
    width:40%;
    height:288px;
}
.who-are-we div{
    width:40%;
}
.who-are-we div h2{
    padding:0;
    color:#9fb95e;
    font-weight: 700;
}
.who-are-we div p span{
    color:#9fb95e;
    font-weight: bold;
}



#one, #three, #five, #seven{
    color:#9fb95e;
    /* text-align: center; */
}
#s1, #s3, #s5, #s7{
    color:rgb(23,39,61);
    /* text-align: center; */
}
#two, #four, #six, #eight{
    background-color: #EEE;
    padding-top:1rem;
    color:#9fb95e;
    display: none;
}
#s2, #s4, #s6, #s8{
    background-color: #EEE;
    padding-top:1rem;
    color:rgb(23,39,61);
    display: none;
}
#two div, #four div, #six div, #eight div, #s2 div, #s4 div, #s6 div, #s8 div{
    padding:.3rem;
    border-bottom: 1px solid #CCC;
}
#two div:hover, #four div:hover, #six div:hover, #eight div:hover, #s2 div:hover, #s4 div:hover, #s6 div:hover, #s8 div:hover{
    background-color: #EEE;
    padding:.3rem;
    border-bottom: 1px solid #CCC;
}
.maintenance{
    padding:3rem 0;
    background-color: #F7F7F7;
}
.maintenance .container{
    display: flex;
    justify-content:space-between;
    align-items: center;
}
.maintenance .container div{
    width:50%;
    color:#6b6b6b;
    /* width:100%; */
    display:flex;
    flex-direction: column;
    justify-content: space-between;
}
.maintenance .container .uman{
    /* width:50%; */
    height:320px;
    margin-left:1.5rem;
    margin-bottom:.1rem;
}
.maintenance div h4{
    color:#9fb95e;
    margin-bottom: 2rem;
}
.maintenance div p{
    font-size: 1rem;
}
.supply-who div h4{
    color:rgb(23,39,61);
}
.supply-who div .ajouter{
    width:100%
}
.supply-who div .ajouter div{
    /* padding:.5rem; */
    width: 100%;
    display: flex;  
    flex-direction: row; 
    justify-content: flex-start;
    align-items: center;
}
.supply-who div .ajouter div p{
    margin:0;
}
.supply-who div .ajouter div img{
    margin-right:1rem;
    margin-left:0
}
.maintenance div span{
    color:#9fb95e;
    font-weight: 700;
}

.supply-who div span{
    padding:1rem 0;
    color:rgb(23,39,61);
    font-weight: 700;
}

.why2{
    display:flex;
    justify-content: space-between;
    align-items: center;
    padding:5rem 0;
}
.why2 img{
    margin-top: 5rem;
}
.why2 div{
    width:50%;
}
.why2 div h4{
    color:#9fb95e;
    padding:2rem 0;
}
.why2-supply div h4{
    color:rgb(23,39,61);
    padding:2rem 0;
}
.why2 div p{
    color:#6b6b6b;
}
.why2 div p span{
    font-weight: 700;
}
.why2 img{
    align-self: flex-start;
}


.mission, .secteurs{
    background-color: #F7F7F7;
    padding:5rem 0;
}
.mission .container{
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.mission .container div{
    display: flex;
    width: 50%;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.mission .container h4{
    padding-bottom:3rem;
    color:#9fb95e;
}
.mission .container p{
    /* padding: 0 6rem; */
    /* text-align:center; */
    color:#6b6b6b;
}
.mission .container img{
    margin-top:4rem;
    height:300px;
}

.secteurs h4{
    text-align: center;
    /* padding-bottom:3rem; */
    color:#6b6b6b;
}
.secteurs .container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}


.secteurs .container div{
    /* background-image: url('construction.jpg'); */
    /* background-size: 250px 250px; */
    cursor: pointer;
    width:200px;
    height:200px;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* justify-content: space-evenly; */
    background-color: white;
    border-radius: 50%;
    font-weight: 700;
    /* padding:1rem 1rem; */
}
.secteurs .container div img{
    border-radius: 50%;
    height: 200px;
}

.secteurs .container div p{
    text-align: center;
}
.footer{
    background-color:white;
    color:#013b36;
}
.footer .container{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.footer .container div{
    padding:1rem 0;
}
.footer .container div .logo{
    font-weight: bold;
    color:#9fb95e;
}
.copyright{
    margin: 0;
    padding:1rem 3rem;
    background-color: #9fb95e;
    color:white;
}
.footer .footer-divs{
    color:#013b36;
}

.valeurs h4{
    text-align: center;
    padding:2rem 0;
    color:#9fb95e;
}
.valeurs .values{
    padding:2rem 0;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}
.valeurs .values div{
    background-color: #F7F7F7;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding:1rem;
    border:1px solid #F5F5F5;
}
.valeurs .values div p{
    padding-top:2rem;
    font-weight: bold;
    color:#6b6b6b;
}



.img{
    height:80vh;
    background-image: url('photo6.jpeg');
    background-size: 100% 80vh;
}

.p{
    color:#838383;
    padding:6rem 0;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.rein{
    display: flex;
    min-height: 100vh;
    background-color: #F7F7F7;
}
.rein .photo{
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.rein .photo h1{
    color:#9fb95e;
    text-align: center;
}
.rein .info{
    padding:3rem 3rem;
}
.rein .info div{
    padding-top:3rem;
    display: flex;
    /* justify-content: space-between; */
    align-items: center;
}
.rein .info div p:first-child{
    width:200px;
    height: 200px;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    color:white;
    background-color: #9fb95e;
    padding:2rem;
}
.rein .info div p:last-child{
    padding-left:5rem;
    width:500px;
    color:#838383
}
.rein .info div .vies{
    color:#838383;
    margin:3rem 0;
    padding:0 5rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: start;
}
.rein .info div .vies div{
    padding:.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.rein .info div .vies div img{
    margin-right: 1rem;
}


.contactez-nous{
    height: 90vh;
    margin:3rem 0;
}
.contactez-nous .c1{
    display:flex;
    height: 50%;
}
.contactez-nous .c1 div{
    width:50%;
}
.contactez-nous .c1 .c2-txt1, .contactez-nous .c1 .c2-txt2{
    background-color: rgb(23,39,61);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.contactez-nous .c1 .c2-txt1 h2, .contactez-nous .c1 .c2-txt2 h2{
    font-size:1.5rem;
    padding:1rem;
    color:#9fb95e;
    font-weight: bold;
    margin-bottom: 2rem;
}
.contactez-nous .c1 .c2-txt1 button, .contactez-nous .c1 .c2-txt2 button{
    border:1px solid #9fb95e;
    padding:.5rem 1rem;
    border-radius: 5px;
    background-color: #9fb95e;
    color:white;
    transition: all .3s .1s ease;
}
.contactez-nous .c1 .c2-txt1 button:hover, .contactez-nous .c1 .c2-txt2 button:hover{
    background-color: white;
    color:#9fb95e;
    border:1px solid #9fb95e;
}
.contactez-nous .c1 .c2-txt1 button a:hover, .contactez-nous .c1 .c2-txt2 button a:hover{
    color:#9fb95e;
}
.contactez-nous .c1 .c2-img1{
    background-image: url('gcl1.jpg');
    background-size: cover;
}
.contactez-nous .c1 .c2-img2{
    background-image: url('gcl2.jpeg');
    background-size: 100% 100%;
}