/* HTML5 ✰ Boilerplate
 * ==|== normalize ==========================================================
 */

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; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }

::-moz-selection { background: #EE3F3E; color: #fff; text-shadow: none; }
::selection { background: #EE3F3E; color: #fff; text-shadow: none; }

a { color: #de8c07; }
a:focus { outline: none;}
a:hover, a:active { outline: 0; color: #fff;}

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
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; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; 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; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
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; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* ==|== font import @font-face ===================================================== */

@font-face {
    font-family: 'Rockwell';
    src: url('/fonts/rockwellstd-webfont.eot#') format('embedded-opentype'),
         url('/fonts/rockwellstd-webfont.woff') format('woff'),
         url('/fonts/rockwellstd-webfont.ttf') format('truetype'),
         url('/fonts/rockwellstd-webfont.svg#webfontxAaKwkBp') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Rockwell';
    src: url('/fonts/rockwellstd-bold-webfont.eot#') format('embedded-opentype'),
         url('/fonts/rockwellstd-bold-webfont.woff') format('woff'),
         url('/fonts/rockwellstd-bold-webfont.ttf') format('truetype'),
         url('/fonts/rockwellstd-bold-webfont.svg#webfontgKJoWK9r') format('svg');
    font-weight: bold;
    font-style: normal;
}


/* ==|== primary styles =====================================================
   Author: Nicolas Fiset / AMIRAL AGENCE WEB
   ========================================================================== */


html {
 	height: 100%;
 }

body {
	color: white;
	min-height: 100%;
	font-size: 14px;
	font-family: 'Rockwell', serif;
	letter-spacing: 0px;
	position: relative;
}

a {-webkit-transition: all 500ms ease; transition: all 500ms ease;}

.btn {/* display:block; */ background-color:  #de8c07; color: #000; text-transform: uppercase; text-align: center; text-decoration: none; padding: 20px; -webkit-transition: all 500ms ease; transition: all 500ms ease; font-size: 17px; display: inline-block;}
.btn:hover {background-color: #000; color: #fff;}

.btn.black {background-color: #000; color: #fff;}
.btn.black:hover {background-color:  #fff; color: #000;}

.btn.white {background-color: #fff; color: #000;}
.btn.white:hover {background-color: #000; color: #fff;}

.btn.bottom {position:absolute; bottom:0; width:100%; box-sizing: border-box;}


/* #container {min-width: 1075px;} */

header {

	padding: 10px;
	height: 95px;
	margin: 0px 0 30px 0;
	box-sizing: border-box; 
	position: fixed;
	width: 100%;
	z-index: 100;
	background-color: rgba(0,0,0,0.9);
}

header .logo {
	font-size: 30px;
	font-weight: bold;
	display: block;
	text-align: center;
	line-height: 38px;
}

header .titre2 {
	font-family: 'Playball', cursive;
	display: block; line-height: 27px;
	font-weight:normal;
}

header #brand {height: 80px; line-height: 80px; position:absolute; left: 40px; top: 3px;} 
header #brand img {height: 90%;}


header #nav-top {
	height: 80px;
	line-height: 80px;
	position: absolute;
	right: 40px;
	top: 8px;
}

header #nav-top a {
	color: white;
	font-size: 18px;
	text-decoration: none;
	margin-right: 15px;
}
header #nav-top a:last-of-type {margin-right:2px;}

header #nav-top .logo-association {
	height: 60px;
    margin-right: 30px;
}

header #nav-top a.back {color: #FFCF28;}

header #nav-top a:hover {color: #c80000;}

header #slogant {/*position: absolute; right: 40px; top: 39px;*/ font-size:14px; font-weight:normal; line-height:30px;}

h1 {
	font-size: 24px;
	margin: 0;
	font-weight:normal; letter-spacing: 1px; text-transform: uppercase;
	color: #ffcf28;
}
.bloc.small h1 {margin-bottom: 15px;}

h2 {font-weight: normal; letter-spacing: 1px;}
.bloc.small h3 {
	font-size: 19px;
	font-family: 'Playball', cursive;
	color: #ffcf28;
	margin-bottom: 25px; margin-top:5px; font-weight: normal;}

p {
	margin: 8px 0 0 0;
	font-family: Helvetica;
	font-size: 14px; letter-spacing: 0; line-height: 1.3em;
}

#main {
	padding-bottom: 25px;
	padding-left: 40px;
	padding-right:40px;
	padding-top: 125px;
	/*position: relative;*/
}

.concours h1 {
	color: #ffcf28;
	font-family: 'Playball', cursive;
	font-size: 25px; font-weight: normal;
}

.bloc.small .nom-pourvoirie {margin-top:0;}
span.sous-titre, .nom-pourvoirie {
	font-size: 19px;
/* 	font-family: 'Playball', cursive; */
	color: #ffcf28;
/* 	margin: 15px 0 2px 0; */
	display: block;
	text-transform:uppercase;
}

.bloc.small.info-forfait {margin-bottom: 65px;}

.forfait-pourvoirie.bloc-forfait h3 {margin-top: 40px;}

.wrap {
/* 	width: 980px; */
	margin: 0 auto;
	position: relative;
}

.bloc {
	background-color: rgba(0,0,0,0.8);
	padding: 15px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border-radius: 0px; /* future proofing */
	-khtml-border-radius: 0px; /* for old Konqueror browsers */
	border: 1px solid #000;
/*
	-moz-box-shadow:    0 0 20px 0 #000;
	-webkit-box-shadow: 0 0 20px 0 #000;
	box-shadow:         0 0 20px 0 #000;
*/
	margin-bottom: 15px;
	position:relative;
}

.bloc {/* background-color: rgba(0,0,0,0.9); */ background-color: #212121;}
#bkg div {background-image: none !important; background-color: #000 !important;;}

.bloc .inner-pad {padding: 15px 15px 15px 15px;}

.bloc.accueil {
	text-align: center;
	/*min-width: 390px;
	width: 30%;*/
	width: 460px;
	/*float: left;*/
}


.bloc.small {
	width: 30%;
	min-width: 390px;
}

.bloc.medium {
	width: 64%;
	min-width: 390px;
}

.bloc.small.accueil {width:460px;}

.bloc.small.video {min-width: 560px; width: 560px;}

.bloc.concours {
	/*width: 30%;
	min-width: 300px;*/
	width: 460px;
	text-align:center;
	/*font-size: 16px;*/
	/*position: absolute;
	bottom: 75px;
	right: 40px;*/
	clear:both;
}

.bloc-concours {}
.bloc-concours form {}

.bloc-concours form .concours-groupe-interet {display:flex; align-content: stretch; margin: 8px -5px 20px -5px;}
.bloc-concours form .concours-groupe-identification {display:flex; align-content: stretch; margin: 0 -5px 0 -5px;}
.bloc-concours form .concours-groupe-adresse {display:flex;  margin: 0 -5px 0 -5px;}
.bloc-concours form .concours-groupe-coordonnees {display:flex;  margin: 0 -5px 0 -5px;}
.bloc-concours form .concours-groupe-validation {display:flex;  margin: 8px -5px 20px -5px;}

.bloc-concours form .cache {display:none;}


.bloc-concours form .input  {width: 100%; padding: 5px; box-sizing: border-box; }
.bloc-concours form .select {width: 10%; padding: 5px;box-sizing: border-box; min-width: 70px;}
.bloc-concours form label {margin-top: 5px;}

.bloc-concours form .input.text label, .bloc-concours form .select label, .bloc-concours form .email label {display:block;}
.bloc-concours form .input.text input, .bloc-concours form .select select, .bloc-concours form .input.email input {display:block; width: 100%; box-sizing: border-box;padding: 8px;}
.bloc-concours form .select select {height: 36px;}

.bloc-concours form .concours-groupe-adresse {flex-wrap:wrap;}
.bloc-concours form .concours-groupe-adresse .input {width: 33.33%;}

.bloc-concours form .input.checkbox {}
.bloc-concours form .input.checkbox input {margin-right: 5px;}
.bloc-concours form .input.checkbox label {margin-top: 2px;}

.bloc-concours form input[type='submit'] {
	    background-color: #de8c07;
    color: #000;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    padding: 20px;
    -webkit-transition: all 500ms ease;
    transition: all 500ms ease;
    font-size: 17px;
    display: inline-block;
    border: none;
}
.bloc-concours form input[type='submit']:hover {background-color: #000; color: #fff;}

@keyframes ephemerebox {
    0% {opacity: 0;}
    10% {opacity: 1;}
    90% {opacity: 1;}
    99% {opacity: 0;}
    100% {opacity: 0;}
}

#flashMessage {
	    position: fixed;
    left: 0;
    width: 100%;
    background-color: #de8c07;
    top: 95px;
    padding: 30px;
    z-index: 100;
    text-align: center;
    font-size: 25px;
    text-transform: uppercase;
    box-sizing: border-box;
    animation-name: ephemerebox;
    animation-duration: 10s;
    animation-iteration-count: 1;
    opacity:0;
    
}

.list-wrap {display:flex; flex-wrap: wrap;}
.list-item {float:none ;box-sizing: border-box; padding: 15px; margin-bottom: 30px;}
.list-item.no-marge {margin-bottom:0;}
.list-item .inner {position:relative; height: 100%; /* padding-bottom: 60px;  */box-sizing: border-box;}
.list-item .inner.btn-bottom {padding-bottom: 60px;}


.flex-content {display:flex;justify-content: space-between;}
.flex-col { width: 49.5%;}

@media only screen and (max-width: 1180px) {
    .flex-content {flex-wrap: wrap;}
    .flex-col {width: 100%;}    
}


/* ================================================ *
 *                    FORFAITS                      *
 * ================================================ */

.bloc-forfait {width: 49.9%; /* border-top: 1px dotted #de8c07; */ position:relative;}

.bloc-forfait .section-titre {width:100%; margin-bottom: 15px;}
.bloc-forfait .image {width: 50%; margin-bottom: 20px;}
.bloc-forfait .image img {width: 100%;}
.bloc-forfait .tarifs {width:50%; padding-left: 20px; box-sizing: border-box; margin-bottom: 20px;} 
.bloc-forfait .texte {width: 100%;}
.coordonnees {width: 100%; position:relative; min-height: 60px; color: #FFCF28; margin-top: 15px; padding-top: 5px; /* margin-bottom: 20px; */ font-size: 16px; padding-right: 205px;    box-sizing: border-box;}
.coordonnees .contact a, .position a {color: #FFCF28;}
.coordonnees .contact a:hover, .position a:hover {color: #fff;}
.coordonnees .website {position:absolute; bottom:0; right:0;}
.coordonnees .website .btn {padding: 20px 30px;}

.bloc-forfait.bloc-btn-space .texte {padding-bottom: 80px;}
.bloc-forfait.bloc-btn-space .texte ul, .bloc-forfait .tarifs ul {padding-left: 17px; font-family: Helvetica; font-size: 14px; letter-spacing: 0; line-height: 1.3em;}
.bloc-forfait.bloc-btn-space .coordonnees {position:absolute; bottom:0; left:0;}

.bloc-forfait h3 {margin: 4px 0 15px 0; font-weight: normal; letter-spacing: 1px; font-size: 19px; line-height: 19px;}
.bloc-forfait span.sous-titre, .bloc-forfait .nom-pourvoirie {font-size: 21px;}
.section-titre {/* margin-right: 75px; *//*  margin-top: 17px; */}
.section-titre.full-large {margin-right: 0;}
/* .bloc-forfait a {color: #DE8C07; text-decoration: none; margin-top:0px; float:right;} */

/*#main .bloc-forfait .tarifs {top:8px; text-align: left; position:static; float:left;}
#main .bloc-forfait .tarifs .apartirde {font-size:8px;}
#main .bloc-forfait .tarifs .prix {font-size: 18px; float:left;}
#main .bloc-forfait .tarifs .details {float:left; padding: 8px 0 0 4px;}
#main .bloc-forfait .tarifs .conditions {clear:both;}*/
#main .bloc-forfait .tarifs {top: 8px;}
#main .bloc-forfait .tarifs, #main .classification {font-size: 13px;}
#main .tarifs .apartirde {}
#main .tarifs .prix {font-size: 35px; font-weight: bold; color:#FFCF28;}
#main .tarifs .details {}
#main .tarifs .conditions {font-weight: bold; font-style: italic;}

#main .bloc-forfait a.site {bottom: -14px; float:left; right: auto; left: 0; background: none; color: #DE8C07; position:static; display:inline; height: auto; width: auto; margin:0 10px 4px 0; padding:0;}


#main .points ul {padding-left: 15px;}


/* ================================================ *
 *                   CATÉGORIES                     *
 * ================================================ */

.bloc-categorie .section-titre {margin-bottom: 15px;}
.bloc-categorie {width: 33.333%}
.bloc-categorie .texte {margin-bottom: 20px;}
.bloc-categorie .image img {width: 100%;}


/* ================================================ *
 *                LISTE POURVOIRIES                 *
 * ================================================ */

#pourvoiries-list {display:flex; flex-wrap:wrap;}

#pourvoiries-list .pourvoirie-list {width: 33.33%; box-sizing: border-box; padding: 15px; margin-bottom: 30px;}
#pourvoiries-list .pourvoirie-list .inner {position:relative; height: 100%; padding-bottom: 60px; box-sizing: border-box;}

h2 {text-transform: uppercase; margin: 0; color: #ffcf28;}
h2.min-2-lignes {min-height: 60px;}

#pourvoiries-list .pourvoirie-list .image {margin-bottom: 30px;}
#pourvoiries-list .pourvoirie-list .image img {width: 100%;}

#pourvoiries-list .pourvoirie-list .position{margin-top:20px; color: #ffcf28; font-size: 16px; margin-bottom: 20px;}


#pourvoiries-list .pourvoirie-list .vcard{}
#pourvoiries-list .pourvoirie-list .vcard .org {display:none;}
#pourvoiries-list .pourvoirie-list .vcard .adr {margin-bottom:15px;}
#pourvoiries-list .pourvoirie-list .vcard .adr .street-address {}
#pourvoiries-list .pourvoirie-list .vcard .adr .locality {}
#pourvoiries-list .pourvoirie-list .vcard .adr .region {}
#pourvoiries-list .pourvoirie-list .vcard .adr .country-name {}
#pourvoiries-list .pourvoirie-list .vcard .adr .postal-code {}
#pourvoiries-list .pourvoirie-list .vcard .tel {}
#pourvoiries-list .pourvoirie-list .vcard .email {margin-bottom: 15px; display: inline-block; color: #ffcf28;}
#pourvoiries-list .pourvoirie-list .vcard .email:hover {color: #fff;}
#pourvoiries-list .pourvoirie-list .vcard .geo {}


#pourvoiries-list .pourvoirie-list .distance {margin-bottom: 20px; margin-top: 20px; border: 1px solid #666; color: #fff}
#pourvoiries-list .pourvoirie-list .distance .km, 
#pourvoiries-list .pourvoirie-list .distance .temps,
#pourvoiries-list .pourvoirie-list .distance .comparaison {display: block; text-align: center; padding: 20px 20px; box-sizing: border-box; float:left;}
#pourvoiries-list .pourvoirie-list .distance .km, 
#pourvoiries-list .pourvoirie-list .distance .temps {width: 50%; font-size: 18px;}

#pourvoiries-list .pourvoirie-list .distance .km {/* background-color: #444; */    background-color: rgba(255,255,255,0.25); border-right: 1px solid #666;}
#pourvoiries-list .pourvoirie-list .distance .temps {/* background-color: #222; */     background-color: rgba(255,255,255,0.2);}
#pourvoiries-list .pourvoirie-list .distance .comparaison {/* background-color: #000; */    background-color: rgba(255,255,255,0.1); width: 100%; font-size: 26px; text-transform: uppercase; border-top: 1px solid #666;} 





/* ================================================ *
 *                   POURVOIRIES                    *
 * ================================================ */
 
 
 .fiche-pourvoirie {}
 .fiche-pourvoirie .section-titre {width: 100%; margin-bottom: 20px;}
 .fiche-pourvoirie .image {width: 35%; padding-right: 30px; box-sizing: border-box;}
 .fiche-pourvoirie .image img {width: 100%;}
 .fiche-pourvoirie .texte {width: 65%; }
 .fiche-pourvoirie .texte p:first-of-type {margin-top:0;}

/*
 #main img.appoint {float:left; margin: 0 25px 10px 0;
 	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px; 
	-khtml-border-radius: 10px; 
	border: 1px solid #000;}
*/
/* #main .bloc-forfait .tarifs {right:0;} */

/*
#main .classification, #main .tarifs {
	font-size: 11px;
	position: absolute; top: 15px; right: 20px;
}
*/



#main .details ul {margin:0 0 8px 15px; padding:0; font-family: helvetica;}

/*
#main a.site, #main a.bouton, #main a.bonton-wide {
	display:block;
	background-color: #ca1116; color: #fff;
	text-align: center; text-decoration: none;
	-webkit-border-radius:100px; -moz-border-radius:100px; -o-border-radius:100px; border-radius:100px;
	position: absolute;}
*/

/*
#main a.site {
	 bottom: 60px; right: -42px;
	 width: 80px; height: 49px; padding-top: 31px;
}
*/
#main a.bouton {
	 bottom: 60px; right: -140px;
	 width: 80px; height: 59px; padding-top: 21px;
}
#main a.bonton-wide {padding: 13px;}
#main a.bt-voirplus {position: absolute; bottom: 78px; right: -320px; padding-left: 35px; background: #ca1116 url(/img/layout/bt-down.png) no-repeat center left;}

#main a.site:hover {}

/* #main .coord {color:#FFCF28; font-size: 12px; border-top: 1px dotted #FFCF28; padding-top: 10px; margin-top: 10px; min-height: 65px; clear:both;} */
#main .coord .vcard .org {display:none;}
#main .coord .vcard .localisation {/* width: 40%; float:left; */}
#main .coord .vcard .contact {/* width: 40%; float: left; */ margin-top: 10px;}
#main .coord .vcard .contact a.email {color: #ffcf28;}
#main .coord .vcard .contact a.email:hover {color: #fff;}









#bkg, #bkgover {
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	display:block;
}

#bkg div, #bkgover div {
	background: url(/img/layout/bg.jpg) no-repeat center fixed; 
 	-webkit-background-size: cover; /* pour Chrome et Safari */
 	-moz-background-size: cover; /* pour Firefox */
 	-o-background-size: cover; /* pour Opera */
 	background-size: cover; /* version standardisée */
 	height: 100% !important;
	width: 100% !important;
	position: absolute;
	top: 0;
	left: 0;
}

#bkgover div {
	display: none;
}

#trame {
/* 	background: url(/img/layout/trame.png) repeat; */
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	display:none;
	z-index:100;
	background-color: rgba(0,0,0,0.7);
	opacity:0;
	-webkit-transition: opacity 500ms ease; transition: opacity 500ms ease;
	
}


/* ================================================ *
 *                     ACCUEIL                      *
 * ================================================ */

#template-accueil {}
#template-accueil .col-first-accueil {width: 66.66%; padding:0; margin:0;}
#template-accueil .col-second-accueil {width: 33.33%; padding: 0 0 0 15px; margin:0;}

#template-accueil video {background-color: #fff; width: 100%; margin-bottom: -4px;}
#template-accueil #video {position:relative; display:block;}
#template-accueil #video .over {opacity:0; position:absolute; top:0; left:0; right:0; bottom: 0; font-size:45px; background-color: rgba(0,0,0,0.5); transition: opacity 500ms ease; cursor: pointer;}
#template-accueil #video:hover .over {opacity:1;}
#template-accueil #video .over i {position:absolute; bottom: 10px; right: 15px;}
#template-accueil #video .over .fa-volume-up {display:none;}
#template-accueil #video .over .fa-volume-off {display:inline-block;}
#template-accueil #video.muted .over .fa-volume-up {display:inline-block;}
#template-accueil #video.muted .over .fa-volume-off {display:none;}

#template-accueil .box-pourvoiries {height: 85px; display: block; background-image: url(/img/layout/bg-box-pourvoiries.jpg); background-size:cover; background-position:center center; position:relative;}
#template-accueil .box-pourvoiries a {text-decoration: none; color: #fff; text-transform: uppercase; font-size: 40px; font-weight: bold;}
#template-accueil .box-pourvoiries a .inner { width: 1500px; display: table-cell; vertical-align: middle; height: 85px; padding-left: 20px; padding-right: 20px; -webkit-transition: background-color 500ms ease; transition: background-color 500ms ease;}
#template-accueil .box-pourvoiries:hover a .inner {background-color: rgba(0,0,0,0.5);}

#template-accueil .pub {}
#template-accueil .pub .bigbox {display: block; padding-top: 15px; /* cursor: pointer; */}
#template-accueil .pub img {width: 100%;}



nav#nav-forfaits {padding-top: 15px;}
nav#nav-forfaits ul {display:flex; width: 100%; align-content: stretch;}
nav#nav-forfaits ul li {flex-grow:1; position:relative; background-image:url(/img/layout/bg.jpg);  background-blend-mode: multiply;  background-repeat: no-repeat; background-position: center center; background-size: cover; -webkit-transition: background-color 500ms ease; transition: background-color 500ms ease;}
nav#nav-forfaits ul li:hover {background-color: #333 !important;}

nav#nav-forfaits ul li:nth-of-type(1) {background-color: #7d1a05;}
nav#nav-forfaits ul li:nth-of-type(2) {background-color: #e36127;}
nav#nav-forfaits ul li:nth-of-type(3) {background-color: #ebd02d;}
nav#nav-forfaits ul li:nth-of-type(4) {background-color: #2a5a27;}
nav#nav-forfaits ul li:nth-of-type(5) {background-color: #2747c5;}
nav#nav-forfaits ul li:nth-of-type(6) {background-color: #3d2755;}


nav#nav-forfaits ul li a {width: 100%; text-align: center; display: block; text-decoration: none; text-transform: uppercase; height: 85px; color: #fff; font-weight:bold; font-size: 17px; -webkit-transition: none; transition: none;}
nav#nav-forfaits ul li a .inner {height: 85px; width: 1500px; display: table-cell; vertical-align: middle; padding-left: 5px; padding-right: 5px;}
nav#nav-forfaits ul li a:hover {}





/* ================================================ *
 *                 TEMPLATE RELÈVE                  *
 * ================================================ */
 
#template-releve {}
#template-releve .col-first-accueil {width: 66.66%; padding:0; margin:0;}
#template-releve .col-second-accueil {width: 33.33%; padding: 0 0 0 15px; margin:0;}

#template-releve .box-pourvoiries {background-image: url(/img/layout/bg-box-pourvoiries.jpg);}
#template-releve .box-forfaits {background-image: url(/img/layout/bg-box-forfaits.jpg); margin-top: 15px;}
#template-releve .box-pourvoiries, #template-releve .box-forfaits {height: 130px;  background-size:cover; background-position:center center; position:relative;}
#template-releve .box-pourvoiries a, #template-releve .box-forfaits a {text-decoration: none; color: #fff; text-transform: uppercase; font-size: 40px; font-weight: bold;    width: 100.9%; display: inline-block;}
#template-releve .box-pourvoiries a .inner, #template-releve .box-forfaits a .inner { width: 1500px; display: table-cell; vertical-align: middle; height: 130px; padding-left: 20px; padding-right: 20px; -webkit-transition: background-color 500ms ease; transition: background-color 500ms ease; background-color: rgba(0,0,0,0.4); position:relative; right:-1px;left:-1px;  }
#template-releve .box-pourvoiries:hover a .inner, #template-releve .box-forfaits:hover a .inner {background-color: rgba(0,0,0,0.8);}

#template-releve .pub {padding-top: 15px;}
#template-releve .pub .bigbox {display: block; cursor:pointer;}
#template-releve .pub img {width: 100%;}


#template-releve #forfait-highlight {height: 100%; position:relative; cursor:pointer; -webkit-transition: background-color 500ms ease; transition: background-color 500ms ease; background-image: url(/img/layout/bg.jpg); background-size:cover; background-position:center center;}
#template-releve #forfait-highlight .inner {-webkit-transition: background-color 500ms ease; transition: background-color 500ms ease; background-color: rgba(0,0,0,0.4); padding: 40px; /* padding: 40px 40px 160px 40px; */ height: 100%;}
#template-releve #forfait-highlight:hover .inner {background-color: rgba(0,0,0,0.8);}
#template-releve #forfait-highlight h1 {font-size: 63px; line-height: 1.2em;}
#template-releve #forfait-highlight p { font-size: 21px; padding: 0 0 20px 0;}
#template-releve #forfait-highlight h2 {font-size: 75px; }
#template-releve #forfait-highlight .btn-releve {position:absolute; right: 40px; bottom:80px; /* bottom: 128px; */ font-size: 30px;}

#template-releve #forfait-highlight .logo-partenaire-majeur {height: 100px; padding: 20px; background-color: rgba(255,255,255,0.9); position: absolute; bottom: -16px; left: 40px;}


/* ================================================ *
 *                     FOOTER                       *
 * ================================================ */


footer {
	background-color: rgba(0,0,0,0.8);
	width: 100%;
	padding: 10px 0;
	color: #999;
	text-align: center;
	font-size: 13px;
	position: relative;
	bottom: 0;
	left: 0;
}

.accueil footer {background-color: rgba(0,0,0,0.9);}

footer .partenaire {
	position:static; display:inline-block; padding: 20px 20px 20px 0;
}

footer .partenaire a {margin-left: 30px;}

footer a {
	color: #999;
	text-decoration: none;
}


#lignes_pourvoiries {
	position: absolute;
	right: 75px;
	top: 155px;
	z-index: 20;
	display: none;
}

#lignes_forfaits {
	position: absolute;
	right: 165px;
	top: 100px;
	z-index: 20;
	display: none;
}



/* ==|== non-semantic helper classes ======================================== */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/* ==|== media queries ====================================================== */

@media only screen and (max-width: 1360px) {
	footer .partenaire {/* position:static; display:inline-block; padding: 20px 20px 10px 0; */}
	footer .partenaire img {margin-bottom: 10px;}
	nav#nav-forfaits ul li a .inner {font-size: 14px;}
	
	
	
}

@media only screen and (max-width: 1220px) {
	#template-releve #forfait-highlight .btn-releve {font-size: 22px;}
	#template-releve #forfait-highlight .logo-partenaire-majeur {height: 90px;}
	#template-releve #forfait-highlight h2 {font-size: 65px;}
}

@media only screen and (max-width: 1100px) {
	#template-accueil .box-pourvoiries a {font-size:30px;}
	nav#nav-forfaits ul li a .inner {font-size: 12px;}
	#template-releve .box-pourvoiries a, #template-releve .box-forfaits a {font-size: 30px;}
	#template-releve #forfait-highlight .btn-releve {bottom: 40px;}
}


@media only screen and (max-width: 1020px) {
	#pourvoiries-list .pourvoirie-list {width: 50%;}
	.bloc-categorie {width: 50%;}
	
	 .fiche-pourvoirie .texte, .fiche-pourvoirie .image {width: 50%;}
	 
	 #template-accueil .col-first-accueil, #template-accueil .col-second-accueil {width: 100%; padding-left:0; padding-top: 15px; }
	 
	#template-accueil .box-pourvoiries {width: 50%; float: left;}
	#template-accueil .pub {width: 50%; float: left;}
	#template-accueil .pub .bigbox {padding: 0 0 0 15px;}
	
	nav#nav-forfaits ul li a .inner {font-size: 14px;}
	
	#template-releve .col-first-accueil, #template-releve .col-second-accueil {width: 100%; padding-left:0; padding-top: 15px;}
	#template-releve .box-forfaits {margin: 0 0 0 15px;}
	#template-releve .pub {padding-left: 15px; padding-top:0;}
/*
	#template-releve .col-second-accueil {display:flex;}
	#template-releve .box-pourvoiries, #template-releve .box-forfaits {height: 300px; width: 50%;}
*/
	
	#template-releve #forfait-highlight .logo-partenaire-majeur {bottom:20px;}
	#template-releve #forfait-highlight .inner {/* padding-bottom: 180px; */}
	
	
}

@media only screen and (max-width: 768px) {
	#pourvoiries-list .pourvoirie-list {width: 100%;}
	
	.fiche-pourvoirie .image {width: 100%; padding:0; margin-bottom: 20px;}
	.fiche-pourvoirie .texte {width: 100%;}
	
	#main .coord .vcard .localisation {width: 100%; padding-right: 100px; box-sizing: border-box; margin-bottom: 20px;}
	#main .coord .vcard .contact {width: 100%}
	
	.bloc-forfait {width: 100%;}
	
	.bloc-categorie {width: 100%;}
	
	
	.bloc-forfait.bloc-btn-space .texte {padding-bottom:0;}
	.bloc-forfait.bloc-btn-space .coordonnees {position:static;}
	
	#template-accueil .box-pourvoiries {width: 100%; float: none;}
	#template-accueil .pub {width: 100%; float: none;}
	#template-accueil .pub .bigbox {padding: 15px 0 0 0;}
	
	#template-releve #forfait-highlight .btn-releve {position:static; margin-top: 30px;}
	#template-releve .col-second-accueil {display:block;}
	#template-releve .box-pourvoiries, #template-releve .box-forfaits {height: 130px; width: 100%;}
	#template-releve .box-pourvoiries .inner, #template-releve .box-forfaits .inner {height: 130px;}
	
	#template-releve .box-forfaits {margin: 15px 0 0 0;}
	#template-releve .pub {padding-left: 0px; padding-top:15px;}
	
	
}

@media only screen and (max-width: 520px) {
	.bloc-forfait .image {width: 100%;}
	.bloc-forfait .tarifs {width: 100%; padding-left:0;}
	#main {padding-left:20px; padding-right:20px;}
	
	.coordonnees {padding-right:0;}
	.coordonnees .contact {margin-bottom:15px;}
	.coordonnees .website {position:static; width: 100%; clear:both;}
}

@media only screen and (min-width: 769px) and (max-width: 1023px) {
	.bloc-forfait .coordonnees {padding-right:0;}
	.bloc-forfait .coordonnees .contact {margin-bottom:15px;}
	.bloc-forfait .coordonnees .website {position:static; width: 100%; clear:both;}
	
	.coordonnees {padding:0;}
	.coordonnees .website {display: block; position: static; width: 100%; margin-top: 20px;}
	.coordonnees .website .btn {padding: 20px 0; width: 50%; float:left;}
	
	.bloc-forfait.bloc-btn-space .texte {padding-bottom:125px;}
	
	#template-releve .col-second-accueil {display:flex;}
	#template-releve .box-pourvoiries, #template-releve .box-forfaits {width: 33.3%; height: 100%;}
	#template-releve .pub {width: 33.33%;}
}

@media only screen and (max-width: 480px) {
	#main {padding-left:0; padding-right:0;}
}


/*@media only screen and (min-width: 481px) {*/
@media only screen and (min-device-width: 668px) {
	.mobile {display:none !important;}
}

.bt-nav {display:none;}

@media only screen and (min-width: 668px) {
	header #nav-top {display:block !important;}
}

@media only screen and (max-width: 667px) { 
	
	header {position:absolute;}
	
	header #brand {left:30px;}
	
	header .bt-nav {position:absolute; top: 30px; right: 30px; font-size: 30px; display:block;}
	header .bt-back {display:none;}
	
	header #nav-top {position:absolute; height: auto; right:0; background-color: rgba(0,0,0,0.9); width: 80%; top: 95px; line-height:normal; display:none;}
	header #nav-top a {display:block; padding: 15px 30px; border-top: 1px solid #333;}
	
	body.open #trame {display:block; opacity:1;}
	
	.coordonnees {padding:0;}
	.coordonnees .website {display: block; position: static; width: 100%; margin-top: 20px;}
	.coordonnees .website .btn {padding: 20px 0; width: 50%; float:left;}
	
	nav#nav-forfaits ul {display:block;}
	
	#template-accueil .box-pourvoiries a {text-align:center; font-size: 18px;}
	#template-accueil .box-pourvoiries a .inner {padding:0;}
	
	nav#nav-forfaits ul li {width: 100% !important;}
	nav#nav-forfaits ul li a .inner {font-size: 18px;}
	
	#template-releve #forfait-highlight h1 {font-size: 40px;}
	#template-releve #forfait-highlight p {font-size: 25px;}
	
	
	.bloc-concours form .concours-groupe-interet {display:block;}
	.bloc-concours form .concours-groupe-identification {display:block;}
	.bloc-concours form .concours-groupe-adresse {display:block;}
	.bloc-concours form .concours-groupe-coordonnees {display:block;}
	.bloc-concours form .concours-groupe-validation {display:block;}
	
	.bloc-concours form .concours-groupe-adresse .input {width: 100%;}
	.bloc-concours form .select {width: 100%;}
	
	
/*
	.desktop {display:none !important;}
	
	a:focus {outline: none;}
	
	body {position:static; overflow:hidden; }
	#bkg, #bkgover {position:fixed;}
	header {}
	
	#container {width:100%; min-width:inherit; 
		padding-bottom: 100px; 
	}
	.wrap, #main {width: 96%; padding: 0 2% 0 2%; margin: 0;}
	
	.mobile-scroll {
		 overflow: scroll; -webkit-overflow-scrolling: touch;
	}
	
	.mobile-scroll.no-scroll {overflow:hidden; position:fixed;}
	
	.bloc.accueil, .bloc.concours {width: 96%;}
	.bloc {width: 96%; padding: 10px 2%;}
	
	header #nav-top {display:none; background-color: #000; width: auto; position: absolute; z-index: 100; height: auto; line-height:1; padding: 10px 15px 10px 15px; top: 90px; right: 0; left: auto;}
	header #nav-top a {padding: 10px; width: auto; display:block;}
	
	header {height: auto;}
	header .logo {font-size: 22px; line-height:24px;}
	
	.accueil .bt-back {display:none;}
	
	.bt-nav,
	.bt-back {position: absolute; top: 35px;  font-size: 30px; color: #fff;}
	.bt-nav {right: 20px;}
	.bt-back {left: 20px;}
	
	#lignes_forfaits, #lignes_pourvoiries {display:none !important;}
	nav {width: 100%; right: 0; margin-left: 0; position: fixed; bottom: 0; top:auto;}
	nav > ul {}
	nav > ul > li {background: transparent; height: 87px; position:absolute; bottom:0; width:100%; }
	nav > ul > li > a {background-color: #ffcf28; margin:0; padding: 20px 0; width: 49%; margin: 0 0.5%; position:absolute; z-index: 1000;}
	nav > ul > li#menu_p {background-color: #000; -webkit-overflow-scrolling: touch;}
	nav > ul > li#menu_p > a {}
	nav > ul > li#menu_f > a {right:0;}
	
	nav > ul > li > ul {position:absolute; bottom: 88px; width:100%; display:none; z-index: 1000; max-height: 380px; overflow:scroll;   background-color:#000;}
	nav > ul > li.open > ul {display:block; height:auto;}
	nav > ul > li.open > a {background-color: #C80000;}
	nav > ul > li > ul > li {width: 100%; position: relative; left:0!important; bottom:0!important;}
	nav > ul > li > ul > li a {position: relative; width: 100%; display: block; clear: both; height: inherit; padding: 15px 0; margin-top: 1px;}
	nav > ul > li#menu_p > ul > li a {background-color: #fff; background-image:none;}
	nav > ul > li#menu_f > ul > li a {background-color: #C80000; background-image:none;}
	nav > ul > li > ul > li a .sub-titre {display:inline;}
	
	.bloc-forfait {width: 100%;}
	.bloc.small {min-width:inherit; width: 96%;}
	.forfaits .bloc.small, .pourvoiries .bloc.small {padding-bottom: 60px; margin-bottom: 60px;}
	#main a.site {bottom:-40px; left: 50%; right: auto; margin-left: -40px;}
	#main a.bouton {bottom:-40px; right:10px;}
	
	.bloc.small.video {width: 96%; min-width: inherit;}
	.bloc.small.video iframe {width: 100%;}
	
	footer {display:none;}
*/
	
}

@media only screen and (max-device-width: 667px) and (orientation : landscape) { 
	nav > ul > li > ul {max-height: 150px;}
}

/* ============================== */
/* ============ iPad ============ */
/* ============================== */
@media only screen and (min-device-width : 668px){
/* 	html {min-width: 1075px;} */
}






/*
@media only screen and (min-device-width : 668px) and (max-device-width : 1024px){
	.desktop {display:none !important;}
	a:focus {outline: none;}
	body {position:static; overflow:hidden;}
	#bkg, #bkgover {position:fixed;}
	#container {width:100%; min-width:inherit; padding-bottom: 100px;}
	.wrap, #main {width: 96%; padding: 0 2% 0 2%; margin: 0;}

	.mobile-scroll {overflow: scroll; -webkit-overflow-scrolling: touch;}
	.mobile-scroll.no-scroll {overflow:hidden; position:fixed;}

	.bloc.accueil, .bloc.concours {width: 96%;}
	.bloc {width: 96%; padding: 10px 2%;}

	header #nav-top {display:none; background-color: #000; width: auto; position: absolute; z-index: 100; height: auto; line-height:1; padding: 10px 15px 10px 15px; top: 90px; right: 0; left: auto;}
	header #nav-top a {padding: 10px; width: auto; display:block;}
	header {height: auto;}
	header .logo {font-size: 22px; line-height:24px;}

	.accueil .bt-back {display:none;}
	.bt-nav, .bt-back {position: absolute; top: 35px;  font-size: 30px; color: #fff;}
	.bt-nav {right: 20px;}
	.bt-back {left: 20px;}

	#lignes_forfaits, #lignes_pourvoiries {display:none !important;}

	nav {width: 100%; right: 0; margin-left: 0; position: fixed; bottom: 0; top:auto;}
	nav > ul {}
	nav > ul > li {background: transparent; height: 87px; position:absolute; bottom:0; width:100%; }
	nav > ul > li > a {background-color: #ffcf28; margin:0; padding: 20px 0; width: 49%; margin: 0 0.5%; position:absolute; z-index: 1000;}
	nav > ul > li#menu_p {background-color: #000; -webkit-overflow-scrolling: touch;}
	nav > ul > li#menu_p > a {}
	nav > ul > li#menu_f > a {right:0;}
	nav > ul > li > ul {position:absolute; bottom: 88px; width:100%; display:none; z-index: 1000; max-height: 350px; overflow:scroll;background-color:#000;}
	nav > ul > li.open > ul {display:block; height:auto;}
	nav > ul > li.open > a {background-color: #C80000;}
	nav > ul > li > ul > li {width: 100%; position: relative; left:0!important; bottom:0!important;}
	nav > ul > li > ul > li a {position: relative; width: 100%; display: block; clear: both; height: inherit; padding: 15px 0; margin-top: 1px;}
	nav > ul > li#menu_p > ul > li a {background-color: #fff; background-image:none;}
	nav > ul > li#menu_f > ul > li a {background-color: #C80000; background-image:none;}
	nav > ul > li > ul > li a .sub-titre {display:inline;}

	.bloc-forfait {width: 100%;}
	.bloc.small {min-width:inherit; width: 96%;}
	.forfaits .bloc.small, .pourvoiries .bloc.small {padding-bottom: 60px; margin-bottom: 60px;}

	#main a.site {bottom:-40px; left: 50%; right: auto; margin-left: -40px;}
	#main a.bouton {bottom:-40px; right:10px;}

	.bloc.small.video {width: 96%; min-width: inherit;}
	.bloc.small.video iframe {width: 100%;}
	footer {display:none;}
}
*/

@media only screen and (min-height: 800px) {#main a.bt-voirplus {display:none;}}

/* ==|== print styles ======================================================= */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } 
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } 
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}