/* --------------------------------------------------------
    Main stylesheet
    Site: Everell
    Created by: Stéphanie Léveillé - stef@annotea.com
    Filename: main.css
   -------------------------------------------------------- */

/* --------------------------------------------------------
    COLORS
    Grey: 				#646466
    orange: 			#f6a800
   -------------------------------------------------------- */

@import url(reset.css);


/********** commun *********/

html { height: 100%; }

body {
	background: #fff;
	color: #646466 ;
	font-family: "Century Gothic", Arial, Verdana, sans-serif;
	font-size: 14px;
	height: 100%;
	position: relative;
}

#container { background: #fff; height: 100%; margin: 0 auto;width: 1200px;position: relative; }

p,ul,ol,table { margin-bottom: 1em; line-height: 16px; }
sup { font-size: 65%; line-height: 1; vertical-align: super; }
small { font-size: 90%; }

ul { margin-left: 20px; }
a { cursor: pointer; color: #646466; text-decoration:none; }
a:focus {  }
a:visited { }
a:hover, a:focus { color: #f6a800; text-decoration: underline; }
a *, button * { cursor: pointer; }
hr { display: none; }

.orange { color: #f6a800; }

#mainContent .texte h1 {
	border-bottom: 2px solid #f6a800;
	color: #f6a800;
	font-size: 18px;
	font-weight: normal;
	padding-bottom: 3px;
	width: 400px;
	/*margin-bottom: 85px;*/
}

#mainContent .texte h2 { font-size: 120%; margin-bottom: 20px;}

input, select, button, textarea, option { font-family: Arial, Verdana, sans-serif; font-size: 100%; }
button, label, select, option, input[type=submit] { cursor: pointer; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-block;}
/* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */



/*************** texte *****************/
#mainContent { 
	height: 682px;
	width: 1200px;
}

#mainContent .texte{
	margin: 0 0 0 550px;
	padding-top: 150px;
	overflow: hidden;
	/*width: 380px;*/
}

#mainContent .texte p { line-height: 18px;}

/*************** back *******************/
.bodyProfil #mainContent { background: url(../img/backProfil.jpg) 120px 230px no-repeat;  }
.bodyPortfolio2 #mainContent { background: url(../img/backPortfolio.jpg) 275px 57px no-repeat;  }
.bodyPortfolio2.en #mainContent { background: url(../img/backPortfolioEN.jpg) 275px 57px no-repeat;  }
.bodyContact #mainContent { background: url(../img/backContact.jpg) bottom center no-repeat; }


/************** images *****************/
.pics { height: 618px; width: 1197px; padding:0; margin:0; position:relative; top:28px; overflow: hidden;text-align:center; }
.pics img { /*height: 655px; width: 1265px;  top:0; left:0;*/ }

.pics .video { position:relative; z-index: 300 !important; display:none; left: 156px !important; top: 30px !important;}

.navImg { position: absolute; top: 606px; left: 562px;z-index: 10002;}
.navImg2 { position: absolute; top: 606px; left: 562px;z-index: 10001;}

.navImg1 { position: absolute; top: 227px; left: 582px;z-index: 10002;}
.navImg21 { position: absolute; top: 227px; left: 582px;z-index: 10001;}


/*.bodyPortfolio .navImg, .bodyPortfolio .navImg2 { top: 615px;}*/

.navImg a, .navImg2 span, .navImg1 a, .navImg21 span { float: left; display:block; text-indent: -9999px; height: 37px; background-position: left top; }

.navImg span,.navImg1 span {float: left; display:block; width:50px; height: 37px;}

#prev1, #prev { background: url(../img/prev.png) no-repeat; width: 50px; }
#next1, #next { background: url(../img/next.png) no-repeat; width: 47px; }

#prev, #next { background-position: left bottom; }
.bande,.bande2 {
	top:652px;
	opacity:0.5;
	width: 1200px; 
	height: 30px;
	background: #fff;
	position: absolute;
	z-index: 10000;
}
.bande2 { top:190px;}
.bandeTxt,.bandeTxt2 {
	color: #fe7108;
	top:652px;
	width: 1169px; 
	line-height: 30px;
	height: 30px;
	padding-left: 90px;
	position: absolute;
	z-index: 10001;
}
.bandeTxt2 { top: 190px;}

.bandeTxt a, .bandeTxt2 a { text-decoration: none; }
.bandeTxt a.actif,.bandeTxt2 a.actif { color: #fe7108 !important; }

/***** emploi dispo *******/
#emploiDispo {
	background: url(../img/emploiDispo.jpg) left top no-repeat;
	margin-top: 30px;
	min-height: 120px;
	line-height: 1.1em;
	padding: 17px 0 0 120px;
}
#emploiDispo a { color:#f6a800; text-decoration: none; }
#emploiDispo a:hover { text-decoration: underline; }

.mask { background: url(../img/mask.png) no-repeat; height:630px;width:1200px;overflow:hidden;position:absolute;z-index:100;top:28px;}

/*************** header *****************/
#header {
	width:1261px;
	position:fixed;
	z-index:1000;
	height:63px;
	overflow:hidden;
}

#header div {
	background:url(../img/menuFr.png) no-repeat;
	width:674px;
	height:63px;
	position:absolute;
	left:306px;
}

body.en #header div { background:url(../img/menuEn.png) no-repeat; }

#header ul.nav { margin-left: 245px; }
body.en #header ul.nav { margin-left: 242px; }

#header ul.nav li {
	display: inline;
	float: left;
	height: 40px;
	margin-right: 10px;
	
}

#header ul.nav li a {
	display: block;
	float: left;
	height: 40px;
	width: 55px;
	text-indent: -9999em;
}
#header ul.nav li.mMaking a {width:  120px; }
body.en #header ul.nav li.mMaking a {width:  85px; }
#header ul.nav li.mPortfolio a { width: 55px; }
body.en #header ul.nav li.mPortfolio a { width: 65px; }
#header ul.nav li.mContact a { width: 50px; margin-right: 42px;}
body.en #header ul.nav li.mContact a { width: 65px; margin-right: 60px;}
#header ul.nav li.mLangue a { width: 50px;}

/*************** footer *****************/

#footer {
	/*background: #fea407;*/
}

#intFooter {
	background: url(../img/backFooter.png) no-repeat;
	height: 190px;
	position: relative;
	width: 1261px;
}

.en #intFooter {background: url(../img/backFooterEn.png) no-repeat;}

#footer a { text-indent: -9999px; }

#footer h1 a, #footer h2 a {
	display: block;
	height: 100px;
	left: 80px;
	position: absolute;
	top:0px;
	width: 180px;
}

#footer h2 a {
	height: 80px;
	left: 864px;
	width: 250px;
}

#footer ul.nav{
	list-style: none;
	position: absolute;
	margin: 0;
	left: 289px;
	top: 30px;
	width: 410px;

}

.en #footer ul.nav {width: 800px;}

#footer ul.nav li {
	display: inline;
	float: left;
	height: 40px;
	margin-right: 10px;
	
}
#footer ul.nav li a {
	display: block;
	float: left;
	height: 40px;
	width: 50px;
}
.en #footer ul.nav li a {width: 90px;}

#footer ul.nav li.mPortfolio a { width: 60px; }
#footer ul.nav li.mContact a { width: 80px; margin-right: 45px;}
.en #footer ul.nav li.mPortfolio a { width: 100px; }
.en #footer ul.nav li.mContact a { width: 100px; margin-right:0;}

#imageLoaderSplashArea
{
	width: 1200px;
	padding: 5px;
	margin: auto;
	text-align: center
}

#imageLoaderSplashArea .splashScreenImage
{
	
	width: 300px; margin: 280px auto 0;
}