.c,.cc,.c8,.c6,.c7,.head, .content .box{width: 100%;}

.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}
    .content{padding: 0 20px}

    header{width: 100%;padding:10px}
    .logo, .logo-big{ height: 35px;}
    header .char {margin-left: 0;}

    header .btn{display: none;}

    span.menu-res{display: block;width: 40px;height: 40px;padding: 7px;font-size: 1.7em;margin-top: 11px;position: absolute;top: 0;right: 10px;background-color: var(--cl4);color: var(--cl1);transition: 0.15s linear; text-align: center;cursor: pointer;z-index: 9999}
    span.menu-res::before{content: "n";width: 40px;height: 40px;display: block;position: absolute;top: 6px;right: 0;}
    .mn span.menu-res::before{content: "r";}
    .mn span.menu-res{right: 20px}
    .mn .menu-res{right: 250px}
    .mn nav{right:0;}
    header nav{position: fixed;overflow:hidden;padding-top: 30px;overflow-y:auto;height:100%;right:-100%;top: 0;width: 100%!important;background-color: var(--cl4);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 var(--cl3-light);padding: 0 10px;}
    header nav ul li:hover{background: transparent}
    header nav ul li a{display:block;color:var(--cl1);font-size: 1.2em;}
    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(--cl3)}
    header nav ul li ul li:first-child a{padding-top: 0;}
    header nav ul ul li a:hover{color: var(--cl3); }

    .caroussel{text-align: center;height: auto}
    .caroussel .masq{display: block;padding: 70px 20px 0;width: 100%}
    .caroussel h1, .team .cnt span{font-size: 2em;}
    .caroussel .child img, .caroussel video{height: 500px;}

    .caroussel .seeMore{position: relative;width: 90%;left: 5%}
    .caroussel .seeMore h2{font-size: 1.3em;}
    
    .caroussel .gla_slider .slider_btn{bottom: 65px;color: #fff;background-color: var(--cl3)}
    .gla_slider .slider_btn{font-size: 2em}
    .gla_slider .previos_btn{right: 55px;}

    .page h1{margin: 40px 0 10px !important}
    .page .grid6{padding: 10px;display:grid;grid-template-columns: repeat(3, calc( calc(100% / 3) - 8px )[col-start]);grid-gap:10px}

    .image-p{height: 100px;}

    .btn{font-size: 1.1em;}
    .pt100{padding-top: 40px;}
    .pb100{padding-bottom: 40px;}
    .m_px10{padding: 0 10px;}

    .c2 .grid4{padding: 10px;}

    .c3 video{width: 100%;height: 280px;padding: 20px 20px 0}
    .c3 .p50{padding: 20px;}

    .realisation .cnt{width: 90%;}

    
    .contact.pb80{padding-bottom: 0}
    .contact .c{padding: 0 20px;}

    .content{font-size: 1.1em;}
    .content h2{font-size: 1.7em;}
    
    footer .c{padding: 30px 20px;}
    footer ul{margin-bottom: 30px}

}