@charset "utf-8";
/* CSS Document */
/* CSS Document*/

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
/*

BLEU : #188fc3 / 24,143,195
ROUGE : #760e0b / 118,14,11 + JAUNE : #f5e97d / 252,237,110
							+ BLEU : #f0B7376
ANCIEN : 4d6d7b / 4D6D7B
*/
.cs-show-hide {overflow:hidden !important; display:inline-block !important; transition:all 0.3s  !important;}
.cs-show-hide.cs-hide {width:0 !important; height:0 !important; opacity:0 !important; margin:0 !important; padding:0 !important;}
.cs-show-hide.cs-show {width:auto !important; height:auto !important; opacity:1 !important;}
/********************************************************************************************
SURCHARGE MENU

********************************************************************************************/
.container {background-color:transparent !important; min-height:100vh;}
.mp-level {background-color:#FFF !important;}
.mp-level {background-color:#760e0b !important;}
.mp-level a,
.mp-level h2 {color:#fff !important;}
.mp-level h2 {font-size:1.3em !important;}
.cs-no-icon.icon::before {display:none !important;}

.mp-back::after { content: "\e032"; color: rgba(255,255,255,0.6);}
.mp-forward::after {
    font-family: 'linecons';
    position: absolute;
    right: 10px;
    font-size: 1em;
    color: rgba(255,255,255,0.6);
	content: "\e033";
	z-index:-1;}
	

/********************************************************************************************
STYLES COMMUNS FORMULAIRES ET LISTES

********************************************************************************************/
body {margin:0; padding:0; color:#414141; font-family:"DINOT-Light",Geneva, Arial, Helvetica, sans-serif; 
font-size:16px; background:none; background-color:rgba(0,0,0,0.04);}
a, a:hover {color:#414141; text-decoration:none;}
h1, h2, h3, h4, h5, h6 { 
font-family: "dinot-bold";
font-weight: normal;
hyphens: auto;}
h1 { font-size:4em; text-align:center; /*text-transform:uppercase;*/ color:#760e0b; padding:1em 0 0.5em 0;}
h1::after {
    content: "";
    display: block;
    width: 20%;
    height: 5px;
    position: relative;
    top: 10px;
    z-index: 6;
    margin: auto;
	background-color:#0B7376;
}

#jcs-cache {background:url('/2021/visuels/public/loader.gif') #FFF center no-repeat; position:fixed; z-index:50000; min-width:100%; min-height:100%; }

.cs-bt-bgcolortocolor {font-family:"optima"; display:inline-block; color:#FFF !important; border:none; 
transition:all 0.2s; padding:0.3em 1em; text-transform:uppercase; font-size:0.9em;}
.cs-bt-bgcolortocolor:hover {background-color:transparent !important; }

.cs-bt-greytobgcolor {background: rgba(0,0,0,0.7); color:#FFF; border:none; padding:0.4em 1em; font-size:1.5em;
display: inline-block; transition: all 0.3s;font-family:"optima"; text-transform:uppercase;}


.cs-header {text-align:left; padding:0; margin:0; width:100%; position:fixed; top:0; z-index:1000; 
background:rgba(255,255,255,1); box-shadow:0 0 2px #333; transition:background-color 0.2s;}
.cs-header .jcs-fixed {display:none; position:fixed;width:100%; top:0; z-index:1000; animation:all 0.3s ease-out 0s}
.cs-header .jcs-fixed.is-show {display:block;}
.cs-header > .cs-logo {display:inline-block; text-align:center; width:100%;}
.cs-header > .cs-logo img {transition: all 0.3s; opacity:1; }
.cs-header > .cs-logo img.cs-hidden {opacity:0;}
.cs-header.cs-scrolled > .cs-logo img {}
.cs-header.cs-scrolled  {background-color:rgba(255,255,255,1);}


footer {clear:both; padding:0; background:rgba(118,14,11,1); color:#fff; }
footer .cs-enbas { background:rgba(186,198,203,1); text-align:center; vertical-align:top; padding:1em 0;}
footer .cs-enbas a { display:inline-block; margin:0 1em;}
footer .cs-enbas a img { height:60px; }
footer .cs-enbas p strong {font-size:1.2em;}
footer ul.cs-footer-menu {text-align:center; padding:1em 0;}
footer ul.cs-footer-menu a { color:#fff; opacity:0.7; transition:all 0.2s;}
footer ul.cs-footer-menu a:hover { opacity:1; }
footer ul.cs-footer-menu > li {display:inline-block; color:#fff; width:13%; vertical-align:top;font-size:0.9em; padding:0 0.5%; text-align:left; } 
footer ul.cs-footer-menu > li ul li {font-size:0.8em; margin-bottom:0.3em} 

footer .cs-contenair > div a {color:#fff;}
footer .cs-contenair .cs-cop {text-align:center; }
footer .cs-contenair .cs-cop.cs-cop-foo {font-size:1.75em; padding:0.5em 0;}
footer .cs-contenair .cs-cop.cs-cop-foo em {font-size:0.6em;}
footer .cs-contenair > div.cs-c2, footer .cs-contenair > div.cs-c3 {font-size:0.9em;}

footer .cs-partenaires {width:65%;}
footer .cs-partenaires a {display:inline-block; width:48%; margin-right:2%; height:3em; overflow:hidden; margin-bottom:0.2em; overflow:hidden}
footer .cs-partenaires a span {display:block; width:100%; height:100%; background:no-repeat center center; background-size:cover; transition: all 0.3s ease-in-out 0s; }
footer .cs-partenaires a:hover span {transform:scale(1.1);}


.cs-clear {clear:both; display:block; height:0;}


body .cs-middle {margin:0;} 
body .cs-margin-lr {margin-left:10%; margin-right:10%;} /*ATTENTION : body .cs-bandeau .cs-titre A MODIFIER AUSSI */
body .cs-padding-lr {padding-left:10%; padding-right:10%;} /*ATTENTION : body .cs-bandeau .cs-titre A MODIFIER AUSSI */
body .cs-margin-tb {margin-top:1em; margin-bottom:0;}
body .cs-padding-tb {padding-top:1em; padding-bottom:3em;}

body .cs-grey-bg {background:rgba(0,0,0,0.05);} 



body .cs-main {margin:0 0; position:relative;}
body .cs-main h2 {margin:0; font-size:2em; padding:1em 0; text-transform:uppercase; color:#333;}
body .cs-main h2::before {
    content: "";
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    position: relative;
	vertical-align:middle;
    z-index: 6;
    margin: 0 0.2em 0.25em 0;
    background-color: #760e0b;
}


body .cs-max-width {max-width:1160px; margin:0 auto !important;}

body .cs-gradient-bg {background: linear-gradient(65deg, rgba(239,170,16,0.1) 0%, rgba(239,170,16,0.1) 10%, white 10%, white 80%, rgba(118,14,11,0.1) 80%, rgba(118,14,11,0.1) 90%, rgba(110,110,110,0.15) 90%, rgba(110,110,110,0.15) 100%);}


/*PARAGRAPHES	*/
.cs-paragraphe-item .cs-texte strong {font-size:1em; color:#760e0b; font-family: "dinot-bold"; font-weight:normal; }

.cs-paragraphe-item {margin-top:3em;}
.cs-paragraphe-item.no-margin {margin:1em 0;}
.cs-paragraphe-item.no-margin .cs-link {padding-top:0.2em;}
.cs-paragraphe-item:first-child {margin-top:0;}
.cs-paragraphe-item .cs-texte img {max-width:100%;}
.cs-paragraphe-item .cs-texte li, .cs-avec-bordure {border-left: solid 0.4em; padding-left:0.5em; list-style:none; margin-bottom:0.5em;}
.cs-paragraphe-item .cs-visuel {float:right; width:43%;margin-bottom:2em; margin-right:0;}
.cs-paragraphe-item .cs-visuel.cs-visuel-1 {float:left;margin-right:2%; margin-left:0;}
.cs-paragraphe-item .cs-visuel.cs-visuel-2 {float:right; margin-left:2%; margin-right:0;}
.cs-paragraphe-item .cs-visuel.cs-old {max-width:400px !important;}
.cs-paragraphe-item .cs-visuel {max-width:400px !important; text-align:center;}
.cs-paragraphe-item .cs-visuel img {max-width: 100%; max-height: 300px;}
.cs-paragraphe-item video {max-width: 500px; margin:0 auto; display:block;}
.cs-paragraphe-item a {font-weight:bold;}

.cs-link-bouton {margin-top:2em;}
/*
.cs-link-bouton > a::before {
    content: "";
    top: 20px;
    position: absolute;
    width: 100%;
    height: 40px;
    background-image: url(/visuels/public/picto_ddl.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%;
    left: 0;
}
*/
.cs-link-bouton.cs-offre > a::before {
   background-image: url(/visuels/public/icon-loupe.png) !important;
}
.cs-link-bouton > a,
.cs-link-bouton input {position:relative; background-color:#760e0b; text-align:center; color:#FFF; padding:1em; text-transform:uppercase !important; transition:all 0.2s; text-decoration:none; margin:0 1em; border:none; border-radius: 0.2em;}
.cs-link-bouton > a:hover,
.cs-link-bouton input:hover  {background:#0B7376; color:#FFF !important;}

/*
.cs-link-bouton.cs-petit > a::before {
    top: 5px;
    width: 100%;
    height: 20px;
}
*/
.cs-link-bouton.cs-petit > a,
.cs-link-bouton.cs-petit input {font-size:0.8em !important;}

.cs-bt-color { background-color:#760e0b; color:#FFF; border:none; padding:0.4em 1em; font-size:1em;
display: inline-block; transition: all 0.2s; border-radius:0.2em; font-family:"dinot-bold"; text-transform:uppercase; cursor:pointer;}
.cs-bt-color:hover,
.cs-bt-color.cs-selected {background:#0B7376; color:#FFF !important;}

.cs-bt-container {text-align:center;}
.cs-bt-container .cs-bt-color {margin:0 1em;}




.cs-accueil .cs-paragraphe-item .cs-texte strong {font-size:1.2em;}
.cs-accueil .cs-paragraphe-item h2 {text-align:left;}



/*LISTES AVEC VISUELS	*/	
.cs-liste-to-format {box-sizing :border-box; }
.cs-liste-to-format .cs-liste-item {width:23%; display:inline-block; margin:1%; overflow:hidden; position:relative; }
.cs-liste-to-format .cs-liste-item .cs-fond {width:100%; height:100%; position:absolute; background-size:cover; background-position:center center; display:block; transition:transform 0.3s ease-in-out 0s;}
.cs-liste-to-format .cs-liste-item a {width:100%; height:100%; display:block; position:absolute; }

.cs-liste-to-format .cs-liste-item:hover .cs-fond {filter:grayscale(75%); transform:scale(1.04)}

.cs-liste-vignette > div > a.cs-visuel:hover {}
.cs-liste-to-format .cs-liste-item a h5 {width:100%; padding:0.5em 5%; background:rgba(255,255,255,0.7); position:absolute; left:0; bottom:0; font-size:1.1em; font-family:"DINOT-Regular";line-height: 120%; }
.cs-liste-to-format .cs-liste-item a h5 .cs-petit {font-size:0.9em; font-family:"DINOT-Light"; }




/*ACCUEIL*/
.cs-bandeau {width:100%; height:70%; overflow:hidden; position:relative;} 
.cs-bandeau .jcs-baseline {color:#fff; text-shadow:0 0 0.2em #333; position:absolute; left:0; width:100%; 
text-align:center; bottom:60px;}
.cs-bandeau .jcs-baseline .bienvenue {opacity:0.9; font-family:"DINOT-BOLD"; font-size:7em; 
display:inline-block; text-transform:uppercase; letter-spacing:-0.1em; line-height:100%;}
.cs-bandeau .jcs-baseline .cs-direction {font-size:1.2em; font-family:"DINOT-Regular"; text-transform:uppercase; line-height:100%; }

.cs-bandeau  .jcs-down {cursor:pointer; opacity:0.95; transition:opacity 0.3s; bottom:10px; 
position:absolute; width:50px; height:50px; display:block; left:50%; margin-left:-25px; 
background:url(/2021/visuels/public/icon-down.png) no-repeat center; background-size:contain;}
.cs-bandeau  .jcs-down:hover {opacity:1; }

.cs-bandeau > div {position:relative;}

.cs-bandeau.cs-bandeau-autre {background:no-repeat center; background-size:cover;}




body.onepage {}
body.no-onepage {}

/* MENU */
.jcs-contenair-ico {position:absolute; overflow:visible; text-align:right; top:0; right:0;}
.jcs-contenair-ico a {display:inline-block; background:no-repeat transparent center; background-size:100%; 
vertical-align:top; transition:all 0.2s;}
.jcs-contenair-ico a:hover {background-size:80%;}

.jcs-contenair-menu-bt {position:absolute; overflow:visible; text-align:left; top:0; left:0; opacity:0;}

.jcs-contenair-menu-bt a {display:inline-block;  }
.jcs-contenair-menu-bt a span {text-transform:uppercase; font-size:1.2em; display:inline-block; vertical-align:middle;transition:all 0.2s; }
.jcs-contenair-menu-bt a svg {transition:all 0.2s; display:inline-block; vertical-align:middle; height:50px; width:50px;margin-right:5px;}
.jcs-contenair-menu-bt a svg .st0{fill:#760e0b;stroke:#760e0b;stroke-width:22;stroke-miterlimit:10; transition:all 0.2s;}
.jcs-contenair-menu-bt a svg .st1{fill:#FFFFFF; transition:all 0.2s;}
.jcs-contenair-menu-bt a:hover .st0 {fill:#fff;}
.jcs-contenair-menu-bt a:hover .st1 {fill:#760e0b;}
.jcs-contenair-menu-bt a:hover span {color:#760e0b; padding-left:0.3em;}
/*.jcs-contenair-menu-bt a:hover {background-size:80%;}*/

/*NO ONE PAGE */
body.no-onepage .js-showhide.cs-noblock {display:none !important;}
body.no-onepage nav {position:absolute;}
body.no-onepage a.cs-bt-menu {display:inline-block;}
body.no-onepage nav > ul {position:absolute; right:0;top:75px; width:50%; background:#FFF; display:none;}
body.no-onepage nav > ul > li {display:block; margin-bottom:0.5em;}

body.no-onepage .jcs-section {margin-top:0 !important;}






svg.cs-plus {transition:all 0.2s; display:inline-block; vertical-align:middle; height:50px; width:50px;}
svg.cs-plus .rond {fill:#760e0b;stroke:#760e0b;stroke-width:22;stroke-miterlimit:10; transition:all 0.2s;}
svg.cs-plus .croix {fill:#FFFFFF; transition:all 0.2s;}
svg.cs-plus:hover .rond {fill:none;}
svg.cs-plus:hover .croix {fill:#760e0b;}



a.jcs-retour  {position:absolute; top:0; right:0; text-align:right; padding:5px; }
a.jcs-retour span {text-transform:uppercase; font-size:1em; display:inline-block; vertical-align:middle;transition:all 0.2s; line-height:25px; }
a.jcs-retour svg {transition:all 0.2s; display:inline-block; vertical-align:middle; height:25px; width:25px; margin-right:5px;}
a.jcs-retour svg .rond {fill:#760e0b;stroke:#760e0b;stroke-width:22;stroke-miterlimit:10; transition:all 0.2s;}
a.jcs-retour svg .fleche {fill:#FFFFFF; transition:all 0.2s;}
a.jcs-retour:hover .rond {fill:none;}
a.jcs-retour:hover .fleche {fill:#760e0b;}
a.jcs-retour:hover span {color:#760e0b;}
a.jcs-retour:hover svg {margin-right:10px;}





/*LISTE DE PERSONNE (PUPITRES, ETC...)*/
.cs-liste-vignettes  {text-align:center;}
.cs-liste-vignettes  > ul  {padding-bottom:2em;}
.cs-liste-vignettes  > ul > h2 {font-size:1.4em;}
.cs-liste-vignettes  > ul > li {display:inline-block; border:none !important; padding:0 0 2em 0 !important; 
width:18%; margin:0 1%; text-align:center; vertical-align:top; -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}
.cs-liste-vignettes  > ul > li > p {font-size:0.8em;}
.cs-liste-vignettes  > ul > li > span {height:8em; width:6em; background:no-repeat center; background-size:cover; display:inline-block;}
.cs-liste-vignettes  > ul > li > h3 {font-size:1em; color:#000; margin:0; text-align:center;}
.cs-liste-vignettes  > ul.maire {display:inline-block; width:21%; margin:0 2%; margin-bottom:3em;}
.cs-liste-vignettes  > ul.maire > li {width:100%; margin:0; padding:0 !important;}
.cs-liste-vignettes  p.cs-conseillers {text-align:left;}

.cs-galerie-contenair .fotorama__stage {background-color:#333;}
.cs-galerie-contenair .cs-vignette {
background:no-repeat center; background-size:cover;
cursor:pointer;
}
.cs-galerie-contenair.cs-D {
	float:right;
    width:40%;
	margin-left:1em; 
	margin-bottom:1em; 
}
.cs-galerie-contenair.cs-G {
	float:left;
    width:40%;
	margin-right:1em; 
	margin-bottom:1em; 
}
.cs-galerie-contenair.cs-C {
	float:none;
	margin:0 auto;
    width:60%;
}

.boite-avec-ratio-reference {
    position: relative;
}

.boite-avec-ratio-reference:before {
    content:     "";
    display:     block;
    padding-top: 75%; /* initial ratio of 1:1*/
}

.boite-avec-ratio-reference .boite-avec-ratio-contenu {
    position: absolute;
    top:      0;
    left:     0;
    bottom:   0;
    right:    0;
}

.cs-form-connexion {padding:2em 0; display:block; margin:auto; width:auto;  }
.cs-form-connexion table {margin:auto; width:auto; }
.cs-form-connexion table td {padding:0.5em 0.2em;}
.cs-form-connexion table td label {font-weight:bold;}

.cs-erreur {font-weight:bold; text-align:center;}

.cs-table-partition {max-width:100%; width:auto; margin:0 auto;}
.cs-table-partition td { padding:0.5em 0.75em; text-align:center; width:80px; background:#fff; border-bottom:1px solid #ccc; vertical-align:top;}
.cs-table-partition tr.cs-1 td {background:#eee;}
.cs-table-partition tr.cs-entete td {background-color:#760e0b; color:#fff; border-right:1px solid #fff; font-size:0.9em; text-transform:uppercase; padding:0.7em;}
.cs-table-partition tr.cs-entete td:last-child {border:none;}
.cs-table-partition tr td:last-child {border-right:1px solid #ccc;}
.cs-table-partition tr td:first-child {border-left:1px solid #ccc;}
.cs-table-partition td.cs-titre {text-align:left; width:auto; white-space:normal;}
.cs-table-partition td a {}
.cs-table-partition td a span {color:#760e0b; transition:all 0.2s; font-size:1.5em;}
.cs-table-partition td a:hover span {color:#0B7376;}


.cs-table-trombinoscope {max-width:100%; width:auto; margin:0 auto;}
.cs-table-trombinoscope td { padding:0.5em 0.75em; text-align:left; background:#fff; border-bottom:1px solid #ccc; vertical-align:top;}
.cs-table-trombinoscope tr.cs-1 td {background:#eee;}
.cs-table-trombinoscope tr td:last-child {border-right:1px solid #ccc;}
.cs-table-trombinoscope tr td:first-child {border-left:1px solid #ccc;}
.cs-table-trombinoscope td.cs-photo span {width:6em;height:8em; display:block;background-size:cover;}
.cs-table-trombinoscope td.cs-divers p.cs-nomprenom strong {font-size:1.2em; display:inline-block; padding-right:1em;}
.cs-table-trombinoscope td.cs-divers p.cs-autre {white-space:nowrap;}
.cs-table-trombinoscope td.cs-divers p.cs-autre strong {color:#0B7376; font-weight:normal !important;}


/*CONTACT	*/
.cs-contact div.cs-formulaire h2,
.cs-contact div.cs-coordonnees h2 {padding:0;}
.cs-contact div.cs-formulaire,
.cs-contact div.cs-coordonnees {padding:1em 2em 2em 2em;border-radius:0.2em; }

.cs-contact div.cs-formulaire {float:left; width:50%; background-color:rgba(255,255,255,0.5); }
.cs-contact div.cs-formulaire label {display:none; padding:1em 0 0.2em 0;}
.cs-contact div.cs-form-ele, 
.cs-contact .form-leg {margin-bottom:0.5em; }
.cs-contact div.cs-form-ele input[type="text"], 
.cs-contact div.cs-form-ele select, 
.cs-contact div.cs-form-ele textarea, 
.cs-contact div.cs-form-ele label, 
.cs-contact div.cs-form-ele .cs-champ {
	padding:0.4em; font-size:1em; display:block; border:1px solid transparent; color:#444; background:rgba(0,0,0,0.04);
	transition:all 0.3s;
	}
.cs-no-label label {display:none !important;}

.cs-contact .cs-form-submit {display:block; text-align:center; clear:both; margin:1em 0;}
.cs-contact .cs-form-submit input {
		background:#760e0b; color:#FFF; border:none; padding:0.4em 1em; font-size:1.5em; display:inline-block;
		transition:all 0.3s; border-radius:0.2em;}
.cs-contact .cs-form-submit input:hover {background:#0B7376;}

.cs-contact div.cs-form-ele img.jcs-cpa {width:150px; float:left; margin-right:1em; display:block;}
.cs-contact div.cs-form-ele input.jcs-cpa {width:48%; float:left; margin-right:1em; display:block; font-size:1.2em}

.cs-contact div.cs-coordonnees {float:right; width:37%; background-color:rgba(0,0,0,0.1); margin-right:2%; }
.cs-contact div.cs-coordonnees p {margin-top:1em;}
.cs-contact div.cs-coordonnees p:first-child {margin-top:0;}





@media only screen and (max-width: 900px) {
	.cs-exergue {width:29%; margin:2%;}
	.cs-chiffre {width:24.8%;}
	.cs-main {padding:0 1em;}
	.cs-ligne-liste-etablissements .cs-liste-etablissements td.cs-visuel-eta {display:none !important;}
	.cs-ligne-liste-etablissements .cs-liste-etablissements td.cs-coord-eta {width:35% !important;}
	
	.cs-contenair-contact .cs-formulaire,
	.cs-contenair-contact .cs-coordonnees {width:auto !important; float:none !important;}
}
@media only screen and (max-width: 700px) {
	.cs-main {padding:0 0.7em;}
	.cs-exergue {width:45%; margin:2%;  }
	.cs-chiffre {width:32.8%;}
	body .cs-paragraphe-item .cs-visuel {width:100% !important; margin:0 !important; float:none !important;}
	
	.cs-ligne-liste-etablissements .cs-liste-etablissements td.cs-visuel-eta {display:none !important;}
	.cs-ligne-liste-etablissements .cs-liste-etablissements td.cs-coord-eta {width:50% !important;}
	
	
}
@media only screen and (max-width: 480px) {
	.cs-main {padding:0 0.4em;}
	.cs-exergue {width:95%; margin:2%;  }
	.cs-chiffre {width:49.8%;}
	.cs-ligne-liste-etablissements .cs-liste-etablissements td.cs-visuel-eta {display:none !important;}
	.cs-ligne-liste-etablissements .cs-liste-etablissements td.cs-coord-eta,
	.cs-ligne-liste-etablissements .cs-liste-etablissements td.cs-texte-eta {display:block !important; width:auto !important;}
}