/* 
 * Template Thélia version 1.0 - 11/2010
 * Ce template a été réalisé par Jean-Baptiste BILLOT pour Octolys
 * Il est soumis à la licence GPL
 */

@import url(style_editeur.css);


/* Rest CSS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* Eléments HTML en général
-------------------------------------------------------- */
body {
	padding: 0;
	margin: 0;
	font-family:"MS Sans Serif", Arial;
	background-color: #ffffff;
	/*variation
	background-image:url(_gfx/fond_bandeau.png);
	background-repeat:repeat-x;
	background-color: #f1f1f1;
	-----------------------------*/
	color:#4b6973;
	font-size:14px;
	font-weight:100;
}

#wrapper {
	width: 960px;
	margin:0 auto;
	background-color:#f1f1f1;
}
#subwrapper {
	overflow: hidden;
	width:960px;
}

a {
	color:#4b6973;
}

a, a:visited {
	color:#4b6973;
	text-decoration: none;
}
 a:hover  {
	color: #4b6973;
	text-decoration: underline;
	cursor:pointer;
}

img {
	border: 0;
	float:left;
}

.left {
	float:left;
}

.hide {
	display:none;
}

.clear {
	clear:both;
}

.top10 {	
	margin-top:10px;
}

.wrap_select {
	width:230px;
	margin-right:10px;
	height:40px;
	float:left;
	cursor:pointer;
}

td {
	vertical-align:middle;
}

th {
	vertical-align:middle;
	height:20px;
}

.obligatoire {
	color:red;
}


/* typographie
---------------------------------------------------------------*/
@font-face {
	font-family: 'WCManoNegraBtaRegular';
	src: url('WCManoNegraBta-webfont.eot');
	src: url('WCManoNegraBta-webfont.woff') format('woff'), url('WCManoNegraBta-webfont.ttf') format('truetype'), url('WCManoNegraBta-webfont.svg#webfont6vaH4Fi7') format('svg');
	font-weight: normal;
	font-style: normal;
}

h1.fontface {
	font-family:'WCManoNegraBtaRegular', arial, serif;;
	font-size:36px;
	letter-spacing: 0;
	color:#4b6973;
}

h2.fontface {
	font-family:'WCManoNegraBtaRegular', arial, serif;;
	font-size:30px;
	letter-spacing: 0;
	color:#ffffff;
}

h2 {
	font-family:"MS Sans Serif", Arial;
	font-size:16px;
	font-weight: bold;
}



/* Entête
---------------------------------------------------------- */
#top {
	float: left;
	width: 960px;
	height:215px;
	background-image:url(_gfx/bandeau.png);
	text-align: center;
	font-size:12px;
}

a.connexion {
	display:block;
	float:right;
	margin:10px 30px 0 0;
	text-align:right;
	color:#FFFFFF;
}


/* menu horizontal à onglet */
#top ul {
	display:block;
	width:960px;
	height:45px;
	margin-top:170px;
	font-family:Arial, Helvetica, sans-serif;
}

#top ul li {
	display:block;
	width:120px;
	height:45px;
	float:left;	
	margin-right:1px;
}

#top ul li a {
	display:block;
	width:120px;
	height:45px;
	line-height:45px;
	float:left;
	background-image:url(_gfx/fond_onglet.png);
	background-position:0 -90px;
	color:#FFFFFF;
}

#top ul li a:hover, #top ul li a:active {
	display:block;
	width:120px;
	height:45px;
	margin-right:1px;
	line-height:45px;
	float:left;
	background-image:url(_gfx/fond_onglet.png);
	background-position:0 -45px;
	color:#FFFFFF;
	cursor:pointer;
}

#top ul li.menu_actif a {
	display:block;
	width:120px;
	height:45px;
	margin-right:1px;
	line-height:45px;
	float:left;
	background-image:url(_gfx/fond_onglet.png);
	background-position:0 0;
	color:#FFFFFF;
	cursor:pointer;
}

#top ul li.menu_actif a, #top ul li.menu_actif a:hover {
	color:#4b6973;
	text-decoration:none;
	cursor:text;
}

/* Page
------------------------------------------------------------- */
#contenu {
	width:960px;
	overflow:visible;
}

#contenu2 {	
	width:900px;
	margin:0 auto;
}

#principal {
	width:660px;
	margin:0 30px;
	float:right;
	overflow:visible;
}

.right {
	float:right;
	position:relative;
}

.barre {
	height:60px;
	line-height:60px;
	border-top:1px solid #4b6973;
	border-bottom:1px solid #4b6973;
	margin:10px 0 30px 0;
}

.sans_barre {
	height:60px;
	line-height:60px;
	margin:10px 0 30px 0;
}

.sans_barre h2 {
	float:left;
}

.barre li {
	float:left;
}

.trait {
	border-top:#4b6973 1px solid;
}

.trait2 {
	border-top:#CCCCCC 1px solid;
	border-bottom:#FFFFFF 1px solid;
}


/* boutons
-------------------------------------------------------------*/

a.acheter, .bouton, .acheter {
	display:block;
	height:25px;
	line-height:25px;
	color:#FFFFFF;
	background-color:#4b6973;
	padding:5px 10px;
	margin-right:10px;
	font-family:"Cooper Black", arial;
	font-size:18px;
	float:left;
	text-align:center;
}

.blocProd_mini a.acheter {
	margin:0;
	padding:5px 4px;
}

a.details, .details {
	display:block;
	height:25px;
	line-height:25px;
	color:#FFFFFF;
	background-color: #00f6ff;
	border:0;
	padding:5px 10px;
	margin-right:10px;
	font-family:"Cooper Black", arial;
	font-size:18px;
	float:left;
	text-align:center;
}

a.details2, .details2 {
	display:block;
	height:25px;
	line-height:25px;
	color:#FFFFFF;
	background-color: #00f6ff;
	border:0;
	padding:5px 20px;
	font-family:"Cooper Black", arial;
	font-size:18px;
	float:left;
	text-align:center;
	position:absolute;
	top:100px;
	left:40px;
	visibility:hidden;
}

.sans_barre a.details {
	float:right;
	margin-top:10px;
}

a.agrandir, .agrandir {
	display:block;
	height:25px;
	line-height:25px;
	color:#FFFFFF;
	background-color: #00f6ff;
	border:0;
	padding:5px 20px;
	font-family:"Cooper Black", arial;
	font-size:18px;
	float:left;
	text-align:center;
	position:absolute;
	top:120px;
	left:90px;
	visibility:hidden;
}

a.acheter:hover, a.details:hover, .bouton:hover, a.details2:hover, a.agrandir:hover {
	background-color:#84ff00;
	text-decoration:none;
	cursor:pointer;
}


/* Acccueil
-------------------------------------------------------------*/

.pub {
	position:relative;
	width:960px;
	height:400px;
	background-image:url(_gfx/pub.png);
}


.pub a {
	font-family:Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:bold;
	color:#FFFFFF;
	display:block;
	width:420px;
	height:80px;
	position:absolute;
	right:62px;
	top:220px;
	line-height:80px;
	text-align:center;
	background-image: url(_gfx/grosbouton.png);
	background-position:0 80px;
}

.pub a:hover {
	font-family:Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:bold;
	color:#FFFFFF;
	width:420px;
	height:80px;
	position:absolute;
	position:absolute;
	right:62px;
	top:220px;
	display:block;
	line-height:80px;
	text-align:center;
	text-decoration:none;
	background-image: url(_gfx/grosbouton.png);
	background-position:0 160px;
}

.pub a:active {
	font-family:Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:bold;
	color:#FFFFFF;
	width:420px;
	height:80px;
	position:absolute;
	right:62px;
	top:220px;
	display:block;
	line-height:80px;
	text-align:center;
	text-decoration:none;
	background-image: url(_gfx/grosbouton.png);
	background-position:0 0;
}

.accueil {
	position:relative;
	width:270px;
	height:205px;
	background-image: url(_gfx/fond_accueil.png);
	margin-right:30px;
	float:left;
	padding:5px;
}

.accueil2 {
	position:relative;
	width:270px;
	height:205px;
	background-image: url(_gfx/fond_accueil.png);
	margin-right:0;
	float:left;
	padding:5px;
}

.accueil .img_acc, .accueil2 .img_acc {
	margin:20px 0 0 40px;
}

.titre_accueil {
	width:280px;
	margin-right:30px;
	float:left;
}

.titre_accueil2 {
	width:280px;
	margin-right:0px;
	float:left;
}


/* colonne gauche
------------------------------------------------------------*/
#col_gauche {
	width:210px;
	margin-left:30px;
	float:left;
}

/* Panier */
#petitPanier {
	position:relative;
	display:block;
	width:210px;
	height:40px;
	margin:10px 0;	
}

#petitPanier:hover {
	width:210px;
	height:40px;
	margin:10px 0;
	background-color:#FFFFFF;
	cursor:pointer;
}

#caddy {
	display:block;
	width:40px;
	height:40px;
	background-image:url(_gfx/caddy.png);
	background-position:0 40px;
	float:left;
}

#caddy_in {
	margin:5px 0 0 10px;
	float:right;
	text-align:right;
	line-height:18px;
}

#caddy2 {
	display:block;
	width:40px;
	height:40px;
	background-image:url(_gfx/caddy.png);
	background-position:0 80px;
	float:left;
}

.caddy2_in {
	margin:13px 0 0 10px;
	float:left;
	color:#CCCCCC;
}

.menu_in {
	margin:13px 0 0 10px;
	float:right;
}

/* recherche */
#col_gauche input {
	border:0;
	background-color:transparent;
	background: url(_gfx/input.png) no-repeat;
	width:160px;
	padding:10px 0 0 10px;
	height:30px;
	float:left;
}

.inputext {
	border:0;
	background-color:transparent;
	background: url(_gfx/input2.png) no-repeat;
	width:240px;
	padding:10px 0 0 10px;
	margin:0;
	height:30px;
	float:left;
}

#col_gauche .bouton_rech {
	border:0;
	background-color:transparent;
	background-image: url(_gfx/input_btn.png);
	width:40px;
	height:40px;
	cursor:pointer;
	float: right;
	cursor:pointer;
}

/*menu vertical accordéon*/
#menu_vertical {
	/*height:450px;*/
}

.accordion_in {
	width:210px;
	border-bottom:1px solid #4b6973;
}

.applemenu{
	margin:0;
	padding: 0;
	width: 210px;
}

.applemenu div.silverheader a{
	display: block;
	position: relative;
	width: auto;
	height:40px;
	line-height:40px;
	padding:10px 0;
	border-top:#4b6973 1px solid;
}

.applemenu div.submenu{
	border-top:#4b6973 1px solid;
	padding:0;
	margin:0;
	height:140px;
}

.applemenu div.submenu li {
	width:210px;
	height:45px;
	line-height:45px;
	border-top:1px solid #ffffff;
	border-bottom:1px solid #dadada;
	color:#4b6973;
	margin:0;
	padding:0;
}

.applemenu div.submenu li:hover {
	width:210px;
	margin:0;
	padding:0;
}

.applemenu div.submenu li a:hover {
	width:210px;
	display:block;
	width:100%;
	margin:0;
	padding:0;
}

.applemenu div.silverheader a span.coche, .applemenu div.submenu li a span.coche {
	display:block;
	width:210px;
	height:40px;
	background-image:url(_gfx/coche.png);
	margin:0;
	padding:0;
}


/* Pages rubrique
--------------------------------------------------------*/

/* barre de tri & affichage */
.tri, .tri h2, .tri p, .tri .boutonradio, .tri span {
	float:left;
}

.boutonradio1, .boutonradio2, .boutonradio {
	width:40px;
	height:40px;
	line-height:40px;
	text-align:center;
	background-image:url(_gfx/radio_bkg.png);
	float:left;
	margin:10px;
}

.boutonradio_ok {
	width:40px;
	height:40px;
	background-image:url(_gfx/radio_bkg.png);
	background-position:0 -40px;
	float:left;
	margin:10px;
}

.boutonradio1:hover, .boutonradio2:hover {
	width:40px;
	height:40px;
	background-image:url(_gfx/radio_bkg.png);
	background-position:0 -40px;
	float:left;
	margin:10px;
	cursor:pointer;
}

.margleft30 {
	margin-left:20px;
}

#btn_mini {	
	background-position:0 -40px;
}

#loader {
	display:none;
	margin-left:200px;
}

/*fil d'ariane catalogue */
#titre {
	height:40px;
	line-height:40px;
	margin-top:10px;
}

#titre a {
	display:block;
	float:left;
}

#titre img {
margin:0 10px;
}

/* Bloc produit */
.blocProd {
	position:relative;
	width:640px;
	float:left;
	padding:10px;
	border:1px solid #4b6973;
	margin:10px 0;
	background-color:#f1f1f1;
}

.blocProdDesc {
	position:relative;
	width:400px;
	float:left;
}

.blocProdDesc a:hover {
	text-decoration:none;
}

.blocProdImg {
	width:220px;
	float:right;
}

.blocProd .blocProdImg img {
	border:10px solid #FFFFFF;
}

#ombre {
	border:none;
}

.promo {
	position:absolute;
	right:-7px;
	top:-7px;
}

.postit {
	position:absolute;
	width:130px;
	height:57px;
	padding:30px 0 0 5px;
	background-image:url(_gfx/postit.png);
	background-repeat:no-repeat;
	left:-5px;
	top:-5px;
}

.prixProd h1 {
	display:block;
	width:140px;
	height:60px;
	line-height:60px;
	background-image:url(_gfx/prix.png);
	text-align:center;
	float:left;
}

.prixProd span {
	line-height:60px;
}

.ouvre {
	cursor:pointer;
}

.cache {
	width:650px;
	float:left;
}

.haut {
	cursor:pointer;
	text-decoration:underline;
	float:right;
}


.blocProd_mini {
	position:relative;
	width:200px;
	float:left;
	border:1px solid #4b6973;
	margin:10px 10px 10px 0;
	padding:3px;
	text-align:left;
}

.blocProd_mini h1 {
	display:block;
	height:30px;
	overflow:hidden;
}


.miniphotos {
	height:100px;
	float:right;
}

.list_desc {
	width:300px;
	float:left;
}

.chapo {
	height:20px;
	line-height:20px;
	overflow:hidden;
}

.img_mini {
	display:block;
	width:200px;
	float:left;
}

.prix{
	display:block;
	width:57px;
	float:left;
}

/* page produit
--------------------------------------------------------*/

.contenu_left {
	width:300px;
	float:left;
}

li.coche {
	height:40px;
	line-height:40px;
}

ul.vignettes li {
	display:block;
	height:80px;
	float:left;
}


ul.vignettes li a {
	display:block;
	height:80px;
	float:left;
	margin-right:10px;
}


/* adresse et commande
-----------------------------------------*/

.h40 {
	display:block;
	height:40px;
	line-height:40px;
}

.h40 a {
	font-weight:bold;
}

.height40 {
	height:40px;
	line-height:40px;
	float:left;
	width:150px;
}
.height40 label {
	float:left;
	margin-left:30px;	
}

.height40_2 {
	height:40px;
	line-height:40px;
	float:left;
}
.height40_4 {
	height:40px;
	line-height:40px;
	float:left;
	width:600px;
}
	
.height40_4 label {
	margin-left:30px;	
}

.height40_4 label a {
	font-weight:bold;	
}

#btn_cache, #btn_cache2 {
	visibility:hidden;
}

.adresse {
	width:330px;
	float:left
}

.height40_3 {
	height:40px;
	line-height:40px;
	float:left;
	width:600px;
}
.height40_3 label {
	float:left;
	margin:0 30px;	
}

.lab_form {
	display:block;
	float:left;
	width:250px;
}

.bande {
	height:40px;
	margin:0;
	padding:0;
}


/* Personnalisation du zoom de la fiche produit (produit.html)
-------------------------------------------------------- */
#superbox-overlay {
	width: 100%;
	overflow: visible;
	position: relative;
	margin: 0 auto 0 auto;
	padding: 0;
	background: #000000;
}

#superbox-container .loading {
	width:32px;
	height:32px;
	text-indent:-9999px;
	background-image:url(_gfx/loader2.gif);
	background-position:center 0;
	background-repeat:no-repeat;
	overflow: hidden;
	position: relative;
	padding: 0;
	width: 100%;
}

#superbox .close a {
	float:right;
	padding:0 5px;
	line-height:20px;
	color:#fff;
	background:#4b6973;
	cursor:pointer;
}

#superbox .nextprev a {
	float:left;
	margin-right:5px;
	padding:0 5px;
	line-height:20px;
	background:#4b6973;
	cursor:pointer;
	color:#fff;
}

#superbox .nextprev .disabled {
	background:#ccc;
	cursor:default;
}

#superbox .close a:hover, #superbox .nextprev a:hover {
	color:#fff;
	background:#84ff00;
	text-decoration:none;
}



/* Pied de page
-------------------------------------------------------- */
#baspage_contenu {
	width:960px;
	height:215px;
	margin:0 auto;
	background-image:url(_gfx/fond_bandeau.png);
	background-repeat:repeat-x;
}

#menu_bas {
	width:690px;
	padding-top:10px;
	margin-left:30px;
	float:left;
}

.case {
	width:210px;
	margin-right:10px;
	float:left;
}

#baspage_contenu #menu_bas .case, #baspage_contenu #menu_bas .case a, #baspage_contenu #menu_bas .case a h4 {
	color:#f1f1f1;
}


/* Correction des bug Internet Explorer
-------------------------------------------------------- */

*html button {width:1%; overflow:visible;}
*:first-child+html button {overflow:visible;}