@charset "utf-8";
/* CSS Mode M3 (over 939 px) */

@media screen and (min-width: 940px) {

body { 
	background-image:url(../img/trame.png);
	background-position:center top;
	background-repeat:no-repeat;
	background-size:cover;
	background-attachment:fixed;	
}
	
#site {
	position:relative;
	width : 930px;
	padding:5px;
	margin:auto;
}

#sidebar{
	float : left;
	width : 25.274%;
	margin: 0;
	padding:1.6% 0;
}

#page { 
	position : relative;
	float : right; 
	width : 72.527%;
	min-width:660px;
	margin:1.2% 0 1.2% 0;
	padding: 0;
	line-height : 1.5em;
	font-size:1.25em;
	background-image:none;
}

/*--- HEADER ---*/

header{
	position:relative;
	padding:0;
	width : 230px;
	margin:1% 0;
	text-align:center;
	background-color:transparent !important;
}

#logo{
	display:block;
	width:230px;
	margin:auto;
	margin-top:0%;
	margin-bottom:10px;
	padding:0
}
#profil{
	display:none;
}
#profil-desctop{
	display:block;
	margin:auto;
	margin-bottom:5%;
	width:100%;
}

/*--- NAV ---*/

#credits{
	clear:both;
	text-align:center;
	padding :5px 0;
	color:#666;
	font-size: 0.825em !important;
}

#contact,
#credits,
#telecharger-cv{
	display:inline-block !important;
	font-size: 1em;
}

#mentions_legales{
	display:inline-block !important;
	font-size: 0.75em !important;
	color:#666;
}

nav {  
	display:block;
	width:100%;
	clear:both;
	text-align:center;
	margin-bottom:0;
	background-color:transparent !important;
	padding:0; 
	line-height : 1em; 
}

#btn_nav{
	display:none;
}

nav ul li{
	margin:auto;
	padding:0;
	list-style:none;
	font-size:1.4em !important;
	line-height:1.2em;
	color:#000;
	display:block !important;
}
 
.lien_menu_on { 
	color:#000000;
	padding : 2px 0 3px 0;
	margin:2px 0;
	text-decoration : none; 
	-webkit-border-radius: 15px;
	border-radius: 15px;
	background-color:transparent;
	display:inline-block !important;
} 

.lien_menu_on:hover {
	color:#000;
	margin:2px 0;
	background-color:#D9ECEB;
	padding : 2px 15px 3px 15px; 
	text-decoration : none;
	-webkit-border-radius: 15px;
	border-radius: 15px;

}

.lien_menu_off { 
	color:#000 !important;
	background-color:#FFF100 !important;
	margin:2px 0;
	padding : 2px 15px 3px 15px;
	text-decoration : none;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	display:inline-block !important;
}

#telecharger-cv{
	padding : 2px 20px 3px 0;
	background-image:url(../img/picto_download.png);
	background-repeat:no-repeat;
	background-size:11px 11px !important;
	background-position:120px;
	display:inline-block !important;
}

#telecharger-cv:hover{
	background-position:115px;
	background-size:11px 11px !important;
	padding : 2px 35px 3px 15px;
	background-position:135px;
	display:inline-block !important;
}

/*--- PAGE ---*/

#profil_mobile{
	display:none;
	margin-bottom:0;
}

#page h1{
	font-size : 3.5em;
	background-color:transparent;
	color : #000;
	line-height:1em;
	clear:both;
	padding:0;
	margin:0 0 3% 0;
	font-weight:normal;
	text-align:left;
}

#page article h2{
	font-size:1.5em;
	letter-spacing:0.05em;
}

#list_experiences h2{
	font-size:1.5em;
	letter-spacing:0.1em;
}

.look_at a{
	padding: 1px 10px 1px 10px; 
	color : #000;
	background-color:#B2D9D8;
}

.look_at a:hover{	
	background-color:#000;
	color : #ffffff;	
}

#link_portfolio-web,
#link_portfolio-print,
#link_portfolio-illustration,
#link_portfolio-cv{
	/* width:32.33%; */
	width:48%;
	margin-right: 2%;
	margin-bottom: 2%;
}

#gallery_exp #link_portfolio-web,
#gallery_exp #link_portfolio-print,
#gallery_exp #link_portfolio-illustration,
#gallery_exp #link_portfolio-cv{
	width:24% !important;
	margin-right: 1%;
	margin-bottom: 1%;
}

#link_portfolio-web div,
#link_portfolio-print div,
#link_portfolio-illustration div,
#link_portfolio-cv div{	
	margin-top:30%;
	font-size:0.7em !important;
	line-height:1em !important;
}

/*--- GALLERY / PORTFOLIO ---*/

.img_ref{ 
	width : 32.33%; 
	font-size:0em;
	line-height:normal;
	margin-right: 1%;
	margin-bottom: 1%;
}

/*--- BANNER ---*/

.banner,
.banner_slide{
	display:inline-block;
	min-height:250px;
	margin:10px 0;
	clear:both;
}

.banner_slide img,
.banner img{
	height:250px;
	width: 700px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

/*--- FOOTER ---*/

footer {
	display:none;
}

/*--- FORMULAIRE ---*/

.erreur {
	position:relative;
	clear:both;
	color: #e41b5b;
}

.form label{
	position:relative;
	float:left;
	width:100px;
	margin-top:5px;
	margin-bottom:5px;
}

.box_feild{
	position:relative;
	float:left;
	width:300px;
	margin-top:5px;
	margin-bottom:5px;
}

.box_btn{
	position:relative;
	float:left;
	width:300px;
	margin-left:100px;
	margin-top:5px;
	margin-bottom:5px;
}

.form{
	margin:0px;
	padding:0px;
}

.box_form{
	text-align:left;
}

.feild{
	font-family:"Roboto", Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#666666;
	padding:5px;
	background-color:#efefef;
	border:1px solid #efefef;
}

.form_btn {
	background-color : #333333;
	-webkit-border-radius: 18px;
	border-radius: 18px;
	font-family:"Roboto", Arial, Helvetica, sans-serif;
	font-size:18px;
	color:#ffffff;
	border:0px;
	cursor:pointer;
	padding:5px 10px;
}

.form_btn:hover{
	color:#000;
	background-color:#FFF100;
}

.line{
	width:100%;
	float:left;
	clear:both
}

}

@media screen and (min-width: 940px) and (min-height: 680px) {

header{
	position:fixed !important;
	margin:0;
}

}