/*----------------------------
	WebCMS �2009 by Olivier Toscano
	contact	:	olivier.toscano@webcms.lu
	url		:	webcms.lu
	society	:	WebCMS S.�.r.l.
------------------------------*/
@import "ui-lightness/jquery-ui-1.7.2.custom.css";
@import "jquery.lightbox-0.5.css";
@import "jquery.autocomplete.css";

body {
	text-align:center;
	font:12px Arial; color: #333;
	margin:0; padding:0;
	background:transparent url(../layout/header_bg.jpg) repeat-x 0 0;
	}

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

/*-----Class------*/
.msgok { color: green; border: 1px solid #d8d8d8; background-color: #ffffcc; padding: 2px; }
.msgnok { color: red; border: 1px solid #d8d8d8; background-color: #ffffcc; padding: 2px; }
.cb { clear: both; }

div#bg {/* position:fixed; display:block; width:100%; height:350px; background:transparent url(../layout/header_bg.jpg) repeat-x 0 0; */ }

/* wraper */
div#wraper{ text-align:left; margin:0 auto; width:1000px; }

/* header */
div#wraperHeader { position:relative; z-index:10; /* width:100%; height:370px;  background:transparent url(../layout/header_bg.jpg) repeat-x 0 0; */}
	div#wraperHeader div#header{ display:block; width:100%; height:110px; padding:10px 0;}
	div#wraperHeader div#header div#logo a { margin-left:10px; float:left; display:block; width:240px; height:90px; border:1px solid #ffea01; background:transparent url(../layout/logo.jpg) no-repeat 0 0; }
	div#wraperHeader div#header div#pubHeader { margin-left:10px; float:left; display:block; width:727px; height:90px; border:1px solid #ffea01; /* background:transparent url(../layout/pubHeader.jpg) no-repeat 0 0;*/ }
		div#wraperHeader div#header div#pubHeader p { margin:0; padding:0; }

	div#wraperHeader div#pageTitle { margin-left:200px; font-weight:bold; display:block; width:785px; min-height:40px; }

	div#wraperHeader div#wrapperNavigation { position:relative; margin:10px 0 10px 200px; padding:4px 4px 4px 20px; width:760px; height:80px; border:0px solid #333; overflow:hidden; }
	div#wraperHeader div#wrapperNavigation div#navigation { display:block; width:800px; height:59px; background:transparent url(../layout/nav_bg.png) repeat-x 0 0; }
	div#wraperHeader div#wrapperNavigation div#navigation ul li { position:relative; display:block; width:160px; height:59px; margin-right:10px; background:transparent url(../layout/nav_bg_sep.png) no-repeat top right; }
		div#wraperHeader div#wrapperNavigation div#navigation ul li a { font-weight:bold; text-decoration:none; color:#333; font-size:.8em; }
		div#wraperHeader div#wrapperNavigation div#navigation ul li a span.img img { border:none; padding-top:4px; }
		div#wraperHeader div#wrapperNavigation div#navigation ul li a span.title { cursor:pointer; position:absolute; top:30px; left:60px; }
		div#wraperHeader div#wrapperNavigation div#navigation ul li a:hover span.title { font-weight:bold; border-bottom:5px solid #666; }

	div#wraperHeader div#wrapperNavigation div#navigationLeftItem { position:absolute; top:4px; left:4px; display:block; width:16px; height:59px; background:transparent url(../layout/nav_bg_left.png) no-repeat 0 0; }
	div#wraperHeader div#wrapperNavigation div#navigationLegendTop { position:absolute; top:0; right:0; display:block; width:340px; height:5px; background:transparent url(../layout/nav_bg_legend_top.png) no-repeat 0 0; }
	div#wraperHeader div#wrapperNavigation div#navigationLegend { text-align:right; position:absolute; bottom:4px; right:0; display:block; width:340px; height:22px; background:transparent url(../layout/nav_bg_legend.png) no-repeat top right; }
		div#wraperHeader div#wrapperNavigation div#navigationLegend p.controls { margin:4px 37px 4px 30px; font-size:.8em; font-weight:bold; color:#000; }
				div#wraperHeader div#wrapperNavigation div#navigationLegend p.controls a { cursor:pointer; }

	div#wrapper_search { position:absolute; bottom:-47px; right:16px; z-index:10; padding:5px; border:1px solid #fe7501; background-color:#eee; }
	div#wrapper_search form input { font-size:11px; border:1px solid #808080; }
	div#wrapper_search form input#rq { width:250px; }

	div#GooglePlusOne { position:absolute; bottom:-47px; right:262px; z-index:10; }

/* footer */
div#footer{ clear:both; position:relative; z-index:1; text-align:center; font-size:.8em; /*margin:10px 0 0 200px;*/ }

div#wrapperContent { position:relative; z-index:1; margin-top:80px; }
pre#infos { background-color:#e3e3e3; color:#333; border:1px solid #333; display:block; width:600px; min-height:100px; margin:0 20px; padding:5px; }

/* blocLeft */
div#blocLeft { position:relative; z-index:2; display:block; width:180px; margin:0 20px 0 0; padding:0; float:left; }
	div#blocLeft h1 { font-size:1.3em; }
	div#blocLeft h2 { font-size:.9em; text-transform:uppercase; padding:15px 4px 0 4px; display:block; width:167px; height:34px; position:absolute; top:-43px; left:-13px; background:transparent url(../layout/bloc_bg_title_rond2.png) no-repeat 0 0; }
	div#blocLeft div.leftCell { position:relative; display:block; width:165px; /*height:140px;*/ padding:4px; margin:10px 0 60px 0; background:transparent url(../layout/bloc_bg.png) repeat-y 0 0; }
	div#blocLeft div.leftCell div.leftCellHeader { display:block; width:173px; height:8px; position:absolute; top:-8px; left:0; background:transparent url(../layout/bloc_bg_header.png) no-repeat top left; }
	div#blocLeft div.leftCell div.leftCellFooter { display:block; width:173px; height:8px; position:absolute; bottom:-8px; left:0; background:transparent url(../layout/bloc_bg_footer.png) no-repeat bottom left; }
	div#blocLeft div.leftCell a { text-decoration:none; }
	/* manufacturer index */
	div#manufacturerIndex { }
	div#manufacturerIndex ul { padding:0 0 0 2px; margin:0; }
	div#manufacturerIndex ul li { float:left; display:block; width:8px; height:12px; padding:5px; margin:1px; text-transform:uppercase; cursor:pointer; font-weight:bold; color:#333; background-color:#fff; }
	div#manufacturerIndex ul li:hover { color:#fff; font-weight:bold; background-color:#333; }
	div#manufacturerIndex ul li:last-child:after { clear: both; }

/* blocRight */
div#blocRight { position:relative; z-index:2; display:block; width:250px; margin:0; padding:0; float:left; }
	div#blocRight h1 { font-size:1.3em; }
	div#blocRight h2 { font-size:1.1em; text-transform:uppercase; padding:0 0 0 20px; display:block; width:172px; height:27px; line-height:27px; position:absolute; z-index:2; top:-29px; left:-12px; background:transparent url(../layout/bloc2_bg_title.png) no-repeat 0 0; }
	div#blocRight div.rightCell { position:relative; display:block; width:239px; /*height:140px;*/ padding:4px; margin:10px 0 60px; background:transparent url(../layout/bloc2_bg.png) repeat-y 0 0; }
	div#blocRight div.rightCell div.rightCellHeader { display:block; width:247px; height:8px; position:absolute; z-index:1; top:-8px; left:0; background:transparent url(../layout/bloc2_bg_header.png) no-repeat top left; }
	div#blocRight div.rightCell div.rightCellFooter { display:block; width:247px; height:8px; position:absolute; z-index:1; bottom:-8px; left:0; background:transparent url(../layout/bloc2_bg_footer.png) no-repeat bottom left; }
	div#blocRight div.rightCell a { text-decoration:none; }
	div#blocRight div.rightPub { position:relative; display:block; width:250px; padding:0; margin:10px 0 60px; }

	div#blocLeft div.script,
	div#blocRight div.script { background:none; padding:0; margin:10px 0 40px 0; }

/* bg content */
div#contentbg { position:relative; z-index:1; display:block; width:720px; margin:0 20px 20px 0; padding:40px 0 0; float:left; background:transparent url(../layout/content_bg.png) repeat-y 40px 0; }
	div#contentbgtop { display:block; width:666px; height:10px; position:absolute; z-index:1; top:-10px; left:40px; background:transparent url(../layout/content_bg_header.png) no-repeat top left; }
	div#contentbgbottom { display:block; width:666px; height:10px; position:absolute; z-index:1; bottom:-10px; left:40px; background:transparent url(../layout/content_bg_footer.png) no-repeat bottom left; }

/* bg blockContent */
div#blockContent { position:relative; z-index:1; display:block; width:720px; margin:0 20px 20px 0; padding:0; float:left; }
div#contentbg2 { position:relative; z-index:1; display:block; width:720px; margin:0; padding:40px 0 0; float:left; background:transparent url(../layout/content_bg_2.png) repeat-y 40px 0; }
	div#contentbg2top { display:block; width:666px; height:10px; position:absolute; top:-10px; left:40px; background:transparent url(../layout/content_bg_2_header.png) no-repeat top left; }
	div#contentbg2bottom { display:block; width:666px; height:10px; position:absolute; z-index:1; bottom:-10px; left:40px; background:transparent url(../layout/content_bg_2_footer.png) no-repeat bottom left; }

	div#guide {  clear:both; float:left; position:relative; z-index:1; display:block; width:502px; margin:100px 0 0 ; padding:4px 4px 4px 200px; background:transparent url(../layout/guide_bg.png) repeat-y 40px 0; }
/*		div#guide h2.guideTitle { position:absolute; top:-50px; left:220px; font-size:1.2em; overflow:hidden; display:block; width:217px; height:29px; padding:6px 20px; background:transparent url(../layout/guide_bg_title.png) no-repeat 0 0; }*/
		div#guide h2.guideTitle { position:absolute; top:-50px; left:220px; font-size:1.2em; overflow:hidden; display:block; width:600px; height:29px; padding:6px 20px; background:transparent url(../layout/guide_bg_title_left.png) no-repeat 0 0; }
		div#guide h2.guideTitle span { padding:6px 20px 6px 0; background:transparent url(../layout/guide_bg_title_right.png) no-repeat 100% 0; }
		div#guideTop { display:block; width:666px; height:10px; position:absolute; z-index:1; top:-10px; left:40px; background:transparent url(../layout/guide_bg_header.png) no-repeat top left; }
		div#guideBottom { display:block; width:666px; height:10px; position:absolute; z-index:1; bottom:-10px; left:40px; background:transparent url(../layout/guide_bg_footer.png) no-repeat bottom left; }

/* content */
div#content { position:relative; z-index:1; display:block; width:500px; margin:0 20px 0 0; padding:0; float:left; }
	div#content h1 { position:absolute; top:-120px; left:0; z-index:2; display:block; width:778px; height:45px; color:#fff; font-size:17px; overflow:hidden; background:transparent url(../layout/manufacturer_title_bg_left.png) no-repeat 0 0; }
	div#content h1 span { line-height:46px; padding:13px 13px 13px 0; margin:0 0 0 12px; background:transparent url(../layout/manufacturer_title_bg_right.png) no-repeat 100% 0; }
	div#content h2 { font-size:1.1em; }
	div#content h3 { font-size:1em; font-weight:bold; }
	div#content img { border:none; }
	/* manufacturers result */
	ul#manufacturersResult { padding:0; margin:0; liste-style-type:none; }
	ul#manufacturersResult li { display:block; padding:4px; margin:5px 0; background-color:#dadada; }
	ul#manufacturersResult li img { width:120px; }

	/* manufacturer */
	div#manufacturer { width:480px; }
	div#manufacturer h2 { width:480px; padding-left:25px; border-bottom:1px solid #9f9f9f; color: #fe7501; background:transparent url(../layout/puce.jpg) no-repeat bottom left; }

	/* hardware category */
	div#category {}
	div#category h2 { position:relative; width:480px; padding:20px 0 0 25px; border-bottom:1px solid #9f9f9f; color: #fe7501; background:transparent url(../layout/puce.jpg) no-repeat bottom left; }
	div#category h2 a { text-decoration:none; color:#333; }
	div#category h2 img { padding-right:20px; border:none; }
	div#category h2 span { position:absolute; bottom:0; left:250px; cursor:pointer; }
	a#toTheGuide { position:absolute; top:-49px; right:20px; z-index:2; display:block; width:195px; height:26px; padding:6px 15px; color:#333; font-weight:bold; text-decoration:none; background:transparent url(../layout/totheguide.png) no-repeat 0 0;  }
	div#category div.hardwareLogo { position:absolute; top:-157px; left:-170px; z-index:1; display:block; width:188px; height:140px; background:transparent url(../layout/peripherique_title_bg.png) no-repeat center right; }
	div#category div.hardwareLogo img { margin-left:30px; }

	/* hardware */
	div#hardware { width:480px; }
	/*div#hardware h1 { top:-130px; }*/
	div#hardware h2 { width:480px; padding-left:25px; border-bottom:1px solid #9f9f9f; color: #fe7501; background:transparent url(../layout/puce.jpg) no-repeat bottom left; }

	/* hardware gallery */
	div.hardwareGallery img { margin:0 10px 10px 0; }

/* contact */
div#pageContact { position:relative; margin:5px 0 0; }
	div#pageContact form fieldset { border:none; }
	div#pageContact form fieldset div { margin:5px 0; }
	div#pageContact form fieldset div label { display:block; width:100px; text-align:right; float:left; padding:2px 5px 2px 0; }
	div#pageContact form fieldset div input { width:185px; border:1px solid #D79403; }
	div#pageContact form fieldset div input#btnSubmit { width:185px; }
	div#pageContact form fieldset div textarea { width:180px; height:100px; border:1px solid #D79403; }
	div#pageContact form fieldset div label span { color:red; margin-left:4px; }
	div#pageContact p.info { text-align:right; margin-right:15px; }
	div#pageContact p.info span { color:red; }

	div#pageContact div#contactinfos { position:absolute; z-index:1; top:0; right:20px; width:300px; height:380px; font-size:1em; }
	div#pageContact div#contactinfos img { margin-top:50px; }

/* modifs 2015-03-02 */
div#blockContent {
	width: 630px; margin: 0;
	border: 2px solid #fe7501;
	border-radius: 10px;
	box-sizing: border-box;
}
div#contentbg,
div#contentbg2 { background-position: 0 0; width: 100%; background: none; }
div#contentbgtop,
div#contentbgbottom,
div#contentbg2top,
div#contentbg2bottom { display: none; }
div#content { padding-left: 20px; margin: 0; }
div#blocRight { width: 350px; margin-left: 20px; }
div#blocRight div.rightCell {
	width: 100%;
	background: none; background-color: #eee;
	border: 1px solid #000; border-radius: 10px;
	box-sizing: border-box;
	margin-bottom: 30px;
}
div#blocRight div.rightCell div.rightCellHeader,
div#blocRight div.rightCell div.rightCellFooter { display: none; }
div#blocRight div.rightCell.script { padding: 10px; }

div#content h1 { margin-left: 170px; }
div#category div.hardwareLogo { left: 0; }
div#category h2 { width: auto; }
div#category h2 span { right: 0; left: inherit; }
div#category h2 a { display: inline-block; width: 70%; }
div#content { width: 93%; }


a#toTheGuide { right: 0; padding: 0; line-height: 26px; text-align: center; }
div#guide {
	width: auto;
	background: none; background-color: #fffbb2;
	border: 1px solid #9f9f9f; border-radius: 10px;
	margin-left: 20px; margin-right: 20px; margin-bottom: 20px;
	padding: 15px;
	}
div#guideTop, div#guideBottom { display: none; }
div#guide h2.guideTitle { width: auto; top: -41px; }

div#manufacturerIndex ul { padding: 10px; }