@font-face {
font-family: arixelles;
src: url("../fonts/KozGoPro-Light.otf") format("opentype");
}

@charset "utf-8";
html {
	font: 90%/1.4 'arixelles', Helvetica, Arial, Verdana, sans-serif;
	margin: 0;
	padding: 0;
}

body {
	font: 90%/1.4 'arixelles', Helvetica, Arial, Verdana, sans-serif;
	margin: 0;
	padding: 0;
	color: #333;
	background: url(../images/bg.jpg) no-repeat center top fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	body {
		font: 80%/1.4 'arixelles', Helvetica, Arial, Verdana, sans-serif;
	}
}

.lignes_obliques_haut {
	background: url(../images/bg_top.png) top repeat-x fixed;
	z-index:0;
	width:100%;
	height:540px;
	position:fixed;
	top : 0;
}

.libelle {
	height:24px;
	clear:both;
}

.lignes_obliques_bas {
	background: url(../images/bg_bottom.png) bottom repeat-x fixed;
	z-index:0;
	width:100%;
	height:540px;
	position:fixed;
	bottom : 0;
}
tr.border_bottom td {
  border-bottom:1pt solid black;
}
/* ~~ Sélecteurs d'éléments/balises ~~ */
ul, ol, dl {
	padding: 0;
	margin: 0;
}
.content ul, .content ol {
	padding: 0 15px 15px 40px; /* cette marge intérieure reflète la marge intérieure droite dans les en-têtes et la règle de paragraphe ci-dessus. Une marge intérieure a été placée en bas, afin d'assurer un espace entre les autres éléments des listes, et à gauche pour créer le retrait. Vous pouvez les régler comme bon vous semble. */
}

/* hauteur régulière des items */
.content ul li {
  list-style: disc;
  line-height: 28px;     /* hauteur visuelle d’une ligne */
  margin: 0;             /* au besoin ajoute un espacement uniforme ci-dessous */
}

/* clé : empêcher <sup>/<sub> d’agrandir la "line box" */
.content sup,
.content sub {
  line-height: 1;
  font-size: 0.7em;
  padding-left: 0.1em;
}

.content sup { vertical-align: super; }
.content sub { vertical-align: sub; }

.content ul li + li { margin-top: 4px; }

.content ul li::marker {
    font-size: larger;
    color: #333;
}

date {
    font-size: x-small;
    font-weight: normal;
    border: 1px solid #ffcd1c;
    background-color: #ffcd1c;
    color: rgba(0, 0, 0, 0.7);
    padding: 4px;
    border-radius: 5px;
    vertical-align: middle;
    margin-right: 12px;
}
date svg {
	vertical-align: sub;
}

h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;
	padding-right: 15px;
	padding-left: 15px;
	font-weight:500;
	font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}
h1 {
	font-size:175%;
}
h2 {
	font-size:130%;
}

.gallerie img{
	width: 100%;
}
a{
	color:#000;
}

a img {
	border: none;
}

a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}

/* ~~ CONTENEURS ~~ */

/* ~~ Pied de page ~~ */
.footer {
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	display:block;
	font-size:11px;
	clear: both;
}

/* ~~ Principaux ~~ */
table {
	border-spacing:0px;
}

.contentcontainer {
	width: 95%;
	max-width: 1300px;
	min-width: 780px;
	background: url(../images/bg_whitepixel.png) repeat scroll;
	height:700px;
	margin: 0 auto auto auto;
	display:block;
	position:fixed;
	padding-bottom: 100px;
}
.voileBlanc {
	background: url(../images/bg_whitepixel.png) repeat;
	color:#000000 !important;
}
.container {
	width: 95%;
	max-width: 1300px;
	min-width: 780px;
	margin: 0 auto 0 auto;
	position:relative;
}

.header {
	position:relative;
}

.content {
	padding: 10px 0px 120px 0px;
	width: 100%;
	float: left;
	position: relative;
}

.centerbar {
	float: left;
	width: 25%;
	padding-bottom: 10px;
}
.centerbar2 {
	float: left;
	width: 20%;
	padding-bottom: 10px;
}
.contentobject {
	margin:5px 5px 5px 5px;
	min-height:450px;
	position:relative;
}

.contentobject img {
	position:absolute;
	width:100%;
	-webkit-filter: brightness(100%);
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.contentobject img:hover {
    -webkit-filter: brightness(120%);
}

.contentobject p {
	position:absolute;
}

.bloc {
	display:block;
	width:150px;
/*	height:50px;*/
	color:#FFF;
}

.bloctitre {
	display:block;
	width:25%;
	height:35px;
	color:#FFF;
	padding:0px;
	margin: 0;
}

.blocmenu {
	display:block;
	height:35px;
	padding:0px;
	margin:0;
}

.rowtable {
	height:30px;
	line-height:30px;
	padding:0;
	margin:0;
}

.blocicon {
	width:30px;
	height:30px;
	border:0px solid #555;
	margin:5px;
	cursor:pointer;
	background-color:#555;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:auto 15px;
	float:right;
}

.bloctelephone {
	width:200px;
	height:30px;
	line-height:30px;
	border:0px solid #555;
	margin:5px;
	float:right;
	font-size:20px;
	font-weight:900;
	color:#111;
	text-align:right;
}

.facebook {
	background-image:url(../images/facebook.png);
}

.home {
	background-image:url(../images/home.png);
}

.grand {
	font-size:180%;
	font-weight:200;
	font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.moyen {
	font-size:150%;
	font-weight:400;
	font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.normalmoyen {
	font-size:110%;
	font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.normal {
	font-size:100%;
	font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.normalpetit {
	font-size:90%;
	font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.petit {
	font-size:75%;
	font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.gras {
	font-weight:700;
}

.espace {
	padding-top:10px;
	padding-bottom:5px;
}

.espaceexterieur {
	margin:2px;
}

.espaceexterieurgrand {
/*	height:70px;*/
	padding-top: 15px;
	padding-bottom: 15px;
}

.espaceseparateur {
	margin:2px;
}

.bloc a {
	color:#FFF;
	text-align:right;
}

.blanc {
	background-color:#FFFFFF;
	color:#000000;
}

.beigeclair {
	background-color:#F5F5DC;
}

.beige {
	background-color:#C8AD7F;
}

.grisclair {
	background-color:#EEEEEE;
}

.gris {
	background-color:#AAAAAA;
}

.grisfonce {
	background-color:#555555;
	color:#FFFFFF !important;
}

.vert {
	background-color:#56aa22;
}

.bleu {
	background-color:#4395e8;
}

.mauve {
	background-color:#9966cc;
}

.jaune {
	background-color:#ffcd1c;
}

.rouge {
	background-color:#ff3a1c;
}

.blocMauve {
	right:20px;
	margin-top:0%;
	width: 100% !important;
	text-align: right;
}

.blocBleu {
	right:-50px;
	margin-top:215%;
}

.blocRouge {
	width:110%;
	right:0;
}

.droiteHaut {
	margin-left:105px;
	width:70%;
}

.droite {
	margin-left:150px;
	width:70%;
}

.gauche {
	margin-left:15px;
	text-align:left;
}

.dedans {
	right:0px;
	top:20px;
	width:70%;
}

.bas {
	margin-top:240%;
}

/* ~~ MENU ~~ */
#menu {
    margin: 70px auto 0 auto;
    padding-left: 15px;
    padding-right: 0px;
	list-style-type: none;
	height:30px;
	text-align: justify;
	font-weight: 500;
	font-size: 90%;
	float:right;
	z-index:10;
}

#menu:after {
    display: inline-block;
}

#menu li {
	display: inline;
	border:1px !important;
	border-bottom:0px;
	padding:15px;
	transition: all 0.5s ease;
}

#menu li:hover {
	background:#ffcd1c;
	background-position:center top;
	background-repeat:no-repeat;
	border: 0px solid #e9b71a;
	border-bottom: 0px;
	cursor:pointer;
}

#menu li a {
	color:#363636;
	padding: 0px;
	text-decoration:none;
}

/* ~~~~ Menu vertical ~~~~*/

.menuvertical {
    padding: 0px;
	list-style-type: none;
	cursor:pointer;
	z-index:10;
}

.menuvertical:after {
    display: inline-block;
}

.menuvertical li {
	display : block;
	border:1px !important;
	border-bottom:0px;
	padding:15px;
  transition: all 0.5s ease;
}

.menuvertical li:hover {
	background:#CCCCCC;
	color:#FFF;
	background-position:center top;
	background-repeat:no-repeat;
	border: 0px solid #e9b71a;
	border-bottom: 0px;
}

.menuvertical.gris li:hover {
    color: #444;
}

.menuvertical.bleu li:hover {
    background: #9ac1ea;
    color: #243e77;
}

.menuvertical.vert li:hover {
    background: #aedb92;
    color: #165322;
}

.menuvertical.rouge li:hover {
    background: #ffcac1;
    color:#931d0b;
}

.menuvertical.jaune li:hover {
    background: #ffeeb1;
    color:#8c6f06;
}

.menuvertical li a {
	padding: 0px;
	text-decoration:none;
}

.menuvertical li:hover a {
	color:#FFF;
	padding: 0px;
	text-decoration:none;
}

.centreH {
    margin: 0 auto 0 auto;
	text-align: center;
}

.centreV {
    margin: auto 0 auto 0;
}

.bordtop {
	border-top: 1px solid #666;
}

.bordbottom {
	border-bottom: 1px solid #666;
}

/* ~~ Styles de liste de navigation (peuvent être supprimés si vous optez pour un menu de survol prédéfini tel que Spry) ~~ */
ul.nav {
	list-style: none; /* entraîne la suppression du marqueur de liste */
	border-top: 1px solid #666; /* crée la bordure supérieure des liens ; les autres sont placées à l'aide d'une bordure inférieure sur la balise LI */
	margin-bottom: 15px; /* crée l'espace entre la navigation et le contenu en dessous */
}
ul.nav li {
	border-bottom: 1px solid #666; /* crée la séparation des boutons */
}
ul.nav a, ul.nav a:visited { /* le regroupement de ces sélecteurs garantit que vos liens conservent leur apparence de bouton, même après avoir été activés */
	padding: 5px 5px 5px 15px;
	display: block; /* attribue au bloc de liens des propriétés qui lui font remplir toute la balise LI qui le contient. Force la zone entière à réagir à un clic de souris. */
	text-decoration: none;
	background: #8090AB;
	color: #000;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* modifie la couleur de l'arrière-plan et du texte pour les navigateurs à la souris et au clavier. */
	background: #6F7D94;
	color: #FFF;
}

.center {
	text-align:center;
}

/* ~~ classes flottant/effacement diverses ~~ */
.fltrt {  /* cette classe peut servir à faire flotter un élément depuis la droite sur votre page. L'élément flottant doit précéder l'élément à côté duquel il doit apparaître sur la page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* cette classe peut servir à faire flotter un élément depuis la gauche sur votre page. L'élément flottant doit précéder l'élément à côté duquel il doit apparaître sur la page. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* cette classe peut être placée sur une div <br /> ou vide, en tant qu'élément final suivant la dernière div flottante (dans le #container) si le paramètre #footer est supprimé ou retiré du #container */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
.centpourcent{
	width:100%;
}

/* ~~ Formulaire ~~ */
input {
	padding:5px;
	margin:5px;
	border:0px;
	font-size:110%;
	font: 100%/1.4 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}
input[type=submit] {
	padding:5px;
	margin:5px;
	border:0px;
	font-size:110%;
	font: 100%/1.4 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

input#addresse {
	display:none;
}

progress {
	padding:0px;
	height:2px;
	width:100%;
	border:0px;
}

#holder { /*width:450px;*/ min-height:170px; padding-top:10px; padding-bottom:10px; padding-left:10px; margin-left:10px; font-size:70px; background:#eee; border:dashed 10px #ddd; color:#999999 }
#dropper.over { background:#ddd; border-color:pink; }
#dropper > div.help { padding:30px 0 0 30px; color:#aaa; font-size:80px; text-shadow:#ccc 1px 1px 2px; }
#dropper > div.help:not(:first-child) { display:none; }

input.files.hidn { position:absolute; visibility:hidden; }
#file-list > p { margin:5px 0; padding:3px; border:solid 5px lightblue; }

.files {
	padding: 30px 70px;
	background: lightblue;
	border-radius: 20%/50%;
}
.files.over {
	background: black;
	color: white;
}

/* ugh */
#dropper:after {
	clear: both;
	content: '.';
	display: block;
	font-size: 0px;
	height: 0px;
	line-height: 0;
	visibility: hidden;
}

textarea{
	width:500px;
	max-width:500px;
	height:150px;
	padding:5px;
	margin:5px;
	border:0px;
	font-size:110%;
	font: 100%/1.4 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.error-message {
	color:#FF0000;
}

/* ~~ Calendrier ~~ */

.calender { padding:10px;}
.calender .year{ font-size:45px; float:left; width:210px;}
.inactive{ color:#888888; }
.active{ color:#ff3a1c; }
.calender .relative{ position:relative;}
.calender .months{}
.calender .month{ margin-top:12px;}
.calender .months ul{ list-style:none; margin:0px; padding:0px;}
.calender .months ul li a{ float:left; margin:-1px; padding:0px 15px 0px 0px; color:#888888; text-decoration:none; font-size:20px; font-weight:bold; text-transform:uppercase;}
.calender .months ul li a:hover, .months ul li a.active{ color:#ff3a1c;}
.calender table{ border-collapse:collapse;}
.calender table td{ border:1px solid #EEEEEE; background-color:#FFF; height:80px; width:70px;}
.calender table td.today{ border:2px solid #56aa22; height:80px;}
.calender table td.padding{ border:none;background: none;}
.calender table td.padding:hover{ border:none; background: none; cursor:default}
.calender table td:hover{ background:#DFDFDF; cursor:pointer;}
.calender table th{ font-weight:normal; color:#A8A8A8;}
.calender table td .day{ position:absolute; color:#000; bottom:-40px; right:5px;  font-weight:normal; font-size:24.3pt;}
.calender table td .weekday{ position:absolute; color:#BBBBBB; bottom:-40px; right:5px; font-weight:normal; font-size:24.3pt;}
.calender table td .events{ position:relative; width:70px; height:0px; margin:-39px 0px 0px; padding:0px;}
.calender table td .events li{ width:20px; height:20px; float:left; margin-left:1px; margin-top:1px; overflow:hidden; text-indent:-3000px;}
.type1{ background:#56aa22; }
.type2{ background:#ff7a00; }
.type3{ background:#4395e8; }
.type4{ background:#ffcd1c; }
.type5{ background:#F90505; }
.type6{ background:#555555; }
.type7{ background:#EEEEEE; }
.type8{ background:#9966cc; }
.calender table td:hover .events{ position:absolute; right:20px; top:66px; width:30%; width-max:442px; list-style:none; margin:0px;}
.calender table td:hover .events li{ height:90px; font-weight:normal; border-bottom:0px solid #D6D6D6; text-indent:0; margin-right:20px; background:none; width:90%; max-width:442px; padding:5px;}

.calender table td:hover .events li.type1{ border-left:5px solid #56aa22; background:#FFF }
.calender table td:hover .events li.type2{ border-left:5px solid #ff7a00; background:#FFF }
.calender table td:hover .events li.type3{ border-left:5px solid #4395e8; background:#FFF }
.calender table td:hover .events li.type4{ border-left:5px solid #ffcd1c; background:#FFF }
.calender table td:hover .events li.type5{ border-left:5px solid #F90505; background:#FFF }
.calender table td:hover .events li.type6{ border-left:5px solid #555555; background:#FFF }
.calender table td:hover .events li.type7{ border-left:5px solid #EEEEEE; background:#FFF }
.calender table td:hover .events li.type8{ border-left:5px solid #9966cc; background:#FFF }

.calender table td:hover .events li:first-child{ border-top:0px solid #D6D6D6;}
.calender table td .daytitle{ display:none;}
.calender table td:hover .daytitle{ position:absolute; right:20px; top:21px; width:30%; width-max:442px; list-style:none; margin:0px; padding:0px; color:#56aa22; font-size:20px; display:block; font-weight:normal;}
.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width:50%;
  min-width: 500px;
  max-width: 700px;
  margin: 15px auto;
  border: 1px #000 solid;
}
#popup_calendrier .relative{ display:none;}
#popup_calendrier .daytitle{ right:20px; top:21px; width-max:442px; list-style:none; margin:0px; margin-bottom:10px; padding:0px; color:#56aa22; font-size:20px; display:block; font-weight:normal;}
#popup_calendrier .events{ list-style:none; margin:0px;}
#popup_calendrier .events li{ font-weight:normal; border-bottom:1px solid #D6D6D6; text-indent:0; margin:5px; background:none; width:90%; max-width:442px; padding:5px;}
#popup_calendrier .events li.type1{ border-left:5px solid #56aa22; background:#FFF }
#popup_calendrier .events li.type2{ border-left:5px solid #ff7a00; background:#FFF }
#popup_calendrier .events li.type3{ border-left:5px solid #4395e8; background:#FFF }
#popup_calendrier .events li.type4{ border-left:5px solid #ffcd1c; background:#FFF }
#popup_calendrier .events li.type5{ border-left:5px solid #F90505; background:#FFF }
#popup_calendrier .events li.type6{ border-left:5px solid #555555; background:#FFF }
#popup_calendrier .events li.type7{ border-left:5px solid #EEEEEE; background:#FFF }
#popup_calendrier .events li.type8{ border-left:5px solid #9966cc; background:#FFF }
#popup_calendrier .events li:first-child{ border-top:0px solid #D6D6D6;}

.clear{ clear:both;}