/********************************************************* sélecteurs */

*{
	color: black;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
}

body{
	background: url(../img/bg_principal.jpg) left top repeat-x;
	font-size: 75%; /* 16 x 0.75 = 12px */
	text-align: center;
}
.nobg{
	background: none;
}
/* Ordre des différents types de A =>
	Link - Visited - Hover - Active */

a:link{
	color: #3869a8;
	text-decoration: none;
	font-style: normal;
}
a:visited{
	color: #551A8B;
}
a:hover{
	color: #3869a8;
	text-decoration: underline;
}
a:active{
	color: #3869a8;
	text-decoration: none;
}

img{
	border: 0;
}
input, select{
	vertical-align: middle;
}
legend{
	color: black;
}
li{
	list-style-type: none;
}
p{
	margin: 0;
	padding: 0;
}
td{
	
}

/********************************************************* structure */

.centrer{
	width: 960px;
	margin: 0 auto;
	text-align: left;
}
.invisible, .liensref{
	display: none;
}

/********************************************************* specifique */

.spacer{
	display: block;
	clear: both;
}

/********************************************************* Partie supérieure */

/* Positionnement du logo Arcad'optic */
.header{
	height: 100px;
}
.header .logo{
	float: left;
}
.header a.accueil, .header h1{
	float:left;
	display: block;
	width: 243px;
	height: 61px;
	background: url(../img/logo_arcadoptic01.gif) no-repeat;
	margin: 19px 0 0 22px;
}
.header a.accueil span, .header h1 span{
	display: none;
}
.header a.accueil{
	cursor: pointer;
}

/* Positionnement du formulaire de recherche */
.header .searchbox{
	float:right;
	margin-top: 18px;
	display: block; /* POUR AFFICHER-CACHER le moteur de recherche et le panier en haut à droite du Header */
}
.searchbox li{
	float: left;
}
.searchbox li label{
	font-size: 0.9em;
	color: #a4a2a7;
	margin-right: 10px;
}
.searchbox li.saisie input{
	border: none;
	color: black;
	background: url(../img/bg_form_search.gif) no-repeat;
	width: 152px;
/*	height: 15px;*/
	height: 11px;
	font-size: 0.9em;
	padding: 0 5px 0 5px;
	margin-right: 5px;
}
.searchbox li.valider input{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	border: none;
	color: white;
	background: url(../img/bg_form_ok.gif) no-repeat;
	width: 22px;
	height: 15px;
	font-size: 9px;
}

/* Séparation horizontale en pointillés */
.header .searchbox .separ01{
	display: block;
	width: 255px;
	height: 1px;
	margin: 14px 0 8px 0;
}

/* Panier, nombre d'articles et lien "Régler" de la Partie supérieure */
.searchbox ul.basketbox li.basket a{
	color: white;
	font-weight: bold;
	font-size: 1em;
	padding:11px 0 9px 33px;
	background: url(../img/picto_cube_01.gif) 0 center no-repeat;
	display: block;
	margin-left: 25px;
	text-decoration: none;
}
.searchbox ul.basketbox li.basket a:hover{
	text-decoration: underline;
}
.searchbox ul.basketbox li.articles{
	font-weight: bold;
	color: #6fc1cb;
	margin: 11px 0 0 7px;
}
.searchbox ul.basketbox li.regler a{
	color: white;
	text-decoration: none;
	padding-left: 8px;
	background: url(../img/puce_white_square.gif) 0 center no-repeat;
	display: block;
	margin: 11px 0 0 7px;
	font-weight: bold;
}
.searchbox ul.basketbox li.regler a:hover{
	text-decoration: underline;
}

/* Pre-home */

.visuprehome{
	margin-top: 1px;
}

/* Navigation, liste de liens */

.navigation{
	margin: 7px 0 0 0;
	height: 68px;
}

/* Navigation principale, liste des rubriques */

ul.nav01 li{
	float: left;
}
ul.nav01 li span{
	font-weight: bold;
	color: #55515c;
}
ul.nav01 a.selected, ul.nav01 a.selected span{
	color: white;
}

ul.nav01 li a{
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	color: #55515c;
	display: block;
	height: 18px;
	padding-top: 2px;
}
ul.nav01 li a:hover{
	text-decoration: underline;
}

ul.nav01 li.bg01 a{
	width: 62px;
}
ul.nav01 li.bg02 a{
	width: 80px;
}
ul.nav01 li.bg03 a{
	width: 129px;
}
ul.nav01 li.bg04 a{
	width: 100px;
}
ul.nav01 li.bg05 a{
	width: 77px;
}
ul.nav01 li.bg06 a{
	width: 70px;
}

ul.nav01 li.bg01 a.selected{
	background:url(../img/bgnav01_title01.gif) no-repeat; 
}
ul.nav01 li.bg02 a.selected{
	background:url(../img/bgnav01_title02.gif) no-repeat; 
}
ul.nav01 li.bg03 a.selected{
	background:url(../img/bgnav01_title03.gif) no-repeat; 
}
ul.nav01 li.bg04 a.selected{
	background:url(../img/bgnav01_title04.gif) no-repeat; 
}
ul.nav01 li.bg05 a.selected{
	background:url(../img/bgnav01_title05.gif) no-repeat; 
}
ul.nav01 li.bg06 a.selected{
	background:url(../img/bgnav01_title06.gif) no-repeat; 
}


/* Navigation secondaire, liste des sous-rubriques */

ul.nav02 li.noborder{
	border: none;
}

ul.nav02{
	margin-top: 6px;
}

ul.nav02 li{
	float: left;
	color: #8c8991;
	margin-left: 10px;
	padding-right: 9px;
	font-weight: bold;
	border-right: 1px solid #55515c;
}
ul.nav02 li a:link, ul.nav02 li a:visited, ul.nav02 li a:active{
	font-weight: bold;
	color: #55515c;
	text-decoration: none;
}

ul.nav02 li a:hover{
	font-weight: bold;
	color: #55515c;
	text-decoration: underline;
}

.navigation ul.nav02 li a.selected{
	color: white;
	cursor: crosshair;
}


ul.nav01 li a:hover{
	text-decoration: underline;
}

/* fil d'ariane */

ul.filariane li{
	float: left;
}

/* Navigation de gauche, liste des designers */

.designers{
	float: left;
	width: 149px;
}
.designers li{
	margin-left: 10px;	
}
.designers li a:link, .designers li a:visited, .designers li a:active{
	color: #8c8991;
	text-decoration: none;
}
.designers li a:hover{
	color: #8c8991;
	text-decoration: underline;
}
.designers li.fst{
	color: #55515c;
	font-weight: bold;
	margin-bottom: 13px;
}

/* Contenu principal, accroche, signature, highlights */

.vueunique{
	float: left;
	width: 329px;
	border-right: 1px dashed #a7a5ab;
	border-left: 1px dashed #a7a5ab;
}
.vueunique h2{
	margin: 0 0 5px 30px;
	display: block;
	width: 284px;
	height: 24px;
	background: url(../img/t_votre_vue_est_unique.gif) no-repeat;
}

.vueunique p{
	margin-left: 30px;
}
.vueunique p.claim{
	width: 276px;
	padding-bottom: 70px;
	background: url(../img/signature_noire.gif) right bottom no-repeat;
}


.vueunique p.hilite1{
	display: block;
	width: 286px;
	height: 63px;
	background: url(../img/visu_3points_01.gif) no-repeat;
	margin: 12px 0 7px 14px;
}
.vueunique p.hilite2{
	display: block;
	width: 286px;
	height: 71px;
	background: url(../img/visu_3points_02.gif) no-repeat;
	margin: 0 0 7px 14px;
}
.vueunique p.hilite3{
	display: block;
	width: 286px;
	height: 70px;
	background: url(../img/visu_3points_03.gif) no-repeat;
	margin: 0 0 0 14px;
}

.vueunique span{
	display: none;
}

/* Encart promo de la hompage  */

.produit{
	float: left;
	width: 479px;
}

.produit p{
	text-align: center;
	position: absolute;
}

/* Encart promo = Marque */
.produit p.promo1{
	color: #55515c;
	font-size: 1em; /* 12px */
	margin-top: 47px;
	margin-left: 186px;
}
/* Encart promo = Griffe */
.produit p.promo2{
	color: #55515c;
	font-size: 1.7em; /* 20px */
	margin-top: 60px;
	margin-left: 145px;
}

/* Encart promo = Démarque */
.produit p.promo3{
	color: #5cb2be;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 3.75em; /* 45px */
	margin-top: 76px;
	margin-left: 127px;
}

/* Encart promo = Economie réalisé */
.produit p.promo4{
	color: #5cb2be;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 0.9em; /* 11px */
	margin-top: 126px;
	margin-left: 87px;
}
.offrepromo{
	text-align: center;
	vertical-align: top;
	margin: 10px 0;
}
.offrepromo p.promo1{
	color: #5cb2be;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 10em; /* ??px */
}
.offrepromo p.promo2{
	color: #5cb2be;
	font-size: 3em; /* 12px */
}

/* Encart promo = Lien vers la fiche produit */

.produit .savoirplus{
	margin-top: 84px;
	margin-left: 281px;
}
.produit .decalage01{
	margin-top: 92px;
	margin-left: 271px;
}  
p.savoirplus a:link, p.savoirplus a:visited, p.savoirplus a:active{
	color: white;
	font-weight: bold;
	font-size: 0.9em; /* 11px */
	display: block;
	width: 98px;
	height: 20px;
	background: url(../img/bg_turquoise_savoirplus.gif) no-repeat;
	padding-top: 2px;
	text-decoration: none;
	text-align: center;
}
p.savoirplus a:hover{
	text-decoration: underline;
}
/* Encart promo = Visuel produit */
.produit span{
	display: none;
}
.centrer .produit p.visup_prod01{
	display: block;
	width: 417px;
	height: 209px;
	background: url(../img/visu_promo_01.gif) no-repeat;
	margin-top: 183px;
	margin-left: 42px;
}

/* Catalogue, Listes produits */


.tabcollec{
	border-left: 1px dashed #a7a5ab;
}
.tabcollec td.visu{
	width: 267px;
	text-align: center;
}
.tabcollec .infos{
	width: 137px;
	background: url(../img/separ_vert.gif) right top repeat-y;
	vertical-align: top;
}
.tabcollec .nobg{
	background: none;
}


/* Nom, descriptif, prix, remise des différents produits du catalogue */

.tabcollec td.infos p.intitule{
	font-weight: bold;
	font-size: 0.9em; /* 11px */
	margin-top: 21px;
	color: #55515c;
}
.tabcollec td.infos p.descript{
	font-size: 0.9em; /* 11px */
	margin-bottom: 7px;
	width: 110px;
	color: #55515c;
}
.tabcollec td.infos p.prix{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #64b9c5;
	font-size: 2.5em; /* 30px */
	line-height: 0.8em;
}
.tabcollec td.infos p.prix span.centi{
	color: #64b9c5;
	font-size: 20px; /* 20px */
	font-weight: bold;
}
.tabcollec td.infos p.prix span.devise{
	color: #64b9c5;
	font-size: 20px; /* 20px */
	font-weight: normal;
}
.tabcollec td.infos p.eco{
	font-weight: bold;
	color: #64b9c5;
	font-size: 0.9em; /* 11px */
	margin:0 0 7px 2px;
}
.tabcollec td.infos p.savoirplus{
	font-size: 1em; /* 11px */
	margin-bottom: 33px;
}


/* Fiche produit */

.article{
	width: 808px;
	border-left: 1px dashed #a7a5ab;
	float: left;
}

.article .bigvisu{
	text-align: center;
	width: 585px;
	float: left;
}
.article .bigvisu img{
	margin: 34px 0 56px 0;
}
.article .spec{
	width: 222px;
	float: left;
	margin: 40px 0 20px 0;
}

.article .spec p.nomarticle{
	color: #55515c;
	font-size: 1em; /* 12px */
	font-weight: bold;
}
.article .spec p.txtarticle{
	margin: 21px 0 7px 0;
	color: #8c8991;
	font-size: 0.9em; /* 11px */
	width: 200px;
}

.article .spec .aquabox{
	width: 122px;
	float:left;
	margin-top: 10px;
}

.article .spec .aquabox .prixarticle{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #64b9c5;
	font-size: 2.5em; /* 30px */
	line-height: 0.8em;
}
.article .spec .aquabox .prixarticle span.centi{
	color: #64b9c5;
	font-size: 20px; /* 20px */
	font-weight: bold;
}
.article .spec .aquabox .prixarticle span.devise{
	color: #64b9c5;
	font-size: 20px; /* 20px */
	font-weight: normal;
}

.article .spec .aquabox .remisearticle{
	font-weight: bold;
	color: #64b9c5;
	font-size: 0.9em; /* 11px */
	margin:0 0 0 2px;
}
.article .spec .buy a{
	float:left;
	display: block;
	background: url(../img/bg_acheter.gif) no-repeat;
	color: white;
	font-weight: bold;
	font-size: 0.9em;
	width: 85px;
	height: 39px;
	padding: 22px 0 0 10px;
}

.article .contenutxt{
	width: 555px;
	float:left;
}

.article .contenutxt p{
	color: #8c8991;
	font-size: 0.9em;
	margin: 0 0 10px 42px;
}
.article .encarts{
	width: 222px;
	float: left;
	margin-left: 30px;
}
.article .encarts p, .article .encarts li{
	color: white;
	font-size: 0.9em;
}
.article .encarts .p1{
	background: url(../img/bg_encart01.gif) repeat-y;
	width: 192px;
	height: 84px;
	padding: 14px 12px 6px 18px;
}
.article .encarts .p2{
	background: url(../img/bg_encart02.gif) repeat-y;
	width: 192px;
	height: 94px;
	padding: 14px 12px 6px 18px;
	margin-top: 10px;
}
.article .encarts p.title{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 20px;
}

.article .encarts .p1 li{
	padding-left: 7px;
	background: url(../img/puce_blanche_li.gif) left center no-repeat;
}

/* Zones éditoriales */

.content{
	width: 808px;
	border-left: 1px dashed #a7a5ab;
	float: left;
}
.content .infoscontact{
	float:left;
	width: 390px;
	border-right: 1px dashed #a7a5ab;
	margin-right: 30px;
}
.content a:link, .content a:visited, .content a:active{
	color: #64b9c5;
	text-decoration: none;
}
.content a:hover{
	color: #64b9c5;
	text-decoration: underline;
}
.content p{
	display: block;
	margin: 10px 0 10px 30px;
	color: #55515c;
}
.content .italic{
	font-style: italic;
}
.content p span{
	display: none;
}
.content strong{
	color: #55515c;
}
.content .fleft{
	float:left;
}
.content .fright{
	float:right;
}
.content p a.minimap:link, .content p a.minimap:visited, .content p a.minimap:active{
	color: #64b9c5;
	padding: 1px 20px 1px 0;
	background: url(../img/picto_map.gif) right center no-repeat;
	text-decoration: none;
}
.content p a.minimap:hover{
	text-decoration: underline;	
}
.content ul{
	margin-left: 30px;
}
.content li{
	color: #55515c;
	padding-left: 7px;
	background: url(../img/puce_grise_li.gif) left 6px no-repeat;
	margin-left: 10px;
}


/* Titres en background-image */

.content p.t_ao_style{
	display: block;
	width: 256px;
	height: 19px;
	background: url(../img/t_ao_style_voxs_yeux.gif) no-repeat;
}
.content p.t_mentions{
	display: block;
	width: 163px;
	height: 19px;
	background: url(../img/t_mentions.gif) no-repeat;
}
.content p.t_boutq_coupons{
	display: block;
	width: 324px;
	height: 19px;
	background: url(../img/t_boutq_coupons.gif) no-repeat;
}

.content p.t_boutq_20pc{
	display: block;
	width: 634px;
	height: 19px;
	background: url(../img/t_boutq_20pc.gif) no-repeat;
}


.content .coupons img, img.couponreduc{
/*	border: 1px dashed #a7a5ab;*/
	float: none;
	border: 1px dashed black;
}


.content p.titre01{
	display: block;
	width: 204px;
	height: 19px;
	background: url(../img/t_btq01_liverdun.gif) no-repeat;
}
.content p.titre02{
	display: block;
	width: 328px;
	height: 19px;
	background: url(../img/t_btq02_bouxieres.gif) no-repeat;
}
.content p.titre03{
	display: block;
	width: 202px;
	height: 19px;
	background: url(../img/t_btq03_nomeny.gif) no-repeat;
}



.content p.titre05{
	display: block;
	width: 150px;
	height: 15px;
	background: url(../img/t_nous_contacter.gif) no-repeat;
	margin-bottom:14px;
	margin-left: 0;
}

.content .imgboutq{
	margin: 10px 0 0 30px;
}
.content .txtmag{
	float: left;
}
.content .txtmag .mtop01{
	margin-top: 9px;
	clear: right;
}

.content .txtastigma{
	float: left;
	width: 460px;
	margin-top: -14px;
}
.content img.visutest{
	float: left;
	border: 1px solid black;
	margin: 10px 0 0 30px;
}

.content .enlight{
	font-weight: bold;
	font-size: 1.2em;
	color: #64b9c5;
}

.content .marget01{
	margin-top: 23px;
}


.content .mleft30{
	margin-left: 30px;
}

/* positionnement des images/visuels */

.content img{
	float:left;
	margin: 10px 30px 0 30px;
}
.content img.visumat1{
	margin: 10px 60px 0 77px;
}
.content img.visumat2{
	margin: 10px 30px 0 0;
}
.content img.visu_trait{
	margin: 10px 30px 0 77px;
}
.content img.visuyoga1{
	margin: 10px 30px 0 30px;
}
.content img.visuyoga2{
	margin: 10px 30px 0 0;
}
.content img.visuyoga3{
	margin: 10px 0 0 0;
}

.content img.visulens1{
	margin: 10px 30px 0 30px;
}
.content img.visulens2{
	margin: 10px 0 0 0;
}
.content img.visulens3{
	margin: 0;
}

.content img.spacer{
	float: none;
	border: none;
}

.content img.ordo{
	float: left;
	border: 1px solid black;
}


.content p.t_mv_myopie{
	display: block;
	width: 71px;
	height: 19px;
	background: url(../img/t_mv_myopie.gif) no-repeat;
	margin-bottom:14px;
}
.content p.t_mv_hyper{
	display: block;
	width: 145px;
	height: 19px;
	background: url(../img/t_mv_hyper.gif) no-repeat;
	margin-bottom:14px;
}
.content p.t_mv_astigma{
	display: block;
	width: 134px;
	height: 19px;
	background: url(../img/t_mv_astigma.gif) no-repeat;
	margin-bottom:14px;
}
.content p.t_mv_importance{
	display: block;
	width: 218px;
	height: 19px;
	background: url(../img/t_mv_importance.gif) no-repeat;
	margin-bottom:14px;
}
.content p.t_mv_matiere{
	display: block;
	width: 180px;
	height: 15px;
	background: url(../img/t_mv_matiere.gif) no-repeat;
	margin-bottom:14px;
}
.content p.t_mv_traitement{
	display: block;
	width: 208px;
	height: 15px;
	background: url(../img/t_mv_traitement.gif) no-repeat;
	margin-bottom:14px;
}
.content p.t_mv_protection{
	display: block;
	width: 171px;
	height: 19px;
	background: url(../img/t_mv_protection.gif) no-repeat;
	margin-bottom:14px;
}
.content p.t_mv_ordonnance{
	display: block;
	width: 172px;
	height: 15px;
	background: url(../img/t_mv_ordonnance.gif) no-repeat;
	margin-bottom:14px;
}
.content p.t_mv_yoga{
	display: block;
	width: 139px;
	height: 19px;
	background: url(../img/t_mv_yoga.gif) no-repeat;
	margin-bottom:14px;
}




/* Formulaire de contact / page contact */

.content .formcontact{
	float:left;
}

.content .formcontact label{
	color: #55515c;
}

.content .formcontact input{
	width: 300px;
	color: #55515c;
	padding:1px 2px;
	border: 1px solid #64b9c5;
}

.content .formcontact textarea{
	width: 300px;
	height: 100px;
	color: #55515c;
	padding:1px 2px;
	border: 1px solid #64b9c5;	
	font-size: 1em;
}
.content .formcontact input.reset, .content .formcontact input.send{
	width: 80px;
	border: none;
	font-weight: bold;
	color: white;
	background-color: #64b9c5;
}

/* Footer, liste de liens, mentions légales  */

.navbottom{
	margin: 29px 0 0 10px;
	height: 30px;
}
.phome{
	margin: 0 0 0 10px;
}
.navbottom li{
	float:left;
	color: #a7a5ab;
	font-size: 0.9em; /* 11px */
	margin-right: 6px;
}
.navbottom li a:link, .navbottom li a:visited,
.navbottom li a:hover, .navbottom li a:active{
	color: #a7a5ab;
	text-decoration: none;
}
.navbottom li a:hover{
	color: #a7a5ab;
	text-decoration: underline;
}

