/*
   main.css
   General site layout and styles.
   
   Created by Ned Baldessin on 2008-08-20.
   Copyright 2008 Ned Baldessin. All rights reserved.
*/

/* Image replacement. */
.replaced {
	display: block;
	text-indent: -9999px;
}

a {
	outline: 0;
}

body {
	font-family: Arial, sans-serif;
}
div.light_gray,
hr.light_gray {height:0px;font-size:0px;margin:0px;padding:0px;margin-bottom:5px;border-bottom:1px solid #ededed}
/* ========== */
/* = HEADER = */
/* ========== */

#header-row {
	height: 125px;
	
}

/* 980px wide, plus 3px on each side for eventual drop shadows. */
#header {
	height: 125px;
	width: 986px;
	margin: 0 auto;
	background: url(../images/imgsite/header/bg.png) repeat-x;
	background-color:#FFFFFF;
	padding: 0 0px;
	position: relative;
}

/* The main logo. */
#header h1 {
	position: absolute;
	left: 19px;
	height: 95px;
	width: 130px;
}
#header h1 a {
 	position: absolute;
	height: 116px;
	width: 139px;
	background: url(../images/imgsite/header/logo-breizh.png) bottom left no-repeat;
	z-index:5;
}
#header h1 a span{
	display: none;
}
#header h1 a img{
	display: none;
}

/* The nav at the very top of the page. */
#header #top-nav,
#header #top-nav li {
	list-style: none;
	display: block;
}

#header #top-nav {
	height: 27px; /* That's excluding the 1px white line. */
	width: 644px;
	position: absolute;
	top: 0;
	left: 140px;
	/*background: url(../images/header/top-nav.png) no-repeat;*/
}

#header #top-nav li,
#header #top-nav li a {
	display: block;
	text-indent: -9999px;
	height: 26px;
	float: left;
}

#header #top-nav li#tn-aide,
#header #top-nav li#tn-aide a {
	width: 53px;
	background: url(../images/imgsite/header/tn-aide.png) no-repeat;
}

#header #top-nav li#tn-commande,
#header #top-nav li#tn-commande a {
	width: 121px;
	background: url(../images/imgsite/header/tn-commande.png) no-repeat;
}

#header #top-nav li#tn-ligne,
#header #top-nav li#tn-ligne a {
	width: 95px;
	background: url(../images/imgsite/header/tn-ligne.png) no-repeat;
}

#header #top-nav li#tn-portable,
#header #top-nav li#tn-portable a {
	width: 115px;
	background: url(../images/imgsite/header/tn-portable.png) no-repeat;
}

#header #top-nav li#tn-recharge,
#header #top-nav li#tn-recharge a {
	width: 127px;
	background: url(../images/imgsite/header/tn-recharge.png) no-repeat;
}

#header #top-nav li#tn-panier,
#header #top-nav li#tn-panier a {
left:635px;
 height : 37px;
	width: 203px;
	background: url(../images/imgsite/header/tn-panier.png) no-repeat;
}

/* This one isn't replaced, it's the item counter of the cart. */
body.cart #header #top-nav li#tn-panier,
body.cart #header #top-nav li#tn-panier a,
body.order #header #top-nav li#tn-panier,
body.order #header #top-nav li#tn-panier a,
#header #top-nav.tn-panier-selected li#tn-panier,
#header #top-nav.tn-panier-selected li#tn-panier a {
	background: url(../images/imgsite/header/tn-panier.png) no-repeat;
}

/* The cart counter */
#header #top-nav li#tn-panier span#tn-cpt-panier {
	display: block;
	text-align: right;
	font: normal 11px Arial, sans-serif;
	color: #fff;
	text-indent: 0;
	position: absolute;
	top: 7px;
	right: 15px;
}
#header #top-nav li#tn-panier span#tn-cpt-panier a {
	background: none;
	display: inline;
	float: none;
	text-indent: 0;
	width: auto;
	color: #fff;
}

#header #top-nav.tn-panier-selected  li#tn-panier span#tn-cpt-panier,
#header #top-nav.tn-panier-selected  li#tn-panier span#tn-cpt-panier a {
	color: #c00;
}

#header #top-nav.tn-panier-selected  li#tn-panier span#tn-cpt-panier {
	top: 9px;
}



/* The large 'espace client' button at the top right. */
#header #espace-client {
	display: block;
	text-indent: -9999px;
	height: 40px;
	width: 175px;
	position: absolute;
	top: 0;
	right: 27px;
	background: url(../images/imgsite/header/espace-client.png) no-repeat;
}
#header #commander-par-telephone {
	display: block;
	text-indent: -9999px;
	height: 133px;
	width: 366px;
	position: absolute;
	top: 0px;
	right: 250px;
	background: url(../images/imgsite/header/espace-client.png) no-repeat;
}


/* Main navigation tabs. */
ul#main-nav,
ul#main-nav li {
	display: block;
 	z-index:3;
}

ul#main-nav {
	position: absolute;
	top: 80px;
	left: 229px;
	height: 34px;
	width: 530px;
	z-index:40;

}
ul#main-nav li {
	float: left;
	height: 34px;
	background: url(../images/imgsite/header/main-nav-sprites.png) no-repeat;

}

ul#main-nav li a {
	display: block;
	text-indent: -9999px;
	height: 34px;
}
ul#main-nav li#mn-accueil,
ul#main-nav li#mn-accueil a {
	width: 105px; /* I'm including the 1px gap between the tabs. */
	background-position: 34px 0;
}

ul#main-nav li#mn-mobiles,
ul#main-nav li#mn-mobiles a {
	width: 134px;
}

ul#main-nav li#mn-offres,
ul#main-nav li#mn-offres a {
	width: 105px;
}

ul#main-nav li#mn-exclus,
ul#main-nav li#mn-exclus a {
	width: 107px;
}

ul#main-nav li#mn-vous,
ul#main-nav li#mn-vous a {
	width: 77px;
}

/* Sprite handling, using the "sliding doors" technique. */
/* Default state. */
ul#main-nav li#mn-accueil	{ background-position:    0   -34px; }
ul#main-nav li#mn-mobiles	{ background-position:  -105px -34px; }
ul#main-nav li#mn-offres	{ background-position: -239px -34px; }
ul#main-nav li#mn-exclus	{ background-position: -344px -34px; }
ul#main-nav li#mn-vous		{ background-position: -451px -34px; }

/* Hover state. */
/* UPDATE: WE ARE DROPPING THIS HIGHLIGHTED HOVER STATE. USING THE RED INSTEAD. :( */
/*
ul#main-nav li#mn-accueil:hover	{ background-position:    0   -56px; }
ul#main-nav li#mn-mobiles:hover	{ background-position:  -75px -56px; }
ul#main-nav li#mn-offres:hover	{ background-position: -175px -56px; }
ul#main-nav li#mn-exclus:hover	{ background-position: -271px -56px; }
ul#main-nav li#mn-vous:hover	{ background-position: -369px -56px; }
*/
ul#main-nav li#mn-accueil:hover { background-position:    0   0px; }
ul#main-nav li#mn-mobiles:hover { background-position:  -105px 0px; }
ul#main-nav  li#mn-offres:hover { background-position: -239px 0px; }
ul#main-nav  li#mn-exclus:hover { background-position: -344px 0px; }
ul#main-nav    li#mn-vous:hover { background-position: -451px 0px; }

/* Selected state (overrides the hover state).*/
ul#main-nav li#mn-accueil.selected	{ background-position:    0   0px; }
ul#main-nav li#mn-mobiles.selected	{ background-position:  -105px 0px; }
ul#main-nav li#mn-offres.selected	{ background-position: -239px 0px; }
ul#main-nav li#mn-exclus.selected	{ background-position: -344px 0px; }
ul#main-nav li#mn-vous.selected		{ background-position: -451px 0px; }


/* Main sub-navigation (i.e. the red bar underneeth the main nav tabs). */
ul#main-sub-nav {
	position: absolute;
	top: 80px;
	left: 0px;
	width: 890px;
	height: 35px;
	margin: 0 0px;
	background-image: url(../images/imgsite/header/bg-main-sub-nav.jpg);
	background-repeat: repeat-x;
	z-index:2;
}

ul#main-sub-nav.mobiles {
 	z-index:1;
	width: 986px;
}
ul#main-sub-nav.rubVirgin {
	padding-left: 50px;
	width: 930px;
}


ul#main-sub-nav li {
/*	display: -moz-inline-block;
	display: inline-block;
*/
	float: left;
	padding: 0px 0 0 10px;
	
}

ul#main-sub-nav li a {
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	text-decoration: underline;
	padding-right: 10px;
	border-right: 1px solid #fff;
}

ul#main-sub-nav li:last-child a {
	border: 0;
}

/* ===================== */
/* = Main content zone = */
/* ===================== */

#wrapper
 {
 background-color:#94b6d1;
 background-image: url(/images/imgsite/home/bg-gradient.png);
}
 

/* Layout of the main content zone.
   Page-specific styles are in corresponding stylesheets. */

#main {
	width: 986px;
	padding-top:15px;
	margin: 0px auto;
	position: relative;
	overflow: auto;
	background-color:#FFFFFF;
}



/* ========== */
/* = Footer = */
/* ========== */

 

#footer {
	width: 986px;
	height: 42px;
	margin: 0 auto;
	padding-top: 8px;
	position: relative;
	font-size: 13px;
		color: #fff;
	font-weight: bold;
  	text-align: center;
	background: url('../images/imgsite/footer/bg.png') no-repeat;
	background-color:#FFFFFF
}

#footer #small-print {
	width: 600px;
	margin: 15px auto 0 auto;
}

#footer #back-to-home {
	display: block;
	text-indent: -9999px;
	position: absolute;
	top: 0;
	right: 46px;
	width: 108px;
	height: 42px;
}

 
#footer a {
font-size:13px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	padding: 0 5px;
}


/* ====================================== */
/* = Header minicart (panier déroulant) = */
/* ====================================== */

#header #top-nav li#tn-panier {
	position: relative;
}

#header #minicart {
 
	position: absolute;
	left: 0px;
	top: 37px;
	z-index: 30;
	height: 193px;
	width: 203px;
	text-indent: 0px;
}

 

#header #minicart #minicart-wrapper {
	background: url('../images/imgsite/header/minicart-bg.png') no-repeat;
	margin-top: 0px;
	height: 193px;
	width: 203px;
}

#header #minicart p.minicart-vide,
#header #minicart p.minicart-mobile,
#header #minicart p.minicart-plan {
	float: left;
	margin-top: 5px;
	font-size: 12px;
	color: #666;
}

#header #minicart p.minicart-mobile img {
	margin-top: -5px;
	margin-right: 10px;
	margin-left: 6px;
	float: left;
}

#header #minicart p.minicart-mobile {
	width: 185px;
}
#header #minicart p.minicart-mobile span.deleteCartItem,
#header #minicart p.minicart-plan span.deleteCartItem {
	width: 21px;
	height: 21px;
	background: url(../images/imgsite/cart/cart-delete.png) no-repeat;
	float: right;
	margin-right: 5px;	
}
#header #minicart p.minicart-mobile span.deleteCartItem strong,
#header #minicart p.minicart-plan span.deleteCartItem strong{
	display: none;
}

#header #minicart p.minicart-plan {
	border-left: 1px solid #e5e6e6;
	padding-left: 12px;
	width: 154px;
}

#header #minicart p.minicart-vide {
        padding-left: 20px;
	padding-top: 20px;
        width: 154px;
}


#header #minicart p.minicart-total {
	position: absolute;
	bottom: 34px;
	right: 21px;
	text-align: right;
	font-size: 12px;
	font-weight: bold;
}

#header #minicart p.minicart-mobile span.name,
#header #minicart p.minicart-plan span.name {
font-size:11px;
 
	color: #000;
}

#header #minicart p.minicart-mobile span.subname {
font-size:11px;
 
	color: #c00;
}

#header #minicart p.minicart-plan span.subname {
font-size:11px;
 
	color: #000;
}

#header #minicart p.minicart-mobile strong,
#header #minicart p.minicart-plan strong {
font-size:11px;
	color: #000;
}

#header #minicart p.minicart-mobile span.price,
#header #minicart p.minicart-plan span.price {
	font-weight: bold;
	color: #c00;
	font-size: 12px;
}

#header #minicart p.minicart-plan span.per-month {
	font-size: 12px;
	color: #000;
}

#header #minicart p.minicart-total strong {
	font-size: 12px;
}

#header #minicart p.minicart-total strong span.price {
	color: #c00;
	font-weight: bold;
}

#header #top-nav li#tn-panier div#minicart div#minicart-wrapper a#minicart-commander {
	display: block;
	float: none;
	text-indent: -9999px;
	text-align: left;
	background: url('../images/imgsite/header/minicart-bt-commander.png') no-repeat scroll top left;
	width: 86px;
	height: 24px;
 position: absolute;
	bottom: 12px;
	left: 86px;
}
/*Vider panier */
#header #top-nav li#tn-panier div#minicart div#minicart-wrapper a#minicart-vider{
	display:block;
	background: url('../images/imgsite/header/minicart-bt-vider.png') no-repeat scroll top left;
	width: 80px;
	height: 25px;
	position: absolute;
	bottom: 5px;
	left: 10px;
}
/*Fin vider panier */
/* ====================================== */
/* = Send To Friend			      = */
/* ====================================== */

#main #sendFriend {
	display: none;
	position: absolute;
	left: -4px;
	top: 17px;
	z-index: 100;
	text-indent: 0px;
	left : 300px;
	top:100px;
}
#main #sendFriend #formSendFriend {
	width: 367px;
	height: 300px;
}
#main #sendFriend .boxTitleFormSend {
	background:url('../images/imgsite/product/fd-sendfriend.png') no-repeat;
	width: 367px;
	height: 30px;
}
#main #sendFriend .titleFormSend{
	width: 180px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#FFFFFF;
	font-weight:bold;
	float:left;
	margin-top:6px;
	margin-left:5px;
}
#main #sendFriend .closeFormSend {
	width: 50px;
	float:right;
	margin-top:4px;
}
#main #sendFriend .closeFormSend a{
	font-size: 11px;
	text-decoration:underline;
	color:#FFFFFF;
}
#main #sendFriend input{
	width: 190px;
	float:right;
	margin-right:25px;
	margin-top:5px;
}
#main #sendFriend .areaTxt{
	height: 100px;
}
#main #sendFriend .validButton{
	width: 100px;
	clear:both;
	background:url(../images/imgsite/product/bt-envoyer.png) no-repeat;
	width:129px;
	height:39px;
	border:none;
}
#main #sendFriend #formSendFriend span{
	line-height:25px;
	margin-left:5px;
}
#main #sendFriend #formSendFriend span, input{
	font:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#999999;
	font-weight:bold;
}
#main #sendFriend #formSendFriend #envoiAmiForm,#orderFollow_Form{
	background-color:#ffffff;
	border: 1px solid #d1d1d1;
	height: 270px;
	margin:0;
}
/* ====================================== */
/* = Order Follow				      = */
/* ====================================== */
#main #followOrder {
	position: absolute;
	left: -4px;
	top: 17px;
	z-index: 100;
	height: 243px;
	width: 482px;
	text-indent: 0px;
	left : 300px;
	top:100px;
	display: none;
}
#main #followOrder #formSend {
	width: 482px;
	height: 300px;
}
#main #followOrder #formSend p, #envoiAmiForm,#orderFollow_Form label{
	font-size: 12px;
	color: #999999;
	font-weight: bold;
	margin: 14px 0 0 20px;
}
#main #followOrder #formSend p span{
	font-weight: normal;
	margin: 0;
}
#main #followOrder .boxTitleFormSend {
	background: url('../images/imgsite/fd-orderfollow.png') no-repeat;
	width: 482px;
	height: 42px;
}
#main #followOrder .titleFormSend{
	width: 180px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#FFFFFF;
	font-weight:bold;
	float:left;
	margin-top:15px;
	margin-left:20px;
	_margin-left: 10px;
}
#main #followOrder .closeFormSend {
	width: 50px;
	float:right;
	margin-top:11px;
	_margin-top:15px;
}
#main #followOrder .closeFormSend a{
	font-size: 11px;
	text-decoration:underline;
	color:#FFFFFF;
}
#main #followOrder .areaTxt{
	height: 100px;
}
#main #followOrder .validButton{
	width: 100px;
	clear:both;
}
#main #followOrder #formSend span, input{
	font:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#999999;
	font-weight:bold;
}
#main #followOrder #formSend span.small{
	font-size:10px;
	font-weight:bold;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form{
	background-color:#ffffff;
	border: 1px solid #999999;
	height: 200px;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form label, .dateBirth label{
	float: left;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form .cmdNb{
	width: 482px;
	height: 30px;
}
#main #followOrder #formSend .dateBirth{
	width: 482px;
	height: 35px;
	margin-top: 0;
}
#main #followOrder #formSend .cmdNb input{
	float: right; 
	margin-right: 20px;
}
#main #followOrder #formSend .dateBirth input, .cmdNb input{
	margin-top: 11px;
}
#main #followOrder #formSend .dateBirth .dates{
	width: 190px;
	height: 30px;
	float: right;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form  .dateBirth .dates input.day, input.month{
	width: 30px;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form .dateBirth .dates input.year{
	width: 50px;
	margin-left: 10px;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form .dateBirth input.day{
	margin-left: 19px;
	margin-right: 10px;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form .row-valider{
	width: 482px;
	height: 30px;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form button{
	background: url('../images/html/bt-valider-large.png') no-repeat;
	float: right; 
	margin-right: 20px;
	_margin-right: 9px;
	width: 121px;
	height: 39px;
}
#main #followOrder #formSend #envoiAmiForm,#orderFollow_Form div.errMsg{
	color: #c00;
	font-size: 12px;
	margin-left: 10px;
}

/* ========================================== 	*/
/*Page maintenance					*/
/* ==========================================	*/			

body.maintenance #main{
	height: 200px;
}
body.maintenance #main h2{
	font-weight: bold;
	size: 14px;
	text-align: center;
	color: #999999;
}

/* ========================================== 	*/
/* PNG reduc Management mobile - big - mobile page*/
/* ========================================== 	*/
div#stage a.reducPng{
	position: absolute;
	width: 180px;
	height: 300px;
	margin-left: 7px;
}
div#stage a.reducPng .reduc-pos-1 {
	float: left;
	width: 70px;
	height:70px;
}
div#stage a.reducPng .reduc-pos-2 {
	float: right;
	width: 70px;
	height:70px;
}
div#stage a.reducPng span {
	float: left;
	width: 100%;
	position : absolute;
	bottom: 0;
	left: 0;
}
div#stage a.reducPng span .reduc-pos-3{
	width:180px;
	height:73px;
}
/* =======================================================================	*/
/* PNG reduc Management mobile - other mobiles brand - mobile page and top5 	*/
/* =======================================================================	*/
body.product tr.pic-row td div img,
body.home tr.pic-row td div img  {
	position:absolute;
}
body.product tr.pic-row a.reducPng,
body.home tr.pic-row a.reducPng{
	position: absolute;
	width: 90px;
	height: 150px;
	margin-left: 7px;
	margin-top: -1px;
/*	background-color:#c00;*/
}
body.product tr.pic-row a.reducPng img,
body.home tr.pic-row a.reducPng img{
	position:relative;
}
body.product tr.pic-row a.reducPng .reduc-pos-1,
body.home tr.pic-row a.reducPng .reduc-pos-1{
	float: left;
	width: 35px;
	height: 35px;
}
body.product tr.pic-row a.reducPng .reduc-pos-2,
body.home tr.pic-row a.reducPng .reduc-pos-2  {
	float: right;
	width: 35px;
	height: 35px;
}
body.product tr.pic-row a.reducPng span,
body.home tr.pic-row a.reducPng span {
	float: left;
	width: 100%;
	position : absolute;
	bottom: 0;
	left: 0;
}
body.product tr.pic-row a.reducPng span .reduc-pos-3,
body.home tr.pic-row a.reducPng span .reduc-pos-3 {
	width: 90px;
	height: 37px;
}

/* ======================================================================================= */
/* = contact Identifier popup = */
/* ======================================================================================= */

body #popup-contactidentifier .button_choice_client{
  border:none;
  text-indent:-9999px;
  width:135px;
  height:135px;
  background:url('../images/imgsite/contact/contact_client.png') bottom left no-repeat;
}

body #popup-contactidentifier #client-choice {
	display: block;
	text-indent: -9999px;
	height: 150px;
	width: 150px;
	margin-right:30px;
	margin-left:30px;
	background: url('../images/imgsite/contact/client.jpg') no-repeat;
}

body #popup-contactidentifier #client {
	display: block;
	text-indent: -9999px;
	height: 150px;
	width: 150px;
	margin-right:30px;
	margin-left:30px;
	background: url('../images/imgsite/contact/pas-client.jpg') no-repeat;
}



body #popup-contactidentifier .ou{
	padding-top: 10px;
	font-weight:bold;
	font-size:20px;
}



body #popup-contactidentifier .title{
	display:block;
	width:420px;
	margin-left:0px;
	padding-top: 10px;
	font-weight:bold;
}


.monOffre table{
	margin:0 auto !important;
}