@charset "utf-8";

/* Germain Larivière - CSS */

body{
	font-family: Lucida Grande, Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #616161;
	margin: auto;
}

@font-face {
	font-family: 'FuturaLTMediumRegular';
	src: url('../font/futura_lt_medium-webfont.eot');
	src: local('☺'), url('../font/futura_lt_medium-webfont.woff') format('woff'), url('../font/futura_lt_medium-webfont.ttf') format('truetype'), url('../font/futura_lt_medium-webfont.svg#webfontZKclU9sW') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'FuturaLTMediumBold';
	src: url('../font/futura_lt_heavy-webfont.eot');
	src: local('☺'), url('../font/futura_lt_heavy-webfont.woff') format('woff'), url('../font/futura_lt_heavy-webfont.ttf') format('truetype'), url('../font/futura_lt_heavy-webfont.svg#webfontMJYI3cg7') format('svg');
	font-weight: normal;
	font-style: normal;
}

.FuturaLT {
	font-style: normal;
	line-height:normal;
	font-family: 'FuturaLTMediumRegular', sans-serif;
	font-size-adjust: 0.47;
}
.FuturaLTHeavy {
	font-weight: normal;
	font-style: normal;
	line-height:normal;
	font-family: 'FuturaLTMediumBold', sans-serif;
	font-size-adjust: 0.49;
}

/* liens bleus */

a.bleu{
	background: url(../../images/liste_fleche_on.gif) no-repeat;
	background-position:0 1px;
	padding-left: 10px;
	color: #0059a1;
	text-decoration: underline;
}
a.bleu:hover{
	color: #0578d5;
	text-decoration: none;
	background-position: 5px 1px;
}

/* //// disposition générale du site //// */

#master{
	width: 960px;
	margin: 0 auto;
	overflow: hidden;
}

#entete_gauche{
	float: left;
	width: 490px;
}
#entete_droite{
	float: right;
	width: 150px;
	margin-top: 40px;
}

#entete_gauche{
	height:80px;
	width:221px;
	padding:20px 0 10px 0;
}

#contenu{
	width: 958px;
	float: left;
	border: 1px solid #76736e;
	overflow: hidden;
	padding: 0 0 10px 0;
	position: relative;
}

/* /////// menu texte (secondaire) /////// */

#menu_txt{
	float: left;
	width: 100%;
	font-size: 11px;
	padding: 3px 0 3px 0;
	background: url(../../images/fond_menu1.gif) repeat-x;
	color: #7d7d7d;
}
#menu_txt .actuel{
	color: #0058a0;
	margin-left: 30px;
	padding-left: 10px;
	background: url(../../images/liste_fleche_on.gif) no-repeat;
}
#menu_txt .fleche{
	color: #7d7d7d;
	text-decoration: none;
	margin-left: 30px;
	padding-left: 10px;
	background: url(../../images/liste_fleche_off.gif) no-repeat;
}
#menu_txt a.fleche:hover{
	color: #a1a1a2;
	background-position: 5px 0;
}

/* /////// MENU PRINCIPAL /////// */

#menu ol, #menu ul, #menu li{
	margin: 0;
	padding: 0;
	list-style-type: none;
}
#menu {
	position: relative;
	height: 36px;
	z-index: 100;
	background: url(../../images/fond_menu2.gif) repeat-x;
}
#menu .section{
	background: url(../../images/fond_sous_menu.gif);
	background-repeat: no-repeat;
	padding-bottom: 15px;
	position: absolute;
	z-index: 210;
	top: 23px;
}
#menu .section li{
	text-align: left;
	font-size: 11px;
	padding-top: 5px;
}
#menu .section a{
	font-style: italic;
	color: #FFFFFF;
	background: url(../../images/menu_fleche.gif) no-repeat;
	letter-spacing :normal;
	text-decoration: none;
	padding:2px 2px 2px 31px;
	border: 0 none;
	display: block;
	height:auto !important;
	width:150px;
}
#menu .section a:hover{
	background:url(../../images/menu_fleche.gif) no-repeat #4a4948;
	background-position:-5px 0;
}
html[lang='en'] #menu .section a{
	font-style: italic;
	color: #FFFFFF;
	background: url(../../images/menu_fleche.gif) no-repeat;
	letter-spacing :normal;
	text-decoration: none;
	padding:2px 2px 2px 31px;
	border: 0 none;
	display: block;
	height:auto !important;
	width:150px;
}
html[lang='en'] #menu .section a:hover{
	background:url(../../images/menu_fleche.gif) no-repeat #4a4948;
	background-position:-5px 0;
}
#menu .menu{
	float: left;
	text-decoration: none;
	border: 0 none;
}

#menu1:hover, #menu2:hover, #menu3 a:hover, #menu4 a:hover, #menu5 a:hover, #menu6 a:hover, #menu7 a:hover{background-position: 0 top;}

#menu1 		{width: 106px; height: 23px; overflow:hidden; background:url("../../images/fr/menu_01.gif") no-repeat; background-position: 0 bottom; cursor: pointer; cursor: hand;}
#menu2 		{width: 148px; height: 23px; overflow:hidden; background:url("../../images/fr/menu_02.gif") no-repeat; background-position: 0 bottom; cursor: pointer; cursor: hand;}
#menu3 a	{width: 174px; height: 23px; overflow:hidden; background:url("../../images/fr/menu_03.gif") no-repeat; background-position: 0 bottom; display: block;}
#menu4 a	{width: 100px; height: 23px; overflow:hidden; background:url("../../images/fr/menu_04.gif") no-repeat; background-position: 0 bottom; display: block;}
#menu5 a	{width: 155px; height: 23px; overflow:hidden; background:url("../../images/fr/menu_05.gif") no-repeat; background-position: 0 bottom; display: block;}
#menu6 a	{width: 133px; height: 23px; overflow:hidden; background:url("../../images/fr/menu_06.gif") no-repeat; background-position: 0 bottom; display: block;}
#menu7 a	{width: 142px; height: 23px; overflow:hidden; background:url("../../images/fr/menu_07.gif") no-repeat; background-position: 0 bottom; display: block;}

html[lang='en'] #menu1:hover, html[lang='en'] #menu2:hover, html[lang='en'] #menu3 a:hover, html[lang='en'] #menu4 a:hover, html[lang='en'] #menu5 a:hover, html[lang='en'] #menu6 a:hover, html[lang='en'] #menu7 a:hover{background-position: 0 top;}

html[lang='en'] #menu1 		{width: 153px; height: 23px; overflow:hidden; background:url("../../images/en/menu_01.gif") no-repeat; background-position: 0 -23px; cursor: pointer; cursor: hand;}
html[lang='en'] #menu2 		{width: 121px; height: 23px; overflow:hidden; background:url("../../images/en/menu_02.gif") no-repeat; background-position: 0 -23px; cursor: pointer; cursor: hand;}
html[lang='en'] #menu3 a	{width: 141px; height: 23px; overflow:hidden; background:url("../../images/en/menu_03.gif") no-repeat; background-position: 0 -23px; display: block;}
html[lang='en'] #menu4 a	{width: 129px; height: 23px; overflow:hidden; background:url("../../images/en/menu_04.gif") no-repeat; background-position: 0 -23px; display: block;}
html[lang='en'] #menu5 a 	{width: 137px; height: 23px; overflow:hidden; background:url("../../images/en/menu_05.gif") no-repeat; background-position: 0 -23px; display: block;}
html[lang='en'] #menu6 a	{width: 136px; height: 23px; overflow:hidden; background:url("../../images/en/menu_06.gif") no-repeat; background-position: 0 -23px; display: block;}
html[lang='en'] #menu7 a	{width: 141px; height: 23px; overflow:hidden; background:url("../../images/en/menu_07.gif") no-repeat; background-position: 0 -23px; display: block;}

#flash{
	float: left;
	width: 958px;
	margin: 25px 0 20px 0;
	position: relative;
	z-index: 15;
	text-align: center;
}

/* /////// pied de page /////// */

#footer{
	text-align: center;
	color: #969696;
	font-size: 9px;
	margin: 10px 0 20px 0;
	width: 99%;
	float: left;
}
#footer a{
	color: #969696;
	text-decoration: none;
}

/* //// formulaires //// */

.input_txt{
	height: 16px;
	font-size: 11px;
	margin: 0;
	padding: 0;
	width: 165px;
	border: 1px solid #bababa;
	color: #999999;
}
.input_btn{
	padding: 0;
	margin: 0 0 2px 0;
	width: 16px;
	height: 16px;
	vertical-align: middle;
}

/* //// titres //// */
	
h1, h2{
	margin: 0;
	padding: 0;
	font-family: 'FuturaLTMediumRegular', sans-serif;
}
h3, h5{
	padding-left: 8px;
	color: #7299C6;
	font-size: 17px;
	margin: 0px 0px 10px 0px;
	padding-top: 0;
	font-family: 'FuturaLTMediumRegular', sans-serif;
	font-weight: normal;
	font-style: normal;
	line-height:normal;
	font-size-adjust: 0.47;
}
h4{
	color: #577fc7;
	font-size: 14px;
	font-family: 'FuturaLTMediumBold', sans-serif;
	padding: 0;
	margin: 0;
}
h5{
	color: #FFFFFF;
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////// */

/* ----- INDEX - index.html ///////// */

.bloc_accueil{
	float: left;
}
.bloc_accueil h3{
	background: url(../../images/barre.gif) repeat-y;
}
.bloc_accueil h3.h3vide{
	background: none;
}
#blocMagasins{
	width: 220px;
	padding-left: 10px;
	font-size: 9px;
	font-weight: bold;
}
#blocMagCourt{
	width: 208px;
	padding-left: 10px;
	font-size: 9px;
	font-weight: bold;
}
#blocMagasins h4{
	margin: 0;
}
#blocMagasins p{
	margin: 0;
}
#blocMagasins #btns a:hover, #blocMagCourt #btns a:hover{
	background-position: left top;
}
#blocCirculaire{
	width: 185px;
	margin-right: 5px;
}
#blocCirculaire div{
	width: 95%;
	height: 180px;
	background: #cdc8be;
}
#blocNouveautes{
	width: 320px;
}
#blocNouvCourte{
	width: 180px;
}
#blocNouvMoy{
	width: 230px;
}
#blocPromotions-AVenir{
	width: 200px;
}
#blocPromotions-ConcoursPhoto{
	width: 315px;
}
#blocPromotionsCourt{
	width: 168px;
}
#blocBrandSource{
	width: 140px;
}

#btns{
	margin-top: 24px;
}

#btnDetails{
	background: url(../../images/fr/btn_details.gif) bottom no-repeat;
	display: block;
	width: 80px;
	height: 18px;
	float: left;
}
#btnCartes{
	background: url(../../images/fr/btn_cartes.gif) bottom no-repeat;
	display: block;
	width: 80px;
	height: 18px;
	float: left;
	margin-left: 15px;
}
html[lang='en'] #btnDetails{
	background: url(../../images/en/btn_details.gif) bottom no-repeat;
}
html[lang='en'] #btnCartes{
	background: url(../../images/en/btn_cartes.gif) bottom no-repeat;
}
	
.bloc{
	float: left;
}
.bloc h3, .bloc h4{
	padding: 0px 0px 0px 10px;
	margin: 10px 0px 0px 0px;
}
.titre{
	width: 400px;
	margin: 10px 20px 0 30px;
}
.titre h1{
	color: #7299C6;
}
.titre h2{
	margin-top: -5px !important;
}

#slides{
	margin-left: 20px;
}

/* ----- MAGASINS - magasins.html ///////// */

.lst-magasins .bloc{
	width: 305px;
	padding: 0 5px;
}
.lst-magasins .bloc p{
	margin: 0;
	padding-left: 10px;
}
.lst-magasins .gauche{
	width: 33%;
	padding-left: 0;
	border-left: none;
}
.lst-magasins .fdbleu{
	background: #F0F4FF;
}
.lst-magasins .lienEspace{
	margin: 10px 0 !important;
}
.lst-magasins {
	margin-bottom: 10px;
}
.directions{
	height: 105px;
}

/* ----- CONTACT - contact.html ///////// */

.contact{
	width: 949px;
	margin: 10px 0 0 10px;
}
.contact td{
	border-right: 1px solid #CCCCCC;
	vertical-align: top;
}
.contact_col {
	float: left;
	margin-top: 5px;
	padding-left: 10px;
	border-right: 1px solid #CCCCCC;
}
.contact_col h4 {
	height: 45px;
}
#contact_mail {
	clear: both;
	margin: 10px 15px;
	padding: 10px 0;
	border-top: 1px solid #CCCCCC;	
}
.contact h4, .contact p{
	padding-left: 10px;
}
.contact .courriel{
	border-top: 1px solid #CCCCCC;
	padding-top: 10px;
}
.tel{
	font-size: 13px;
	margin-top: 0;
}
.mail{
	font-size: 13px;
	background: url(../../images/liste_fleche_on.gif) no-repeat;
	background-position: 0 4px;
	padding-left: 10px;
	color: #0059a1;
	text-decoration: underline;
}
.mail:hover{
	background-position: 5px 4px;
}

/* ////////////////////////////////////////////////////////////// */

/* produits (CMS) */

#divMainImage{
	margin: 0 auto;
	background-color: #EFEFEF;
}

#tooltip{
    padding: 3px;
    background: #f9f9f9;
    border: 1px solid #27529E;
    text-align: center;
    font-size: 10px;
    max-width: 300px;
    width: 300px;
    z-index: 1000;
}
span.tip{
    border-bottom: 1px solid #eee;
}

/* map hilight réécris l'image map avec un div / style essentiel pour affichage des fleches*/

#divContour div{
	float: left;
}
.navigation{
	width: 32px;
	height: 305px;
	display: block;
	float: left;
}
#divFlecheGaucheNavigation{
	background: url(../../images/fleche_gauche.gif);
}
#divFlecheDroiteNavigation{
	background: url(../../images/fleche_droite.gif);
}

#pagesNavigation{
	clear: both;
	background: #CCC8BD;
	width: 100%;
	height: 30px;
	overflow: auto;
}
#pagesNavigation div{
	margin: auto;
}

#divCollection{
	clear: both;
	float: left;
	margin: auto;
	background: #FFFFFF;
	width: 100%;
	height: 10px;
	overflow: auto;
}

.page{
	margin: 3px !important;
	padding-top: 2px;
	width: 17px;
	height: 17px;
	background-color: #8A857E;
	color: #FFFFFF;
	float: left;
	text-align: center;
	display: block;
	text-decoration: none;
}
.page:hover{
	color: #FFFFFF;
	text-decoration: none;
}

/* concours - décembre 2008 /////

#concours				{background: url(../../images/concours_back.gif) repeat-y;}
#concours #texte		{padding: 10px 65px 20px 65px; color: #2b2866;}
#concours #texte .none	{list-style-type :none;}
#concours p img			{margin: 10px 0 10px 0;}
#concours ol li			{margin-top: 10px;}
#concours a				{color: #FFFFFF; font-weight: bold; text-decoration: none; background: #2b2866; padding: 2px 5px 2px 5px;}*/

/* la maison de jacques villeneuve /////

#blocMaisonJacquesVilleneuve			{width: 185px;}
#blocMaisonJacquesVilleneuve #espacepub	{width: 165px; height: 130px; float: left;}
#blocMaisonJacquesVilleneuve #bgbrun	{background:url(../../images/logo_maisonjacquesvilleneuve.gif) no-repeat center bottom #e7e5d8; height: 110px; padding: 10px; margin-top: 0; font-weight: bold; color: #764a1b;}*/

/* promotion Miele - septembre 2010 /////// */

#promoMiele{
	display: block;
	width: 85px;
	height: 53px;
	position: absolute;
	z-index: 35;
	background:url(../../images/promotions/Miele_promo_85x53FR.gif) no-repeat;
}
#promoMieleBIL{
	display: block;
	width: 85px;
	height: 53px;
	position: absolute;
	z-index: 35;
	background:url(../../images/promotions/Miele_promo_btn.gif) no-repeat;
}

html[lang='en'] #promoMiele{
	background:url(../../images/promotions/Miele_promo_85x53EN.gif) no-repeat;
}

/* concours Urbania - novembre 2010 /////// */

#slides {
	overflow:hidden;
	position:relative;
	width:185px;
	height:180px;
}
	
#slides ul {
	position:relative;
	left:0;
	top:0;
	list-style:none;
	margin:0;
	padding:0;	
	width:740px;			
}

#slides li {
	width:185px;
	height:180px;	
	float:left;
}

#prev {text-indent: -999em; display: block; width:1px; height:1px;}
#next {text-indent: -999em; display: block; width:5px; height:5px;}