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-size:100%; font-weight:normal;}
q:before,q:after{ content:'';}
abbr,acronym{ border:0;}

body {background: url(../img/style/bg.jpg); font-family:Georgia,serif; font-size:12px; color:#393939; text-shadow:1px 1px 1px #fff;}
a{ color:#393939; cursor:pointer; outline:none;}
a:hover{ text-decoration:none;}
input,textarea{ font-family:Arial,Verdana,sans-serif; font-size:12px;}

.cl,.cr,.cb{ display:block !important; float:none !important; height:0 !important; width:0 !important;}
.cl{ clear:left;}
.cr{ clear:right;}
.cb{ clear:both;}

#wrap { position:relative; height:1400px; margin:0 auto; width:700px;}

/*SPRITE*/
.cursus h3,
.competences h3,
.experience h3,
.loisirs h3,
.contact h3,
.contact .web,
.contact .phone,
.contact .mail,
.twitter ,
.facebook,
.dribbble,
.forrst,
.viadeo,
.linkedin,
.flickr
{background:url(../img/style/sprite-blue.png) no-repeat top left;}

/*H3AD3R*/
.header-bg { background: url(../img/style/bg-header.png) no-repeat top left; height:209px; width:700px}
header h1 { color:#1d1d1d; float:left; font-size:55px; margin-top:30px; width:500px;}
header h2 { color:#3290CC; float:left; font-size:32px; width:500px;}
.photo { border:1px solid #cbcbcb; float:right; height:130px; margin-top:30px; width:100px;}

/* TAGLINE */
div.languages {
	text-align: center;
}

div.tagline {
	background: url(../img/style/separator.png) 0 100% no-repeat;
	/*margin: 20px 0;*/
}
div.tagline p {
	font-size: 20px;
	font-style: italic;
	line-height: 28px;
	padding: 35px 0 60px 150px;
	background: url(../img/icon/icon-bulb.png) no-repeat;
}

/*TITL3*/
.cursus h3 { background-position:0 0; color:#3290CC; font-size:32px; font-style:italic; line-height:33px; margin:14px 0 0 0px; padding:1px 0 0 50px;}
.competences h3 { background-position:0 -50px; color:#3290CC; font-size:32px; font-style:italic; line-height:33px; margin:15px 0 0 0px; padding:1px 0 0 45px;}
.experience h3 { background-position:0 -100px; color:#3290CC; font-size:32px; font-style:italic; line-height:33px; margin:15px 0 0 0px; padding:1px 0 0 50px;}
.loisirs h3 { background-position:0 -145px; color:#3290CC; font-size:24px; font-style:italic; line-height:33px; margin:0 0 0px; padding:1px 0 0 40px;}
.contact h3 { background-position:0 -186px; color:#3290CC; font-size:24px; font-style:italic; line-height:33px; margin:0 0 0 22px; padding:1px 0 0 40px;}

/*Common*/
.box { font-size:16px; margin:25px 15px 0 15px;}
.box li {  padding-bottom:15px;}
.box li span {color:#3290CC; display:block; padding-bottom:5px; }
.line { background:url(../img/style/line.jpg) no-repeat bottom left; height:2px; padding-top:32px;}
.line-bottom { background:url(../img/style/line.jpg) no-repeat bottom left; height:2px; padding-top:20px;}

.loisirs-contact { margin-top:20px;}
.loisirs {background:url(../img/style/line-verti.jpg) no-repeat top right; float:left; height:180px; width:350px;}
.loisirs p { font-size:16px; margin:15px 15px 0 15px;}
.loisirs ul { font-size:16px; margin:15px 15px 0 15px; }
.loisirs li { float:left; padding-bottom:20px;}

.lattes {background:url(../img/icon/icon-lattes.png) no-repeat top left;display:block; text-indent:-040685px;margin-left:10px; width:16px;}
.twitter { background-position:0 -360px; display:block; text-indent:-040685px; margin-left:10px; width:16px;}
.facebook  { background-position:0 -395px; display:block; text-indent:-040685px; margin-left:10px; width:16px;}
.flickr  { background-position:0 -430px; display:block; text-indent:-040685px; margin-left:10px; width:16px;}
.forrst  { background-position:0 -550px; display:block; text-indent:-040685px; margin-left:10px; width:16px;}
.dribbble  { background-position:0 -460px; display:block; text-indent:-040685px; margin-left:10px; width:16px;}
.viadeo  { background-position:0 -490px; display:block; text-indent:-040685px; margin-left:10px; width:16px;}
.linkedin  { background-position:0 -520px; display:block; text-indent:-040685px; margin-left:10px; width:16px;}
.google {background:url(../img/icon/icon-google.png) no-repeat top left;display:block; text-indent:-040685px;margin-left:10px; width:16px;}

.contact { float:left; height:180px;}
.contact a { text-decoration:none;}
.contact a:hover {color:#156FA9;}
.contact ul { font-size:16px; margin:5px 0 0 40px;}
.contact li { padding-top:15px; padding-left:35px;}
.contact .web { background-position:0 -229px;}
.contact .phone { background-position:0 -265px;}
.contact .mail { background-position:0 -310px;}

/*FOOT3R*/
footer { padding:15px 0;}
footer p { font-size:12px; text-align:center; margin-top:5px;}
footer a { color:#156FA9; text-decoration:none;}

/*HTML5*/
header, nav, footer, figure, section, article, figcaption, aside { display:block;}



/*VERSION MOBILE*/
@media only screen and (max-device-width:640px), only screen and (max-width:640px) {

/*Reset*/
html, body { min-width:100% !important; -webkit-text-size-adjust: none;}
img { max-width:100%; height:auto;}

#wrap { width:auto !important;}

/*H3AD3R*/
.header-bg { background:none; height:100px; width:auto !important;}
header h1 { color:#1d1d1d; font-size:35px; clear:both; margin:10px 20px; width:auto !important; }
header h2 { color:#3290CC; font-size:20px; clear:both; margin:0 20px; width:auto !important;  }
.photo { display:none;}

/*Common*/
.line-bottom { display:none;}
.line { display:none;}

.loisirs {background:none; float:none; width:auto !important;}

.contact { float:none; height:180px; width:auto !important;}
.contact ul { font-size:16px; margin:5px 0 0 25px;}
.contact h3 { margin:0 0 0 0; }

/*TITL3*/
.loisirs h3,
.contact h3 ,
.experience h3,
.competences h3,
.cursus h3 { margin-left:20px;}