@charset "utf-8";
/* CSS Document */

body{
	background:url(../images/bg.jpg) repeat;
	color:#fcfbfb;
	
}

#page{
	width:980px;
	margin:0 0;
}

#sidebar{
	background:url(../images/pattern.jpg) repeat;
	width:220px;
	height:2000px;
	padding:30px;
	-moz-box-shadow: 1px 1px 6px 0px #c0c0c0;
	-webkit-box-shadow: 1px 1px 6px 0px #c0c0c0;
	-o-box-shadow: 1px 1px 6px 0px #c0c0c0;
	box-shadow: 1px 1px 6px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=134, Strength=6);
}

#home{
	margin-top:15px;
}
	
#site, #app, #charte{	
	padding-top:30px;
}

/* ----anchor---- */
#about p {
	color:#72c3e6;
	text-decoration:none;
}

a{
	color:#72C3E6;
	
	}
a:active{
	color:#acacac;
	text-decoration:underline;
}

a:hover {
	color:#acacac;
	text-decoration:none;}


/* ----headers---- */
h2, h3{
	/*background:url(../images/nav_bg.png) no-repeat bottom center;*/
	font-family: 'Poiret One', cursive;
	text-transform:uppercase;
	color:#a1a0a0;
	margin-bottom:20px;
	text-shadow: #fff 0px 1px 0px;
}
h2{
	font-size:60px;
	line-height:100px;
	margin-left:10px;
	color:#72c3e6;
	
}
h3{
	font-size:48px;
	line-height:45px;
	margin-left:0px;
}
h4{
	font-family: 'Poiret One', cursive;
	font-size:28px;
	line-height:45px;
	color:#72c3e6;
	margin-bottom:10px;
	text-shadow: #fff 0px 1px 0px;
	
	
}

p{
	color: #acacac;
	line-height:16px;
	margin-bottom:20px;
	font-family: 'Terminal Dosis', sans-serif;
	font-size:20px;
	line-height: 24px;	
	text-shadow: #fff 0px 1px 0px;
	
}

/* ----aside---- */
aside{
	float:left;
	width:250px;
	position:fixed;
	padding-top:10px;
}

/* ----nav---- */
nav{
	text-align:left;
	margin-top:20px;
	margin-bottom:20px;
}

nav .logo{
	
	font-family: 'Poiret One', cursive;
	font-size:30px;
	
	text-align:left;
	color:#72c3e6;
	text-decoration:none;

	display:block;
	font-weight:normal;
	
	text-shadow: #7E7E7E 0px 1px 0px;
}
nav .logo span{
	font-size:18px;
	display:block;
	font-family: 'Poiret One', cursive;
	color: #fffefe;
	font-weight:normal;
	margin-top:5px;
}

nav ul{
	/*background:url(../images/nav_bg.png) no-repeat bottom center;*/
	font-family: 'Poiret One', cursive;
	font-size:30px;
	padding-top:150px;
	font-weight:500;
	text-transform:uppercase;
}
nav ul li{
	position:relative;
	margin-top:-7px;
}
nav ul li a, nav ul li a:link{
	color:#fffefe;
	text-decoration:none;
	padding:10px 0 10px 0;
	display:block;
	text-shadow: #7e7e7e 0px 1px 0px;
}
nav ul li a:hover{
	text-decoration:none;
	color:#72c3e6;
}
nav ul li.active{
	

}
nav ul li.active a{
	color:#72c3e6;
	text-shadow: #6d6f6f 0px 1px 0px;
}
nav .bg_bottom{
	
	height:30px;
	
}

#main-content{
	float:right;
	width:680px;
}


/* ----sections---- */

#home, #work, #about, #contact{
	position:relative;
	margin-bottom:800px;
	float:left;
	width:100%;
	padding-top:15px;
	
}
#top{
	margin-bottom:0px;
}
#work, #about, #contact, #mentions, .columns, .intro-text{
	padding:15px;
}


/* ----divider---- */
.divider {
	text-align:center;
}
.divider h2{
	background:url(../images/border_bg.gif) repeat-x bottom left;
	/*padding-bottom:40px;*/
	margin-bottom:20px;
}
#main-content section .intro-text h2{
	font-family: 'Poiret One', cursive;
	font-size:40px;
	line-height:44px;
	padding-bottom:20px;
	
}
 .intro-text .contact-me{
	font-family: 'Poiret One', cursive;
	background:url(../images/button.gif) no-repeat;
	margin:-28px 0 0 200px;
	position:relative;
	font-size:20px;
	height:42px;
	width:237px;
	text-align:center;
	text-transform:uppercase;
} 
.intro-text .contact-me a{
	padding:10px 40px;
	text-decoration:none;
	color:#fff;
	display:block;
	text-shadow: #b04d35 1px -1px 0px;
	
}

/* ----columns---- */
.columns{
	float:left;
	width:100%;
	margin-bottom:20px;
}
.two-column{
	width:300px;
	float:left;
	margin-right:44px;
}
.three-column{
	width:200px;
	float:left;
	margin-right:30px;
	
	
	
	
}


.last{
	margin-right:0px;
}

/* ----figure---- */
figure{
	
	-moz-box-shadow:0px 0px 5px #dfdfdf;
	-o-box-shadow:0px 0px 5px #dfdfdf;
	-webkit-box-shadow:0px 0px 5px #dfdfdf;
	box-shadow:0px 0px 5px #dfdfdf;
	padding:4px;
	background:#fff url(../images/icon_magnify.gif) no-repeat center center;
	float:left;
	border:1px solid #d6d6d6;
	margin-bottom:20px;
	position:relative;
	
}
figure img{
	float:left;
}
figure figcaption{
	position:absolute;
	bottom:0px;
	margin-bottom:-5px;
	width:170px;
	color:#acacac;
	
	
}

figure figcaption a{
	left:0;
	position:absolute;
	text-decoration:underline;
	
	-webkit-transition: color 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: color 0.3s ease;
    transition: color 0.3s ease;
	
}



figure figcaption a:hover{
	text-decoration:none;
	
}
figure figcaption a span{
	display:none;
	position:absolute;
	
}
figure figcaption a:hover span{
	display:inline;
	
}

/* ----margin---- */
.marginLeft{
	margin-left:30px;
}
.marginRight{
	margin-right:30px;
}

/* ----float---- */
.floatRight{
	float:right;
}
.floatLeft{
	float:left;
}


/* ----list---- */
.list{
	float:left;
	width:100%;
	margin:0;
	padding:0;
}
.list li{
	display:inline;
	margin-right:44px;
	float:left;
	margin-bottom:17px;
}
.list li.last{
	margin-right:0px;
}


/* ----social sites icons---- */
.social_wrapper{
	float:left;
	width:100%;
	padding:20px 0;
	margin-bottom:20px;
	border-top:1px solid #e7e7e7;
	border-bottom:1px solid #e7e7e7;
}
.social_wrapper h3{
	margin-bottom:0px;
	float:left;
}
.social{
	padding:0;
	
	
	width:300px;
}
.social li{
	text-indent:-9999999px;
	display:block;
	float:left;
	margin:0 4px;
}


.social li.twitter a{
	background:url(../images/icon_twitter.png) no-repeat;
	width:29px;
	height:29px;
	display:block;
}
.social li.myspace a{
	background:url(../images/icon_myspace.png) no-repeat;
	width:29px;
	height:29px;
	display:block;
}
.social li.facebook a{
	background:url(../images/icon_facebook.png) no-repeat;
	width:29px;
	height:29px;
	display:block;
}

.social li.viadeo a{
	background:url(../images/icon_viadeo.png) no-repeat;
	width:29px;
	height:29px;
	display:block;
}

.social li.linkedin a{
	background:url(../images/icon_linkedin.png) no-repeat;
	width:29px;
	height:29px;
	display:block;
}


.social li a{
	opacity:.5;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.social li a:hover{
	opacity:1;
	
}



/* ---about---*/
#about p{
	font-size:20px;
	color:#acacac;
	line-height: 24px;	
	
	}
.introprofil{
	color:#72C3E6;
	
	}
	

/* ---contact---*/

#contact p{
	font-size:20px;
	color:#acacac;
	line-height: 24px;	
	
	}

/* ----copyright---- */
.copyright{
	margin-top:10px;
	
	padding-top:10px;
	float:left;
	width:100%;
	
	text-shadow: #fff 0px 1px 0px;
	color:#acacac;
}
.copyright small{
	font-size:14px;
}
.copyright a{
	color:#acacac;
	text-decoration:underline;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.copyright a:hover{
	color:#72c3e6;
	text-decoration:none;
}

/* ---contact ---*/
#contact{
	position:relative;
	margin-bottom:800px;
	float:left;
	width:100%;
	padding-top:15px;
	}
#contact p{
	margin-left:14px;}
#contact a{
	color:#ACACAC;
	text-decoration:underline;
	}	
	
#contact a:hover{
	color:#72C3E6;
	text-decoration:none;
	
	}	


/* ----mentions--- */
#mentions{
	position:relative;
	margin-bottom:800px;
	float:left;
	width:100%;
	padding-top:15px;
	
}
#mentions p, #mentions h4{
	margin-left:14px;}

#mentions a{
	color:#acacac;
	text-decoration:underline;
	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#mentions a:hover{
	color:#72c3e6;
	text-decoration:none;
}