/* cmsms stylesheet: Default modified: vendredi 25 août 2023 19:04:12 */



* {
	margin:0;
	padding:0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
.video { margin:1em 0; height:450px }

html { height:100%; width:100% }
body { 
	display:grid; 
	grid-template-rows:1fr auto; 
	margin: 0; 
	font-size: 1.2em; 
	line-height: auto; 
	height:100%;
        width:100% 
}
body, button, input, select, textarea, nav li a { 
	font-family: 'Nunito', sans-serif; 
	color: #4d4c4c; 
	font-weight:300 
}

body {
	background: #fff;
	color: #555;
}


header {
	position: fixed;
 	background: #fff;      
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	z-index:2000;
	overflow:hidden;
        box-shadow: 0 0 1em rgba(0,0,0,0.3)
}

#logo {
	position: relative;
	width: auto;
	max-width: 350px;
	margin:0 auto;
	padding:0;
	z-index: 1500;
}

#logo img {
	width: 100%;
	height: auto;
}


#menu { 
	position:fixed; 
	width:100%; 
	top: 3em; 
	z-index: 1020;
	transition-delay: 0s;
	transition-duration: 0.8s;
	transition-property: all;
	transition-timing-function: ease;
}

#menu_lang { 
     position:fixed;
     top: 0;
     right:0;
     padding:1em;
     z-index:5000;
}

#menu_lang span {
     display:inline-block
}

#menu_lang a { color:#8f1172 }

#menu_lang .active { color: #999 }

#menu_lang .active img { opacity:0.3 }

#menu_lang img { display: inline; width: 1em; height: auto; margin:0 0.2em }

#contact {
     display:grid;
     width:100%;
     height:300px;
     position: absolute;
     top:0;
     left:0;
     grid-template-columns: 1fr 1fr;
     grid-gap:17em;
     align-items:center;
     justify-items:center;
}



#contact div { text-align: center }

#contact p { display:inline:block; height:3em; line-height:3em }

#contact .picto { position:relative; display:inline; width:auto; height: 1.5em; top:0.3em }
#contact .FB { position:relative; width:160px }

.compact #contact {
   width: 75%;
   margin-left:25%;
   grid-template-columns: repeat(2, 1fr);
   grid-gap:0;
   height:150px
}


.compact #contact div {
   display:grid;
   width: 100%;
   grid-template-columns: repeat(2, 1fr);
   height:auto;
   text-align:center
}

.compact #logo { margin: 0 0 0 2em }
.compact #contact .FB { width:120px }


/*
#slogan { position: absolute; right:0; top: 50%; display: table; height:50% }
#slogan div { display: table-cell; vertical-align: top; font-size: 1em; text-align: right }
*/


#main { 
   background-color: #fff;
   margin:9em auto 0 auto; 
   padding: 1em;
   width: 100%;
   max-width: 1200px;
   z-index:100
}

.accueil #main { width:100%; max-width: none }


/* image en fond */
/*
#imgTitre { position:absolute; width:100%; height:600px; min-height:600px; z-index: 40; background-size: cover }
#imgTitre img { position:relative; display:block; z-index:50; }
#imgTitre .degrade { position:absolute; z-index:100; background:linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 40%); height:100%; width:100%; } 
*/


footer {
   width: 100%;
   height: auto;
   margin: 0 auto;
   padding: 3em;
   text-align: center;
   background: #fff;
}

footer a { color:#aaa }
footer a:hover { color:#fff }

/* typos */
h1 { font-weight:normal; padding:0 0 1em 0; color:#8f1172 }

h2 { font-weight:normal; padding:0 0 1em 0 }

strong { font-weight: bold }

.petit { font-size:0.9em }


/* Grille */


.grille4c-25pc {
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-flow:dense
}

.grille3c-33pc {
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-flow:dense
}

.grille2c-50pc {
  display:grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-flow:dense
}

.grille2c-1t2t {
  display:grid;
  grid-template-columns: 1fr 2fr;
  grid-column-start:1;
  grid-column-end:-1;
  margin-bottom: 2em
}

.grille2c-2t1t {
  display:grid;
  grid-template-columns: 2fr 1fr;
  grid-column-start:1;
  grid-column-end:-1;
  margin-bottom: 2em
}


.goutt1 { grid-gap:1em }
.goutt2 { grid-gap:2em }

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


.centre { margin:0 auto; max-width: 1200px; width: 100% }
.centree { margin:0 auto }


.margeInt1 { padding:1em }
.margeInt2 { padding:2em }

.centreLH { display: flex; justify-content: center; align-items:center; width:100%; height:100% }



/* iframe */

iframe { width: 100% }


/* Formulaire */

.cms_form legend, .formulaire legend { display: none }
.cms_form input:not([type="submit"]), .cms_form textarea, .formulaire input:not([type="submit"]), .formulaire textarea, .formulaire select { border:0; background-color: #eee; margin-bottom:1em; font-size:0.95em }
/* .cms_form label, .cms_form input, .formulaire label, .formulaire input { float: left } */
.cms_form div, .formulaire div { clear: both }
.cms_form label, .cms_form textarea, .cms_form input, .formulaire label, .formulaire textarea, .formulaire input, .formulaire select { width: 100% }
.cms_form .cms_submit, .formulaire .cms_submit, .formulaire input[type="submit"] { float:none; border:0; margin:0; color:#fff; margin-bottom:0; background-color: }
.formulaire select { background-color:#fff; border:1px solid #eee }
.formulaire option:checked { background-color:#eeeeee; }
.error { color: red }


/* Liens */
a { 
	color:#202640; 
	text-decoration: none;
	transition-delay: 0s;
	transition-duration: 0.8s;
	transition-property: all;
	transition-timing-function: ease;
	line-height:120%;
}

a:hover { color:#8f1172; }
a:focus { outline: none; }
a:hover, a:active { outline: 0; }

/* Couleurs */

.blanc, .blanc * { color:#fff }
.fdblanc { background-color:#fff }
.fdblanc80 { background-color:rgba(255,255,255,0.8) }

.noir { color:#000 }
.fdnoir { background-color:#000 }

.rose { color:#8f1172 }
.fdrose { background-color:#8f1172 }
.fdrose90 { background-color:rgba(143,17,114,0.9) }

.vert { color:#0d8390 }
.fdvert { background-color:#0d8390 }
.fdvert90 { background-color:rgba(13,130,142,0.9) }

.bleu { color:#202640 }
.fdbleu { background-color:#202640 }
.fdbleu90 { background-color:rgba(32,38,64,0.9) }

/* articles */

article .photo { min-height:50vh }
article { display: grid; position:relative }
article .photo img { height:100%; object-fit:cover }


.txt { color:#fff; padding:3em; direction:ltr }
.txt.droite { padding-left:40%; direction:ltr }
.txt.gauche { padding-right:40% }

.txt.fdblanc { color:#999 }
.txt.fdblanc h2 { color:#8f1172 }
.txt.fdblanc .bouton.blanc { color:#fff; background-color:#8f1172 }


article.tiers { 
   grid-template-columns: 1fr 2fr;
   grid-auto-flow:dense
}

article.demi { 
   grid-template-columns: 1fr 1fr;
   grid-auto-flow:dense
}

.large .txt { position:absolute; bottom:0; width:35%; padding:2em; text-align:left; direction:ltr }

.droite { direction:rtl }
/* .droite .txt { padding:3em 3em 3em 50% } */



/* Listes */
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
li { margin: 0 0 0.5em 0 }
#main li { line-height: 135% }

figure { margin: 0; }


/* Formulaires */
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; line-height:100% }

legend { border: 0; *margin-left: -7px; padding: 0; }

button, input, select, textarea { font-size: 100%; margin: 0; padding: 0.5em; vertical-align: baseline; *vertical-align: middle; }

button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; border-radius: 0; border:0 }

.formulaire input[type="checkbox"], .formulaire input[type="radio"] { position:relative; box-sizing: border-box; height:1em; width:auto; margin-right: 0.5em }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* Remove inner padding and border in FF3/4: h5bp.com/l */

textarea { overflow: auto; vertical-align: top; resize: vertical; }


/* Boutons */

.bouton, .formulaire .bouton, .cms_form .bouton { 
   display: inline-block;
   font-size:1em;
   padding:0.5em; 
   transition-delay: 0s;
   transition-duration: 0.8s;
   transition-property: all;
   transition-timing-function: ease;
   margin-bottom:0;
   border:1px solid #fff
}

.bouton:hover {
   background-color:#202640;
   color: #fff
}

.fdbleu .bouton:hover {
   background-color:;
   color: #fff
}

.bouton a { color: #fff }


.large { width:100% }



/* Tables */
table { width:100%; border-collapse: collapse; border-spacing: 0; border:0; margin: 1em 0 }
td input { margin-bottom:0 }
table td { border:0; padding:0.4em }
table td p { padding:0 }
tr:nth-child(even) { background-color: #eee }


img {
   display:block;
   width: 100%;
   height: auto
}

.largeur_defaut { width: auto; height:auto }

.icone { max-width: 180px }


/* Rollover FX zoom, fondu et symbole + */

.hovereffect {
	width:100%;
	height:auto;
	float:left;
	overflow:hidden;
	position:relative;
	text-align:center;
	cursor:default;
}

.hovereffect .overlay {
	width:100%;
	height:100%;
	position:absolute;
	overflow:hidden;
	top:0;
	left:0;
	opacity:0;
	background-color:rgba(0,0,0,0.5);
	-webkit-transition:all .4s ease-in-out;
	transition:all .4s ease-in-out
}

.hovereffect img {
	display:block;
	position:relative;
	-webkit-transition:all .4s linear;
	transition:all .4s linear;
}

.hovereffect p {
	display:inline;
	width: auto;
	color:#fff;
	text-align:center;
	position:relative;
	font-size:0.5em;
	line-height:1.5em;
	background:rgba(245,156,0,0.9);
	-webkit-transform:translatey(-100px);
	-ms-transform:translatey(-100px);
	transform:translatey(-100px);
	-webkit-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out;
	padding:10px;
}

.hovereffect a.info {
	text-decoration:none;
	display:table;
	width:100%;
	height:100%;
	color:#fff;
	background-color:transparent;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out;
	margin:0;
	padding:0;
}

.hovereffect a.info span {
	display:table-cell;
	vertical-align:middle;
	text-align: center;
	font-size:2em;
   }

.hovereffect a.info:hover {
   /*box-shadow:0 0 5px #fff;*/
}

.hovereffect:hover img {
	-ms-transform:scale(1.2);
	-webkit-transform:scale(1.2);
	transform:scale(1.2);
}

.hovereffect:hover .overlay {
	opacity:1;
	filter:alpha(opacity=100);
}

.hovereffect:hover p,.hovereffect:hover a.info {
	opacity:1;
	filter:alpha(opacity=100);
	-ms-transform:translatey(0);
	-webkit-transform:translatey(0);
	transform:translatey(0);
}

.hovereffect:hover a.info {
	-webkit-transition-delay:.2s;
	transition-delay:.2s;
}

.hovereffect::after {
	content: " "; 
	display: table; 
	clear:both
}


/* Mobiles */

/* Phones */
@media screen and (max-width: 767px) {
  body {  font-size: 1em; }
  #logo { max-width:130px; padding-bottom: 1em }
  #contact { position:relative; height:auto; grid-gap:0 }
  #contact .FB { width:100px }
  #main { padding: 1em }
  article.tiers, article.demi, article.large { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr }
  .large .txt { width:100%; position:relative }
  .txt.gauche { padding-right:3em }
  .txt.droite { padding-left: 3em }
  #contact p { font-size:0.8em }
  .grille2c-50pc { grid-template-columns: 1fr; }
  .grille3c-33pc { grid-template-columns: 1fr; }
  .grille4c-25pc { grid-template-columns: 1fr; }

}

@media screen and (max-width: 1200px) {
  #contact p { font-size:0.7em }
}


/* Tiny Mce */

.mce-content-body div[class^='grille'] div { border:1px dotted grey }
.mce-content-body .picto { max-width: 50px }
.mce-content-body .FB { max-height: 50px }