/* je commence par mettre une image de fond (si le design en a besoin) 
et je rempli d'une couleur pour que l'image et le fond soit en accord (si le design en a besoin)*/ 
body {
background:#FFFFFF;
margin:0;
padding:0;
}

/* pour que la bannière ne soit pas empiétée par le texte (ou d'autre éléments de la page) 
je crée un div avec rien dedans (c'est comme créer une zone qui ici palce 2 murs invisibles, 
un tout en haut de la page et un autre à 340px du haut de la page)*/
#header {
height:65px;
width:1110px;
margin:20px 0 30px 20px;
font-family:arial, sans-serif;
color:#ffffff;
font-size:17px;
padding:0px;
}

#lastproject {
height:30px;
width:1110px;
margin:10px 0 0px 0px;
font-family:arial, sans-serif;
color:#ffffff;
font-size:15px;
background-color:#8f8f9b;
vertical-align:middle;
padding:10px;
}

#lastproject .text_lastproject_title{
font-size:25px;
font-weight:bold;
margin:0px 0 0 10px;
height:30px;
background-color:#8f8f9b;
}

.text_lastproject_content_14px
{
font-size:14px;
}

.text_lastproject {
font-size:20px;
float:right;
margin:5px 0 5px 5px;
}

#lastproject_content{
height:160px;
width:1060px;
color:#4e4e4e;
font-size:20px;
margin:20px 0 0px 0px;
background-color:#e5ffe1;
border:1px dashed #4e4e4e;
}

#text_lastproject_content{
margin-left:200px;
}

#header .text_header_title{
font-size:50px;
font-weight:bold;
margin:0px 0 0 10px;
height:39px;
}

.text_header {
font-size:20px;
float:right;
margin:30px 0 30px 30px;
background-color:#4e4e4e;
}

#text_header{
margin:0 0px 30px 30px;
font-family:arial, sans-serif;
color:#ffffff;
font-size:17px;
background-color:#4e4e4e;
padding:5px 0 5px 0px;
width:150px;
text-align:center;
}

.text{
font-family:arial, sans-serif;
color:#4e4e4e;
font-size:13px;
margin-left:30px;
}

/* là je crée une nouvelle div (zone) qui me servira à contenir dans les limites de la div (zone avec ses murs invisibles)le corps/contenu de ma page*/
#conteneur {
margin:0 auto;
width:1100px;
}

#conteneur .text_conteneur{
width:180px;
height:2100px;
float:left;
margin:0 0 0 30px;
font-family:arial, sans-serif;
color:#396900;
font-size:15px;
border-right:solid 1px #396900;
}

#reseaux a{
margin-top:10px;
}

#shokokut a{
float:left;
margin : 0px 0px 0px 10px;
}

a{
color:#396900;
text-decoration:none;
}

a img{
/*-moz-box-shadow: -1px 1px 2px #7d7d7d;
-webkit-box-shadow: -1px 1px 2px #7d7d7d;
box-shadow: -1px -1px 2px #7d7d7d;*/
 border: none;
}
a:focus
{
outline:0;
} 
/* POUR ALIGNEMENT HORIZONTAL !!!!!!!!!!!! : (dans le html ajouter les <br/> à la fin des lignes des miniatures d'images)
#creations{
}

#creations_design {
border: 1px solid blue;
float:left;
margin-top:50px;
}

#creations_illustration {
border: 1px solid orange;
float:left;
}
*/

#works{
margin-left:240px;

}

#liens {
margin-top:30px;
margin-bottom:30px;
}

#liens img{
border: 1px solid #396900;
margin:4px;
}

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }


#footer{
margin-bottom:5px 5px 5px 5px;
height:80px;
margin:30px 0 0 30px;
font-family:arial, sans-serif;
color:#396900;
font-size:10px;
}