﻿@CHARSET "utf-8";

/* PREPARATION RESPONSIVE */
/* PC */
@media all and (min-width:781px) {
	#bandeau .menu-wrapper  {display:block !important; height:32px !important;}
    #bandeau-mobile {display:none;}
}

@media all and (max-width:1260px) {

    /* Bandeau */
	#bandeau .global {padding:0px 10px;}
    #centre .global {padding:15px 20px;}
    
	.iframe-responsive-wrapper {position: relative;}
	#centre .iframe-responsive-wrapper .iframe-ratio {display: block;    width: 97%;   height: auto;}
	.iframe-responsive-wrapper iframe{position: absolute;top: 0;left: 0;width: 97% !important; height: 97% !important;}
	
	
    video {width:100%; height:auto;}
    
    		#accueil-mosaiques .accueil-mosaique {margin:5px !important;}
        
        	#pied .col {margin:32px 40px !important;}
   
        
     .tableau-parent-5 .tableau-enfant {width:calc(33.333% - 35px) !important; }
   
 }

@media all and (max-width:1259px) {

}
@media all and (max-width:1170px) {

	#bandeau #logo a img {width: 165px;}
	#bandeau.sm #logo a img {}
	#bandeau.sm #menu .menu-element {}
	
	}


@media all and (max-width:1090px) {

    /* Bandeau */
    #bandeau .titre {}
    #bandeau.sm .menu-wrapper {}
    

    /* Menu */
    #centre .global {padding:15px 20px;}

    #parallax-window-9 .global .cadreinfos .info {margin-left:2%; }

}

@media all and (max-width:1065px) {

			#bandeau #logo {float:none;}
		#bandeau.sm #logo{padding-top:5px !important;}
		#bandeau #menu {padding-top: 30px;}
		
		#bandeau.sm #logo {float:left;}
		#bandeau.sm #menu .menu-element {}
	}



@media all and (max-width:1024px) {
 	
}

@media all and (max-width:990px) {
	#bandeau.sm #logo a img {width:95px;}
	#bandeau #logo{padding:5px 0;}
	#bandeau #menu{padding-top:35px;}
	#bandeau .menu-wrapper {}
	#bandeau #menu {text-align:center;}
	#bandeau #menu .menu-element {}
	#bandeau.sm #menu .menu-element > a > span, 
	#bandeau.sm #menu .menu-element > span {height:30px;}
		
	/* Module Contact */
 	#module-contact #module-contact-adresse {float:none; width:100%;}
	#module-contact .googlemap {float:none;  width:100%; margin:20px 0;}
	
	
	#realisations .conteneur .contenu .photo {width:250px;}
	#realisations .conteneur .contenu .photo img {width:auto; height:auto; max-width:100%; max-height:100%;}
	#pied .col{margin:10px 40px !important;}
}

@media all and (max-width:956px) {
    #parallax-window-9 .global .cadreinfos .info {width:24%; }
}	

@media all and (max-width:930px) {

	.tableau-parent-4 .tableau-enfant {width:calc(33.333% - 35px) !important;}
	/* Table responsive*/
	.table-responsive-label {display:table-row;}
}
@media all and (max-width:910px) {
	
    .global {padding:0 20px;}
	#bandeau #menu .menu-element {}
    
   
    
    #centre #parallax-window-9 .cadreinfos {text-align:left;}
    #centre #parallax-window-9 .cadreinfos .tel {border:none; padding-right:0; margin-left:62px;}
	
}

@media all and (max-width:867px) {
#bandeau.sm #menu{padding-top:4px !important;}
}


@media all and (max-width:860px) {
	.tableau-parent-4 .tableau-enfant {width:calc(50% - 35px) !important;}
}
@media all and (max-width:840px) {
	
	#bandeau #menu .menu-element {}
		#bandeau.sm #logo {float:none;}
	
	    
}

@media all and (max-width:810px) {
    
    #bandeau.sm #menu .menu-element {}
     
    .global {padding:0 10px;}
        
    #centre .global {padding:15px 10px;}
    
    #pied .col {min-width:100%;}

}


/* Tablette */
@media all and (max-width:780px) {

    body {width:100%; font-size:16px;}
    #centre img{ display: inherit;margin:0px}
	#centre table {padding:0; border-spacing : 0; border-collapse : collapse;}
    #centre table td {display: inline-block; width:100%;padding:0;}
	#centre table td img { margin: 0 auto;}
    #global {min-width:inherit; margin:0 auto; width:auto; padding-top:0px;}


    /* Droite */
    #droite {display:none;}

    /* Gauche */
    #gauche {display:none;}

    /* Centre */
    #centre {width:auto; margin:0; padding-top:0px;}
    #centre .global .contenu-wrapper {padding-top:0px;}

    /* Fil d'ariane */
    #ariane {display:none;}

    /* Contenu */
    #centre img {max-width:100%; height:auto; width:auto;}
	#centre h1{text-align:left !important;}
	
	
    /* Formulaire */
    input.bouton {height:38px;}
    #centre .input-text,
    #centre input {width:97%;height:30px;}
    #centre .submit input, 
    #centre input.submit,
    #centre .bouton, 
    #centre #contenu a.bouton {height:35px;}
    #centre select {height:30px; }
    #centre textarea,
    #centre textarea {width:97% !important; }
    #centre .form140 {float:none; text-align:left;}

    #centre .submit,
	#module-contact #contact-captcha { margin-left:0;}
    #module-contact .form div {display:block;}
	#contact-container .contact-vide {display:none;}

    /* Menu mobile */

    /* Bandeau */
	#bandeau {position: relative;left: unset;top: unset; height:auto !important; border-bottom:0;}
	#bandeau #bandeau-conteneur .global {padding:0;}
	#bandeau-contact {margin:0; height:auto; min-height:85px;}
	#bandeau #logo{padding: 10px 0 0 5px;}
		
	/* Menu mobile */
    #bandeau-mobile { min-width:inherit; width:100%;  min-height:15px;height:inherit;  background:#fff; }
    
	#bandeau-mobile .menu-icon {padding: 5px 0px 0px 0px;}
	#bandeau-mobile .menu-icon a.enseigne {color: #d2221e; display: block; float: right; padding-right: 15px; text-decoration:none;}
   
   
    #bandeau-mobile #bandeau-mobile-icones {margin:5px 15px 0;width:auto;min-width:435px; float:right; clear:both; }

	#bandeau-mobile-telephone {position:relative; padding:0 5px; float:right; color:#fff; background: ; width:auto; min-width:190px; height:34px; margin-left:40px; font-size:22px; font-weight:700;  display: flex; flex-direction: column;justify-content: center; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px;  }

	#bandeau-mobile-telephone span.fa-stack {width:34px; height:34px; margin:0px; padding:0px; line-height:34px; position:absolute; top:0px; left:0px; }
	#bandeau-mobile-telephone i.fa-circle {font-size: 29px;}
	#bandeau-mobile-telephone i.fa-phone {color:; font-size: 23px;}
	#bandeau-mobile-telephone .numero {margin-left:32px; letter-spacing:1px;}
	#bandeau-mobile-telephone a,#bandeau-mobile-telephone a:visited, #bandeau-mobile-telephone a:hover {text-decoration:none; color:#fff;}
	
	/* Adresse de contact */
	#bandeau-mobile-mail {position:relative; float:right; padding:0 5px 0 6px; margin-left:40px; height:35px; border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; -khtml-border-radius: 16px;   -moz-box-shadow: 0px 0px 2px #BCBCBC; -webkit-box-shadow: 0px 0px 2px #BCBCBC;  box-shadow: 0px 0px 2px #BCBCBC;}
	#bandeau-mobile-mail a,
	#bandeau-mobile-mail a:visited,
	#bandeau-mobile-mail:hover a {text-decoration:none;}
	#bandeau-mobile-mail i.fa-envelope-o {color:;height: 34px; font-size: 25px; display: flex;flex-direction: column;justify-content: center; }
	#bandeau-mobile-mail:hover {background:;}
	#bandeau-mobile-mail:hover .fa-envelope-o {color:#fff;}

	/* bas */
	#bandeau-mobile-bas {position: relative; z-index: 45; clear:both; background:#ffffff; border-bottom:5px solid #c33424;  cursor:pointer; }
	#bandeau-mobile-bas > span {position:relative; line-height: 45px; padding:5px 0px 2px 10px; display: block; font-size: 26px;  width: auto; height: 40px; text-transform: uppercase; text-align: center; color: #d2221e; text-decoration: none;}
	#bandeau-mobile-bas i {position: absolute; left: 10px; top: 6px; color:#d2221e; font-size:38px;}
   
	
    /* Menu mobile */
	
	#bandeau .menu-wrapper {width:100%; background:#ffffff; padding:5px 0; display:none; z-index:100 ;border-bottom:1px solid #c33424;}
	#bandeau #menu #menu-conteneur {float:none;}
	#bandeau #menu {height:auto; padding:0 !important;}
	#bandeau #menu-conteneur {padding-bottom:0px; text-align:left;}
	#bandeau #menu-conteneur .global {padding:0;}
	
	#bandeau #menu .menu-element {margin:0px 0 5px; padding:5px 7px 0; display:block; color:#393939; font-size:16px;}
	#bandeau #menu .menu-element > a > span, 
	#bandeau #menu .menu-element > a:visited > span, 
	#bandeau #menu .menu-element > span {height:auto; padding:0px; padding-top:10px; text-align:left;display:block; border-top: 1px solid #eceaea; color:#393939; font-size:16px; font-weight: 400; font-family:'Lato', sans-serif; text-transform:none;}
	#bandeau #menu .menu-element:first-child > a > span,
    #bandeau #menu .menu-element:first-child > span { padding-top:0px;border-top: none;}
    
    #bandeau #menu .menu-element.selected > span,
    #bandeau #menu .menu-element.selected > a > span,
    #bandeau #menu .menu-element.selected > a:visited > span,
    #bandeau #menu .menu-element:hover > span,
    #bandeau #menu .menu-element:hover > a > span,
  	#bandeau #menu .menu-element:hover > a:visited > span {border-bottom:none; color:#c33424; font-weight: 400; }
         
	#bandeau #menu .smenu-conteneur {border:none; width:calc(100% - 40px); padding:0 20px; display:block !important; position:relative; left:0 !important; top:0; background:none; min-height: 0; }
	
    #bandeau #menu .smenu-conteneur .global {padding: 0 !important;} 
	#bandeau #menu .smenu-centre {border:none; margin:0; width:auto;}
	#bandeau #menu .ssmenu-conteneur-images {display:none !important;}
	#bandeau #menu .smenu-centre-menus {float:none; width:auto;}
	#bandeau #menu .smenu-conteneur .smenu-element {display:block; width:auto; margin:6px 0; line-height:17px;}
	#bandeau #menu .smenu-element > a > span, 
	#bandeau #menu .smenu-element > span {padding:0px; display:block !important; border:none;width:auto; text-decoration:none; font-size:0.85em; text-transform: none;  text-align:left; color:#393939; }
	#bandeau #menu .smenu-element > a > span::before,
	#bandeau #menu .smenu-element > span::before {content:""; display:none;}
	#bandeau #menu .smenu-element.selected > span,
   	#bandeau #menu .smenu-element.selected > a > span,
   	#bandeau #menu .smenu-element.selected > a:visited > span,
   	#bandeau #menu .smenu-element:hover > span,
   	#bandeau #menu .smenu-element:hover > a > span,
    #bandeau #menu .smenu-element:hover > a:visited > span {text-decoration:none; color:#c33424;}

    #bandeau #menu .ssmenu-element {}
    #bandeau #menu .ssmenu-element a,
    #bandeau #menu .ssmenu-element a:visited {font-size:0.8em; text-decoration:none; padding-left:7px;}
	#bandeau #menu .ssmenu-element a:hover {text-decoration:underline;}
    

    #centre table {float:none !important; margin:5px auto; border:none !important; width:100% !important;}
    
    #centre #parallax-window-1 h1 {font-size:35px !important;}
    
    #parallax-window-3 table {float:none !important; margin:5px auto; border:none !important; width:100% !important; text-align:center;}
	#centre #parallax-window-3 td {padding:0;}
	

    #centre #parallax-window-9 .global .cadreinfos {height:auto; padding:0px;}
    #centre #parallax-window-9 .global .cadreinfos .info {float: none; margin: 0 auto; padding-left: 40px; width: auto;}
   
    #centre #parallax-window-9 .cadreinfos .tel {margin-left:15px; display:block;}
    #centre #parallax-window-9 .cadreinfos .adresse{margin-left:15px; display:block;} 



	.tableau-parent-3 .tableau-enfant, 
	.tableau-parent-4 .tableau-enfant, 
	.tableau-parent-5 .tableau-enfant {width:calc(50% - 35px) !important; }
		
	.table-responsive-50-pourcent tr,
    .table-responsive-100-pourcent tr {	width: 100%; margin: 0 0 1rem;}	


}

@media only screen and (max-width: 767px) {
	
	/* Table responsive */
	table.table-responsive { margin-bottom: 0; }
	.pinned { position: absolute; left: 0; top: 0; z-index:20; background: #fff; width: 181px; overflow: hidden; }
	.pinned table { border-right: none; border-left: none; width: 100%; }
	.pinned table th, .pinned table td, .pinned .table-responsive-label th,
	.pinned table th p, .pinned table td p,
	table.table-responsive th:first-child p, table.table-responsive td:first-child p, 
	table.table-responsive td:first-child p	{ text-align:left !important; margin-top:6px; }
	
	.pinned td:last-child { border-bottom: 0; }
	
	div.table-wrapper { position: relative; overflow: hidden; border-right: 1px solid #ccc; }
	div.table-wrapper div.scrollable table {}
	div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden; }	
	
	table.table-responsive td, table.table-responsive th {  white-space: nowrap; overflow: hidden; }
	table.table-responsive thead th {}
	table.table-responsive th:first-child, table.table-responsive td:first-child, 
	table.table-responsive td:first-child, table.table-responsive.pinned td,
	table.table-responsive .table-responsive-label th:first-child	{opacity:0;  white-space: initial; }
	.pinned table th, .pinned table td, .pinned .table-responsive-label th,
	table.table-responsive th:first-child, table.table-responsive td:first-child, 
	table.table-responsive td:first-child, table.table-responsive.pinned td,
	table.table-responsive .table-responsive-label th:first-child	{ width:180px !important; max-width:180px; min-width:180px; word-wrap:break-word; box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-khtml-box-sizing:border-box; }
	.table-responsive-label th.table-responsive-label-th {display:table-cell !important;}
	
		
}
@media all and (max-width:685px) {

    #centre #parallax-window-9 table tr td, #centre #parallax-window-9 table tr td:last-child {text-align:left; }
    
    #centre p {margin-left:10px;}
    
	#realisations .conteneur .contenu .photo {float:none; margin:10px auto;}
	#realisations .conteneur .contenu .extrait {min-height:0;}
	
	


	.tableau-enfant {margin:5px !important;}
	.tableau-parent-2 .tableau-enfant,
	.tableau-parent-3 .tableau-enfant,
	.tableau-parent-4 .tableau-enfant,
	.tableau-parent-5 .tableau-enfant {width:calc(50% - 15px) !important; }
}


@media all and (max-width: 605px) {
  	
	#renseignement-titre {display:block;}
	#renseignement-titre::after {display:none;}
	#renseignement-contenu {margin-left:0; display:block;}
	#renseignement-telephone {width:calc(100% - 75px);}
	
	/* Table responsive */
	.pinned {width:136px;}
	.pinned table th, .pinned table td, .pinned .table-responsive-label th,
	table.table-responsive th:first-child, table.table-responsive td:first-child, 
	table.table-responsive td:first-child, table.table-responsive.pinned td,
	table.table-responsive .table-responsive-label th:first-child {max-width:115px; width:115px !important; min-width:115px;font-size:15px;  box-sizing: initial;-webkit-box-sizing: initial;-moz-box-sizing: initial;-khtml-box-sizing:initial;  }
	table.table-responsive th {font-size:15px;}
	
}

@media all and (max-width: 500px) {
  
	.tableau-parent-2 .tableau-enfant,
	.tableau-parent-3 .tableau-enfant,
	.tableau-parent-4 .tableau-enfant,
	.tableau-parent-5 .tableau-enfant {margin:5px auto !important; width:100% !important; }
}

@media all and (max-width:480px) {
    #centre img {}
    #bandeau-mobile #bandeau-menu {float:left;}

    #parallax-window-1 p {margin:0;}

    #back-to-top {width:55px; height:58px;}
    #back-to-top i {width:55px; line-height:50px;}
    
    
    
	#centre h1 {margin:10px 0 10px 0px;}
	#centre h2 {margin:10px 0 20px 5px;}
	#centre h3 {margin-left:10px;}
	#centre p {margin-left:10px;}
	#centre ul {margin-left:0px;}
	
	#centre #parallax-window-1 h1 {font-size:28px !important;}
	
	
	#accueil-mosaiques .accueil-mosaique {margin:15px 5px !important;}
	
}

@media all and (max-width:450px) {		
	/* LABEL SUR LE COTÉ */
	.table-responsive-50-pourcent td {padding-left: 110px;}
	.table-responsive-50-pourcent td.nolabel {padding-left: 8px; text-align:center;}
	.table-responsive-50-pourcent td::before {width: 90px;padding: 5px;text-align: center;justify-content: center;line-height: 15px;}
	.table-responsive-50-pourcent td.nolabel::before {display:none;}

	/* LABEL AU DESSUS */
	.table-responsive-50-pourcent td,
	.table-responsive-100-pourcent td {padding: 0 0 7px; text-align: center !important;}
	.table-responsive-50-pourcent td.nolabel, 
	.table-responsive-100-pourcent td.nolabel { background: #fff !important;}
	.table-responsive-50-pourcent td::before, 
	.table-responsive-100-pourcent td::before {padding: 8px 5px; margin-bottom: 10px; text-align: center;justify-content: center;line-height: 15px;position: relative;top: 0;left: 0;width: 100%;	box-sizing: border-box;}
	.table-responsive-50-pourcent td.nolabel::before,
	.table-responsive-100-pourcent td.nolabel::before {display:none;}
	.table-responsive-50-pourcent tr,
	.table-responsive-100-pourcent tr {margin: 0 0 38px;}
	
	/* Table responsive */
	.pinned {width:116px;}
	.pinned table th, .pinned table td, .pinned .table-responsive-label th,
	table.table-responsive th:first-child, table.table-responsive td:first-child, 
	table.table-responsive td:first-child, table.table-responsive.pinned td,
	table.table-responsive .table-responsive-label th:first-child {max-width:95px; width:95px !important; font-size:14px; box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-khtml-box-sizing:border-box; }

}
/* Smartphone */
@media all and (max-width:435px) {	
	
	#accueil-mosaiques{margin:10px auto;}
    #centre {padding-top:0px;}
    
    #bandeau-mobile #bandeau-mobile-icones {min-width:unset; width:210px; float:none; margin:0 auto;}
    #bandeau-mobile #bandeau-mobile-mail {width: 26px; margin: 5px auto; float:none;}
    #bandeau-mobile #bandeau-mobile-telephone {margin: 0 auto; float:none;}
    	
	#cookie-message-wrapper {
    	padding: 20px 10px 20px 10px;
    }
    
    #cookie-choix-contenu .cookie-choix span {
    	font-size:11px;
    }
    
    #cookie-consent-form .categorie .titre {
    	width: 50%;
    }
    #cookie-consent-form .categorie .configuration {
    	width: 48%;
    }
}

@media all and (max-width:385px) {

	#accueil-mosaiques .accueil-mosaique {max-width:280px; }
	#accueil-mosaiques .accueil-mosaique img {width:100%; height:auto; margin: 0 !important;}
	
	#centre img {float:none !important; margin: 10px auto !important;}
}

@media all and (max-width:320px) {	

}
