.text-blue{
  color: blue !important;
}

.text-yellow{
  color: yellow;
}

.text-bluee{
  color: #0e90d2;
}

.text-violet{
    color: #7d5fff;
}

.text-maroon{
    color: #8b0000;
}
.anim{
  opacity: 0;
    transform: translateY(180px);

}

.crea-contain {
    margin-bottom: 150px;
}

/*********************************************Errors ********************************************************/

@import url('https://fonts.googleapis.com/css?family=Fira+Mono:400');

.err{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 85vh;
    margin: 0;
    flex-direction: column;
    font-family: 'Fira Mono', monospace !important;

}
.err .butt {
    margin-top: 100px;
    position: inherit;
    width: auto;
    padding: 10px;
    border-radius: 0px;
}
.err div{
    letter-spacing: -7px;
    font-size: 250px;
    color: #fff;
    animation: glitch 1s linear infinite;
}

@keyframes glitch{
    2%,64%{
        transform: translate(2px,0) skew(0deg);
    }
    4%,60%{
        transform: translate(-2px,0) skew(0deg);
    }
    62%{
        transform: translate(0,0) skew(5deg);
    }
}

.err div:before,
.err div:after{
    content: attr(title);
    position: absolute;
    left: 0;
}

.err div:before{
    animation: glitchTop 1s linear infinite;
    clip-path: polygon(0 0, 100% 0, 100% 33%, 0 33%);
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 33%, 0 33%);
}

@keyframes glitchTop{
    2%,64%{
        transform: translate(2px,-2px);
    }
    4%,60%{
        transform: translate(-2px,2px);
    }
    62%{
        transform: translate(13px,-1px) skew(-13deg);
    }
}

.err div:after{
    animation: glitchBotom 1.5s linear infinite;
    clip-path: polygon(0 67%, 100% 67%, 100% 100%, 0 100%);
    -webkit-clip-path: polygon(0 67%, 100% 67%, 100% 100%, 0 100%);
}

@keyframes glitchBotom{
    2%,64%{
        transform: translate(-2px,0);
    }
    4%,60%{
        transform: translate(-2px,0);
    }
    62%{
        transform: translate(-22px,5px) skew(21deg);
    }
}
/*********************************************Fin Errors ********************************************************/



/*.ball{*/
/*    position: fixed;*/
/*    border:grey 1px solid;*/
/*    width:50px;*/
/*    height:50px;*/
/*    border-radius:100px;*/
/*    z-index: 1;*/

/*}*/
.p-6{
    transform: translate(70px,70px);
    min-height: 300px;
}
.snap {
    overflow-y: scroll;
    overflow-x: hidden;
    scroll-snap-type: y mandatory;
    height: 100vh;
}

.child {
    scroll-snap-align: start;
}
/*********************************************************************Slider projet*******************************************************************************/

.mouse {
    max-width: 2rem;
    width: 100%;
    height: auto;
    position: relative;
}
.scroll {
    animation-name: scroll;
    animation-duration: 1.5s;
    animation-timing-function: cubic-bezier(0.65, -0.55, 0.25, 1.5);
    animation-iteration-count: infinite;
    transform-origin: 50% 20.5px;
    will-change: transform, opacity;
    opacity: 1;
}
.scroll-link {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
}
@keyframes scroll {
    0%, 20% {
        transform: translateY(0) scaleY(1);
    }
    100% {
        transform: translateY(36px) scaleY(2);
        opacity: 0;
    }
}


/*********************************************************************Fin slider projet*******************************************************************************/

/*********************************************************************Navbar complète*******************************************************************************/
.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    right: 0;
    background-color: #202020;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}
#main {
    margin: 0;
    padding: 0;

}

#main {
    transition: all .5s;
}
.sidenav a {
    padding: 5px 5px 5px 25px;
    transition: 0.3s;
}

.sidenav a:first-child {
   color: white;
}
.sidenav li {
    list-style: none;
    margin-top: 15px;
}


.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

.navHide{
    opacity:0;
}

.nav-item .nav-link{

    font-size: 18px;
    text-decoration: none;
    color: #FFFFFF;
    opacity: .8!important;
    text-shadow: transparent ;

}

.navbar {
    height: 70px;
}
/****Trait en dessous des liens*****/
.nav-item .nav-link,
.nav-item .nav-link:after,
.nav-item .nav-link:before {
    transition: all .3s ease-in-out;
}
.sidenav .nav-item .nav-link,
.sidenav .nav-item .nav-link:after,
.sidenav .nav-item .nav-link:before {
    transition: all .3s ease-in-out;
}

.nav-item .nav-link
{
    position: relative;

}

.sidenav .nav-item .nav-link
{
    position: relative;

}
nav {
    background: transparent;
    position: fixed;
    transition: all .5s;
}

.z-depth-1, nav, .card-panel, .card, .toast, .btn, .btn-large, .btn-floating, .dropdown-content, .collapsible, .side-nav {
     box-shadow: none !important;
}

.navbar-expand-md .navbar-nav .nav-link {
    padding-left: 0;
    padding-right: 0;
    margin-left:40px;
    margin-right:40px;

}
.navbar-expand-md .navbar-collapse {

    /*margin-top: 10px;*/
}


.sidenav .nav-item .nav-link:after{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top:20px;
    margin: auto;
    width: 0%!important;
    content: '.';
    color: transparent;
    background: #FFFFFF;
    height: 1.5px;
}

.nav-item .nav-link:after{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top:20px;
    margin: auto;
    width: 0%;
    content: '.';
    color: transparent;
    background: #FFFFFF;
    height: 1.5px;
}

button:focus {

    background-color: inherit;
}

.nav-item .nav-link:hover:after {
    width: 100%;
}
.sidenav .nav-item .nav-link:hover:after {
    width: 100%;
}


/**fin   Trait en dessous des liens******/

.nav-item .nav-link:hover
{
    opacity: 1!important;
    text-shadow: 0 0 10px #fff,
    0 0 20px #fff,
    0 0 40px #fff !important;
    background: transparent;

}


.acti{
    opacity: 1 !important;
    text-shadow:0 0 10px #fff,
    0 0 20px #fff,
    0 0 40px #fff !important;
    font-family: HelveticaMedium!important;
}

.nav-item .acti:after{
    width: 100%;
}
.sidenav .nav-item .acti:after{
    width: 100%;
}

.activeNav {
    display: block !important;
}

.navbar-toggler {
    opacity: 0.7;
    transition: all .5s ease-in-out;
}

.navbar-toggler:hover{
    opacity: 1;
}



/*********************************************************************  Fin Navbar complète*******************************************************************************/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***//*********************************************************************  Slider Home*******************************************************************************/

.Section-home  h1 {
    position: absolute;
    bottom: 50px;
    width: 100%;
    text-align: center;
    font-size: 1.7rem;
    font-family: HelveticaMedium!important;
    color: #fff;
}

.agen {
    position: absolute;
    bottom: 18px;
    left: 20px;
}

.agen span:first-child {
    font-size: 1.7rem;
    color: #fff;
}

.agen span:last-child {
    font-size: 1.7rem;
    color: #fff;
    line-height: 1.2;
    font-family: HelveticaMedium!important;
}

#home-slider .slick-slide .background-zoom {
    height: 100vh;
    outline: none;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

#home-slider .slick-slide.slick-active.deactivate-zooming .background-zoom {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}
#home-slider .slick-slide .background-zoom {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: transform 7s ease-in-out;
    -webkit-transition: -webkit-transform 7s ease-in-out;
    transition: -webkit-transform 7s ease-in-out;

}
#home-slider .slick-slide.slick-active .background-zoom {
    -webkit-transform: scale(1);
    transform: scale(1);
}
.show .slick-dots {
    position: relative !important;
    width: auto;
    text-align: left;
    bottom: 0;
}

.bgC .slick-dots {
    position: relative !important;
    width: auto;
    text-align: left;
    bottom: 0;
}
.slickCall2 .slick-dots {
    position: relative !important;
    width: auto;
    bottom: 0;
}
.slickCall3 .slick-dots {
    position: relative !important;
    width: auto;
    bottom: -20px;
    text-align: start;
}
.slickCall3 .slick-dots li{
    margin: 0 5px;
}


.slick-dots li {
    margin-right:2px;
}

.slick-dots {
    bottom: 20px;
}

.slick-dots li.slick-active button:before {
    background-color: #fff;
    color: transparent;
}

.slick-dots li button:before {
    background: transparent ;
    border: solid 1px #fff ;
    margin: 0 2px ;
    height: 20px ;
    width: 20px ;
    border-radius: 50%;
    color: transparent;
    transition: all 0.5s ease-in-out;
}

/*********************************************************************Fin  Slider Home***********************************************************************************/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/****************************************************************** Début Création **************************************************************************************/
.container-fluid {
    width: 100%;
    padding-right: 0px!important;
    padding-left: 0px!important;
    margin-right: auto;
    margin-left: auto;
}
.tt1{
    color: #fff;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    opacity:0;
    background-color: transparent;
    -webkit-transition:opacity .7s ease-in-out;
    transition:opacity .7s ease-in-out;
    line-height: 1.1;
    letter-spacing: 3px;

}
.animated:hover .tt1 {
    opacity:1;
}

.big{
    margin: 0;
    font-family: HelveticaMedium!important;
    font-size: 30px;
}

.little{
    align-self:flex-start;
    margin: 0;
    font-size: 20px;
}
 .creation {
    -webkit-transition: .7s ease-in-out;
    transition: .7s ease-in-out;
}
.animated:hover .creation {
    opacity: .3;
}
.loader {
    border: 4px solid #121216;
    border-radius: 50%;
    border-top: 4px solid grey;
    border-bottom: 4px solid grey;
    width: 40px;
    height: 40px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.content1,.content2,.content3 {

    height: 100vh;
    z-index: -1;
    background-size: cover!important;
    background-repeat: no-repeat!important;
    background-position: center center!important;
    border: 15px solid #202020;

}




/****************************************************************** Fin Création **************************************************************************************/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/*Page Actualité    (Alex)*/
.no-gutter {
    padding-right:0;
    padding-left:0;
}
.img-fluid2{
    width:100%;

}
.bg{
    position: relative;
    width: 100%;
    height: 100vh;
    display: flex;

}
.bgC{
    position: relative;
    width: 100%;
    height: auto;

}
.bloc1 {
    width: 100%;
    height: 100vh;
    padding-left: 11%;
    padding-right: 11%;
}

.bgC2 {
    position: relative;
    width: 100%;
    height:auto;
}
.bgC3 {
    position: relative;
    width: 100%;
    height: auto;
}


.bloc1 h1 {
    font-size: 64px;
    letter-spacing: 3px;

}
.bloc11 h1 {
    font-size:65px;
    letter-spacing: 12px;
    font-family: HelveticaMedium;
}



.bloc3 {
    padding-top: 70px;

}
.bloc3 div:nth-child(1) {

   padding-right: 50px;
}
.bloc3 span{
    font-size: 45px;
    line-height: 1.2;
}

.bloc3 p{
    line-height: 1.1;
    font-size: 24px;
    color: #ababab;
}

.bloc4{
    padding-top: 95px;
}


.bloc5 h1 {
    padding-top: 50px;
    padding-bottom: 50px;
    font-size: 42px;
    margin: auto;
    text-align: center;
    width: 60%;
}
.bloc6 p {
    padding-top: 71px;
    font-size: 21px;
    color: #BABABA;
    margin: auto;
    text-align: center;
    width: 85%;
}
.bloc7{
    padding-top: 70px;
}
.bloc7 div:nth-child(2) img {
    height: 100%;

}
.t-paysage {
    padding-top: 50px;
    padding-bottom: 50px;
}
.bloc8{

}
.portrait{
    padding-top: 90px;

}


.bloc8 div:nth-child(2) {
    padding-left: 110px;
    padding-right: 220px;

}
.bloc8 span {
        font-size: 60px;
    color: #c7c7c7;
    line-height: 1.3;

}
.bloc8 p {
        font-size: 24px;
        color: #797979;
    line-height: 1.1;

}




.bgC h1{
    font-size: 50px;
    letter-spacing: 10px;
}
.bgC2 h1{
    font-size: 50px;
    letter-spacing: 7px;
}
.tt {

}
.titreCreation {
    font-family: HelveticaMedium;
    font-size: 20px;
    color:#c7c7c7;
}
.bgC p,.bgC2 p ,.bloc1 p{
    color: #ababab;
    font-size: 24px;
    letter-spacing: 2px;
    line-height: 1.3;

}
.bloc1 span{
    opacity: 60%;
    font-size: 25px;
    letter-spacing: 4px;
}
.head{
    position: absolute;
    height: 100%;
    width: 100%;
    background-size: cover!important;
    -webkit-background-size: cover!important;
    background-repeat: no-repeat!important;
    background-position: center center!important;
    opacity: 0 !important;
    transform: scale(1.5);
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
    z-index: 0;
}
.heade{
    height: auto;
    opacity: 0 !important;
    transform: scale(1.5);
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
    z-index: 0;
}
.header{
    height: auto;
    width: 100%;

}

.head2{
    opacity: 1 !important;
    transform: scale(1);
    transform: translate(0%,0%);

}

.titreH{
    position: absolute;
    bottom: 105px;
    left: 105px;
    transform: scale(0.9);
    opacity: 0;
    transition:transform 1s ease-in-out, opacity 2s ease-in-out;
}
.titreA{
    position: absolute;
    bottom: 105px;
    left: 105px;
    transform: scale(0.9);
    opacity: 0;
    transition:transform 1s ease-in-out, opacity 2s ease-in-out;
}
.titreHC{

    position: absolute;
    bottom: 50%;
    left: 120px;
    transform: scale(0.9);
    opacity: 0;
    transition:transform 1s ease-in-out, opacity 2s ease-in-out;
}

.titreHAV{
    position: absolute;
    bottom: 70px;
    left: 120px;
    transform: scale(0.9);
    opacity: 0;
    transition:transform 1s ease-in-out, opacity .8s ease-in-out;
}

.titreHA{
    position: absolute;
    bottom: 105px;
    left: 105px;
    transform: scale(0.9);
    opacity: 0;
    transition:transform 1s ease-in-out, opacity 2s ease-in-out;
}

.titreNone{
    transform: scale(1);
    opacity: 1;
}

.line{
    height: auto;
    width: 50%;
    border-left: 1px solid white;
    padding-left: 20px;
    padding-bottom: 0px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;

}

.vertical {
    border-left: 1px solid white;
    height: auto;
    opacity: 30%;
    display: inline-block;
}

.lineC{
    height: auto;
    width: 70%;
    border-left: 1px solid white;
    padding-left: 20px;
    padding-bottom: 0px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.test {
    padding-right: 5px;
    padding-left: 5px;
}

.test img{
    opacity: 30%;
    transition: opacity 0.8s ease-in-out;
}

.test:hover img{
    opacity: 80%;
}

.line2 .petit {
    margin-bottom: 10px;
}
.petit{
    font-family: "HelveticaLigth"!important;
    font-size: 100px;
    line-height: 1.2;
    letter-spacing: 7px;
}

#header-creation .petit{
    font-family: "HelveticaLigth"!important;
    font-size: 50px;
    line-height: 1.2;
    letter-spacing: 2px;
}

#header-creation .grand{

    font-family: "HelveticaMedium"!important;
    font-size: 87px;
    line-height: .78;
    margin-bottom: 30px;
    letter-spacing: 2px;
}

.grand{

    font-family: "HelveticaMedium"!important;
    font-size: 160px;
    line-height: 0.78;
    letter-spacing: 7px;
}
.texte-date{
    font-family: "HelveticaLigth"!important;
    font-size: 20px;
    opacity: 50%;
}
.petitA{
    font-family: "HelveticaLigth"!important;
    /*font-size: 60px;*/
    font-size: 100px;
    line-height: 1.2;
}

.ag span {
    font-family: HelveticaMedium!important;
}
.ag {
    width: 50%;
}

.div1Texte {
        padding-left: 5rem;
        padding-right: 10rem;
}

.grandA{

    font-family: "HelveticaMedium"!important;
    /*font-size: 110px;*/
    font-size: 160px;
    line-height: 0.78;
}


.titreH  .petitAV{
    font-family: "HelveticaLigth"!important;
    /*font-size: 30px;*/
    font-size: 40px;
    letter-spacing:5px;

}
.titreA  .petitAV{
    font-family: "HelveticaLigth"!important;
    /*font-size: 30px;*/
    font-size: 40px;
    letter-spacing:5px;

}


.titreH .grandAV{

    font-family: "HelveticaMedium"!important;
    /*font-size: 70px;*/
    font-size: 90px;
    line-height: 0.90;
    letter-spacing:7px;
}
.titreA .grandAV{

    font-family: "HelveticaMedium"!important;
    /*font-size: 70px;*/
    font-size: 90px;
    line-height: 0.90;
    letter-spacing:7px;
}

.titreHAV .petitAV{
    font-family: "HelveticaLigth"!important;
    /*font-size: 30px;*/
    font-size: 90px;

}

.titreHAV .grandAV{

    font-family: "HelveticaMedium"!important;
    /*font-size: 70px;*/
    font-size:160px;
    line-height: 0.90;
}

.petitAVC{
    font-size: 35px;
    letter-spacing: 1.5px;
    line-height: 1.2;
}

.grandAVC{
    letter-spacing: 1.5px;
    font-size: 75px;
    line-height: 0.70;
    margin-bottom: 20px;
}
.heade .client {
    position: absolute;
    bottom: 40px;
    right: 70px;
    font-family: "HelveticaMedium";
    font-size: 30px;
    letter-spacing: 1.5px;
    opacity: 20%;
    color: #ffffff;
    transition: opacity 1s ease-in-out,color .5s ease-in-out,font-size 1s ease-in-out;
}
.heade .client:hover {
    color: #B6B6B6;

}
.allum {
    opacity: 100%!important;


}
.butt{
    font-family: "HelveticaLigth"!important;
    position: absolute;
    bottom: 100px;
    right: 70px;
    border: 1px solid gray;
    border-radius: 20px;
    width: 8%;
    text-align: center;
    text-decoration: none;
    color: white;
    opacity: 70%;
    font-size: 22px;
    letter-spacing: 1.3px;
    padding: 5px;
    transition: all .5s ease-in-out;
}
.butt:hover{
    text-decoration: none;
    color: gray;
    opacity: 55%;
    background-color: #FFFFFF;
}

.divCreations .cre{
    letter-spacing: 0.5rem;
    opacity: .7;
    transition: all .5s ease-in-out;
    color: #FFFFFF;
    font-size: 30px;
    text-decoration: none;
}

.espace .cre{
    letter-spacing: 0.3rem;
    opacity: .7;
    transition: all .5s ease-in-out;
    color: #FFFFFF;
    font-size: 70px;
    text-decoration: none;
}

.cre:hover{
    letter-spacing: 0.7rem;
    opacity: 1;
}

button.evok{

    border: 1px solid white;
    color: white;
    border-radius: 50%;
    margin-left: 4px;
    padding: 5px 14px!important;
    margin-right: 4px;
    background-color: transparent;
    transition: background-color .7s ease-in-out;
}

.pagined{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 85px;
    margin-top:  1%;
}

button.evok:hover{
    cursor: pointer;
    background-color: white;
    color: #333;
    box-shadow: none;
    font-weight: bolder;
    border: 1px solid white;
}

.actif{
    background-color: white !important;
    color: #333 !important;
    box-shadow: none !important;
    font-weight: bolder ;
    border: 1px solid white !important;
}

/*Début page News */

.containeurTitre{

    margin-bottom: 3%;
}


.petitTitre{

    text-decoration: none;
    letter-spacing: 5px;
    color: #FFFFFF;
    font-size: 25px;
    opacity: 70%;
    transition: all 0.5s ease-in-out;

}

.paragraphe{
    color: grey;
}

.sp{
    color: white!important;
}


.TextAnim{
    overflow: hidden;
    animation: reveal 1.2s linear  forwards;

}
.TextAnim1{
    overflow: hidden;
    animation: reveal1 1.2s linear forwards;

}

@keyframes reveal {
    0%{
        width: 100%;
        height: 0px;
    }
    30%{
        width: 100%;
        height: 20px;
    }
    60%{
        width: 100%;
        height: 30px;
    }
    80%{
        width: 100%;
        height: 40px;
    }
    100%{
        width: 100%;
        height: 50px;
    }
}
@keyframes reveal1 {
    0%{
        width: 100%;
        height: 10px;
    }
    30%{
        width: 100%;
        height: 20px;
    }
    60%{
        width: 100%;
        height: 30px;
    }
    80%{
        width: 100%;
        height: 35px;
    }
    100%{
        width: 100%;
        height: 40px;
    }
}

.grandTitre{
    text-decoration: none;
    letter-spacing: 1px;
    color: #FFFFFF;
    font-size: 16px;
    opacity: 40%;
    transition: all 0.5s ease-in-out;
}
.grandTitre2{

    font-family: "HelveticaLigth"!important;
    text-decoration: none;
    letter-spacing: 5px;
    color: #FFFFFF;
    font-size: 25px;
    transition: all 0.5s ease-in-out;
}

.petitTitre:hover{
    text-decoration: none;
    color: #FFFFFF;
    opacity: 100%;
}

/* Traitement fond gris blog*/


#fond img{
    z-index: 1;
    -webkit-transition: .5s ease-in-out;
    transition: .7s ease-in-out;
}
#fond:hover img{
    opacity: .4;
}

#fond a{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "HelveticaLigth"!important;
    border: 1px solid gray;
    border-radius: 20px;
    width: 25%;
    text-align: center;
    padding: 5px;
    text-decoration: none;
    color: white;
    opacity:0;
    font-size: 22px;
    letter-spacing: 1px;
    z-index: 5;
    transition: all .7s ease-in-out;

}

#fond:hover .butt2{
    text-decoration: none;
    color: gray!important;
    background-color: #FFFFFF ;
    opacity: 0.7!important;
}

.act{

    transition: opacity 1s ease-in;
}
.apparition{
    opacity: 1;
}

/*Fin Page News */

.scroll-down{
    bottom: 10px;
    left: 50%;
}

.blob {

    background: transparent;
    border-radius: 50%;
    transform: scale(1);
    animation: pulse-white 2s infinite;
}
.blob2 {

    background: transparent;
    transform: scale(1);
    animation: pulse-white 2s infinite;
}

@keyframes pulse-white {
    0% {
        transform: scale(0.60);

    }

    70% {
        transform: scale(1);

    }

    100% {
        transform: scale(0.60);

    }
}


/*FIN Page Actualité*/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/*********************************************************************  Début Agence*******************************************************************************/


.div1 {
    padding: 5%;
    margin-left: 0px;
    margin-right: 0px;
}

.div1 svg {
    width: 100%;
    height: 100px;
    fill: #fff;
}
.div3 {
    padding: 5%;

}
.div2Texte .espace {
    font-size: 36px;
    line-height: 1.2;
    letter-spacing: 0.5rem;

}

.equipe {
    font-size: 69.5px;
    line-height: 1;
    letter-spacing: .4rem;
    display: block;
}


/*********************************************************************  Fin Agence*******************************************************************************/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/*********************************************************************  Espace presse*******************************************************************************/
.line2{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: auto;
    /*width: 50%;*/
    display: flex;
    flex-direction: column;
}

/*********************************************************************  Fin Espace presse*******************************************************************************/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/*********************************************************************  Espace parcours magazine*******************************************************************************/

.img-parcours{
    width: 90%;
 /*   max-width: 600px;*/
    opacity: 100%;
    transition: opacity 0.5s ease-in-out;
}

.img-parcours:hover {
    opacity: 50%;
}
.pro #ico{
    position: absolute;
    top:50%;
    left: 45%;
    transform: translate(-45%,-50%);
    color: white;
    opacity: 0 !important;
    transition: opacity 1.2s ease-in-out;
}
#ico:hover .img-parcours {
    opacity: 50%;
}
.pro:hover #ico{
    opacity: 1!important;
}

.parcours-text p{
    font-size: 1.7em;
    opacity: 70%;
}

/*********************************************************************  Fin Espace parcours magazine*******************************************************************************/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/********************************************************************* Début Article de presse*******************************************************************************/
.titre_Article{

    font-size: 40px;

}
.produits-text .grandTitre2{
margin-bottom: 0!important;
}

.produits-text .pro {
    padding-left: 2px;
}

.img-produits{
    width: 100%;
    max-height: 450px;
    max-width: 600px;
    opacity: 100%;
    transition: opacity 0.7s ease-in-out;
}
.img-produits:hover{
    opacity: 30%;
}

.img-Articles{
    width: 100%;
    max-height: 500px;
    max-width: 800px;
    opacity: 100%;
    transition: opacity 0.7s ease-in-out;
}

#fonde a{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "HelveticaLigth"!important;
    border: 1px solid white;
    border-radius: 20px;
    width: 25%;
    text-align: center;
    padding: 5px;
    text-decoration: none;
    color: white;
    opacity:0;
    font-size: 22px;
    letter-spacing: 1px;
    z-index: 500;
    transition: all .7s ease-in-out;
}


#fonde:hover img{
    opacity: .4;
}

#fonde:hover .butt2{
    text-decoration: none;
    color: white;
    background-color: transparent;
    opacity: 0.7!important;
}

#fonde .butt2:hover {

    background-color: #FFFFFF ;
    opacity: 1!important;
    color:gray;
    border: 1px solid grey;
}

#fonde img {
    z-index: 1;
    -webkit-transition: .5s ease-in-out;
    transition: .7s ease-in-out;

}

#fonde iframe {
height: 450px;
}


/*********************************************************************  Fin article de presse*******************************************************************************/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***/


/*********************************************************************  Début Contact*******************************************************************************/
.contact {
    column-gap: 200px;
    height: 85vh;
}
.contact .row {

}

.contact h3{
    color: #fff;
    font-family: HelveticaMedium;
    font-size: 30px;
    letter-spacing: 1.3px;
}
.contact p{
    color: grey;
    font-size: 20px;
    letter-spacing: 1.3px;
}

.link {
    border: 1px solid gray;
    border-radius: 20px;
    width: fit-content;
    text-align: center;
    text-decoration: none;
    color: white;
    opacity: 90%;
    font-size: 22px;
    letter-spacing: 1.3px;
    padding: 3px 20px;
    transition: all .5s ease-in-out;
}
.link:hover{
    text-decoration: none;
    color: gray;
    opacity: 70%;
    background-color: #FFFFFF;
}
.contact .decouvrir a {
    color: white;
    margin-right: 30px;
    transition: color .5s ease-in-out;
}
.contact .decouvrir a:hover {
    text-decoration: none;
    color: grey;
}

/********************************************************************* Fin contact*******************************************************************************/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/***/
/*********************************************************************  Début Footer*******************************************************************************/


/*Footer toujours en bas de page*/
#bottom {
    z-index: 100000000000;
}

#footer{
    margin-top: auto;


}
#footer span{
    margin-bottom: 3px;
}
.F-m{
    font-family: HelveticaMedium;
    letter-spacing: 1.4px;
}
.F-l{
    font-family: HelveticaLigth;
    letter-spacing: 1.4px;
}
.lien{

    font-family: HelveticaLigth;
    opacity: 1;
    color: inherit;
    text-decoration: none;
    letter-spacing: 1.4px;
    font-size: 14px;
    transition: all 0.5s ease-in-out;

}
.lien:hover{

    opacity: 1;
    color: inherit!important;
    text-decoration: none;


}

.LesP p{

    font-size: 15px;
    margin-bottom: 7px;!important;
    color: #939393;
    font-family: HelveticaMedium;

}
.LesP {
    margin-left: 7vw;
}


/*********************************************************************  Fin Footer *******************************************************************************/


/*********************************************************************  Début Scrollbar et button scrolltop *******************************************************************************/
::-webkit-scrollbar
{
    width: 8px;
    background-color: #202020;
}

::-webkit-scrollbar-thumb
{
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #555;
    transition: all .8s ease-in-out;
}

.gotop{
    position:fixed;
    width:3em;
    height:3em;
    border-radius: 50%;
    background:#555;
    bottom:-3em;
    right:3em;
    display:flex;
    justify-content:center;
    align-items:center;
    text-decoration:none;
    color:white;
    transition: all .6s ease-in-out;
}
.gotop:hover{
    background: #2A292A;
    color: grey;
}


/*********************************************************************  Fin Scrollbar  *******************************************************************************/



.text-primary{
    color: #003866 !important;
}
.text-secondary{
    color: #FF8400 !important;
}
.administration{
    width: 40%;
}


div .fc-dayGrid-view .fc-body .fc-row{
    min-height: 2em !important;
}


@media(max-width: 768px){
    .administration{
        width: 100%;
    }
}


@font-face {
    font-family: "HelveticaLigth";
    src: url("/fonts/Helvetica/HelveticaNeue-Light.otf");
}
@font-face {
    font-family: "HelveticaMedium";
    src: url("/fonts/Helvetica/HelveticaNeue-Medium.otf");
}
/*FRONT END*/

*{
    font-family: "HelveticaLigth";
}

h1,h2,h3,h4,h5{
    font-family: "HelveticaLigth";
}
.navbar ul li a{
    font-family: "HelveticaLigth";
}

#navbar_dropdown_content {
    left: 0;
}


.pole-container a{
    font-family: "HelveticaLigth" !important;
}


p{
    font-size: 18px;
}
:root {
    --app-height: 100%;
}

html {
    scroll-behavior: smooth;

}
html, body{
    padding: 0;
    margin: 0;
    background-color: #202020!important;
    color: #FFFFFF;
    overflow-x: hidden;
    /*cursor: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' ...") 16 16, pointer;*/

}

.mentions {
    margin-top: 100px;
}

}
.text-mentions{
    color: rgba(255,255,255,0.6);
    text-decoration: none;
    font-size: 14px;
    text-transform: uppercase;
    transition: .3s;
}
.text-mentions:hover{
    color: white;
    text-decoration: none;
    transition: .3s;
}

.bg-prestation{
    background-size: cover;
    background-position: center;
    height: 100%;
    min-height: 365px;
}

.creations{
    overflow: hidden;
    height: 500px;
    background-position-x: center !important;
    position: relative;
    /*filter: grayscale(100%);*/
    transition: .5s;
}


/*@media (max-width: 992px) {*/
    /*.creations-container {*/
        /*margin-top: 15px;*/
    /*}*/
/*}*/

.devisBold{
    font-family: HelveticaMedium!important;
}

.imageActualiteShow{
    float: left;
    margin-right: 20px;
}

.actualites{
    overflow: hidden;
    /* height: 500px; */
    background-position-x: center !important;
    position: relative;
    /*filter: grayscale(100%);*/
    transition: .5s;
}

.creations:hover{
    transition: .5s;
    /*filter: grayscale(0%);*/
}
.custom-file-label{
    border-color: #5c96d3;
    background: transparent;
    color: white;
    min-width: 60%;
}

.custom-file-label::after{
    background: transparent;
    content: "Rechercher";
    color: white;
}
.textImg{
    font-family: HelveticaMedium!important;
    color: #5c96d3;
    font-size: 2.5em;
    position: absolute;
    top: 5%;
    left:5%;
}

.creations-container h2{
    position: absolute;
    padding-right: 39px;
    width: 100%;
    bottom: 0px;
    text-align: right;
    margin-bottom: 0px;
    padding-top: 65px;
    color: #00adef;
    z-index: 2;
    font-weight: 600;
    font-size: 48px;
}



.retour {

    border: 1px solid gray;
    border-radius: 20px;
    width: fit-content;
    text-align: center;
    text-decoration: none;
    color: white;
    opacity:1;
    padding: 10px 25px;
    font-size: 30px;
    letter-spacing: 1px;
    z-index: 5;
    transition: all .6s ease-in-out;
}
.retour:hover{
    text-decoration: none;
    color: black;
    background-color: white;
    border: 1px solid grey;

}


.actualite-container h2{
    position: absolute;
    padding-right: 39px;
    width: 100%;
    bottom: 0px;
    text-align: right;
    margin-bottom: 0px;
    padding-top: 65px;
    color: #00adef;
    z-index: 2;
    font-weight: 600;
    font-size: 48px;
}

/*.creation:hover .creations{*/
    /*filter: grayscale(0%);*/
/*}*/


/*Gestion des images dans l'accueil pour les mettre en noir et blanc et en couleur lors du passage de la souris*/
.greyImg img{
    -webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
    filter: grayscale(100%);
    -webkit-transition:all 0.3s;
    transition:all 0.3s;
}

.greyImg img:hover{
    -webkit-filter: grayscale(0%); /* Chrome, Safari, Opera */
    filter: grayscale(0%);
    -webkit-transition:all 0.3s;
    transition:all 0.3s;
}
/*****************************************************************/
/*.gradient{*/
    /*position: absolute;*/
    /*width: 100%;*/
    /*height: 100%;*/
    /*background-image: url("/uploads/degrade_corps_previsu.png");*/
/*}*/

.title-creation{
    position: absolute;
    width: 100%;
    text-align: right;
    color: #00adef;
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgb(0, 0, 0) 8%, rgba(0, 0, 0, 0) 65%);
    bottom: 0;
    margin-bottom: 0px;
    font-size: 5em;
    padding-right: 10%;
    padding-top: 65px;
    padding-bottom: 10px;
}

.title-actualite{
    position: absolute;
    width: 100%;
    text-align: right;
    color: #00adef;
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgb(0, 0, 0) 8%, rgba(0, 0, 0, 0) 65%);
    bottom: 0;
    margin-bottom: 0px;
    font-size: 3em;
    padding-right: 5%;
    padding-top: 65px;
    padding-bottom: 10px;
}

.overflow-hidden{
    overflow: hidden;
}
.actu-suite{
    margin-left: 5%;
}

#bg-web{
    background-image: url(/img/WEB.jpg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

#bg-print, #bg-comm{
    background-image: url(/img/print.svg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.logo{
    z-index: 2;
    margin-top: 13px;
}
#logo{
    height: 30px;
}

#line-pole{
    width: 100%;
}

#line-header{
    position: absolute;
    width: calc(100% - 106px);
    height: 40px;
    top: 20px;
    background-image: url(/img/design_ligne_m.png);
    background-position: right;
    background-repeat: no-repeat;
    background-size: cover;
}

.index-img h2{
    position: absolute;
    text-transform: uppercase;
    color: #00adef;
    right: 15px;
    margin-bottom: 0px;
    bottom: 13px;
}

.parcours-text p{
    font-size: 1.7em;
}

#bg-print h2, #bg-comm h2{
    position: absolute;
    text-transform: uppercase;
    color: #00adef;
    left: 15px;
    top: 13px;
}
/*NAVBAR*/

/* Gestion du menu Nav Bar dropdown  */
.dropbtn {
    font-size: 20px;
    cursor: pointer;
  }

  .dropdown {
    position: relative;
    display: inline-block;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    right: 0;
    /* top:37px; */
    text-align: left;
    /* background-color: #121216; */
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  .dropdown-content2 {
      margin-top: 4px;
      background-color: #121216;
  }
  .dropdown-content a {
    color: #FFFFFF;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
  }

  .dropdown-content a:hover {background-color: #121216;}
  .dropdown:hover .dropdown-content {display: block;}
  /* .dropdown:hover .dropbtn {background-color: #3e8e41;} */

/*.containerActu{*/
    /*min-height: 1200px;*/
/*}*/

div#navbar{
    margin-bottom: 30px;
    margin-top: 15px;
}

div.navbar{
    display: flex;
    padding-left: 0px;
    padding-right: 0px;
}
div.navbar>ul{
    z-index: 2;
    display: flex;
    flex-direction: row;
    list-style: none;
    width: auto;
    margin-bottom: 0px;
}

.justifyActu{
    text-align: justify;
}



div.navbar>ul>li{
    flex: 1;
    flex-grow: 1;
    text-align: right;
}
div.navbar>ul>li:nth-child(-n+4) {
    margin-right: 15px;
}
div.navbar>ul>li>a, div.dropbtn>a{
    text-decoration: none;
    color: white;
    font-size: 24px;
    text-transform: uppercase;
}
div.navbar>ul>li>a:hover, div.navbar>ul>li>a.active, div.dropbtn>a:hover, div.dropbtn>a.active {

    opacity: 0.5;
}


div.navbar>ul{
    padding-left: 0px;
}

.font-size-creation{
    font-size: 20px;
}

.text-red{
    color: #00adef !important;
}

.text-blue{
    color: red !important;
}

.title-section{
    font-size: 1.9em;
}
.box-contact .logo{
    height: 40px;
    margin-top: 0px;
}
.title-prestation{
    position: absolute;
    top: calc(50% - 24px);
    left: calc(50% - 363px/2);
    text-transform: uppercase;
    color: #00adef;
    font-size: 40px;
}

.mt-100{
    margin-top: 100px;
}

.img-header{
   width: 100%;
}
.img-heade{
    width: 100%;
    height: auto;
}

.DesktopCre{
    width: 100%;
    height: 250px;

}

button.evok{
    background-color: transparent;
    border: 1px solid white;
    color: white;
    font-weight: initial;
    transition: .3s;
    font-size: 20px;
    padding: 8px 12px;
    text-transform: uppercase;
}



button.evok:hover{
    cursor: pointer;
    background-color: white;
    color: #333;
    box-shadow: none;
    font-family: HelveticaMedium!important;

    border: 1px solid white;
}

#logoFooter{
    height: 60px;
    margin: auto;
    margin-bottom: -3px;
    z-index: 5;
}

.pole-container{
    margin-top: -30px;
}

.pole-container .pole{
    font-size: 25px;
    line-height: 1em;
    padding-bottom: 5px;
}

.bgFooter{
    background-color: #2A292A;
    padding-top: 20px;
}
.form-control{
    font-family: HelveticaMedium!important;

}
.border-communication{
    height: 1px;
    background-color: red;
}

.box-contact{
    background-color: #2A292A;
    border-radius: 10px;
    margin-top: 50px;
    margin-bottom: 50px;
}

.box-contact .form-control{
    border: 1px solid #00adef;
    color: white;
    background: transparent;
}

.box-contact .evok{
    font-size: 1em;
}
.div2Img {

}
.text1{
    margin-right: 140px;
}
.mapboxgl-popup-content{
    color: black;
    font-family: HelveticaMedium!important;

}

.box-contact select{
    color: white;
}

.box-contact select option{
    color: #333;
    font-family: HelveticaMedium!important;
}

.box-contact input[type="file"].form-control{
    padding-top: 3px;
}

.form-control:focus{
    box-shadow: none;
}

.border-design{
    height: 1px;
    background-color: #00adef;
}

div.bgFooter>div.flex{
    display: flex;
    justify-content: center;
}

div.bgFooter>div.flex a{
    flex: 1;
    max-width: 30px;
    margin: 0px 10px;
}
#map { position:absolute; top:0; bottom:0; width:100%; }


.description-right-actu{
    text-align: right;
}

div.pole a{
    color: rgba(255,255,255,0.6);
    transition: .5s;
    text-decoration: none;
}

div.pole a:hover{
    color: white;
    transition: .5s;
}
.alert{
    font-family: HelveticaMedium!important;
}
.captcha{
    min-height: 100px;
}
.is-flex{
    display: flex;
}
input[name="consent"]{
    margin-right: 20px;
    width: 40px;
}

.mentions a, .description-creation a{
    color: #00adef;
}
.description-creation a:hover {
    text-decoration: none;
}

.affichageDesktop a:hover {
    text-decoration: none;
}

.affichagePhone a:hover {
    text-decoration: none;
}


/*RESPONSIVE*/
@media (min-width: 2000px){
    #line-header{
        height: 47px;
        top: 15px;
    }
}

@media (max-width: 1200px){
    div.navbar>ul>li>a, div.dropbtn>a{
        font-size: 20px;
    }
    p{
        font-size: 16px;
    }
}

@media (min-width: 768px) and (max-width: 1200px){
    #line-header{
        background-image: url("/img/design_ligne_s.png");
    }
}

@media (min-width: 992px) and (max-width: 1300px){
    .no-padding-mediaQuerries{
        padding-top: 0.7rem !important;
        padding-bottom: 0.7rem !important;

    }
}

@media (max-width: 992px){
    div.row.mt-4.mb-4{
        margin-bottom: 0px !important;
        margin-top: 0px !important;
    }
    .description-right-actu{
        text-align: center;
    }
    .description-left-actu{
        text-align: center;
    }
}

@media (min-width: 950px){
    .imageActualiteShow{
        width:50%;
    }

}
@media (max-width: 950px){


    div.navbar>ul{
        display: block;
        padding-left: 0px;
        margin-top: 15px;
    }
    div.navbar>ul>li, div.navbar>ul>li:nth-child(-n+3){
        margin-right: 0px;
        text-align: left;
    }
    #line-header{
        position: absolute;
        width: calc(100% - 106px);
        height: 30px;
        top: 28px;
        left: 110px;
        background-image: url("/img/design_ligne_xs.png");
        background-position: left;
    }
    .logo{
        width: 100%;
    }
    .dropdown-content a{
        padding: 3px 16px;
    }
    .logoHaut{
        display: block !important;
    }
    .logoBas{
        display: none;
    }
}

@media(min-width: 992px){
    .pl-md-medium.pr-md-medium{
        padding-left: 7.5px;
        padding-right: 7.5px;
    }
}

@media (max-width: 767px){
    .title-creation{
        font-size: 3em;
        padding-right: 15px;
    }
    #logoFooter{
        height: 20px;
        margin-bottom: 2px;
    }
    .pole-container{
        margin-top: -15px;
    }
    .pole-container .pole{
        font-size: 14px;
    }
    .pole-container .pl-5{
        padding-left: 5px !important;
        padding-bottom: 0px;
    }
    .pole-container .pr-5{
        padding-right: 5px !important;
        padding-bottom: 0px;
    }
    .padding-top-actus-MQ{
        padding-top: 1rem;
    }
}

@media (min-width:2300px) {
    .img-fluid{
        width:100%;
        height: auto;
    }
}

/***********************
***** TARTE AU CITRON
****/
body #tarteaucitronRoot * {
    font-family: HelveticaLigth !important;
}

body #tarteaucitronRoot #tarteaucitronAlertBig{
    background-color: white;
    padding: 40px 0px;
    box-shadow: 0px -7px 20px 0px black;
}
body #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert, #tarteaucitronRoot *, body #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert strong{
    color: #000000;
    font: 19px SourceSans;
    font-family: "HelveticaLigth" !important;
}
body #tarteaucitronAlertBig #tarteaucitronPersonalize {
    background-color: transparent;
    border: 1px solid black;
    color: black;
    font-weight: initial;
    transition: .3s;
    font-size: 20px;
    padding: 8px 12px;
    text-transform: uppercase;
}
body #tarteaucitronAlertBig #tarteaucitronPersonalize:hover {
    cursor: pointer;
    background-color: black;
    color: white;
    box-shadow: none;
    border: 1px solid white;
}
body #tarteaucitronRoot #tarteaucitronPercentage{
    background: #00adef !important;
    box-shadow: none;
    height: 2px;
    z-index: 2147483645;
    display: none !important;
}
body #tarteaucitronAlertBig #tarteaucitronCloseAlert{
    font-size: 19px;
}
button:focus{
    outline: none;
}
body #tarteaucitronRoot div#tarteaucitron{
    top: 15px !important;
}
body #tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl{
    display: none;
}
sele #tarteaucitron #tarteaucitronPrivacyUrl{
    padding: 10px 10px;
    font-size: 1em;
}


/*Gestion des erreurs*/
.text-error-principale{
    font-size: 13rem;
    color: white;
    font-family: HelveticaMedium!important;
}

.text-error-scd{
    font-size: 1.5rem;
    color: #827e82;
}


#select-category-container{
    width: 40%;
    margin: auto;
}


.categories{

    font-size: 20px;
    border-bottom: none;
    opacity: .5;
    transition: all .8s ease-in-out;

}

.categories:hover{
    cursor: pointer;
    opacity: 1;
    border-bottom: solid 1px grey;
}

.activeCategory{
    border-bottom: solid 1px grey;
    opacity: 1;
}

@media screen and (max-width: 950px) {
    #sub-select-category-container{
        display: none;
    }

    #menuResponsive{
        display: none;
    }

}

@media screen and (min-width: 951px) {
    #select-category{
        display: none;
    }

    #hamburger-button{
        display: none;
    }

}

/*Gestion des queries pour la page show actu*/
@media (min-width: 800px) {

    .containerActu{
        min-height: 200px;
    }

}

@media (min-width: 1100px) {

    .containerActu{
        min-height: 300px;
    }

}

@media (min-width: 1300px) {

    .containerActu{
        min-height: 400px;
    }

}

@media (min-width: 1500px) {

    .containerActu{
        min-height: 500px;
    }

}

@media (min-width: 1800px) {

    .containerActu{
        min-height: 600px;
    }

}

.textIndexActu>p>span {
    font-size: 21px !important;
}
.textIndexActu>p {
    font-size: 21px !important;
}

@media (min-width: 1400px) {
    .marginActuRes{
        margin-top: 3rem;
    }

}

/*@media (max-width:600px) {*/
    /*.border-design{*/
        /*padding-right: -10px !important;*/
    /*}*/
    /**/
/*}*/

/* Overwrite du fullcalendar main.css*/
.fc table{
    color: #00adef;
}

.fc-unthemed td{
    border-color: #00adef !important;
}


@media (min-width: 992px) {
    .fc-button{
        padding: 0;
    }

}

@media (min-width: 768px) and (max-width:799.99px)  {

    .navbar-expand-md .navbar-nav .nav-link {

    }
}
@media (min-width: 800px) and (max-width:991.98px)  {

    .navbar-expand-md .navbar-nav .nav-link {

    }
}
@media (max-width: 768px){

    .navbar-expand-md .navbar-toggler {
        display: inline-block;
        margin-left: auto;
    }
    .correction{
        width: 100%;
    }
    .correction img{
        width: 96px;
        height: 49px;
    }
}
@media (width: 768px) {
    nav .navbar-nav {
        padding-top: 0px!important;

    }
    .navbar-expand-md {

        justify-content: space-between;
    }
    .navbar-expand-md .navbar-collapse {
      display: none!important;
    }
}


/*******************************************************************  Pages projets numéros         ******************************************************************************************/
.userNumBar,.userNumBar1,.userNumBar2 {
    position: relative;
}
.userNumBar .pplNum,.userNumBar1 .pplNum,.userNumBar2 .pplNum {
    display: inline-block;
    vertical-align: bottom;
    font-size: 50px;
    line-height: 60px;
}
.userNumBar .pplNum .digit-con, .userNumBar .pplNum .comma, .userNumBar1 .pplNum .digit-con, .userNumBar1 .pplNum .comma, .userNumBar2 .pplNum .digit-con, .userNumBar2 .pplNum .comma {
    height: 60px;
    overflow: hidden;
    display: inline-block;
    vertical-align: bottom;
}
.userNumBar .pplNum span ,.userNumBar1 .pplNum span ,.userNumBar2 .pplNum span {
    position: relative;
    font-size:55px;
    letter-spacing: 12px;

    font-family: HelveticaMedium;
    opacity: 100%!important;
}
.userNumBar .pplNum, .userNumBar1 .pplNum, .userNumBar2 .pplNum {
    opacity: 100%!important;
}




/*************************************************************Responsive **********************************************************************************/

.h-m{
    font-family: HelveticaMedium;
}
.h-l{
    font-family: HelveticaLigth;
}


.custom-select{
    color: white;
    border:1px solid grey;
    outline: none!important;

}
.custom-select:focus{
   border: 1px solid grey;
    box-shadow: none;
}



@media screen and (max-width: 575.98px) {
    .anim{
        opacity: 0;
        transform: translateY(70px);
    }
    .heade .client {
       display: none;
    }
    .bloc11 {
       display: none!important;
    }
    .err{
        height: 75vh;
    }

    .err .butt {
        margin-top: 50px;

    }
    .err div{

        font-size: 100px;

    }
    .err h1 {
        font-size: 20px;
    }
    #scroll{
        display: none;
    }
    .bail{
        transform: none!important;
    }
    .p-6{

        min-height: 200px;
    }
.correction{
    display: -webkit-flex !important;
    -webkit-justify-content: space-between!important;
}
    .correction div:first-child{
      background-color: #202020;
    }

    .userNumBar .pplNum span ,.userNumBar1 .pplNum span ,.userNumBar2 .pplNum span {
        font-size: 45px;
    }
    .correction img {
        width: 70px;
        height:30px;
    }
    .correction svg {
        font-size: 1.2em!important;
    }

    .content1,.content2,.content3 {
        height: 250px;
        width: 100%;
        border: 10px solid #202020;
    }

    .back svg{
        font-size: 15px;
        margin-right: 5px;
    }
    .back{
        display: block !important;
        font-size: 15px;
        color: darkgray;
        transition: all 0.5s ease-in-out;
    }
    .back:hover{
        text-decoration: none;
        color: #ffffff;
    }

    .vertical,.pano{

    }
    .bloc1{
        padding:0 ;
        height: auto;
    }
    .bloc1 div:nth-child(1){
        padding-left: 15px;

    }

    .crea-contain{
        margin-bottom: 50px;
        margin-top: 20px!important;
    }
    .bloc3 {
        margin-bottom: 40px;
        padding-top: 0px;
    }
    .bloc3 div:nth-child(1){

        padding-left: 13px!important;
    }

    .bloc3 p {
     margin-top: 20px!important;
        font-size: 14px;
        width: 60%;
    }
    .bloc3 span {
        display: block;
        width: 30%;
        font-size: 20px!important;
    }


    .bloc1 h1 {
        font-size: 28px;
        letter-spacing: 3px;
        margin-bottom: 30px;
        margin-top: 30px;
    }


    .bloc11 h1 {
        font-size:40px;
        letter-spacing:5px;
        font-family: HelveticaMedium;
    }

    .bloc1 p{

        font-size: 16px;

        letter-spacing: 2px;

    }

    .bloc1 span{
        opacity: 60%;
        font-size: 18px;
        letter-spacing: 5px;

    }
    .bloc4{
    display: none;
    padding-bottom: 30px;
     }

    .bloc5 h1{
        padding-top:10px!important;
        padding-bottom: 30px!important;
        font-size: 15px;
    }
    .bloc6 p{
        font-size: 12px;
        padding-bottom: 30px!important;
        padding-top: 30px!important;
    }

    .bloc7{
        padding-top: 0px!important;
    }
    .bloc7 div:nth-child(2){
        padding-right:88px!important;
        padding-left:88px!important;
        padding-top:36px!important;
        padding-bottom:36px!important;
    }
    .bloc7 div:nth-child(2) img{
        height: auto;
    }

    .t-paysage{
        /*margin-top: 30px!important;*/
        padding-right: 88px!important;
        padding-top: 0!important;
        padding-bottom: 15px;
    }
    .t-paysage p{
        font-size:20px!important;
        width: 30%!important;
    }

    .t-portrait{
        padding-left: 10px!important;
    }
    .bloc8 .t-portrait span{
        margin-top: 10px!important;
        font-size: 20px!important;
    }

    .bloc8 p{
        margin-top: 20px!important;
        font-size: 14px!important;
    }
    .bloc8 div:nth-child(2) {
        padding-left: 15px;
        padding-right: 0;
    }

    .portrait{
        padding-top: 0;

    }

    .slickCall2 img{
        width:auto!important;
        height:auto!important;
    }

    .slickCall2 .slick-slide{

        min-height: 207px!important;
    }

    .pro #ico{


        left: 50%;
        transform: translate(-50%,-50%);

    }
    .ball {

        display: none;
    }
    .retour{
        font-size: 20px;
    }

    .bg{

        height: 60vh;

    }
    .lien {
        opacity: 1;
        color: inherit;
        text-decoration: none;
        letter-spacing: 1.4px;
        font-size: 13px;
        transition: all 0.5s ease-in-out;
        margin-top: 10px;

    }


    .LesP p {
        margin-top: 20px;
        font-size: 14px;
        color: #939393;

    }

    .LesP {
        margin-left: 1.5vw;
    }


    .Section-home .rea{
        position: absolute;
        width: 100%;
        bottom: 20px;
        text-decoration: none;
    }

    .Section-home h1 {
        position: relative;
        font-size: 20px;
        bottom: 30px;

    }

    .slick-dots {
        bottom: 90px;
    }


    nav .navbar-nav {
        padding-top: 50px;
        background: #121216;
        opacity: .8;
        transform: translate(190px, -65px);
        align-items: flex-start;
        border-radius: 5px;
        line-height: 1.5;
    }

    .nav-link {
        padding: 0;
    }

    .big {
        font-size: 25px;
    }

    .little {

        font-size: 15px;
    }

    #select-category-container {
        width: 100%;
        margin: auto;
        text-align: center;
        -webkitt-text-align: center;
    }
    .custom-select {
        text-align: center;
    }

    .gotop{

        right:2em;

    }
    /** Actu */
    #fond a{
        font-size: 20px !important;
        width: inherit!important;
    }
    #fonde a{
        font-size: 20px !important;
        width: 40%!important;
    }

    #fonde img{


    }

    #fonde iframe {
        height: 180px;
    }
    .body .container-fluid{
        margin-top: 25px !important;
    }
    /***/

    /* header*/
    .butt{

        right: 33px;
        bottom: 20px;
        border-radius: 20px;
        width: 30%;
        font-size: 15px;
        background-color: #FFFFFF;
        color: grey;
    }
    .titreHA{
         position: absolute;
         bottom: 80px;
         left: 30px;
         transform: scale(1);
         opacity: 1;
         transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
     }
    .titreHC{
         position: absolute;
         bottom: 130px;
         left: 30px;
         transform: scale(1);
         opacity: 1;
         transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
     }
    .petitAVC{
        font-size: 25px;
        letter-spacing: 1.5px;
    }

    .grandAVC{
        letter-spacing: 1.5px;
        line-height: .9;
        font-size: 65px;
    }

    .titreH{
        position: absolute;
        bottom: 100px;
        left: 27px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .titreA{
        position: absolute;
        bottom: 20px;
        left: 35px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .petit{
        font-family: "HelveticaLigth"!important;
        font-size: 20px;
        letter-spacing: 4px;
    }
    .grand{

        font-family: "HelveticaMedium"!important;
        font-size: 50px;
        letter-spacing: 4px;
    }

    #header-creation .petit{
        font-family: "HelveticaLigth"!important;
        font-size: 20px;
        line-height: 1.2;
        letter-spacing: 2px;
    }

    #header-creation .grand{

        font-family: "HelveticaMedium"!important;
        font-size: 40px;
        line-height: .90;
        margin-bottom: 15px;
        letter-spacing: 1px;
    }
    .p{
        font-family: "HelveticaLigth"!important;
        font-size: 15px;
    }
    .g{
        font-family: "HelveticaMedium"!important;
        font-size: 25px;
    }
    .petitA{
        font-family: "HelveticaLigth"!important;
        font-size: 30px;
    }

    .grandA{

        font-family: "HelveticaMedium"!important;
        font-size: 60px;
    }

    .titreHAV{
        position: absolute;
        bottom: 25px;
        left: 50px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .titreA .petitAV{
        font-family: "HelveticaLigth"!important;
        font-size: 20px;
    }


    .titreA .grandAV{

        font-family: "HelveticaMedium"!important;
        font-size: 30px;
        letter-spacing: 1px;
    }

    /*.headAgence{*/
    /*    background-position: 25% 75% !important; !*centre de l'image *!*/
    /*}*/
    /**/

    .equipe {
        font-size: 40px;
        line-height: 1;
        padding-bottom: 1rem!important;
    }
    .div2Texte .espace{
        font-size: 35px;

    }
    .div1Texte {
        text-align: center;
        align-items: center;
        padding-top:.5rem;
        padding-bottom:.5rem;
        padding-left: 0px!important;
        padding-right: 0px!important;
    }

    .ag{
        align-items: center;
        width: fit-content;
    }

    .img-parcours{
        width: 100%;
    }
    .div1 {
        padding: 4%;

    }
    .div1 svg {
        width: 70%;
        height: 100px;
        fill: #fff;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: -30px;
    }

    .div3 {
        padding: 30px;
        margin-left: -15px;

    }
    .espace .cre{

        font-size: 50px;

    }
    .divCreations{
        margin-top:1.5rem!important;
    }
    .divCreations .cre{
        font-size: 20px;
        letter-spacing: 0.2rem;
    }
    .titreCreation{
        font-size: 17px;
    }
    .trait{
        margin: 1.5rem!important;
        width: 20%!important;

    }
    .parcours-text p{
        font-size: 1.2em;
        opacity: 70%;
    }
    .grandTitre2{
        font-size: 20px;
    }
    .grandTitre{
        font-size: 14px;
    }
    .petitTitre{

        font-size: 20px;

    }
   .div1Img{
       padding-left: 0;
       padding-right: 0;
   }

    .titreH  .petitAV{


        font-size: 20px;

    }


    .titreH .grandAV{


        font-size: 50px;

    }

    .header .petitAV{
        font-family: "HelveticaLigth"!important;
        font-size: 20px;
    }

    .header .grandAV{
        font-family: "HelveticaMedium"!important;
        font-size: 40px;
    }

    .header .titreHAV{
        position: absolute;
        bottom: 10px;
        left: 40px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }

    .contact {

        height: auto;
    }

    .contact h3{

        font-size: 22px;

    }
    .contact p{

        font-size: 15px;

    }

    .link {

        font-size: 18px;

    }
.correction svg {
    -webkit-transform: translate(0px,0px); /* Safari and Chrome */
}

}

@media screen and (min-width:  575.98px) and (max-width:768px) {


    .bloc11 {
        display: none!important;
    }
    .back svg{
        font-size: 20px;
        margin-right: 5px;
    }
    .back{
        display: block !important;
        font-size: 20px;
        color: darkgray;
        transition: all 0.5s ease-in-out;
    }
    .back:hover{
        text-decoration: none;
        color: #ffffff;
    }

    .vertical,.pano{

    }
    .bloc1{
        padding:0 ;
        height: auto;
    }
    .bloc1 div:nth-child(1){
        padding-left: 18px;

    }

    .crea-contain{
        margin-top: 20px!important;
        padding-right: 0px!important;
        padding-left: 0px!important;
        margin-bottom: 80px;
    }
    .bloc3 {
        margin-bottom: 40px;
        padding-top: 20px;
    }
    .bloc3 div:nth-child(1){
        padding-left: 13px!important;
    }

    .bloc3 p {
        margin-top: 20px!important;
        font-size: 16px;
        width: 60%;
    }
    .bloc3 span {
        display: block;
        width: 30%;
        font-size: 24px!important;
    }


    .bloc1 h1 {
        font-size: 38px;
        letter-spacing: 3px;
        margin-bottom: 30px;
        margin-top: 30px;
    }


    .bloc11 h1 {
        font-size:40px;
        letter-spacing:5px;
        font-family: HelveticaMedium;
    }

    .bloc1 p{

        font-size: 18px;

        letter-spacing: 2px;

    }

    .bloc1 span{
        opacity: 60%;
        font-size: 18px;
        letter-spacing: 5px;

    }
    .bloc4{

       padding-top: 10px;
    }

    .bloc5 h1{
        padding-top:30px!important;
        padding-bottom: 30px!important;
        font-size: 18px;
    }
    .bloc6 p{
        font-size: 15px;

        padding-top: 30px!important;
    }

    .bloc7{
        padding-top: 30px;

    }

    .bloc7 div:nth-child(2){
        padding-right:88px!important;
        padding-left:150px!important;
        padding-top:36px!important;
        padding-bottom:36px!important;
    }

    .t-paysage{
        padding-right: 176px!important;
        padding-top: 0!important;
    }
    .t-paysage p{
        font-size:20px!important;
        width: 20%!important;
    }

    .bloc8{
        margin-top: 30px!important;
    }
    .t-potrait span{
        font-size: 24px!important;
    }
    .t-portrait p{
        margin-top: 10px!important;
        font-size: 14px!important;
    }

    .bloc8 div:nth-child(2) {
         padding-left: 15px;
         padding-right: 0;
     }

    .slickCall2 img{
        width:auto!important;
        height:auto!important;
    }
    .portrait{
        padding-top: 14px!important;
    }

    .slickCall2 .slick-slide{

        min-height: 207px!important;
    }


    .err{
        height: 75vh;
    }

    .err .butt {
        margin-top: 90px;

    }
    .err div{

        font-size: 150px;

    }
    .err h1 {
        font-size: 20px;
    }

    .contact {

        height: auto;
    }
    .bail{
        transform: none!important;
    }

    .userNumBar .pplNum span ,.userNumBar1 .pplNum span ,.userNumBar2 .pplNum span {
        font-size: 50px;
    }
    .content1,.content2,.content3 {
        height: 400px;
        width: 100%;

    }
    .p{
    font-family: "HelveticaLigth"!important;
    font-size: 20px;
    }
    .g{
    font-family: "HelveticaMedium"!important;
    font-size: 30px;
    }




    .img-parcours{
        width: 100%;
    }
    .pro #ico{


        left: 50%;
        transform: translate(-50%,-50%);

    }
    .ball {

       display: none;
    }
    .bg{

        height: 60vh;

    }
    .lien{

        opacity: 1;
        color: inherit;
        text-decoration: none;
        letter-spacing: 1.4px;
        font-size: 13px;
        transition: all 0.5s ease-in-out;
        margin-top:5px
    }


    .LesP p{
        margin-top: 20px;
        font-size: 14px;
        color: #939393;

    }

    .agen{
        display: none!important;
    }

    nav .navbar-nav{
        padding-top: 50px;
        background:#121216;
        opacity: .8;
        transform: translate(420px,-80px);
        align-items: flex-start;
        border-radius: 5px;
        line-height: 1.5;
    }
    .nav-link
    {
        padding: 0;
    }

    .big{
        font-size: 30px;
    }

    .little{

        font-size: 20px;
    }
    #select-category-container {
        width: 80%;
        margin: auto;
        text-align: center;
    }
    .custom-select {
    text-align: center;
    }

    #fond a{
        font-size: 20px !important;
        width: inherit!important;
    }

    .titreHA{
        position: absolute;
        bottom: 70px;
        left: 30px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .titreHC{
        position: absolute;
        bottom: 200px;
        left: 40px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .petitAVC{
        font-size: 35px;
        letter-spacing: 1.5px;
    }

    .grandAVC{
        letter-spacing: 1.5px;
        font-size: 70px;
    }
    .butt{

        right: 40px;
        border-radius: 20px;
        bottom: 40px;
        width: 20%;
        font-size: 20px;
        background-color: white;
        color: grey;
    }

    .petitA{
        font-family: "HelveticaLigth"!important;
        font-size: 50px;
    }

    .grandA{

        font-family: "HelveticaMedium"!important;
        font-size: 80px;
    }



    .titreH{
        position: absolute;
        bottom: 100px;
        left: 27px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .titreA{
        position: absolute;
        bottom: 40px;
        left: 40px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }

    .petit{
        font-family: "HelveticaLigth"!important;
        font-size: 50px;
    }
    .grand{

        font-family: "HelveticaMedium"!important;
        font-size: 80px;
    }

    #header-creation .petit{
        font-family: "HelveticaLigth"!important;
        font-size: 50px;
    }

    #header-creation .grand{

        font-family: "HelveticaMedium"!important;
        font-size: 80px;
    }

    .titreHAV{
        position: absolute;
        bottom: 25px;
        left: 65px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
   .titreA .petitAV{
        font-family: "HelveticaLigth"!important;
        font-size: 30px;
    }
    .header .petitAV{
        font-family: "HelveticaLigth"!important;
        font-size: 30px;
    }

    .titreA .grandAV{
        font-family: "HelveticaMedium"!important;
        font-size: 50px;
    }

    .titreH  .petitAV{


        font-size: 30px;

    }


    .titreH .grandAV{


        font-size: 70px;

    }

    .header .titreHAV{
        position: absolute;
        bottom: 25px;
        left: 40px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }


    .grandAV{

        font-family: "HelveticaMedium"!important;
        font-size: 45px;
    }

    #fonde iframe {
        height: 300px;
    }
    #fonde img {


    }
    .grandTitre{
        font-size: 14px;
    }
    .petitTitre{

        font-size: 20px;

    }

    .ag{
        align-items: center;
        width: fit-content;
    }
    .div1Texte {
        padding:1.5rem;
        align-items: center;
    }
    .trait{
        width:25%!important;
        margin:.5rem!important;

    }

}
/*tablette*/
@media (min-width: 768px) and (max-width:991.98px)  {

    .bloc11 {
        display: none!important;
    }
    .back svg{
        font-size: 25px;
        margin-right: 5px;
    }
    .back{
        display: block !important;
        font-size: 25px;
        color: darkgray;
        transition: all 0.5s ease-in-out;
    }
    .back:hover{
        text-decoration: none;
        color: #ffffff;
    }

    .vertical,.pano{

    }
    .bloc1{
        padding:0 ;
        height: auto;
    }
    .bloc1 div:nth-child(1){
        padding-left: 18px;

    }

    .crea-contain{
        margin-top: 20px!important;
        padding-right: 0px!important;
        padding-left: 0px!important;
        margin-bottom: 100px;
    }

    .bloc3 {
        margin-bottom: 40px;
        padding-top: 20px;
    }
    .bloc3 div:nth-child(1){
        padding-left: 0!important;
    }

    .bloc3 p {
        margin-top: 20px!important;
        font-size: 16px;
        width: 60%;
    }
    .bloc3 span {
        display: block;
        width: 30%;
        font-size: 35px!important;
    }


    .bloc1 h1 {
        font-size: 45px;
        letter-spacing: 3px;
        margin-bottom: 30px;
        margin-top: 30px;
    }


    .bloc11 h1 {
        font-size:40px;
        letter-spacing:5px;
        font-family: HelveticaMedium;
    }

    .bloc1 p{

        font-size: 20px;

        letter-spacing: 2px;

    }

    .bloc1 span{
        opacity: 60%;
        font-size: 18px;
        letter-spacing: 5px;

    }
    .bloc4{

        padding-top: 10px;
    }

    .bloc5 h1{
        padding-top:30px!important;
        padding-bottom: 30px!important;
        font-size: 18px;
    }
    .bloc6 p{
        font-size: 18px;

        padding-top: 30px!important;
    }

    .bloc7{
        padding-top: 30px;

    }

    .bloc7 div:nth-child(2){
        padding-right:88px!important;
        padding-left:150px!important;
        padding-top:36px!important;
        padding-bottom:36px!important;
    }

    .t-paysage{
        padding-right: 176px!important;
        padding-top: 0!important;
    }
    .t-paysage p{
        font-size:25px!important;
        width: 20%!important;
    }

    .bloc8{
        margin-top: 30px!important;
    }
    .t-portrait span{
        font-size: 28px!important;
    }
    .t-portrait p{
        margin-top: 10px!important;
        font-size: 14px!important;
    }

    .bloc8 div:nth-child(2) {
        padding-left: 0;
        padding-right: 0;
    }

    .slickCall2 img{
        width:auto!important;
        height:auto!important;
    }
    .portrait{
        padding-top: 14px!important;
    }

    .slickCall2 .slick-slide{

        min-height: 207px!important;
    }




    .err{
        height: 75vh;
    }

    .err .butt {
        margin-top: 90px;

    }
    .err div{

        font-size: 180px;

    }
    .err h1 {
        font-size: 30px;
    }
    .contact {

        height: auto;
    }

    .bail{
        transform: none!important;
    }

    .bloc1 {
        width: 100%;
        height: auto;
    }

    #select-category-container {
        width: 80%;
        margin: auto;
        text-align: center;
    }
    .custom-select {
        text-align: center;
    }



    .content1,.content2,.content3 {
        height: 550px;
        width: 100%;

    }

    .div1 {
        padding: 1%;

    }
    .div1Texte {
        align-items: center!important;
        padding:1.5rem;
    }
    .ag{
        align-items: center;
        width: auto;
    }
    .img-parcours{
        width: 100%;
    }
    .pro #ico{


        left: 50%;
        transform: translate(-50%,-50%);

    }
    .ball {

        display: none;
    }
    .bg{

        height: 60vh;

    }
    .navbar-expand-md .navbar-nav .nav-link {
        padding-left: 0;
        padding-right: 0;
        margin-left:18px;
        margin-right:18px;
        margin-bottom: 20px;
        font-size: 14px;
    }
    .navbar-expand-md .navbar-collapse {
        justify-content: flex-end;
        margin-top: 10px;
    }

    .lien{


        opacity: 1;
        color: inherit;
        text-decoration: none;
        letter-spacing: 1.4px;
        font-size: 14px;
        transition: all 0.5s ease-in-out;
        margin-top:5px
    }


    .LesP p{
        margin-top: 20px;
        font-size: 15px;
        color: #939393;

    }
    .LesP {
        margin-left:2vw;
        margin-right:1.3vw;
    }
    #home-slider .slider-caption {
        bottom: 130px;
        position: absolute;
        width: 50%;
        transform: translate(340px,70px);
    }

    #home-slider .slider-caption h3 {
        font-size: 1.5rem;
    }
    .agen{
        display: none!important;
    }

    .nav-toggle{
        display: none;
    }
    .nav-item{
        padding-right: 0rem;
    }
    .big{
        font-size: 35px;
    }

    .little{

        font-size: 25px;
    }

    #fond a{
        font-size: 20px !important;
        width: inherit!important;
    }
    #fonde a{
        font-size: 20px !important;
        width: 40%!important;
    }
    .titreHA{
        position: absolute;
        bottom: 70px;
        left: 50px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }

    .titreHC{
        position: absolute;
        bottom: 300px;
        left: 40px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .petitAVC{
        font-size: 35px;
        letter-spacing: 1.5px;
    }

    .grandAVC{
        letter-spacing: 1.5px;
        font-size: 70px;
    }

    .petitA{
        font-family: "HelveticaLigth"!important;
        font-size: 50px;
    }


    .grandA{

        font-family: "HelveticaMedium"!important;
        font-size: 90px;
    }
    .petit{
        font-family: "HelveticaLigth"!important;
        font-size: 60px;
    }
    .grand{

        font-family: "HelveticaMedium"!important;
        font-size: 90px;
    }

    .butt{

        right: 40px;
        border-radius: 20px;
        bottom: 50px;
        width: 17%;
        font-size: 20px;
        background-color: white;
        color: grey;
    }

    .titreHAV{
        position: absolute;
        bottom: 25px;
        left: 80px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .titreH{

        left: 27px;

    }
    .titreA{

        left: 40px;
        bottom: 50px;

    }

    .petitAV{
        font-family: "HelveticaLigth"!important;
        font-size: 35px;
    }


    .grandAV{

        font-family: "HelveticaMedium"!important;
        font-size: 50px;
    }
    .body .container-fluid{
        margin-top: 25px !important;
    }
    /*.headAgence{*/
    /*    background-position: 25% 75% !important; !*centre de l'image *!*/
    /*}*/

    .div1 {
        margin-top: 10px;
    }

    #fonde iframe {
        height: 250px;
    }

    .titreA .petitAV{
        font-size: 40px;
    }

    .titreA .grandAV{

        font-size: 60px;
    }

    .header .titreHAV{
        position: absolute;
        bottom: 15px;
        left: 40px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }

    .titreH  .petitAV{


        font-size: 30px;

    }


    .titreH .grandAV{


        font-size: 80px;

    }
    .trait{
        width:25%!important;
        margin:.5rem!important;
    }
    .slick-dots {
        bottom: 230px;
    }
}

@media screen and (min-width:991.98px) and (max-width: 1325px) {

    /*.img-heade{*/
    /*    height: 100vh;*/
    /*    width: auto;*/
    /*}*/

 .bloc7 div:nth-child(1){
     padding-right: 10px!important;
 }
    .p-6{
        min-height: 435px!important;
    }
    .text1{
        margin-right: 4.5%;
    }
    .userNumBar .pplNum span, .userNumBar1 .pplNum span, .userNumBar2 .pplNum span {

        font-size: 35px;

    }

    .bloc1 {

        padding-left: 1%;
        padding-right:1%;
    }
    .bloc1 h1 {
        font-size: 50px;
        letter-spacing: 3px;
    }
    .bloc1 {
        width: 100%;
        height: auto;
    }
    .bloc1 p{

        font-size: 18px;
        letter-spacing: 2px;

    }
    .bloc1 span {

        font-size: 18px;

    }


    .equipe {
        font-size: 3vw;
        padding-bottom:1rem!important;
    }
.paragraphe{
    padding-bottom:1.5rem!important;
}
    .div1Texte {
        padding-right: 1rem;
        padding-left: 1rem;
    }

    .div2Texte .espace{
        font-size: 32px;

    }

    .big{
        font-size: 35px;
    }

    .little{

        font-size: 25px;
    }
    #fond a{
        font-size: 20px !important;
        width: inherit!important;
    }
    #fonde a{
        font-size: 20px !important;
        width: 40%!important;
    }
    .butt{

        right: 70px;
        bottom: 105px;
        border-radius: 20px;
        width: 13%;
        font-size: 20px;

    }

    .titreHAV{
        position: absolute;
        bottom: 25px;
        left: 90px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }



    .titreHC {

        bottom: 300px;

    }



    #fonde iframe {
        height: 300px;
    }
    .navbar-expand-md .navbar-nav .nav-link {
        padding-left: 0;
        padding-right: 0;
        margin-left:30px;
        margin-right:30px;
        margin-bottom: 20px;

    }
    #fonde img {


    }

    .grandTitre{
        font-size: 14px;
    }
    .petitTitre{

        font-size: 20px;

    }
    .titreH  .petitAV{


        font-size: 30px;

    }


    .titreH .grandAV{
        font-size: 85px;
    }

.trait{
    width:20%!important;
    margin:.5rem!important;
}

.petit{
    font-size: 80px;
}
.grand{
    font-size:120px;
}

    .crea-contain{


    }
}

@media screen and (min-width:1326px) and (max-width: 1450px) {
    .userNumBar .pplNum span ,.userNumBar1 .pplNum span ,.userNumBar2 .pplNum span {
        font-size: 36px;
    }
    .bloc1 {
        width: 100%;
        height: auto;
    }
    .bloc1 span {

        font-size: 22px;

    }
    .bloc1 p {

        font-size: 22px;

    }



    .bloc1 h1 {
        font-size: 60px;
        letter-spacing: 3px;
    }


    .div1Texte {

        padding-left: 5rem;
        padding-right: 5rem;
    }
    .text1{
        margin-right: 4.5%!important;
    }
    .equipe {
        font-size: 3.20vw;
        padding-bottom:1rem!important;
    }
    .paragraphe{
        padding-bottom:1.5rem!important;
    }
    .butt {
        right: 70px;
        border-radius: 20px;
        width: 13%;
        font-size: 20px;
    }
    .butt2 {
        width: auto!important;
    }
}
@media screen and (min-width:1450px) and (max-width: 1900px) {


    #fond a{
        font-size: 20px !important;
        width: inherit!important;
    }
    .butt{

        border-radius: 20px;
        width: 10%;
    }
    .titreHAV{
        position: absolute;
        bottom: 25px;
        left: 120px;
        transform: scale(1);
        opacity: 1;
        transition:transform 1s ease-in-out, opacity 0.9s ease-in-out;
    }
    .equipe {
        font-size: 3.55vw;

    }


   /*.bail{*/
   /*     display: none!important;*/
   /* }*/

    .bloc1{
        height:100vh;
    }

    .bloc11 h1 {
        font-size:40px;

    }
    .userNumBar .pplNum span, .userNumBar1 .pplNum span, .userNumBar2 .pplNum span {

        font-size: 45px;

    }

    .bloc1 p{

        font-size: 18px;
        letter-spacing: 2px;

    }
    .bloc1 span{
        opacity: 60%;
        font-size: 18px;
        letter-spacing: 5px;

    }
    .text1 {
        margin-right:4.5%;
    }

}


@media only screen and (min-width : 1900px) {
    /* Styles pour cette Media Queries  Large screens*/
    .bloc1{
        height: 100vh;
    }

}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    /* Styles pour cette Media Queries Ipad portrait */
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    /* Styles pour cette Media Queries Ipad paysage*/
}

@media (min-width: 1500px){
    .container {
        max-width: 1251px!important;
    }
}