﻿@CHARSET "utf-8";

/* PREPARATION RESPONSIVE */
.w780 {display:none;}
.w435 {display:none;}
.w1260 {display:block;}

/* PC */
@media all and (min-width:781px) {
    #bandeau-mobile {display:none;}
    #menumobile-wrapper {display:none;}
    #menumobile {display:none !important;}
}
@media all and (max-width:1350px) {
	#gabarit-page {margin: 0;padding: 0 10px;}
}
@media all and (max-width:1259px) {

    /* Bandeau */
    #bandeau .titre {}
    #bandeau.sm .menu-wrapper {}

    /* Menu */
    #bandeau.sm #menu .menu-element,
    #menu .menu-element {}
    
    
	.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;}
	
    .tableau-parent-5 .tableau-enfant {width:calc(33.333% - 35px) !important; }
    
    video {width:100%; height:auto;}
   
 }
 @media all and (max-width:1193px) {

	#gabarit-page .global-gabarit.global-gabarit-image > div  {width: 55%;}
	#gabarit-page .gabarit-image {width: calc(50% - 105px);}
}
@media all and (max-width:1170px) {

	#bandeau .global {padding:0 25px;}
}

@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:956px) {

	#bandeau #logo a img {height: 85px;}

    #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) {

	#bandeau #logo a img {height: 65px;}
	
    .global {padding:0 20px;}
	
        
    #centre .global {padding:15px 20px;}
    #pied .col {margin:0 5px 10px;}
    
    #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:860px) {
	#gabarit-photo .gabarit-gauche-image,
    #gabarit-photo .gabarit-droite-image {max-width:50%;}
    
    .tableau-parent-4 .tableau-enfant {width:calc(50% - 35px) !important;}
}
@media all and (max-width:840px) {
	
	#bandeau.sm #logo {margin-top: 10px;}
	#bandeau.sm #logo a img {height: 45px;}
	
    #pied .col{min-width:20px;}
    
}
@media all and (max-width:830px) {
	#gabarit-page .gabarit-gauche, #gabarit-page .gabarit-droite {flex-direction: column;justify-content: center;align-items: center;}
	#gabarit-page .global-gabarit > div {width: 100% !important;}
	#gabarit-page .gabarit-image {position: relative;top:unset;left: unset;right: unset;margin:10px auto; width: auto;height: 265px;}
	#gabarit-page .gabarit-texte {margin-top:10px;}
}
@media all and (max-width:810px) {
    
    .global {padding:0 10px;}
        
    #centre .global {padding:15px 10px;}
    
    #pied .col {margin:0 5px 10px; min-width:100%;}

}


/* Tablette */
@media all and (max-width:780px) {
    .w1260 {display:none;}
    .w435 {display:none;}
    .w780 {display:block;}


    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;}

	
    /* Bandeau */
    #bandeau {display:none;}

    /* 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;}

    /* Formulaire */
    input.bouton {min-height:38px;}
    #centre .input-text,
    #centre input {width:97%;height:30px;}
    #centre .submit input, 
    #centre input.submit,
    #centre .bouton, 
    #centre #contenu a.bouton {min-height:35px;}
    #centre select {height:30px; }
    #centre textarea,
    #centre textarea {width:97% !important; }
    #centre .form140 {float:none; text-align:left;}

    #centre .submit { margin-left:0;}

    /* Menu mobile */
    #bandeau-mobile {min-height:70px;height:inherit; min-width:inherit; background:#ffffff; border-bottom:5px solid #75005b; width:100%; }
    #bandeau-mobile .menu-icon {padding:5px 0px 2px 10px;}
    #bandeau-mobile .menu-icon .fa-bars {color:#75005b; font-size:38px;position: absolute;}
    #bandeau-mobile .menu-icon a.enseigne {color: #75005b; 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 #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 #bandeau-mobile-mail a,
	#bandeau-mobile #bandeau-mobile-mail a:visited,
	#bandeau-mobile #bandeau-mobile-mail a:hover {text-decoration:none;}
	#bandeau-mobile #bandeau-mobile-mail i.fa-envelope-o {color:#75005b;height: 34px; font-size: 25px; display: flex;flex-direction: column;justify-content: center; }
	#bandeau-mobile #bandeau-mobile-mail:hover {background:#75005b;}
	#bandeau-mobile #bandeau-mobile-mail:hover i.fa-envelope-o {color:#fff;}
		
	/* Téléphone */
   	#bandeau-mobile #bandeau-mobile-telephone {position:relative;background:#75005b; background-size:9%; float:right; line-height:30px; width:210px; height:30px; font-size:20px; font-weight:700; color:#ffffff; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px;  }
	#bandeau-mobile #bandeau-mobile-telephone a,
	#bandeau-mobile #bandeau-mobile-telephone a:visited,
	#bandeau-mobile #bandeau-mobile-telephone a:hover { color:#fff; text-decoration:none; font-size:24px; font-weight:700;}	
	
	#bandeau-mobile #bandeau-mobile-telephone span.fa-stack {width:26px; height:26px; margin:0px; padding:0px; line-height:31px; position:absolute; top:0px; left:0px; }
	#bandeau-mobile #bandeau-mobile-telephone i.fa-circle {font-size: 24px;}
	#bandeau-mobile #bandeau-mobile-telephone i.fa-phone {color:#75005b; font-size: 17px;}
	#bandeau-mobile #bandeau-mobile-telephone .numero {letter-spacing:1px;margin-left: 32px;}


	#menumobile-wrapper {display:block;}
    #menumobile {width:100%; background:#ffffff; padding:5px 0; border-bottom:1px solid #ccc; display:none; position:absolute; z-index:1000;}
    #menumobile .menumobile-element {margin:15px 0 5px 0; padding:0 7px;}
    #menumobile .menumobile-element span,
    #menumobile .menumobile-element a,
    #menumobile .menumobile-element a:visited {text-decoration:none;color:#1d1d1b; font-size:17px;}
    #menumobile .menumobile-element.menumobile-element-selected span,
    #menumobile .menumobile-element.menumobile-element-selected a,
    #menumobile .menumobile-element.menumobile-element-selected a:visited {color:#000000;}
    #menumobile .menumobile-element a:hover {color:#75005b;}
    #menumobile .smenumobile-conteneur {padding:0 20px;}
    #menumobile .smenumobile-conteneur .smenumobile-element {margin:6px 0; line-height:17px;}
    #menumobile .smenumobile-conteneur .smenumobile-element span,
    #menumobile .smenumobile-conteneur .smenumobile-element a,
    #menumobile .smenumobile-conteneur .smenumobile-element a:visited {text-decoration:none; font-size:0.85em; }
    #menumobile .smenumobile-conteneur .smenumobile-element span {font-weight:bold;}
    #menumobile .smenumobile-conteneur .smenumobile-element a:hover {text-decoration:underline;}
    #menumobile .smenumobile-conteneur .ssmenumobile-element {}
    #menumobile .smenumobile-conteneur .ssmenumobile-element a,
    #menumobile .smenumobile-conteneur .ssmenumobile-element a:visited {font-size:0.8em; text-decoration:none; padding-left:7px;}
    #menumobile .smenumobile-conteneur .ssmenumobile-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;} 
    #gabarit-photo table {width:auto !important; margin:0;}


    .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 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;}

    .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: 640px) {
    
    #renseignement-conteneur {text-align:center;}
	#renseignement-titre {font-size:29px;}
	#renseignement-contenu .renseignement-element {float:none !important; display:inline-block; vertical-align:top; margin:5px 10px;}
}

@media all and (max-width: 605px) {
    #gabarit-photo .gabarit-gauche-image,
	#gabarit-photo .gabarit-droite-image {float:none !important; margin:15px auto !important; width:100% !important; text-align:center;}
	#gabarit-photo .portrait,
	#gabarit-photo .paysage {width:100%; min-width: 0 !important; text-align:center;}   
}

@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 {padding:27px 10px;}
}

/* Smartphone */
@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-100-pourcent td {padding: 0 0 7px; text-align: center !important;}
	.table-responsive-100-pourcent td.nolabel { background: #fff !important;}
	.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-100-pourcent td.nolabel::before {display:none;}
	.table-responsive-100-pourcent tr {margin: 0 0 38px;}

}
@media all and (max-width:435px) {	
    .w1260 {display:none;}
    .w780 {display:none;}
    .w435 {display:block;}


    #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;}
    
    
	#renseignement-mail a, #renseignement-mail a:visited {width:260px;}
}

@media all and (max-width:385px) {

	#accueil-mosaiques .accueil-mosaique {width:280px; max-height: 280px;}
	#accueil-mosaiques .accueil-mosaique img {width:280px; height:auto;}
	
	#centre img {float:none !important;    margin: 10px auto !important;}
}

@media all and (max-width:320px) {	

}
