@charset "utf-8";
/*reset default styles*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing :0; }
fieldset, img { border: 0; }
address, caption, cite, code, dfn ,/*em,strong,th,*/ var { font-style: normal; font-weight: normal; }
ol,ul { list-style: none; }
caption, th { text-align:left; }
h1, h2, h3 ,h4, h5, h6 { font-weight: normal; }
q:before, q:after { content:''; }
abbr, acronym { border: 0; border-bottom: 1px dotted; cursor: help }

body { -webkit-font-smoothing: antialiased; }

body { 
	background: url(../img/bg.jpg); 
	font-family: Georgia,serif; 
	font-size: 80%; 
	color: #393939; 
	text-shadow: 1px 1px 1px #fff;
	height: 100%; 
	margin: 0 auto; 
	max-width: 830px; /*978px; */
	padding: 10px;
}
a {
	color: #3290CC;
	cursor: pointer;
	text-decoration: none;
	white-space:nowrap;
}
a:hover, a:active, a:visited {
	text-decoration: underline;
}
a, dl dd {-webkit-transition: all 0.15s ; -moz-transition: all 0.15s ; -ms-transition: all 0.15s ; -o-transition: all 0.15s ; transition: all 0.15s ;}
.clear {
	clear:both;
}
header, nav, footer, figure, section, article, figcaption, aside { 
	display: block; 
}
body>header, body>nav, body>aside, body>article, body>footer, body>section {
	border:solid 1px white;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding:8px;
	margin:10px;
	max-width: 830px;
}
dt {
	font-size:1.4rem;
	margin-top:10px;
	padding:8px;
}
dd {
	font-size:1rem;
	padding:8px;
}
ul {
	list-style-type:square;
	padding-left:1rem;
}
/*SPRITE*/
#formations h3,
#competences h3,
#experiences h3,
#loisirs h3,
#contact h3,
#contact .web,
#contact .phone,
#contact .mail,
#twitter ,
#facebook,
#dribbble,
#forrst,
#viadeo,
#linkedin,
#flickr
{ 
	background: url(../img/sprites.png) no-repeat top left; 
	font-size: 1.8rem;
	line-height:1.8rem;
	height:2.6rem;
	vertical-align:middle;
}
#competences h3 { background-position: -50px -50px;  padding: 0 0 0 50px; }
#experiences h3  { background-position: -50px 0px; padding: 0 0 0 50px; }
#formations h3  { background-position: 0 -100px; padding: 0 0 0 50px; }
#loisirs h3     { background-position: -50px -145px; padding: 0 0 0 50px; }
#contact h3     { background-position: 0 -186px; padding: 0 0 0 50px; }

/*ROOT*/
/*HEADER*/
body>header {
	float:left;
	display:block;
}
body>header h1 {
	color: #1d1d1d;
	font-size: 2.4rem;
}
body>header h2 {
	color: #cb7956;
	font-size: 1.2rem;
}
body>header h3 {
	color: #13893c;
	font-size: 1.1rem;
	text-align: center;
}
.printonly {
	display:none;
}
.photo > img {
	border-radius: 4px;
	-webkit-border-radius: 4px;
	display: block;
	position: absolute;
}
.photo {
	/*-webkit-transform: rotate(-4deg);*/
	border: 1px solid #cbcbcb;
	border-radius: 6px;
	-webkit-border-radius:6px;
	padding: 4px;
	width: 145px;
	height: 145px;
	position: relative;
	background: #fff;
	float:left;
	margin-right:2em;
}
.photo:after {
  -webkit-box-shadow: 0 15px 10px rgba(0,0,0, 0.7);
  -moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
  -webkit-transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -o-transform: rotate(-10deg);
  position: absolute;
  left: 10px;
  bottom: 11px;
  z-index: -1;
  width: 50%;
  max-width: 300px;
  height: 20%;
  content: "";
}
.photo:before {
  -webkit-box-shadow: 0 15px 10px rgba(0,0,0, 0.7);
  -moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
  -webkit-transform: rotate(10deg);
  -moz-transform: rotate(10deg);
  -o-transform: rotate(10deg);
  position: absolute;
  right: 10px;
  bottom: 11px;
  z-index: -1;
  width: 50%;
  max-width: 300px;
  height: 20%;
  content: "";
}
/* NAV */
nav {
	text-align:center;
}
nav ul {
	list-style:square;
	padding-left:1rem;
}
nav ul li {
	display:inline;
	padding-left:2rem;
	padding-right:2rem;
}
/*ARTICLE*/
body>article {
	float:left;
}
/*ASIDE*/
aside {
	float:right;
	display:block;
	width:17rem;
	color:#555;
	text-align:left;
	border-left:solid 1px white;
	padding:1rem;
	margin-left:1rem;
}

aside {
	-webkit-box-shadow: -9px 17px 13px -10px rgba(0, 0, 0, 0.698);
	-moz-box-shadow: -9px 17px 13px -10px rgba(0, 0, 0, 0.698);
	box-shadow: -9px 17px 13px -10px rgba(0, 0, 0, 0.698);
	transform: skewX(3deg);
	-ms-transform: skewX(3deg);
	-webkit-transform: skewX(3deg);
	-moz-transform: skewX(3deg);
	content: "";
}
aside p{
	text-align:justify;
}
aside dl dt {
	font-size:1.3rem;
	margin-top:0px;
	padding:2px;
}
aside dl dd {
	font-size:.9rem;
}
/*SECTION*/
body>section {
	float:left;
}
/*FOOTER*/
footer {
	clear:both;
	text-align:center;
}
span.date {
	display:inline;
	margin-left:6px;
	border-left:double 3px #cb7956;
	padding-left:6px;
	color:#cb7956;
	font-size:1.1rem;
}
/*VERSION MOBILE*/
@media only screen and (max-device-width:640px), only screen and (max-width:640px) {
	body {
		font-size:100%;
	}
	aside {
		display:none;
		float:left;
		width:100%;
		border:none;
		padding:0;
		position:relative;
		border:none;
		margin-top:4rem;
	}
	nav {
		text-align:left;
	}
	nav ul {
		list-style-type:square;
	}
	nav ul li {
		display:block;
		font-size:1.4rem;
		padding-left:0;
	}
}