/****************** GENERAL ********************/

html {
	height:100%;
	margin:0;
	padding:0;
	font-size:12px;
	font-family:Arial, sans-serif;
	color:#FFF;
}

body {
	height:100%;
	margin:0;
	padding:0;
}

.clearfix {
	margin:0;
	padding:0;
}

.clearfix:after {
	content:".";
	display:block;
	visibility:hidden;
	height:0;
	clear:both;
}

.clearfix { display:inline-block; }
/* Hides from IE5-mac \*/
.clearfix { display:block; }
/* End hide from ie5-mac */

h1#logo {
	position:absolute;
	top:5px;
	right:10px;
	width:131px;
	height:47px;
	margin:0;
	padding:0;
	background:url(../images/zo-logo.png) left top no-repeat;
	text-indent:-10000px;
	z-index:1000;
}

a {
	color:#F6751E;
	text-decoration:none;
}

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

.hilight {
	font-size:12px;
	text-transform:uppercase;
	color:#979292;
}


/****************** LAYOUT ********************/

#table_layout {
	position:relative;
	width:100%;
	height:100%;
	border:none;
}

#table_layout .expanding_header {
	width:100%;
	background:#F6751E url(../images/zo-site-backing6.png) center top repeat-y;
}

#table_layout .header {
	width:100%;
	height:230px;
	max-height:230px;
	min-height:230px;
	background:#F6751E url(../images/zo-site-backing5.png) center bottom no-repeat;
}

#table_layout .content {
	width:100%;
	height:330px;
	max-height:330px;
	min-height:330px;
	background-color:#FFF;
	color:#666;
}

#table_layout .expanding_footer {
	width:100%;
	background-color:#FFF;
}

.wrapper {
	position:relative;
	width:976px;
	height:100%;
	margin:0px auto;
	/*border:#ccc 1px solid;*/
}


/****************** MENU PRINCIPAL ********************/

ul#main_menu {
	position:relative;
	width:240px;
	margin:0;
	padding:0;
	list-style:none;
}

ul#main_menu li.main {
	display:block;
	width:80px;
	margin:10px 0px 10px 160px;
	padding:0;
	overflow:visible;
	/*border:#CCC 1px solid;*/
}

ul#main_menu li a.main {
	display:block;
	width:80px;
	line-height:14px;
	text-indent:-10000px;
	overflow:hidden;
}

ul#main_menu li#menu_item_nous a.main { background:url(../images/zo-menu-nous.png) right no-repeat; }
ul#main_menu li#menu_item_services a.main { background:url(../images/zo-menu-services.png) right no-repeat; }
ul#main_menu li#menu_item_contact a.main { background:url(../images/zo-menu-contact.png) right no-repeat; }
ul#main_menu li#menu_item_creations a.main { background:url(../images/zo-menu-creations.png) right no-repeat; }
ul#main_menu li#menu_item_nous a.main:hover { background:url(../images/zo-menu-nous-hilight.png) right no-repeat; }
ul#main_menu li#menu_item_services a.main:hover { background:url(../images/zo-menu-services-hilight.png) right no-repeat; }
ul#main_menu li#menu_item_contact a.main:hover { background:url(../images/zo-menu-contact-hilight.png) right no-repeat; }
ul#main_menu li#menu_item_creations a.main:hover { background:url(../images/zo-menu-creations-hilight.png) right no-repeat; }

#page_nous ul#main_menu li#menu_item_nous a.main { background:url(../images/zo-menu-nous-hilight.png) right no-repeat; }
#page_services ul#main_menu li#menu_item_services a.main { background:url(../images/zo-menu-services-hilight.png) right no-repeat; }
#page_contact ul#main_menu li#menu_item_contact a.main { background:url(../images/zo-menu-contact-hilight.png) right no-repeat; }
#page_creations ul#main_menu li#menu_item_creations a.main { background:url(../images/zo-menu-creations-hilight.png) right no-repeat; }


/****************** SOUS-MENU CREATIONS ********************/

#submenu_creations_div {
	position:absolute;
	display:none;
	visibility:visible;
	margin-top:-15px;
	margin-left:105px;
	width:650px;
	background-color:transparent;
	overflow:hidden;
}

#submenu_creations_div ul#submenu_creations {
	position:relative;
	margin:0;
	padding:0 0 0 10px;
	list-style:none;
	width:625px;
}
	
#submenu_creations_div ul#submenu_creations li {
	position:relative;
	display:inline;
	margin:0px;
	padding:0px 0px 0px 0;
	color:#FFF;
}

span.menu_item_separator {
	display:inline-block;
	width:16px;
	height:12px;
	line-height:12px;
	background:url(../images/zo-menu-separator.png) right bottom no-repeat;
}

#submenu_creations_div ul#submenu_creations li a.sub {
	line-height:18px;
	font-size:10px;
	color:#FFF;
	text-transform:uppercase;
	text-decoration:none;
}

#submenu_creations_div ul#submenu_creations li a.sub:hover {
	color:#892807;
	text-decoration:none;
}

#submenu_creations_div ul#submenu_creations li a.hilight {
	font-size:10px;
	font-weight:bold;
	color:#892807;
}

#submenu_creations_div ul#submenu_creations li a.hilight:hover {
	color:#FFF;
	text-decoration:none;
}

/****************** PAGES NOUS, SERVICES ET CONTACT ********************/

#page_nous #content_left_pane, #page_services #content_left_pane, #page_contact #content_left_pane {
	position:relative;
	width:682px;
	padding:17px;
	margin:0 0 0 260px;
}

#page_nous #content_left_pane p, #page_services #content_left_pane p, #page_contact #content_left_pane p {
	margin:20px 0;
	padding:0;
	color:#979292;
	font-family:Helvetica, Arial, sans-serif;
	font-weight:normal;
	font-size:15px;
	line-height:20px;
}

#page_nous #content_left_pane .text_hilight, #page_services #content_left_pane .text_hilight, #page_contact #content_left_pane .text_hilight {
	color:#4b4848;
}

#page_nous #content_left_pane ul, #page_services #content_left_pane ul, #page_contact #content_left_pane ul {
	margin:20px 0;
	padding:0;
	list-style:none;
}

#page_nous #content_left_pane ul li, #page_services #content_left_pane ul li, #page_contact #content_left_pane ul li {
	line-height:20px;
	color:#979292;
}

/********** PAGES DE LA SECTION CREATIONS ***********/

#page_creations #content_left_pane {
	width:242px;
	height:290px;
	padding:15px 17px 0px 0px;
	margin:0;
}

h2 {
	display:none;
	margin:0;
	padding:0;
	line-height:0;
	text-indent:-10000px;
}

#content_left_pane h4 {
	display:block;
	width:100%;
	margin:0 0 15px 0;
	padding:0;
	text-align:right;
	font-family:Helvetica, Arial, sans-serif;
	font-size:17px;
	font-weight:normal;
	color:#bebbba;
	text-transform:uppercase;
}

/* Menu projets */

#projects_menu_container {
	position:relative;
	float:right;
	width:auto;
	padding:20px 0;
	background:url(../images/zo-creation-text-separator.png) right top no-repeat;
}

#projects_menu_container h5 {
	display:block;
	float:left;
	margin:0px 0px 10px 0px;
	padding:0;
	text-align:right;
	font-family:Helvetica, Arial, sans-serif;
	font-size:11px;
	font-weight:bold;
	text-transform:uppercase;
	color:#979292;
}

ul#projects_menu {
	float:right;
	margin:0;
	padding:0;
	list-style:none;
}

ul#projects_menu li {
	display:block;
	float:left;
	width:15px;
	height:12px;
	margin:0 3px;
	font-size:10px;
	font-weight:bold;
	color:#FFF;
	text-align:center;
}

ul#projects_menu li a {
	display:block;
	width:15px;
	height:12px;
	background-color:#CCC;
	line-height:12px;
	color:#FFF;
	text-decoration:none;
}

ul#projects_menu li a:hover {
	background-color:#979292;
	color:#FFF;
	text-decoration:none;
}

ul#projects_menu li a.active {
	background-color:#F6751E;
}

ul#projects_menu li span {
	position:absolute;
	display:none;
	width:200px;
	top:35px;
	right:0;
	padding:0 5px 15px 0;
	line-height:16px;
	font-size:11px;
	font-weight:normal;
	color:#bebbba;
	text-align:right;
	text-transform:uppercase;
	z-index:2000;
}

/* Bloc projet */

.project_container {
	display:none;
	padding-top:5px;
}

.project_container.active {
	display:block;
}

.project_container h6 {
	display:none;
}

.project_container p.description {
	width:100%;
	margin:0 0px 50px 0px;
	padding:20px 0 0 0;
	background:url(../images/zo-creation-text-separator.png) right top no-repeat;
	text-align:right;
	line-height:14px;
	font-family:Helvetica, Arial, sans-serif;
	font-size:12px;
	color:#979292;
}

p.specification {
	position:relative;
	margin:0 0 5px 0;
	padding:0;
	text-align:right;
	line-height:14px;
	font-family:Helvetica, Arial, sans-serif;
	font-size:12px;
	/*color:#bfbbbb;*/
	color:#979292;
}

.project_container p.specification a {
	color:#F6751E;
	text-decoration:none;
}

.project_container p.specification a:hover {
	color:#872300;
	text-decoration:none;
}

/* Photos des projets */

.project_container .picture_navigation {
	position:absolute;
	right:20px;
	top:18px;
	width:38px;
	height:11px;
	z-index:2000;
}

.project_container .picture_navigation a {
	display:block;
	width:11px;
	height:13px;
	padding:0 4px;
	margin:0;
	text-indent:-10000px;
	overflow:hidden;
}

.project_container .picture_navigation a.arrowPrevious {
	float:left;
	background:url(../images/zo-slideview-nav-arrow-left.png) top center no-repeat;
}

.project_container .picture_navigation a.arrowNext {
	background:url(../images/zo-slideview-nav-arrow-right.png) top center no-repeat;
}

.project_container .picture_mask {
	position:absolute;
	right:70px;
	top:18px;
	width:120px;
	height:330px;
	background:url(../images/zo-slideview-mask.png) repeat-y;
	z-index:3000;
}

.project_container .picture_wrapper {
	position:absolute;
	right:70px;
	top:18px;
	width:630px;
	height:300px;
	z-index:1000;
}

#picture_wrapper1, #picture_wrapper2, #picture_wrapper3, #picture_wrapper4, #picture_wrapper5 {
	position:relative;
	width:630px;
	height:300px;
	overflow:hidden;
}

.project_container ul.picture_container {
	position:relative;
	margin:0;
	padding:0;
	width:6000px;
	height:300px;
	list-style:none;
}

.project_container ul.picture_container li {
	float:left;
	display:inline;
	padding:0 20px 0 0;
	margin:0;
}


.project_container ul.picture_container li a {
	outline:none;
}

.project_container ul.picture_container.logotypes li {
	padding:0 0 0 175px;
}

.project_container ul.picture_container.logotypes li:first-child {
	padding:0 0 0 150px;
}