/* Votre Style */

/* Global deco */
* {
	box-sizing: border-box;
}
html {
	font-size: 62.5%;
}
body {
	margin: 0;
	padding: 0;
	font-family: verdana, arial, sans-serif;
	color: #292c32;
}
a { color: #b8860b; text-decoration: none;}
a:hover,
a:focus { color: #292C32; text-decoration: none;}
.on > a,
.page_agenda .nav-agenda a { font-weight: normal; color: #292C32; border-bottom: 1px solid #292C32;}

h1, .h1-like, h2, .h2-like, h3, .h3-like, h4, .h4-like, h5, .h5-like, h6, .h6-like,
nav ul li a,
.soustitre, .encadre {font-family: 'Roboto', sans-serif;}

h1.u-biggest,
span.u-biggest a {font-size: 5rem; color:#292C32}

h3.spip {margin-top: 1em; font-weight: bold}
h3.spip::before,
.deuxpoints::before {content: ': :'; color:#b8860b; margin-right: 1rem;}
.pucettn {padding-left: 2rem; background: url(../puce.gif) left center no-repeat;}

.wrapper {
	position: relative;
	min-height: 100vh;
	max-width: 100vw;
	margin: 0;
	padding: 0;
	background-color: #fff;
}
.sidebar {
	margin: 0 10%;
	padding: 5rem 1rem 0;
	text-align: right;
}

/*Menu Navigation*/
nav ul li ul {display: none}
nav ul li:hover > ul {display: block; position: absolute; left: 0; top: 3rem; z-index: 5; width: 20rem; margin: 0; padding: 0; background-color: #fff;}

nav > ul > li { display: inline; position: relative; padding: .6rem .5rem; }

nav ul li a {
	text-decoration: none;
	background: rgba(255,255,255, 0.1);
	text-transform: uppercase;
	font-size: 1.6rem;
	font-weight: normal;
}
nav ul li ul li {
	text-align: left;
}
nav ul li ul li a {
	font-size: 1.4rem;
}

/*Divers*/

#slideshow { display: block; position: relative; width: 100%; overflow: hidden; }
#main {background: url(../img/fond_degrade.jpg) top left repeat-x; overflow: hidden;}

.edito {position: absolute; top: 3rem; right: 10.5%; bottom: 0; width: 380px; z-index: 4; background-color: rgba(184,134,11, 0.8)}
.edito a {color: #fff; text-decoration: underline; }
.edito a:hover {color: #292C32}
.edito .encadre {border-color: #fff;}

iframe {max-width: 100%;}

#dates {background-color: #353348; color: #fff;}
#dates a:hover,
#dates a:focus {color: #fff;}
.encadre {border: 1px solid #b8860b;}
.encadre.u-big {line-height: 5rem;}
a.encadre:hover {background: #b8860b; color: #fff;}
.fleche-haut {float: right; width: 28px; height: 28px; margin-top: -1.6rem; background: url(../img/haut_page.png) center center no-repeat;}
.logo-site {position: absolute; top:-10rem; left: 0; z-index: 10;}
.inner {position: relative;}
.inner iframe,
.inner img { margin: 0 0 2rem}
.suite {padding: .2rem .4rem}
.actuellement {position: absolute; top: 0; right: 0; background-color: #b8860b; color: #fff;}
.flex-container p.actuellement {position: relative; margin: 0;}
.w80.center .pas .spip_logo {float: none; display: block; margin:0;}
.titrerub {display: none}
.page_article .titrerub {display: block}

p.pagination span.sep {color: #999;}

.formulaire_spip label {display: block}
.formulaire_spip label strong {font-size: .8em; font-weight: normal; font-style: italic}
.formulaire_spip input {margin-bottom: 2rem}
.formulaire_spip input,
.formulaire_spip textarea {box-shadow: none}
.formulaire_spip ul {padding: 0}
.formulaire_spip p.boutons {text-align: center}
[type="submit"] {color:#b8860b; background-color:#fff; border: 1px solid #b8860b; box-shadow: none;}
[type="submit"]:hover {color:#fff; background-color:#b8860b; }

/* Surcharge pour Slick slider */
.slick-prev:before, .slick-next:before {font-size: 3rem; color:#b8860b; background-color:#fff; }
button.slick-prev.slick-arrow,
button.slick-next.slick-arrow {padding: 0; font-size: 0;}
.slick-prev { left:-17px; }
.slick-next { right:-10px; }

/* small screens styles */
@media (max-width: 991px) {
	.sidebar {
	position: absolute;
	top: 0; left: 0; right: 0;
	margin: 0;
	padding: 0;
	text-align: center;
	}
  
	/* navigation styles */
	nav {
	-webkit-columns: 2;
	-moz-columns: 2;
	-ms-columns: 2;
	columns: 2;
	-webkit-column-gap: 2px;
	-moz-column-gap: 2px;
	-ms-column-gap: 2px;
	column-gap: 2px;
	padding: 2px;
	}
  
	nav ul {
	padding: 0;
	}

	nav > ul li {
	display: inline-block;
	width: 100%;
	padding: 2px;
	background-color: #fff;
	}

	nav > ul li.on a {
	color: #fff;
	background-color: #b8860b;
	border: 0 none;
	}
  
	nav > ul li a {
	display: inline-block;
	width: 100%;
	padding: 1rem 0;
	background-color: #fff;
	border: 1px solid #b8860b;
	}
  
	nav > ul li:hover > ul {
	top: 4rem;
	width: auto;
	}
  
	
	nav ul li ul li {
		text-align: center;
	}
	
	.wrapper {
	transform: translateX(0) translateZ(0);
	transition: transform .2s;
	will-change: transform;
	}  

	/* button deco */
	[class^="nav-button-open"] {
	display: block;
	z-index: 1;
	height: 3.5rem; width: 3.5rem;
	background-color: transparent;
	background-image: linear-gradient(to right, #333, #333),
	  linear-gradient(to right, #333, #333),
	  linear-gradient(to right, #333, #333);
	background-position: center top, center, center bottom;
	background-repeat: no-repeat;
	background-size: 3.5rem .8rem;
	padding: 0;
	outline: 0;
	border: 0;
	cursor: pointer;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	}
	[class^="nav-button-close"] {
	display: block;
	z-index: 1;
	height: 3.5rem; width: 3.5rem;
	background-color: transparent;
	background-image: linear-gradient(to right, currentColor, currentColor);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% .8rem;
	padding: 0;
	outline: 0;
	border: 0;
	color: #333;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: .25s cubic-bezier(.17,.67,.89,1.4);
	transition-property: transform;
	will-change: transform;
	 }
  
	/* here's goes the push top effect */
	body:target .wrapper {
	transform: translateY(22rem); /* based on navigation's height */
	}
	.nav-button-close,
	body:target .nav-button-open {
	display: none;
	}
	.nav-button-open,
	body:target .nav-button-close {
	display: block; position: absolute; top: 1rem; right:2rem;
	}
	a.logo-site {display: none;}
	.edito {position: relative; left: 0; top: 0; width: 100%; background-color: rgba(184,134,11, 1)}
} /* end of small screen media queries */