/* 
Title:     Boudj Design master styles for screen media
Author:    David Boudjenah | http://www.designislove.fr/
Created:   25 Janvier 2009
*/

/* GLOBAL RESET
------------------------------------------------------------------*/
html,body,div,dl,dt,dd,ul,ol,li,pre,form,fieldset,input,blockquote,table,th,td { margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset,img,abbr { border: 0; }
address,caption,cite,code,dfn,th,var { font-style: normal; font-weight: normal; }
ul { list-style: none; }
caption,th { text-align: left; }
h1,h2,h3,h4,h5,h6,p { font-size: 1.0em; margin: 0 0 .8em 0; padding: 0; }
.hide { display: none; }

a img, :link img, :visited img { border: 0; }
a, a:link{ text-decoration: none; color: #f5f4e9 ; outline: none; }
a:visited { text-decoration: none; outline: none; }
a:hover { color: #e8b43d; outline: none; }	

.clear { clear: both }

/* HEADINGS
------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6{ margin: 0; padding: 0; color: #8eab99}
h2{
	font-family: Georgia, Times, "Times New Roman", serif;
	font-size:20px;
	color:#E8B43D;
	line-height:1.3em;
	text-align:justify;
	font-style:italic;
	font-weight: 400;
	margin-bottom: 30px;
}
h3{ color:#E8B43D; font-size:13px; font-weight:normal; margin:0 0 0.5em;}

/* MAIN STRUCTURE
------------------------------------------------------------------*/
body {
	color: #E4D9BB;
	background: #010101 url(../images/background.jpg) repeat-y top center;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 100%;
}
#container{
	width: 960px;
	margin: 0 auto;
	position: relative;
}
#page {
	float:left;
	margin:0 auto;
	width:960px;
}
#header{
	height: 200px;
	text-align: left;
	padding-top: 15px;
}
#logo {
	float:left;
	width: 302px;
}
#logo h1, #logo span {
	display:none;

}
#nav { 
	width: auto;
	float:right;
	height:100px;
	margin-top: 49px;
	text-align:center;

}

#nav ul li { 

	width: 74px; 
	height: 100px; 
	margin-right:25px;
	cursor: pointer;
	display:inline;
	float:left;
	}
	
#nav ul li#contact {
	margin-right:0;
	}

	
#nav ul li a img { 
	border:1px solid #FFFFFF;
	display:block;
	padding:2px;
	width:66px;
}


#nav ul li a span { 
	display: block; 
	font-size: 17px;
	line-height: 2em;
	letter-spacing: 1px;
	text-align: center;
	color:#e8b43d;
	}
	
#nav ul li#jupiter a span { line-height: 1em; padding-top: 3px; }

#nav ul li#guestbook a span { font-size: 15px; font-weight: bold; letter-spacing: 0; padding-top: 3px; }
	
#nav ul li a:hover span { color: #e8b43d; font-weight: normal }
	  
	  
#nav ul li.current {  color: #f5f4e9 ; }
	  
#nav ul li.current a span,
#nav ul li.current a:focus span,
#nav ul li.current a:hover span,
#nav ul li.current a:active span { color: #f5f4e9;  }

#main {  }

#main .leftCol { width: 430px; float:left; }

#main .leftCol .preface { padding:30px 50px 0 30px; }
#main .leftCol .actu p a { color: #E8B43D;
text-decoration: underline }

#main .leftCol .preface p {
	font-size:14px;
	line-height:1.3em;
	text-align:justify;
	font-style:italic;
	}
	
	#main .leftCol .actu p {
	font-size:12px;
	line-height:1.3em;
	text-align:justify;
	}

#main .leftCol .preface span { color: #E8B43D ; }
#main .leftCol .actu span { color: #E8B43D ; }
#main .leftCol .preface p.sign { text-align:right; color: #f5f4e9; margin-top: 30px}

#main .rightCol { width: auto; float: right }
#main .rightCol img  { border: 1px solid #f5f4e9;padding:2px; }


/* GALERIE */


div#galerie
{
	float:left;
	width:960px;
	border: 0;
	bottom: 10px;
	text-align: center ;
	font: 0.9em Georgia, serif ;
}

#thumbs
{
	list-style-type:none;
	padding:0;
	width: 245px;
	padding: 20px 0 0 12px;
}

#slideshow { float: right; width:475px; position: relative; min-height:565px; }

#slideshow img { border:1px solid #F5F4E9; padding:2px; }

.container-photo{
	display: table-cell;
	vertical-align: middle;
	height: 635px;
	text-align: center;
	width: 565px;
}

#thumbs li
{
	float:left;
	height:56px;
	margin-bottom:25px;
	margin-left:25px;
	width:56px;
}

#thumbs li a { display: block;}
#thumbs li .caption { display: none;}
#thumbs li a img
{
	border: 1px solid #F5F4E9 ;
	padding:2px;
	
}

div.loader {
	position: absolute;
	top: 0;
	left: 0;
	background-image: url('../images/loader.gif');
	background-repeat: no-repeat;
	background-position: center;
	width: 475px;
	height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
}

.biographie {

	margin-left:50px;
}

.galeriejupinfo {

	margin-top:40px;
	text-align:center;
	font-size:19px;
	
}

.contact {

	margin-top: 60px;
	font-style:italic;
	
}

.contact ul li {

	margin: 0 0 10px;
	list-style-type: disc;
	list-style-position: inside;
	
}

.contact a { color: #e8b43d; }
.contact a:hover { text-decoration: underline;  }


.nicefont { color: #e8b43d;  }
a.nicefont:hover { color: #E4D9BB; }
.nicefont a:hover { color: #E4D9BB;  }
.galeriejupinfo span { display: block; }



span.date { font: italic 1.5em Georgia, serif ; color: #fff; display: block; margin: 15px 0 5px; }

span.descr { 
	background:transparent url(../images/puce.png) no-repeat scroll 0 11px;
	padding:1px 0 1px 10px;
	font-size:0.8em;
	color: #e8b43d; 
	display: block; 
	margin-bottom:15px; 
}

span.imp { font-size: 18px; }

span.prix { font: normal 1.5em Georgia, serif ; text-transform: uppercase; color: #f5f4e9  }

img.jupiter { width:480px; }

span.galeriejupiter { color: #e8b43d;  }

a.acces { font-size:0.8em; color:#e8b43d  }

a.acces:hover { text-decoration:underline;  } 


#footer { 
float: left; 
display: block; 
clear: both; 
width:100%; 
height:111px; 
margin-top: 50px; 
text-align:center }

#footer p { padding-top:30px; text-align:center; font-size: 0.8em; color:#666666;  }

#footer p a { color: #999999; }
#footer p a:hover { color: #e8b43d; }

.fb-link { background: transparent url('../images/icon_facebook.png') no-repeat scroll left center ; line-height:2em; cursor:pointer; padding:0 0 0 30px; }
.fb-link a { color: #999 !important }

.caption span { color: #CCC; font-size: 16px; }
.caption { color: #999; font-size: 12px; margin:1em 0 0; }

div#loading {
	background:url("../images/loader.gif") repeat scroll 0 0 transparent;
	display:block;
	height:16px;
	left:50%;
	position:absolute;
	top:50%;
	width:16px;
}