.c,.cc,.c8,.c6,.c7,.head, .content .box{width: 100%;padding: 0}

.content{display: block}

span.menu-res{display: none}
.cont,aside{width: 100%}


@media (max-width : 960px) {

    .flex{display: block}
    .content .c{display: block;padding: 0 20px}

    header{width: 100%;padding:10px}
    header,footer .logo{ margin-top: 5px;}
    header .char {margin-left: 0;}

    header .btn{margin-left: 0;margin-top: 10px;}
    .logo{height: 40px;}
    header .flex-end{justify-content: flex-start;}

    span.menu-res{display: block;width: 50px;height: 50px;margin-top: 11px;position: absolute;top: 0;right: 20px;background-color: #fff;transition: 0.15s linear; text-align: center;border-radius: 15px;}
    .mn .menu-res{right: 250px}
    .mn nav{right:0;}
    header nav{position: fixed;overflow:hidden;overflow-y:auto;height:100%;right:-250px;top: 0;width: 250px!important;background-color: #fff;box-shadow: 0 0 6px rgba(0,0,0,0.6);transition: 0.15s linear;}
    header nav ul{display: block;padding: 0}
    header nav ul li{display: block;border-bottom: 1px solid #eee;padding: 10px;}
    header nav ul li:hover{background: transparent}
    header nav ul li a{padding: 10px;display:block;color:var(--cl2)}
    header nav ul li a span.icon2{display: none}
    header nav ul li ul{position: relative;margin-left: 20px;box-shadow: none;left: 0;display: block;padding: 0;background-color: transparent !important;}
    header nav ul li ul li{border-bottom: none}
    header nav li ul h3,header nav li ul .top{display: none}
    header nav li ul .mn,header nav li ul li{width: 100%;margin-right: 5px}
    header nav ul li ul li a{color:var(--cl2)}
    header nav ul ul li a:hover{color: var(--cl3); }


    .contact-img {height: auto;width: 100%;}
    /* .contact .grid3{display: flex;} */

    .caroussel{text-align: center;height: 900px;}
    .caroussel .masq{width: 100%;height: 100%;}
    .caroussel .masq div{width: 100%; margin-top: 70px;}
    .caroussel h1{font-size: 2em;}
    .caroussel span{ font-size: 1em;}
    .caroussel a {display: block; margin-bottom: 20px; padding: 15px 15px; margin-right: 50px; margin-left: 50px;}
    .caroussel .child img{height: auto;width: 80%;}


    
    .c6 .masq {display: flex; justify-content: center;}
    .c6 .masq h1{font-size: 3.5em;}
    /* .c6 .border-up::before{right: 8px;}
    .c6 .border-up::after{right: 8px;}
    .c6 .border-down::after{left: 8px;} 
    .c6 .border-down::before{left: 8px;}  */

    .border-up::before{right: 8px;}
    .border-up::after{right: 8px;}
    .border-down::after{left: 8px;} 
    .border-down::before{left: 8px;} 

    .c7 .flex{ display: flex;}
    
    .c7{height: auto;}
    .box{margin: 10px 20px;box-shadow: rgba(17, 12, 46, 0.15) 0px 5px 50px 0px;}
    .box .flex{display: flex;}
    /* .facade img{width: 100%;} */
    .about-img{top:44px; right: -99px;}
    .facade-img{bottom:44px; left: -99px;}

    .c .col-5{margin-bottom: 40px;margin-top: 40px;}
    .c .p40{padding: 20px;}
    /* .c{ padding-top: 80px; padding-bottom:60px ;} */
    .cc{ padding: 20px}

    .projet img {width: 100%; margin: 0;}
    .page .mr40{margin:0px  ; padding: 10px; text-align: center; }
    .page .contact-form{padding: 10px; }
    .page .adr{padding: 10px;text-align: center;}
    .page .adr .mt20{margin-bottom: 50px;}
    .page .map{width: 100%; margin:0; }
    #about .content{padding: 20px;}
    .realisation{height: 400px;}
    .realisation .title{font-size: 1em;}

    .c7.cover-static{height: 200px;}

    .fz4{font-size: 2.5em;}

    .bigText{overflow: hidden;position: relative;}
    
    .c2 .img, .c2 .img-clip, .steps .img,.steps .img-clip{width: 100% !important}
  
    .c2 .img-clip{background-size: 100%;height: 320px; background-repeat: no-repeat;};

    .c5{padding: 20px;}
    .c5 .flex{display: flex;flex-wrap: wrap;flex-direction: column-reverse;}
    .c5 .flex > div{width: 100%;margin-bottom: 20px;}
    .c5 .flex > div.mt70{margin-top: 0}
    .c4 .c > div{margin-bottom: 20px;}
    #contact{padding: 60px 20px;}
    .c4 .mt15p{ margin-top: 25%;}
    .c4 .h1{ font-size: 1.5em;}
    .c4 .p{ font-size: 0.5em;}

    .contact .col-5{margin-bottom: 20px}

    .page .service{margin-bottom: 30px}
    /* .page h1{font-size: 1.5em;margin-bottom: 30px!important} */

    .ovf-h { overflow: hidden;}

    .gla-form .group{display: block}
    .gla-form .group input[type=text], .gla-form .group input[type=email]{width: 100%}
    .gla-cptch{margin: 20px 0}
    .about::after{left: -10px;}

    .mc{ margin: 0; padding: 20px;}
  
    .mbox {display: flex;}

    .avis.flex {display: flex;}
    .heading2 h1{font-size: 3em; padding-top: 120px ; }
    .page .cont table tr:first-child {font-size: 1.5em;}
    .g h1{font-size: 3em;}
    .contact {padding: 20px 0;}
    footer{padding: 30px;}
    footer img{margin-bottom: 30px}
    footer .business{ justify-content: center; display: flex;}
    footer .child{width: 100%}
    footer .c{display: block;}
    footer .c>div{margin-bottom: 40px;width: 100%}
    footer .c>div a{margin-bottom: 20px;}
    footer .imobile{display: flex;}
    footer .c{padding-top: 0; padding-bottom: 0%;}

}

