@charset "UTF-8";

html{
	margin:0;
	padding:0;
}

li{font-size:10px}

body {
	font-family:Tahoma, Geneva, sans-serif;
	font-size:10px;
	background-color:#000;
	color:#8c9496;
	letter-spacing:2px;
/*	padding:0;
	margin:0;*/
	overflow-y:scroll;
}
div {
	display:block;
}

a:hover {
	/*color: #8c9496;*/
}

.rounded {
	background:#1c292c;
	padding:5px;
	letter-spacing:0px;
	text-transform:uppercase;
}

#oc_dock{
	height:33px;	
}

.cleared
{
  float: none;
  clear: both;
  margin: 0;
  padding: 0;
  border: none;
  font-size: 1px;
}

#oc_general {
	width:1250px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
	background-image:url(../images/bot2.jpg);
	background-repeat:no-repeat;
	padding-bottom:152px;
	background-position:left bottom;
}
#oc_header {
	background:url('../images/background.jpg');
	background-repeat:no-repeat;
	background-position:center bottom;
	position:relative;
	z-index:2;
	height:589px;
	overflow:hidden;
}
#oc_header #cadre{width:1250px; height:589px; background:url('../images/bg-menu.png') no-repeat; position:absolute; bottom:0; left:0; z-index:3}

/****** Parallax ******/
#oc_header ul#parallax{padding:0; margin:0; list-style-type:none;}
#oc_header #layer1{height:831px; width:1490px; background:url('../images/stars1.png') no-repeat;}
#oc_header #layer2{height:831px; width:1490px; background:url('../images/stars2.png') no-repeat;}
#oc_header #layer3{height:831px; width:1490px; background:url('../images/stars3.png') no-repeat;}
#oc_header #layer4{height:831px; width:1490px; background:url('../images/stars4.png') no-repeat;}

ul.lavaLamp li a {
	display:block;
	z-index:10;
}
#oc_header .masque {
	background-image:url(../images/degrad_top.png);
	background-repeat:repeat-x;
	height:562px;
}

#oc_portfolio li {
	float: left;
	padding: 0 4px;
	list-style:none;
}
#oc_portfolio a {
	display: block;
	text-decoration: none;
	cursor:pointer;
}

#oc_portfolio span{
	display:none;
}

#oc_portfolio{ position:relative;width:1250px;overflow: hidden  !important ;}


/* menu portfolio */
#oc_portfolio ul.menu {
	overflow:auto;
	text-transform:uppercase;
	list-style:none;
	float:right;
	margin-right:113px;
}
#oc_portfolio ul.menu li {
	float:left;
	position:relative;
    z-index:5;
	margin-right:15px;
	padding:5px;
}
#oc_portfolio ul.menu li a{
	color:#fff;
	cursor:pointer;
}
#oc_portfolio ul.menu li span{
	position: relative;
	z-index: 5;	
}
#oc_portfolio ul.menu li.backLava{
	position:absolute;
	z-index:3;
	background:url(../images/bg-boutref_03.gif) top left;
	background-repeat:repeat-x;
	-webkit-border-radius: 5px; 
	-moz-border-radius: 5px;  
	border-radius: 5px;
}
/* fin menu portfolio */



/* Menu header */
#oc_header ul.menu {
	left:355px;
	color:#fff;
	text-transform:uppercase;
	list-style:none;
	position:absolute;
	z-index:15;
}
#oc_header ul.menu li {
	float:left;
	position:relative;
    z-index:5;
	margin-right:15px;
}
#oc_header ul.menu li a{
	padding:8px; 
	cursor:pointer;
}
#oc_header ul.menu li span{
	display:none;	
}
#oc_header ul.menu li.backLava {
    background-color:#fff;
	opacity : 0.1;
    -moz-opacity : 0.1;
    -ms-filter: "alpha(opacity=10)"; 
    filter : alpha(opacity=10); 
}
/* fin menu header */



#oc_main{background:url(../images/bg-content.jpg) repeat-x left top;}

.content {
	width:1086px;
	margin:0 auto;
	padding-top:25px;
	padding-bottom:25px;
}
#oc_whois .left, #oc_contact .left {
	width:222px;
	position:relative;
	margin-right:60px;
	float:left;
}
#oc_whois .left {
	text-align:right
}
#oc_whois .left .exergue h4,  #oc_contact .left .exergue h4 {
	font-size:12px;
	color:#fff;
	font-weight:normal;
	margin:0;
}
#oc_whois .left .rounded {
	background-image:url(../images/flech_blocG.png);
	background-repeat:no-repeat;
	background-position:8px 8px;
	height:100px;
	padding-top:30px;
	width:160px;
	margin-top:45px;
	line-height:16px
}
#oc_whois .left #oc_resume {
	float:right
}
#oc_whois .right {
	width:235px;
	float:right;
	margin-left:25px;
}
#oc_whois .right .rounded {
	margin-bottom:45px;
}
#oc_whois .right .rounded table{
	margin-left:10px;
}
#oc_whois .right .rounded h3 {
	font-size:12px;
	letter-spacing:2px;
	margin:0;
}
#oc_whois .right .rounded td {
	vertical-align:top;
}
#oc_whois .right .rounded ul {
	text-transform:uppercase;
	padding-left:25px;
	margin:0;
	list-style: none;
	line-height:12px;
}
#oc_whois .middle {
	float:left;
	width:500px;
}
.middle H2 {
	padding:0px;
	margin:0px;
	font-size:12px;
	color:#fff;
	margin-top:10px
}
#oc_whois .middle .rounded {
	text-align:center;
	padding-top:7px;
	margin-top:10px
}
#oc_footer {
	color:#343434;
	clear:left;
	text-align:center;
	height:14px;
	line-height:14px;
	font-size:10px;
	width:100%;
	margin:5px 0 0;
}

.link {
	cursor:pointer
}
#oc_general .right .big.link {
	background-image:url(../images/fond_contactez.png);
	background-repeat: no-repeat;
	width:260px;
	height:21px;
	padding-left:10px;
	line-height:21px;
	vertical-align:middle;
	margin-bottom:5px
}
.toprounded {
	background:url(../images/vignette.png) no-repeat;
	padding:10px 8px 8px;
	letter-spacing:0px;
	text-transform:uppercase;
}
.toprounded h4{
	font-size:12px; font-weight:normal; letter-spacing:2px;margin-bottom:8px; color:#fff;height:15px;overflow:hidden;width:231px
}

 @font-face {
 font-family: 'PlanetEstyleRegular';
 src: url('http://www.ocebo.fr/ocebo2010/planet.eot');
 src: local('http://www.ocebo.fr/ocebo2010/'), url('http://www.ocebo.fr/ocebo2010/planet.woff') format('woff'), url('http://www.ocebo.fr/ocebo2010/planet.ttf') format('truetype'), url('http://www.ocebo.fr/ocebo2010/planet.svg#oc_l4AjGFgJ') format('svg');
 font-weight:normal;
}
strong.PlanetEstyle {
	font-weight: normal;
	font-style: normal;
	line-height:normal;
	font-family: 'PlanetEstyleRegular', sans-serif;
	color:#576e75;
	font-size:24px;
	margin-bottom:5px;
	display:block;
	letter-spacing:3px
}
#oc_dock img {
	margin-left:4px;
	margin-right:5px;
	float:left;
}

#oc_dock span{
	display:inline-block;	
}

ul#mycarousel {
  /* Set it so we could calculate the offsetLeft */
  position: relative;
  /* Add scroll-bars */
  overflow: hidden !important;
  float:left;
  height:165px;
  width:1500px; 
  margin:0;
  margin-left:0;
}

#mycarousel_div{clear:left;width:1017px ;overflow:hidden !important;margin:0px auto 0;padding-top:60px;height:165px;display:block}
#oc_portfolio .btn{margin-top:-165px;height:165px;width:82px;}
#oc_portfolio #btn_right{float:right; margin-right:10px;}
#oc_portfolio #btn_left{float:left; margin-left:43px;}

.jcarousel-clip{
	height:165px !important;
	margin-top:60px;
	width:1022px;
}

#oc_contact h1{
	background:url(../images/titre_contact.png) no-repeat; 
	width:120px;
	height:25px;
}

#oc_contact .error_div{
	color:#fff;
	height:16px;
	line-height:16px;
	margin:0 0px 5px 0;
	padding:0 5px 2px;
}

#oc_contact .error_div b{
	background:none;
	color:#C00;
	font-weight:normal;
}

#oc_contact .middle{
	float:left;	
	position:relative;
	width:272px;
}

#oc_contact .right{
	float:right;
	width:380px;
	margin-right: 80px;
}

#oc_contact .contacts{
	background:url(../images/emailer.png) no-repeat;
	width:350px;
	height:21px;
	padding:0 0 0 30px;
	margin:0 0 4px;
	line-height:21px;
}

#oc_contact a{color:#8C9496;text-decoration:none}
#oc_contact .input {font-family:Arial, Helvetica, sans-serif;font-size:11px;color:#000;}

#oc_contact .right .rounded table{
	width:100%;	
}

#oc_contact .right .rounded table td{
	width:50%;	
}

#oc_contact .right .rounded ul{
	margin:7px 0 0 22px;	
}

#oc_contact .right .rounded ul li{
	text-transform:none;	
}

#oc_contact .right .rounded h4{
	font-family:Tahoma, Geneva, sans-serif;
	font-size:12px;
	text-transform:uppercase;
}

#oc_contact .right .rounded{
	margin:0 0 28px 0;	
}

.exergue{
	text-align:right;	
}

#oc_contact .middle input,#oc_contact .middle textarea{
	width:270px;	
	margin-bottom:5px;
	padding:0 3px;
}

#oc_contact .middle select{
	width:270px;
	padding:0;
	font-size:11px;
	font-family:arial;
	margin:0 0 5px;
	letter-spacing:0;
}

#oc_contact .middle textarea{
	height:100px;	
}

#oc_contact .middle .boutons{
	background:transparent url(../images/btn_contact.png) no-repeat scroll 0 0;
	height:23px;
	line-height:20px;
	padding:0 22px;
	letter-spacing:0;
	font-family:Arial, Helvetica, sans-serif;
}

#oc_contact .middle .boutons #send{
	margin-left:133px;	
}

#oc_contact .middle .btn{
	width:auto;
	background:none;
	font-family:Tahoma, Geneva, sans-serif;
	color:#fff;
	cursor:pointer;
	border:0;
	padding:0;
	margin:0;
	font-size:11px;
}

#oc_contact .contacts strong{
	color:#fff;
	text-transform:uppercase
}

.tip{
	display:none;
	position:absolute;
	z-index:500;
	margin-top:-23px;
	text-align:center;
	width:auto;
	padding:2px 4px;
	overflow: hidden;
	color: #fff;
	background:#18a5ff;
	font-size:10px;
	margin-left:4px;
}

.jcarousel-container{
	display:block;
	overflow:hidden;
	position:relative;
	height:231px;
	width:1022px;
	margin:0 auto;
}

.carousel-wrap{width:1020px;height:165px;}

.scroll_left, .scroll_right{ display:block; position:relative; z-index:8; margin-top:83px; cursor:pointer}
.scroll_left{ margin-left:0px; background:url(../images/scroll_left.gif) no-repeat;width:48px; height:40px}
.scroll_right{ margin-right:0px; background:url(../images/scroll_right.gif) no-repeat;width:48px; height:40px}
.scroll_left:hover{background:url(../images/scroll_left_hover.gif) no-repeat;width:60px;margin-left:-12px;}
.scroll_right:hover{background:url(../images/scroll_right_hover.gif) no-repeat;width:60px;}

#oc_extranet, #oc_ecommerce, #oc_bannieres, #oc_jeux, #oc_print, #oc_agences{ display:none}

.img_link{cursor:pointer;text-decoration:none;display:block;width:231px;height:124px;overflow:hidden}
.img_link img{border:0 none;margin:0 0 0 0;width:231px;float:left}
.img_link .desc{color:#fff;text-decoration:none;margin-top:-193px;padding:198px 5px 5px;width:221px;height:117px;background:url(../images/fond_desc.gif) no-repeat 0 193px;float:left;display:block;}
.desc a{color:#fff;text-decoration:none;}

.illustration_contact{ position:absolute; z-index:50; padding-top:74px;  display:block; padding-left:80px; display:none}
.illustration_portfolio{ position:absolute; z-index:50; top:71px; left:115px; display:none}
.illustration_whois{ position:absolute; z-index:50; top:10px;  display:block; left:115px; display:none;}

.flash_close{display:block;background:url(../images/close.gif) no-repeat;color:#000000;font-weight:bold;width:15px;height:15px;margin:-25px -20px 0 0px;float:right;z-index:501;cursor:pointer}
.total_flash{display:none;z-index:100;position:absolute;width:100%;text-align:center}
#flash{background:#fff;z-index:400;padding-top:37px;padding-left:30px;padding-right:30px;padding-bottom:18px}
#flash .interieur{overflow:hidden;border:1px solid #aaa;width:300px;height:250px;display:block}

.total_img{display:none;z-index:100;position:absolute;width:100%;text-align:center}
.zoom_close{display:block;background:url(../images/close.gif) no-repeat;color:#000000;font-weight:bold;width:15px;height:15px;margin:-27px -20px 0 0px;float:right;text-align:center;cursor:pointer}
#zoom{width:692px;background:#fff;padding:37px 30px 18px;text-align:center}
#zoom .visuel{width:692px;overflow:hidden;}
#zoom .visuel img{width:690px;border:1px solid #aaa} 
#zoom .visuel span{float:left;width:692px;margin-top:5px}
#zoom .visuel span a{background:#1387D4 none repeat scroll 0 0;color:#FFFFFF;display:inline-block;margin:2px 0 0;padding:2px 5px;text-decoration:none;}

.fond_noir{cursor:pointer;position:absolute;background:url(../images/overlay.png) repeat;width:100%;height:100%;display:none;z-index:100;text-align:center;}
.loading{float:left;opacity:0.4;width:232px;background:url(../images/ajax-loader.gif) no-repeat center center;height:124px;display:block;}
.total_img .tour_blanc{width:752px !important;}
.tour_blanc{padding:10px;background:url(../images/tour_blanc.png) repeat;margin:0px auto 0;}
.cache{background:#000;width:1250px;height:100%;position:absolute;z-index:520;text-align:center;}
.cache div{margin:0 auto;}
.cache .logo{margin:280px auto 0px;background:url(../images/logo.png) no-repeat center center;width:188px;height:89px;}
.cache .loading{float:none;display:block !important;margin-top:-40px}

#logo h1 a{background:url('../images/logo2.png') no-repeat; height:59px; width:191px; display:block; text-indent:-9999px; bottom:36px; left:361px; position:absolute; z-index:100; cursor:pointer }

/******** Preloader ********/
.QOverlay {
	background-color: #000000;
	z-index: 9999;
}

.QLoader {
	background-color: #a0b8c3;
	height: 1px;
}

.QAmt {
	color:#8c8c8c;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:30px;
	line-height:50px;
	height:50px;
	width:100px;
	margin:-45px 0 0 -50px;
}

.loading {
	visibility:hidden;
}

/******* Références ********/
#oc_references{
	padding: 18px 0 8px;
	letter-spacing:0;
	font-size:0;
	width:1226px;
	height:204px;
}
.jTscroller img{
	opacity:0.3;
	-moz-opacity : 0.3;
    -ms-filter: "alpha(opacity=30)"; /* IE 8 */
    filter : alpha(opacity=30); /* IE < 8 */ 
}

.jTscroller{top:18px; position:absolute}
.jTscroller li{margin-right:9px; margin-bottom:9px; font-size:0; float:left;}
.jTscroller li.noMargin{margin-right:0;}
