/* reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}

a{
	text-decoration: none;
	color:#152f49;
}
ul{
	list-style:none;
}
strong{
	font-weight:normal;
}
/* end reset */

/* clearfix */
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

/* installation des polices */

@font-face {
		font-family: "ScriptIwebya";
		font-style: normal;
		font-weight: normal;
		src: url("fonts/scriptbl-webfont.eot");
	}
@font-face {
		font-family: "ScriptIwebya";
		font-style: normal;
		font-weight: normal;
		src: url("fonts/scriptbl-webfont.ttf");
	}


	


	
/* CSS */

body{
	font-family:"Calibri","Tahoma";
	background-color:#b5e4e7;
}

/* FONDS */
div#bg_right{
	background-color:#e3f5f7;
	position:absolute;
	margin-left:40%;
	width:60%;
	height:1000px;
}
.blue_band{
	background:url(img/blue_grain.jpg);
	height:25px;
	font-family:"ScriptIwebya";
	font-size:0.9em;
	color:#b5e4e7;
	line-height:25px;
}
.blue_band h1 img{
	vertical-align:middle;
}
.blue_band p img{
	vertical-align:middle;
}
div#bg_right #top_band{
	position:relative;
	width:100%;
}
div#bg_right #top_band h1{
	margin-left:90px;
}
div#bg_right #top_band #shadow_top_band{
	position:absolute;
	background:url(img/shadow_top_band.png);
	width:13px;
	height:35px;
	top:0;
	margin-left:-12px;
}
div#bottom_band{
	position:absolute;
	top:975px;
	margin-bottom:0;
	width:40%;
}
div#bottom_band p{
	position:absolute;
	margin-left:5%;
}

div#bottom_band p#share{
	right:0;
}
div#bottom_band #shadow_bottom_band{
	position:absolute;
	background:url(img/shadow_bottom_band.png);
	width:12px;
	height:35px;
	bottom:0;
	left:100%;
}
/* end FONDS */


/* MIDDLE */
div#middle{
	position:relative;
	top:70px;
	margin:auto;
	width:730px;
}
/* BANNER */
div#banner{
	background:url(img/banner.jpg);
	width:730px;
	height:94px;
	text-align:center;
}
div#banner ul{
	position:absolute;
	right:-5px;
	top:15px;
	font-family:"ScriptIwebya";
	font-size:1.1em;
	color:#355d5f;
}
div#banner ul li{
	background:url(img/banner_item.png);
	height:22px;
	width:103px;
}
div#banner #welcome{
	position:absolute;
	top:-1px;
	left:-1px;
}
div#banner #shadows_banner_left{
	background:url(img/shadow_banner_left.png);
	width:31px;
	height:23px;
}
div#banner #shadows_banner_right{
	position:absolute;
	top:94px;
	right:0px;
	background:url(img/shadow_banner_right.png);
	width:31px;
	height:23px;
}

/* PAGE */
div#page{
	position:relative;
	width:670px;
	margin:auto;
	height:730px;
	background:url(img/lightblue_grain.jpg);
	border:2px solid white;
	border-top-width:0;
	z-index:10;
}
/* menu */
div#page #nav{
	position:relative;
	font-family:"ScriptIwebya";
	font-size:1.1em;
	color:#1d3035;
	text-align:center;
	top:30px;
	left:40px;
}
div#page #nav li{
	float:left;
	background:url(img/menu_arrow.png);
	width:114px;
	height:29px;
	padding-left:6px;
	line-height:29px;
	margin-left:-5px;
	cursor:pointer;
}
div#menu_activate{
	position:relative;
	background:url(img/menu_activate.png);
	width:105px;
	height:3px;
	top:35px;
	left:36px;
}
/* end PAGE */

/* PARTS */
div.part{
	display:none;
}
div.part img.illu{
	position:absolute;
	right:0;
}

div.part .content{
	position:relative;
	top:60px;
	left:35px;
	width:430px;
	height:590px;
	padding:25px 10px 0 10px;
	background:#b4d2d3;
	font-size:0.9em;
	text-align:justify;
	color:#335863;
}
div.part .content a{
	color:#335863;
	text-decoration:underline;
}
div.part .content a:hover{
	color:black;
}
div.part .content .shadow{
	position:relative;
	background:url(img/shadow_content_h2.png) no-repeat;
	height:30px;
	left:-17px;
	padding-left:7px;
}
div.part .content div h2{
	position:relative;
	padding-left:4px;
	padding-right:4px;
	font-family:"ScriptIwebya","Tahoma";
	font-size:1.2em;
	background:#dadf9d;
	height:25px;
	line-height:25px;
}
div.part .content p{
	text-indent:10px;
	border-bottom:1px solid white;
	margin-bottom:10px;
	padding-bottom:10px;
}
div.part .insert{
	position:absolute;
	top:330px;
	right:10px;
	background:#b4d2d3;
	width:164px;
	height:377px;
}

/* presentation */
div#presentation .content{
	line-height:18px;
}
div.insert dl{
	padding:10px;
	padding-top:5px;
	text-align:center;
}
div.insert dl dt{
	color:white;
	width:111px;
	height:32px;
	margin:auto;
	line-height:32px;
	font-family:"ScriptIwebya";
}
.insert dl dt#cv{
	background:url(img/frame_green.png);
	padding-left:3px;
}
.insert dl dt#profil{
	background:url(img/frame_blue.png);
}
.insert dl dt#competences{
	background:url(img/frame_red.png);
}
.insert dl dd{
	margin-bottom:15px;
}
.insert #legend{
	text-align:left;
	font-size:0.85em;
	color:#38999f;
}
.insert #legend img{
	margin-right:10px;
}
/* end presentation */

/* sites */
div#sites #site_visu{
	position:relative;
	width:330px;
	height:440px;
	margin-top:15px;
}
div#site_visu #site_description{
}
div#site_visu #site_description div{
	padding-left:8px;
	padding-top:1px;
	background:url(img/tip_site_title.png) no-repeat;
	height:21px;
	float:left;
	margin-bottom:4px;
}
div#site_visu #site_description div p{
	display:inline;
	border:0;
	background:#00b8e8;
	padding:0px 15px 1px 15px;
	color:white;
	font-size:0.8em;
	font-family:'Calibri';
	margin-right:8px;
}
div#site_visu #site_description a{
	display:block;
	background:url(img/site_link.png);
	width:20px;
	height:17px;
	float:left;
}
div#site_visu a img{
	margin-bottom:20px;
}
div#site_visu #site_tasks{
	text-indent:30px;
	font-size:0.9em;
}
div#site_visu #site_tasks li img{
	margin-right:10px;
}
/*diapo*/
div#sites #site_diapo{
	position:absolute;
	top:70px;
	right:10px;
	width:90px;
	height:434px;
	text-align:center;
}
div#sites #site_diapo img{
	cursor:pointer;
}
div#sites #site_diapo img#next_site{
	position:absolute;
	bottom:5px;
	left:35px;
	display:block;	
}
div#sites #site_diapo>div{
	position:relative;
	margin-top:2px;
	border:2px solid white;
	height:390px;
	overflow:hidden;
}
div#sites #site_diapo>div img.site_thumbs{
	margin-top:5px;
	border:1px solid white;
	opacity:0.5;
}
div#sites #site_diapo>div img.site_thumbs:hover{
	
	opacity:1;
}
div#sites #site_diapo>div img.active{
	
	opacity:1;
}
/* end sites */

/* creations */
div#creations #visu{
	position:relative;
	text-align:center;
	width:100%;
	height:280px;
	margin-top:10px;
}
div#visu #description{
	margin-top:10px;
}
div#visu #description div{
	display:inline;
	padding-top:2px;
	padding-left:8px;
	background:url(img/tip_diapo_description.png) no-repeat;
	height:21px;	
}
div#visu #description div p{
	display:inline;
	margin-top:6px;
	border:0;
	background:#00b8e8;
	padding:0px 4px 1px 4px;
	color:white;
	font-size:0.8em;
	font-family:'Calibri';
	margin-right:8px;
}
div#visu #description img#zoom{
	vertical-align:middle;
	opacity:0.3;
}
div#creations #visu #img_shadow{
	position:absolute;
	top:5px;
	left:130px;
	background:black;
	height:250px;
	z-index:0;
}
div#creations #visu a img{
	position:relative;
	height:250px;
	border:1px solid white;
	z-index:1;
}
div#diapo{
	position:relative;
	margin-top:10px;
	z-index:2;
}
div#diapo>img{
	position:absolute;
	margin-top:80px;
	margin-left:95px;
}
div#diapo img#next{
	margin-left:319px;
}
div#diapo img{
	cursor:pointer;
}
div#diapo>div{
	overflow:hidden;
	width:200px;
	margin:auto;
	border:1px solid white;
}
div#diapo div div.visu_diapo{
	margin-left:-200px;
	width:1000px;
	height:195px;
}

div.visu_diapo div.multiple_img{
	width:200px;
	margin-top:25px;
	text-align:center;
	float:left;
}
div.visu_diapo div.multiple_img img{
	border:1px solid white;
}
div.visu_diapo div.multiple_img img:hover{
	border:1px solid #1d3035;
}
div.visu_diapo div.multiple_img img.active{
	border:1px solid #1d3035;
}
div.visu_diapo div.multiple_img img.newImg{
	margin:0px 2px 2px 2px;
}
div.new_div{
	display:none;
}
/* end creations */

/* contact */
div#contact .content ul{
	text-indent:60px;
	margin-bottom:10px;
	padding-bottom:10px;
	border-bottom:1px solid white;
}
div#contact  .insert{
	background-image:url(img/contact_cloud.png);
	background-repeat:no-repeat;
}
form#form_mail{
	margin-top:10px;
	margin-bottom:10px;
	padding-bottom:10px;
	border-bottom:1px solid white;
}
form#form_mail input,textarea{
	border:0;
	font-family:"Calibri";
	font-size:0.9em;
	padding-left:3px;
	margin-bottom:5px;
}
textarea{
	width:90%;
}
#mail_message{
	margin-left:20px;
	font-family:"Calibri";
	color:red;
	font-size:0.9em;
}

/* end PARTS */

/* BOTTOM PAGE */
div#corner_page{
	position:absolute;
	background:url(img/shadow_corner_page.png);
	width:300px;
	height:179px;
	bottom:-13px;
	left:-15px;
}
ul#links{
	position:absolute;
	right:5px;
	bottom:5px;
}
ul#links li{
	position:relative;
	width:87px;
	height:27px;
	margin-bottom:5px;
	cursor:pointer;
}
ul#links li a{
	display:block;
	width:87px;
	height:27px;
}
li#bruno{
	background:url(img/arrow_bruno.png);
}
li#quentin{
	background:url(img/arrow_quentin.png);
}
li#kevin{
	background:url(img/arrow_kevin.png);
}
li#max{
	background:url(img/arrow_maxF.png);
}
li#thibaut{
	background:url(img/arrow_thibaut.png);
}
li#webrank{
	background:url(img/arrow_webrank.png);
}
ul#community_links{
	position:absolute;
	right:90px;
	bottom:-23px;
	cursor:pointer;
}
ul#community_links li{
	position:relative;
	width:28px;
	height:87px;
	margin-right:5px;
	float:left;
}
ul#community_links li a{
	display:block;
	width:27px;
	height:87px;
}
li#facebook{
	background:url(img/arrow_facebook.png);
}
li#twitter{
	background:url(img/arrow_twitter.png);
}
li#linkedin{
	background:url(img/arrow_linkedin.png);
}
/* end BOTTOM PAGE */