﻿
body {
	background : #222;
	color : white;
	margin : 0;
	font-family: "Eras ITC", "Eras Medium ITC", serif, Arial;
}
#body_enfant {
	width : 100%;
	margin : auto;
}
.commander {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color:#ededed;
	-webkit-border-top-left-radius:20px;
	-moz-border-radius-topleft:20px;
	border-top-left-radius:20px;
	-webkit-border-top-right-radius:20px;
	-moz-border-radius-topright:20px;
	border-top-right-radius:20px;
	-webkit-border-bottom-right-radius:20px;
	-moz-border-radius-bottomright:20px;
	border-bottom-right-radius:20px;
	-webkit-border-bottom-left-radius:20px;
	-moz-border-radius-bottomleft:20px;
	border-bottom-left-radius:20px;
	text-indent:0;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#777777;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	font-style:normal;
	height:35px;
	line-height:35px;
	width:131px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #ffffff;
}
.commander:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
}.commander:active {
	position:relative;
	top:1px;
}
.bouton a {
display:block;
width:150px;
line-height:50px;
text-align:center;
vertical-align:middle;
background:url(../images/boutonnoir.png) no-repeat;
text-decoration:none;
}
.bouton a:hover {
background:url(../images/boutonnoir2.png) no-repeat;
}

a{
	text-decoration : none;
	text-shadow: 1px 1px 10px rgba(89,22,20,0.6);
	color: #fff;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}	
a:hover{
	text-decoration : none;
	text-shadow: 1px 1px 2px rgba(89,22,20,0.3);
	color: #6f69e6;
}	
.centrer{
	text-align : center;
}
.gros {
	font-size : 2em;
	font-weight : bold;
}
.flottant_gauche {
	float: left;
	margin-right : 1em;
}
.flottant_droite {
	float: right;
	margin-left: 1em;
}
.texte {
	text-indent : 20px;
	text-align : justify;
}
.clear {
	clear: both;
}

#accueil
{
	background : url('../images/filigrane01.png');
}
/*Barre de navigation*/
nav {
	background : black;
	width : 15%;
	height: 100%;
	position : fixed;
	z-index : 20;
}
	nav ul {
		margin : 0;
		padding: 10px;
	}
	nav li {
		height: 80px;
		list-style-type : none;
		margin : 10px 0 20px 0;
	}
	nav .menu_texte  {
		width : 50%;
		height : 80px;
		line-height: 70px; /* On centre verticalement le texte du menu ici */
		margin-left : 40%;
	}
		nav .menu_texte span{
			display: inline-block;
			vertical-align: middle;
			line-height: normal;
		}
	nav div {
	position:relative;
	width:100%;
	float: left;
	}
	
		nav div img {
			width : 35%;
			position:absolute;
			left:0;
			-webkit-transition: all 1s ease-in-out;
			-moz-transition: all 1s ease-in-out;
			-o-transition: all 1s ease-in-out;
			transition: all 1s ease-in-out;
		}

		nav div img.top {
			-webkit-transform:scale(1,0);
			-moz-transform:scale(1,0);
			-o-transform:scale(1,0);
			transform:scale(1,0);
			filter: alpha(opacity=0);
			opacity:0;
		}

		nav div:hover img.top, nav div.hover_effect img.top {
			opacity:1;
			-webkit-transform:scale(1,1);
			-moz-transform:scale(1,1);
			-o-transform:scale(1,1);
			transform:scale(1,1);
		}

		nav div:hover img.bottom, nav div.hover_effect img.bottom {
			filter: alpha(opacity=0);
			-webkit-transform:rotate(360deg) scale(0,0);
			-moz-transform:rotate(360deg) scale(0,0);
			-o-transform:rotate(360deg) scale(0,0);
			transform:rotate(360deg) scale(0,0);
		}

		nav li a.active {
			font-weight:bold;
			text-shadow: 1px 1px 10px rgba(89,22,20,0.6);
			color: #581514;
		}

		nav:hover li a{
			text-shadow: 0px 0px 5px #fff;
		}


/*Fin de la barre de navigation */

/*bandes latérales fondues*/
#grad_gauche, #grad_droite {
	width: 100px;
	height: 100%;
	position: fixed;

}
	#grad_gauche {
		left: 15%;
		background: url('../images/grad_gauche.png') repeat-y;
		z-index : 20;
	}
	#grad_droite {
		right: 0;
		background: url('../images/grad_droite.png') repeat-y;
	}
/*Fin de la bande*/

/*Le corps principal*/
article {
	position : absolute;
	left : 13%;
	margin : auto;
	overflow : hidden;
	padding-top : 20px;
}

.contentbox-wrapper{			
	position:relative; 
	left:0; 
	width : 950%;
	height : 100%;
}

.contentbox{
	width:9%;
	height : 700px;
	overflow-y : auto;
	overflow-x : hidden;
	float:left; 
	padding-left : 120px;
	background:#222;
}
.colonne1, .colonne2 {
	width : 45%;
	margin : 0px 50px 0px 20px;
}
	.colonne1 {
		float : left;
	}
	.colonne2 {
		display : inline-block;
		margin-right : 0;
	}
	
table {
	width : 100%;
}
.vide {
	width : 50px;
}
.texte_gauche, .texte_droite {
	width : 40%;
}
.texte_droite {
	text-align : left;
	padding-left: 10px;
}
.texte_gauche {
	text-align : right;
	padding-right : 10px;
}
/*Fin du corps principal*/

/*Images Gallery*/
.adipoli-wrapper
{
    margin:auto;
    position:relative;
    display: inline-block;
}
.adipoli-wrapper>img
{
    position: absolute;
    z-index: 1;
}
.adipoli-before
{
    position: absolute;
    z-index: 5;
}
.adipoli-after
{
   position: absolute;
    z-index: 10;
}
.adipoli-slice {
    display:block;
    position:absolute;
    z-index:15;
    height:100%;
}
.adipoli-box
{
    display:block;
	position:absolute;
    z-index:15;
}
.galerie{
	overflow : hidden;
	margin-left: 50px;
}
.galerie figure {
	text-align :center ;
	width : 20%;
	margin : 20px 20px 40px 10px;
	float : left;
}
.galerie figure img {
	width : 150px;
	height : 190px;
}

.galerie figcaption {
	text-align : center;
}

/*Media Queries*/
@media screen and (max-height:582px)
{
	body {
		background : #222;

}
/*Barre de navigation*/
nav {
	background : black;
	width : 15%;
	height: 100%;
	position : fixed;
	z-index : 20;
}
	nav ul {
		margin : 0;
		padding: 10px;
	}
	nav li {
			font-size: 0.8em;
		height : 50px;
		list-style-type : none;
		margin : 20px 20px 10px 0;
	}
	nav .menu_texte  {
		width : 50%;
		height : 50px;
		line-height: 40px; /* On centre verticalement le texte du menu ici */
		margin-left : 40%;
	}
		nav .menu_texte span{
			display: inline-block;
			vertical-align: middle;
			line-height: normal;
		}
	nav div {
	position:relative;
	width:100%;
	float: left;
	}		

/*Fin de la barre de navigation */

.contentbox{
	width:9%;
	height : 550px;
	overflow-y : auto;
	overflow-x : hidden;
	float:left; 
	padding-left : 120px;
	background:#222;
}
.colonne1, .colonne2 {
	width : 45%;
	margin : 0px 20px 0px 20px;
}
	.colonne1 {
		float : left;
	}
	.colonne2 {
		display : inline-block;
		margin-right : 0;
	}
}

@media screen and (min-height:583px) and (max-height: 710px)
{
	body {
		background : #222;

}
/*Barre de navigation*/
nav {
	background : black;
	width : 15%;
	height: 100%;
	position : fixed;
	z-index : 20;
}
	nav ul {
		margin : 0;
		padding: 10px;
	}
	nav li {
		height : 70px;
		list-style-type : none;
		margin : 15px 20px 10px 0;
	}
	nav .menu_texte  {
		width : 50%;
		height : 70px;
		line-height: 60px; /* On centre verticalement le texte du menu ici */
		margin-left : 40%;
	}
		nav .menu_texte span{
			display: inline-block;
			vertical-align: middle;
			line-height: normal;
		}
	nav div {
	position:relative;
	width:100%;
	float: left;
	}		

/*Fin de la barre de navigation */

.contentbox{
	width:9%;
	height : 600px;
	overflow-y : auto;
	overflow-x : hidden;
	float:left; 
	padding-left : 120px;
	background:#222;
}
.colonne1, .colonne2 {
	width : 45%;
	margin : 0px 20px 0px 20px;
}
	.colonne1 {
		float : left;
	}
	.colonne2 {
		display : inline-block;
		margin-right : 0;
	}
}

@media screen and (min-height:900px)
{
	body {
		background : #222;

}
/*Barre de navigation*/
nav {
	background : black;
	width : 15%;
	height: 100%;
	position : fixed;
	z-index : 20;
}
	nav ul {
		margin : 15px;;
		padding: 10px;
	}
	nav li {
		height : 80px;
		list-style-type : none;
		margin : 40px 0 40px 0;
	}
	nav .menu_texte  {
		width : 50%;
		height : 90px;
		line-height: 80px; /* On centre verticalement le texte du menu ici */
		margin-left : 40%;
	}
		nav .menu_texte span{
			display: inline-block;
			vertical-align: middle;
			line-height: normal;
		}
	nav div {
	position:relative;
	width:100%;
	float: left;
	}		

/*Fin de la barre de navigation */

.contentbox{
	width:9%;
	height : 900px;
	overflow-y : auto;
	overflow-x : hidden;
	float:left; 
	padding-left : 120px;
	background:#222;
}
.colonne1, .colonne2 {
	width : 45%;
	margin : 0px 20px 0px 20px;
}
	.colonne1 {
		float : left;
	}
	.colonne2 {
		display : inline-block;
		margin-right : 0;
	}
}