a, .lien a {
    text-decoration: none !important;
}

html, body, * {
    font-family: "Arial", sans-serif;
}


/* HOME */

#home-left { position:relative; box-sizing: border-box; float:left; width:50%;  }
#home-right { position:relative; box-sizing: border-box; float:left; width:50%; }
#home-left .titre-home {
    /*font-size: 17px;*/
    font-size: 16px;
    padding: 10px;
    box-sizing: border-box;
    width: 100%;
    border-radius: 10px 10px 0 0;
    margin: 0;
    font-family: "Arial";
}
#home-left .bx-wrapper,
#home-left .bx-window,
#references .bx-wrapper,
#references .bx-window,
#home-right .bx-wrapper,
#home-right .bx-window {
    width: 100%;
    box-sizing: border-box;
}
#home-left .bx-window {
    height: 206px;
    overflow: hidden;
    border-radius: 0 0 10px 10px;
}
#home-left .bx-wrapper .bx-pager a {
    padding: 5px;
    font-family: "Arial";
    font-weight: normal;
    font-size: 17px;
    line-height: 12px;
}
#home-left .bx-wrapper .bx-pager {
    padding: 5px;
}
#home-left .bx-pager .pager-active,
#home-left .bx-pager .pager-link:hover {
    padding: 5px;
    line-height: 12px;
}


#main-home, #main {
    clear: both !important;
}



/* MENU HAUT */


#nav-top {
    width: 1000px;
    box-sizing: border-box;
    height: 62px;
    margin: 0;
    border-radius: 0 0 10px 10px;
    padding: 0;
    padding-right: 30px;
    position: fixed;
    z-index: 9999;
    line-height: 44px;
}
#nav-top:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
}
#nav-top .menu a {
    padding: 0 5px;
    padding-top: 8px;
    list-style-type: none;
    border-radius: 0;
    background: none;
    box-sizing: border-box;
    width: 130px !important;
    height: 62px !important;
    border-right: solid 1px rgba(255,255,255,0.2);
    font-size:  26px;
}

#nav-top a img { width: auto !important; height: 100% !important; }

#nav-top .menu a#burger { padding: 0 15px; line-height: 62px; font-size: 14px; width: auto !important; }
#nav-top .menu a#burger:hover { cursor: pointer; border-radius: 0 0 0 10px; }

#nav-top .iconesearch {
    margin-top: 15px !important;
    margin-left: 23px !important;
}
#nav-top .iconesearch img {
    width: auto !important;
    height: 28px !important;
    cursor: pointer;
}


#nav-top form input#key {
    float: left !important;
    border: none !important;
    width: 80px !important;
}

    
/* ------------ TITRE ACCUEIL ------------------ */


#home-title {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    height: 0;
    margin-bottom: 0;
    text-align: center;
    display: none;
}
h2.bigtitle {
    font-size: 18px;
    font-weight: bold;
    line-height: 0;
    text-align: center;
    margin: 0;
    padding: 0;
    font-weight: normal;
}

/* ------------ SWITCH AMBIANCE ------------------ */


#switchAmbiance {
    position: fixed;
    left: 0px;
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 999;
    border-radius: 0 10px 10px 0;
    transition: 0.4s;
}
#switchAmbiance.open { left: -100px; }
#switchAmbiance h3 { 
    position: absolute;
    top:  -80px;
    left: 10px;
    width: 220px;
    font-size: 24px;
    color:  #FFF;
}
#switchAmbiance ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: 0 10px 10px 0;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3);
}
#switchAmbiance ul li.title {
    position: relative;
    width: 100%;
    text-align: center;
    width: 100px;
    line-height: 30px;
    font-size: 12px;
    font-size: 22px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 0 10px 0 0;
}

body {
    --hauteur-max-animation-image: -200px;
    --hauteur-min-animation-image: -150px;
    --hauteur-max-animation-titre: -105px;
    --hauteur-min-animation-titre: -70px;
     --hauteur-max-animation-titre-bas: -70px;
     --hauteur-min-animation-titre-bas: -50px;
    --hauteur-max-animation-titre-dernier: -35px;
    --hauteur-min-animation-titre-dernier: -30px;
    --duree-animation:  4s;
}


@keyframes moveimage {
    0% {
        top: var(--hauteur-max-animation-image);
    }
    50% {
        top: var(--hauteur-min-animation-image);
    }
    100% {
        top: var(--hauteur-max-animation-image);
    }
}
@keyframes movetop {
    0% {
        top:  var(--hauteur-max-animation-titre);
    }
    50% {
        top:  var(--hauteur-min-animation-titre);
    }
    100% {
        top:  var(--hauteur-max-animation-titre);
    }
}
@keyframes movemiddle {
    0% {
        top:  var(--hauteur-max-animation-titre-bas);
    }
    50% {
        top:  var(--hauteur-min-animation-titre-bas);
    }
    100% {
        top:  var(--hauteur-max-animation-titre-bas);
    }
}
@keyframes movebottom {
    0% {
        top:  var(--hauteur-max-animation-titre-dernier);
    }
    50% {
        top:  var(--hauteur-min-animation-titre-dernier);
    }
    100% {
        top:  var(--hauteur-max-animation-titre-dernier);
    }
}


#switchAmbiance .image {
    position: absolute;
    top:  -200px;
    left: 10px;
    width: 64px;

    animation-duration: var(--duree-animation);
    animation-name: moveimage;
    animation-iteration-count: infinite;
}
#switchAmbiance h3.haut {
    top: -90px;
    transform: rotate(-20deg);
    transform-origin: left;

    animation-duration: var(--duree-animation);
    animation-name: movetop;
    animation-iteration-count: infinite;
}
#switchAmbiance h3.milieu {
    top: -50px;
    transform: rotate(-10deg);
    transform-origin: left;

    animation-duration: var(--duree-animation);
    animation-name: movemiddle;
    animation-iteration-count: infinite;
}
#switchAmbiance h3.bas {
    top: -20px;

    animation-duration: var(--duree-animation);
    animation-name: movebottom;
    animation-iteration-count: infinite;
}
#switchAmbiance ul li.title {  }

#switchAmbiance ul li.ambGroup {
    position: relative;
    display: block;
    width: 100px;
    height: 50px;
    padding: 0;
    margin: 0;
    text-align: center;
    line-height: 50px;
    vertical-align: middle;
    transition: 0.2s;
}

#switchAmbiance ul li.ambGroup ul li.amb,
#switchAmbiance ul li.ambGroup ul li.amb2 {
    position: absolute;
    left: 50px;
    top: 0;
    width: 50px;
    height: 50px;
    padding: 0;
    margin: 0;
    text-align: center;
    line-height: 50px;
    vertical-align: middle;
    transition: left 0.2s;
}
#switchAmbiance ul li.ambGroup ul li.amb2 {
    left: 0px;
}
#switchAmbiance ul li.amb:hover,
#switchAmbiance ul li.amb2:hover
{ cursor: pointer; }
#switchAmbiance ul li.amb img,
#switchAmbiance ul li.amb2 img {
    width: 34px;
    height: auto;
    vertical-align: middle;
}
#switchAmbiance ul .ambGroup:last-of-type li.amb {
    border-radius: 0 0 10px 0;
}

#switchAmbiance ul li.sep {
    width: 100px;
    height: 1px;
    margin: 10px 0;
    background: rgba(255,255,255,0.4);
}


/* MENU DROIT */


#nav-left .floatMenu {
    position: fixed;
    border-radius: 10px;
    overflow: hidden;
    min-height: 420px !important;
}

#nav-left .floatMenu .cat-accueil {
    height: 32px;
    padding-left: 20px;
    line-height: 23px;
    padding-top: 8px;}	
#nav-left .floatMenu .cat-accueil a {font-size:16px;vertical-align:middle;}

#nav-left .floatMenu .cat-search {
    height: 32px;
    padding-left: 20px;
    padding-top: 8px;
    font-size:20px;}


#nav-left .floatMenu .cat-solutions, #nav-left .floatMenu .cat-ref {
     /* height: 54px;*/
    padding-left: 20px;
    padding-top: 6px; 
	margin-bottom:10px;}	
#nav-left .floatMenu .cat-solutions  a, #nav-left .floatMenu .cat-ref a{ color:#fff; font-size:16px;vertical-align:middle; line-height:.9em;  }	

#nav-left .floatMenu .cat {
     /* height: 54px;*/
    padding-left: 20px;
    padding-top: 6px; 
	margin-bottom:10px;}	
#nav-left .floatMenu .cat a { font-size:16px;vertical-align:middle; line-height:.9em;  }
	
#nav-left .floatMenu .padding{ padding:10px; width:200px; }
#nav-left .floatMenu ul li{ list-style-type:none;  padding-left:15px; margin-bottom:5px; }
#nav-left .floatMenu ul li.devis_mb { margin-bottom:25px;}
/*#nav-left .floatMenu ul li a.active{ background:#888888; color:#fff;  padding: 3px; }*/
#nav-left .floatMenu ul li a:hover,
#nav-left .floatMenu ul li a.active {
    padding: 3px;
    font-weight: bolder;
}



/* SLIDER À LA UNE */

#slider1 li, .image-titre li { position: relative; }
#slider1 h3, .image-titre h3 {
    position: absolute;
    right: 15px;
    text-align: right;
    top: 10px;
    /*font-size: 26px;*/
    font-size: 22px;
    font-weight: bolder;
    font-weight: 900;
    /* font-family: "Euphemia UCAS Bold", sans-serif; */
    font-stretch: condensed;
    /*letter-spacing: -0.4px;*/
}

#slider1 p, .image-titre p {
    position: absolute;
    right: 15px;
    text-align: right;
    bottom: 15px;
    font-size: 22px !important;
    font-weight: normal;
    max-width: calc(100% - 96px);
    /* font-family: "Euphemia UCAS", sans-serif; */
    font-stretch: normal;
    letter-spacing: 0;
    line-height: 32px;
}

#slider1 img.icone, .image-titre img.icone {
    width: auto;
    height: 60px;
    position: absolute;
    left: 20px;
    bottom: 15px;
}

.image-titre {
    box-sizing: border-box;
    position: relative;
    height: 245px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 15px;
}
.image-titre h3 {
    top:  48px;
}

/* CONTACTEZ NOUS */

.contacteznous,
.devis-perso {
    height:107px !important;
    /* float:right;  */
    padding:8px;
    width: 100%;
    overflow: hidden;
    border-radius: 10px;
    margin-bottom: 9px;
    box-sizing: border-box;
}
.contacteznous .bx-window,
.contacteznous .bx-wrapper {
    width: 100% !important;
}
.contacteznous h3 {
    display:inline-block;
    width:auto;
    float:left;
    font-family: "Arial";
    font-size: 22px;
    line-height: normal;
    font-weight: bolder;
    margin: 0;
    margin-top: 15px;
    text-decoration:none;
}
.contacteznous h3 a {
    text-decoration:none;
    cursor:pointer;
}
.contacteznous p {
    width: auto;
    float:left;
    font-family: "Arial";
    font-weight: normal;
    /*font-size: 17px;*/
    font-size: 16px;
    text-decoration:none;
}
.contacteznous p a {
    text-decoration: none; 
    cursor:pointer;
}
.contacteznous .pic  {
    display:inline-block;
    float:right;
    width:80px;
    text-align:right;
}
.contacteznous .pic img { width:80px; height:80px;}
.contacteznous .detail { float:left;}
#container:not(.home) .contacteznous { max-width: 440px; }

.contacteznous {padding-top: 0 !important; padding-bottom: 0 !important; height: 76px !important;}


/* Laurent Lagarde 2024-01 - ajout icônes responsive entre le cadre Contactez-nous et Votre devis */

.contacteznous-bandeau-intermediaire {background: none !important; padding-left: 0 !important; margin-bottom: 8px !important;}
.contacteznous-bandeau-intermediaire div.device {float: left; clear: both; text-align: center; margin-top: 7px;}
.contacteznous-bandeau-intermediaire div.device.break {clear: both;}
.contacteznous-bandeau-intermediaire div.device i {font-size: 40px;}



/*.devis-perso {
    width: 100%;
    text-align: center;
    padding: 0;
    margin-bottom: 15px;
    float: right;
    padding-left: 10px;
}
.devis-perso .etiquette {
    border-radius: 10px;
    margin: 0;
    display: block;
    text-align: left;
    font-weight: normal;
    line-height: 18px;
    box-sizing: border-box;
    font-size:17px;
    padding: 2px 3px 3px 10px !important;
    width:100%;
    box-sizing: border-box;
}*/
#container:not(.home) .devis-perso { max-width: 440px; }



/* bandeau cookies */

#container #cookiesBanner {
    position: fixed;
    bottom: 30px;
    left: 50%;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 1000px;
    padding: 15px;
    background: #FFFFFF;
    z-index: 9999;
    border-radius: 10px;
}

#container #cookiesBanner p {
    display: inline-block;
    width: auto;
    margin: 0;
    padding: 0;
}

#container #cookiesBanner p.bouton {
    padding: 5px 10px;
    border-radius: 10px;
    margin-top: 10px;
    margin-right: 10px;
}
#container #cookiesBanner p.bouton:hover {
    cursor: pointer;
    opacity: 0.8;
}

/* SLIDER TÉMOIGNAGES */


#slider2 { width: 100% !important; }
#slider2 li {
    height: auto;
    min-height: 0;
}
#slider2 li h3 { margin-top: 0; font-size: 17px; }
#slider2 li .message p strong { font-weight: normal; }
#slider2 .pseudo { font-weight: normal !important; font-size: 12px; cursor: pointer; margin-top: 3px; }



/* TABLEAUX */


#myTable_info { width: 100%; }
#myTable_paginate { display: none; }


/* BLOCS PRODUIT-1 */


.produit-1 .pic {width:130px !important; height:120px !important; float:left; clear:left; margin-right: 35px;}
.produit-1 .pic img {width:130px !important; height:auto !important;}

.produit-1 .savoirplus { float: right; line-height: 18px; font-size: 13px !important; font-weight: bolder; }



/* CAROUSEL PRODUITS */


#carousel { height: auto !important; }
#carousel li.fin {
    text-align: center;
    border-radius: 10px !important;
    /* width: 227px !important; */
    margin: 0 !important;
    /* margin-right: 30px !important; */
    margin-bottom: 5px;
    padding: 0 !important
}
#carousel li.fin:first-child {
    margin-right: 0 !important;
}
#carousel li.fin h3 {
    width: 100%;
    background: none;
    margin: 10px 0;
    font-size: 14px;
    /*font-size: 16px;*/
    margin-top: 0px;
}
#carousel li.fin p { padding: 0 5px; font-size: 16px; margin-bottom: 5px; margin-top: 20px; }
/*#carousel li.fin img { width: auto; height: 80px; margin-bottom: 15px; }*/
#carousel li.fin img { width: auto; height: 80px; margin-bottom: 5px; margin-top: 5px; }

#content-home #carousel-wrapper {
    padding: 0;
}

#content-home #carousel-wrapper .bx-wrapper,
#content-home #carousel-wrapper .bx-window {
    width: 100% !important;
}
#content-home #carousel-wrapper .bx-next {
    right: -30px;
}



/* ------------ ENTETE Rubrique (ancien) ------------------ */
.entete-rubrique {
    float: left;
    width: 300px;
    padding:5px 0 10px 0px;
}
.entete-rubrique h2 { font-size: 18px; display:block; margin: 0; margin-bottom: 5px; }
.entete-rubrique p { line-height: 16px; font-size: 14px; }
.entete-rubrique img { float:left; margin-right:15px; margin-bottom: 15px; height: 55px; width: auto; }




/* - - - - - ENTETE RUBRIQUE (nouveau) - - - - - */

#main.large { min-height: 715px; }
#main.large #content {
    width: 1000px;
    padding: 0;
}
#container:not(.home) #main.large .contacteznous,
#container:not(.home) #main.large .devis-perso {
    max-width: 485px;
    width: 485px;
}

#nav-top .menu a { width: 127.5px !important; }

#container:not(.home) #main.large .contacteznous {
    padding-left: 20px;
    height: 100px;
}
#main.large .devis-perso .etiquette,
#main.large #slider2 li h3,
#main.large #slider2 li .message,
#main.large #slider2 li .pseudo
{ padding-left: 25px !important; }

#main.large .entete-rubrique {
    float: left;
    width: 500px;
    padding: 0;
    padding-right: 15px;
    padding-top: 20px;
    box-sizing: border-box;
}
#main.large .entete-rubrique h2 {
    margin-top: 5px;
    margin-bottom: 3px;
    line-height: normal;
    font-size: 26px;
    font-weight: bolder;
}
#main.large .produit-1 .pic {
    margin-right: 3px;
} 
#main.large .produit-1 .pic img {
    width: 110px;
    max-width: 110px;
}
#main.large .entete-rubrique img {
    height: 80px;
    margin-left: 15px;
    margin-right: 35px;
}
#main.large .entete-rubrique h2 {
    font-weight: normal !important;
}

/* - - - - - ENTETE RUBRIQUE (nouveau) - - - - - */



#content { 
	display:inline-block;
	*display: inline; /* IE6 et IE7 */
	zoom: 1; /* IE6 et IE7 */
	float:left;
	margin:0;
	padding: 0 0 0 12px;
    padding-bottom: 30px;
	width:763px;
}

#content .contact-big-image {
    margin-top: 15px;
}
#content .contact-big-image img {
    margin-right: 60px;
    height: auto;
    width: 90px;
}
#content .contact-big-image img,
#content .contact-big-image p,
#content .contact-big-image p span {
    display: inline-block;
    font-family: "Euphemia UCAS";
    font-size: 16px;
    vertical-align: middle;
}

#content .contact-big-image p span {
    font-size: 18px;
    padding-left: 90px;
}


/* mentions legale s*/

#container .mentions-legales h3 {
    font-weight: bolder;
}
#container .mentions-legales p {
    margin: 0;
    padding: 0;
}

#container .mentions-legales p.margin {
    margin-bottom: 10px;
}



/* FOOTER */



#footer {
    clear:both;
    text-align: center;
    font-size:11px;
}
#footer a {text-decoration:none;}
.menu-bas {
    width: 100%;
    text-align: center;
    padding: 10px 0;
}
.menu-bas ul li {
    display: inline-block;
    float:none;
    width: auto;
    font-size:12px;
    list-style:none;
    margin: 0;
    line-height: 20px;
    border-right: solid 1px rgba(0, 0, 0, 0.2);
    padding: 0 8px;
    font-weight:normal;
}
.menu-bas ul li:last-child { border: none; }
.menu-bas ul li a { font-size:12px; font-weight:normal;}


/* - - - - - - - - - - MOBILE - - - - - - - - - - */

@media screen and (max-width:1240px), screen and (max-device-width:1240px) {
    #switchAmbiance h3,
    #switchAmbiance .image {
        display: none;
    }
    #switchAmbiance {
        left: -120px;
    }
    #switchAmbiance.open { left: 0px; }
}

@media screen and (max-width:768px), screen and (max-device-width:768px) {
    
    #main {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    #nav-top .menu a#burger { font-size: 28px; }
    #nav-top form input#key { width: 90px !important; }
    
    #carousel li.fin {
        width: 300px !important;
        margin-right: 47px !important;
    }
    
    #content-home #carousel-wrapper .bx-prev { left: 0px; }
    #content-home #carousel-wrapper .bx-next { right: 0px; }
    
}