/*
Screen Stylesheet for www.thermesdignelesbains.fr
*/
 
html, body {
border:0;
margin:0;
padding:0;
}
 
body {
	text-align:left;
	color:#666;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.75em;
	background-image: url(../img/bg-global.gif);
	background-repeat: no-repeat;
	background-position:center top;
}
.undisplayed {
	display:none;	
}
.hidden{
	visibility:hidden
}

 
/* = Base Structure
============================================================================== */

#global{
	margin: 0 auto;
	width: 1000px;
	background:url(../img/main-border.png) center repeat-y;
	height:100%;
	}

#container{
	margin: 0 10px;
	height:100%;
	width:980px;
	position:relative;
	}

	/* = Header
	-------------------------------------------------------------------------- */

	#header-top{
		background:url(../img/header_top.gif) top left no-repeat;
		height:72px;
		width:1000px;
		}
	
	#header{
		background-color: #FFFFFF;
		width:980px;
		position:relative;
		}
	
	/* Header pages */
		
	.home{
		height:150px;
		background:url(../img/bg_header.gif) no-repeat top left;
		}
		
	.header-cure-thermale{
		height:200px;
		background:url(../img/bg_header_cure.jpg) no-repeat top left;
		}
		
	.header-bienetre{
		height:200px;
		background:url(../img/bg_header_bienetre.jpg) no-repeat top left;
		}
		
	.header-sejour{
		height:200px;
		background:url(../img/bg_header_sejour.jpg) no-repeat top left;
		}
		
	/* = Content
	-------------------------------------------------------------------------- */

	#content{
	min-height:360px;
		}

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

	#footer{
		width:980px;
		position:relative;
		background:#FFF;
		height:200px;
		}
	
	#footer-top{
		background:url(../img/footer_top.gif) no-repeat top left;
		width:980px;
		height:20px;
		width: 100%;
		}
		
	#footer-bottom{
		background:url(../img/footer_bottom.gif) no-repeat top left;
		height:15px;
		float:left;
		width: 100%;
		}
	
	#footer-legal{
		width:980px;
		height:20px;
		margin:30px 0 0 0;
		color:#666666;
		font-size:0.9em;
		text-align:center;
		clear:both;
		}
		

/* = Typo #article
============================================================================== */
#article {
	padding:0 374px 32px 16px;
	position:relative;
	background:#FFFFFF;
}
#article h1{
	font-family:Tahoma, Arial, Helvetica, sans-serif;
	letter-spacing:normal;
	padding:8px 0;
}
#article h2{
	font-family:Tahoma, Arial, Helvetica, sans-serif;
	letter-spacing:normal;
	padding:10px 0px;
}
#article h3{
	font-family:Tahoma, Arial, Helvetica, sans-serif;
	letter-spacing:normal;
	padding:2px 0px;
}
#article span.small{
	font-size:0.8em;
}
#article p.right{
	text-align:right;
}
#article ul span.big,	
#article p span.big{	
	font-size:1.2em;
}
#article span.tel,
#article span.mail,
#article span.fax,
#article span.web{
	padding-left:16px;
	font-weight:bold;
	background-repeat:no-repeat;
}
#article p span.pastille{
	display:block;
	float:left;
	margin:0 0 -4px;
	padding:0 0 0 5px;
	height:17px;
	width:17px;
	background:transparent url(../img/bg_pastille_cure.png) no-repeat top left;
	font-weight:bold;
	color:#FFFFFF;
}
#article p span.plus{
	display:block;
	float:left;
	margin:0 0 -4px;
	padding:0 0 0 5px;
	height:17px;
	width:17px;
	background:transparent url(../img/picto_plus_cure.png) no-repeat top left;
	font-weight:bold;
	color:#FFFFFF;
}
#article p{
	color:#666;
	padding:2px 0px;
	margin:0;
	text-align:justify;
	line-height:1.4em;
}
#article ul{
	color:#666;
	margin:0;
	padding:2px 8px;
	list-style-position:inside;
}
#article ul li{
	margin:0.3em 0;
	text-align:justify;
}
#article hr {
	height: 1px;
	border:none;
	color:#CCCCCC;
	background:#CCCCCC;
	margin:16px 32px 8px 32px;
	clear:both;
}
#article table.tarifs{
	border-collapse:collapse;
	width:100%;
	margin:0 0 16px 0;
}
#article table.tarifs td{
	border-collapse:collapse;
	border:1px solid #FFFFFF;
	border-bottom-color:#DDDDDD;
	padding-top:8px;
}
#article .push{
	border:1px solid #999;
	padding:0 4px 16px;
	margin:16px;
	width:538px;
	font-size:0.8em;
}
#article #colonne .push{
	border:none;
	padding:0;
	margin:8px;
	width:auto;
	background:none;
	font-size:0.8em;
}
#article #colonne h2{
	letter-spacing:-0.02em;
}

#article.bien div.pack{
	diplay:block;
	position:relative;
	float:left;
	margin:0 0 16px 0;
	width:287px;
	height:243px;
	background:#E9DAFF;
	font-size:0.9em;
}
#article.bien div.pack h2{
	display:block;
	position:relative;
	margin:0;
	padding:4px;
	border-bottom:1px solid #BB9BEB;
	background:#D9BFFF url(../img/bg_pack_h2.png) no-repeat top center;
}
#article.bien div.pack.impair{
	margin:0 16px 16px 0;
}
#article.bien hr.hidden{
	margin:0;
	padding:0;
}
#article.bien div.pack p.right{
	display:block;
	position:absolute;
	padding:30px 0 0 16px;
	width:58px;
	height:38px;
	bottom:0;
	right:0;
	
	text-align:left;
	font-size:17px;
	background:transparent url(../img/bg_pack_price.png) no-repeat bottom right;
}
#article.bien div.pack p.right span.big{
	color:#d9bfff;
}

/* = Background et visuel #article, #colonne et .push
============================================================================== */
#article.cure{ background: transparent url(../img/bg_cure_1.png) repeat-y top right; }
#article.bien{ background: transparent url(../img/bg_bien.png) repeat-y top right; }
#article.sejour{ background: transparent url(../img/bg_sejour.png) repeat-y top right; }

#article.cure .push{
	border-color:#0C3E72;
	background-color:#165C88;	
	background-image:url(../img/bg_push_cure.jpg);
	background-repeat:no-repeat;
	background-position:center center;
}
#article.bien .push{
	border-color:#000000;
	background-color:#8c8c8c;	
	background-image:url(../img/bg_push_powerPlate.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	font-size:1em;
}
#article.bien .push *{
	color:#FFFFFF;
}
#article.bien .push h3,
#article.bien .push .big{
	color:#FF9900;
}
#article.bien .push table td{
	border-color:transparent transparent #DDDDDD;
}


#article.cure h1,
#article.cure h2,
#article.cure h3{
	color:#0291CB;
}
#article.bien h1,
#article.bien h2,
#article.bien h3{
	color:#7F5CB5;
}
#article.sejour h1,
#article.sejour h2,
#article.sejour h3{
	color:#DD7B22;
}

#article.cure #colonne .push *{color:#166EA5;}
#article.bien #colonne .push *{color:#FFFFFF;}
#article.sejour #colonne .push *{color:#DD7B22;}


#article.cure #colonne hr {color:#166EA5; background:#166EA5;}
#article.bien #colonne hr {color:#5D4A7A; background:#5D4A7A;}
#article.sejour #colonne hr {color:#DD7B22; background:#DD7B22;}

#article .push *{color:#FFFFFF;}

#article.cure span.tel{background-image:url(../img/picto_telephone_cure.png);}
#article.bien span.tel{background-image:url(../img/picto_telephone_bien.png);}
#article.sejour span.tel{background-image:url(../img/picto_telephone_sejour.png);}

#article.cure span.fax{background-image:url(../img/picto_fax_cure.png);}
#article.bien span.fax{background-image:url(../img/picto_fax_bien.png);}
#article.sejour span.fax{background-image:url(../img/picto_fax_sejour.png);}

#article.cure span.mail{background-image:url(../img/picto_mail_cure.png);}
#article.bien span.mail{background-image:url(../img/picto_mail_bien.png);}
#article.sejour span.mail{background-image:url(../img/picto_mail_sejour.png);}

#article.cure span.web{background-image:url(../img/picto_liens_cure.png);}
#article.bien span.web{background-image:url(../img/picto_liens_bien.png);}
#article.sejour span.web{background-image:url(../img/picto_liens_sejour.png);}

#article.cure #colonne span.tel{background-image:url(../img/picto_telephone_cure_col.png);}
#article.bien #colonne span.tel{background-image:url(../img/picto_telephone_bien_col.png);}
#article.sejour #colonne span.tel{background-image:url(../img/picto_telephone_sejour_col.png);}

#article.cure #colonne span.fax{background-image:url(../img/picto_fax_cure_col.png);}
#article.bien #colonne span.fax{background-image:url(../img/picto_fax_bien_col.png);}
#article.sejour #colonne span.fax{background-image:url(../img/picto_fax_sejour_col.png);}

#article.cure #colonne span.mail{background-image:url(../img/picto_mail_cure_col.png);}
#article.bien #colonne span.mail{background-image:url(../img/picto_mail_bien_col.png);}
#article.sejour #colonne span.mail{background-image:url(../img/picto_mail_sejour_col.png);}

#article.cure #colonne span.web{background-image:url(../img/picto_liens_cure_col.png);}
#article.bien #colonne span.web{background-image:url(../img/picto_liens_bien_col.png);}
#article.sejour #colonne span.web{background-image:url(../img/picto_liens_sejour_col.png);}

#article.cure ul span.big, #article.cure p span.big{color:#0291CB;}
#article.bien ul span.big, #article.bien p span.big{color:#9A72D8;}
#article.sejour ul span.big, #article.sejour p span.big{color:#0291CB;}

#article.cure span.plus{background-image:url(../img/picto_plus_cure.png);}
#article.bien span.plus{background-image:url(../img/picto_plus_bien.png);}
#article.sejour span.plus{background-image:url(../img/picto_plus_sejour.png);}


#article.cure a{color:#0291CB;}
#article.bien a{color:#7F5CB5;}
#article.sejour a{color:#C36A02;}

#colonne{
	position:absolute;
	width:358px;
	top:0;right:0;
}
#colonne img{
	margin:0;
	padding:0;
	display:block;
	position:relative;
}
/* = Navigation
============================================================================== */

	/* = Navigation home
	-------------------------------------------------------------------------- */
		
		#main-nav{
			position:absolute;
			right:20px;
			top:10px;
			margin:0px;
			padding:0px;
			width: 570px;
			height:120px;
			list-style: none;
			}
			
		#main-nav li {
			width: 190px;
			height: 50px;
			position: relative;
			float: left;
			}
			
		#main-nav a, #main-nav a:visited, #main-nav a, #main-nav a:hover {
			margin: 0 auto;
			width: 190px;
			height: 120px;
			text-indent: -9999px;
			overflow: hidden;
			background: url(../img/bg_navigation.png) no-repeat;
			display: block;
			position: relative;
			z-index: 2;
			}
			
		/* Sections */
		
		#main-nav li.button-color-1 a {
			background-position: 0px 0px;
			}
			
		#main-nav li.button-color-2 a {
			background-position: -190px 0px;
			}
			
		#main-nav li.button-color-3 a {
			background-position: -380px 0px;
			}


		/* = Navigation pages
		-------------------------------------------------------------------------- */
		
		#main-nav-page{
			position:absolute;
			right:20px;
			top:10px;
			margin:0px;
			padding:0px;
			width: 570px;
			height:120px;
			list-style: none;
			}
			
		#main-nav-page li {
			width: 190px;
			height: 50px;
			position: relative;
			float: left;
			}
			
		#main-nav-page a, #main-nav-page a:visited, #main-nav-page a, #main-nav-page a:hover {
			margin: 0 auto;
			width: 190px;
			height: 70px;
			text-indent: -9999px;
			overflow: hidden;
			background: url(../img/bg_navigation.png) no-repeat;
			display: block;
			position: relative;
			z-index: 2;
			}
			
		/* Sections */
		
		#main-nav-page li.button-color-1 a {
			background-position: 0px 0px;
			}
			
		#main-nav-page li.button-color-2 a {
			background-position: -190px 0px;
			}
			
		#main-nav-page li.button-color-3 a {
			background-position: -380px 0px;
			}
			
			
			
		/* = Subnav
		-------------------------------------------------------------------------- */
	
		#subnav{width:980px;height:125px;}
	
		#subnav.cure{		/*	Subnav color CURE THERMALE	*/
			background-color:#3c8fc3;
			}
		
		#subnav.bienetre{	/*	Subnav color BIEN ETRE	*/
			background-color:#5d4a7a;
			}
			
		#subnav.sejour{ 	/*	Subnav color SEJOUR	*/
			background-color:#ffb911;
			}
			
		#bloctitre{
			display:block;
			width:200px;
			height:75px;
			float:left;
			text-transform:uppercase;
			font-weight:bold;
			font-size:1.3em;
			padding:50px 0 0 30px;
			line-height:1.5em;
			}
		
		/* Couleur des titres */
		
		#bloctitre .cure-color1{color:#addefd;}
		#bloctitre .bienetre-color1{color:#c4a2f6;}
		#bloctitre .sejour-color1{color:#c36a02;}
		#bloctitre .color2{color:#FFFFFF;}		
		
		/* Liste des rubriques */
		
		
		#navigation{
			width:540px;
			height:100px;
			color:#FFFFFF;
			float:left;
			margin:10px 0 0 0;
			}
		
		#navigation ul{
			margin:0px;
			padding:0px;
			}
		
		/* Subnav Cure */
	
		
		ul.subnav-cure{
			overflow: hidden; 
			list-style-type : none;
			float:left;
			width:180px;
			}
		
		.subnav-cure li{
			overflow: hidden; 
			margin:0;
			padding:0;
			}
		
		.subnav-cure li.item1-cure{	/* Color Item 1 de la liste*/
			color:#addefd;
			font-weight:bold;
			text-transform:uppercase;
			display:block;
			margin:0 0 5px 0;
			}
			
		.subnav-cure li a{
			padding:0px 0px 0px 0px;
			color:#FFFFFF;
			text-decoration:none;
			display:block;
			font-size:0.9em;
			}
		
		.subnav-cure li a:hover{
			color:#addefd;
			}	
		
		/* Subnav Bienetre */
		
		
		ul.subnav-bienetre{
			overflow: hidden; 
			list-style-type : none;
			float:left;
			width:178px;
			}
		
		.subnav-bienetre li{
			overflow: hidden; 
			margin:0;
			padding:0;
			}
		
		.subnav-bienetre li.item1-bienetre{	/* Color Item 1 de la liste*/
			color:#c4a2f6;
			font-weight:bold;
			text-transform:uppercase;
			display:block;
			margin:0 0 5px 0;
			}
			
		.subnav-bienetre li a{
			padding:1px 0px 1px 0px;
			color:#FFFFFF;
			text-decoration:none;
			display:block;
			font-size:0.9em;
			}
		
		.subnav-bienetre li a:hover{
			color:#ddcbf8;
			}	
		
		/* Subnav Séjours */
	
		
		ul.subnav-sejour{
			overflow: hidden; 
			list-style-type : none;
			float:left;
			width:225px;
			}
		
		.subnav-sejour li{
			overflow: hidden; 
			margin:0;
			padding:0;
			}
		
		.subnav-sejour li.item1-sejour{	/* Color Item 1 de la liste*/
			color:#c36a02;
			font-weight:bold;
			text-transform:uppercase;
			display:block;
			margin:0 0 5px 0;
			}
			
		.subnav-sejour li a{
			padding:1px 0px 1px 0px;
			color:#FFFFFF;
			text-decoration:none;
			display:block;
			font-size:0.9em;
			}
		
		.subnav-sejour li a:hover{
			color:#c36a02;
			}	
				
		/* Eléments de navigation à droite */	
		
			
		#items-right{
			width:180px;
			height:80px;
			color:#c4a2f6;
			float:right;
			text-align:right;
			padding:20px 20px 0 0;
			line-height:1.5em;
			font-weight:bold;
			font-size:11px;
			}	
			
		#items-right ul{
			margin:0px;
			padding:0px;
			}
	
		#items-right li{
			overflow: hidden; 
			list-style-type : none;
			}

		ul.cure li a{display:block; color:#addefd; text-decoration:none;}
		ul.bienetre li a{display:block; color:#c4a2f6; text-decoration:none;}
		ul.sejour li a{display:block; color:#c36a02; text-decoration:none;}
	
		#items-right ul li a:hover{color:#FFFFFF;}
	
	
	
	
	
	
	
			
/* = Specifiques Eléments (div,...)
============================================================================== */

	/* = Footer (Bloc informations x3)
	-------------------------------------------------------------------------- */
	
		#offre-speciale{
			display:block;
			width:360px;
			height:140px;
			float:left;
			background:url(../img/bg_offres_speciales.png) no-repeat;
			margin-left:10px;
			}
		
		#offre-speciale .button{
			display:block;
			width:160px;
			height:20px;
			background:url(../img/bg_button.png) no-repeat top left;
			margin-left:130px;
			margin-top:100px;
			padding-left:10px;
			text-decoration:none;
			font-size:0.9em;
			color:#513F6E;
			line-height:1.8em;
			}
			
		#offre-speciale .button:hover{
			color:#FFFFFF;
			}
		
		#reservations-cure{
			display:block;
			width:310px;
			height:130px;
			float:left;
			background:url(../img/bg_reservation_cure.png);
			}
		
		#reservations-cure .button{
			display:block;
			width:160px;
			height:20px;
			background:url(../img/bg_button.png) no-repeat top left;
			margin-left:20px;
			margin-top:100px;
			padding-left:10px;
			text-decoration:none;
			font-size:0.9em;
			color:#FFFFFF;
			background-position:-170px;
			line-height:1.8em;
			}
		
		#reservations-cure .button:hover{
			color:#e0ee9d;
			}
			
		#reservations-bienetre{
			display:block;
			width:310px;
			height:130px;
			float:left;
			background:url(../img/bg_reservation_bienetre.png);
			}
		
		#reservations-bienetre .button{
			display:block;
			width:160px;
			height:20px;
			background:url(../img/bg_button.png) no-repeat top left;
			margin-left:20px;
			margin-top:100px;
			padding-left:10px;
			text-decoration:none;
			font-size:0.9em;
			color:#FFFFFF;
			background-position:-170px;
			line-height:1.8em;
			}
		
		#reservations-bienetre .button:hover{
			color:#e0ee9d;
			}

	
		#informations{
			display:block;
			width:290px;
			height:130px;
			float:left;
			background:url(../img/bg_infos.png);
			list-style: none;
			}
		
		#informations ul{
			margin:55px 30px 0 20px;
			padding:0px;
			list-style:none;
			}
		
		#informations li{
			background-color:transparent;
			padding: 0 0 1px 0;
			color:#FFFFFF;
			}

		#informations li a {
			display: block;
			color: #FFFFFF;
			text-decoration: none;
			margin-left:0px;
			font-size:0.9em;
			}
		
		#informations li a:hover {
			display: block;
			color: #e1d8ef;
			text-decoration: none;
			}

  /* = Specifiques classes
============================================================================== */
 
 		#retour-accueil{
			display             : block;
			margin-left         : 20px;
			width               : 340px;
			height              : 120px;
			}
			
		#bloc-infos{
		background-color:#ACDEFD;
		padding: 5px;
		margin: 10px 0;
		}
		
 		#tarifs{
		 display: block;
		 float: left;
		 font-size: 16px;
		 font-weight: bold;
		 margin: 10px 0 0;
		 width: 80px;
		}
 
 
/***** Headings *****/
 
h1, h2, h3, h4, h5, h6 {
margin:0;
padding:0;
font-weight:normal;
}
 
h1 {
padding:30px 0 25px 0;
letter-spacing:-1px;
font-size:2em;
}
 
h2 {
padding:20px 0;
letter-spacing:-1px;
font-size:1.5em;
}
 
h3 {
font-size:1em;
font-weight:bold;
}
 
/***** Common Formatting *****/
 
 
img {
border:0;
}
 
sup {
position:relative;
bottom:0.3em;
vertical-align:baseline;
}
 
sub {
position:relative;
bottom:-0.2em;
vertical-align:baseline;
}
 
 
/***** Links *****/
 
a,
a:link,
a:visited,
a:hover {
text-decoration:underline;
}
 
 
#article.bien a.btn-boutique{
  background: url("../img/bg-btn-boutique.png") no-repeat scroll left top transparent;
    color: #fff;
    display: block;
    font-size: 14px;
    height: 38px;
    padding-left: 8px;
    padding-top: 5px;
    text-transform: uppercase;
    width: 176px;
    text-decoration:none;
    font-weight:bold;
    float:right;
    margin-left:15px;
    margin-bottom:15px;
    margin-top:15px;
}

#article.bien a.btn-boutique:hover{
  background-position:left -43px;
}

#article.bien a.btn-boutique span {
display:block;
text-transform:none;
font-weight:normal;
color:#DCCBE0;
font-size:15px;
}
 
/***** Forms *****/
 
form {
margin:0;
padding:0;
display:inline;
}

fieldset{
	border:none;
}

input, select, textarea {
font:1em Arial, Helvetica, sans-serif;
}
input{
	margin:0 0 8px 0;
}
form div{
	clear:both;
}
 
textarea {
width:100%;
height:200px;
line-height:1.25;
}
 
label {
display:block;
float:left;
cursor:pointer;
width:107px;
	padding:0 0 8px 0;
}
label.error {
	float:right;
	width:274px;
}

#loading{
	display:none;
}
#btn-envoi-frm{
	text-align:right;
}

#footer-legal a:link, #footer-legal a:visited{
color:#666666;
text-decoration:none;
}

#footer-legal a:hover{
text-decoration:underline;
}
 
/***** Global Classes *****/
 
.clear         { clear:both; }
.float-left    { float:left; }
.float-right   { float:right; }
 
.text-left     { text-align:left !important; }
.text-right    { text-align:right !important; }
.text-center   { text-align:center; }
.text-justify  { text-align:justify; }
 
.bold          { font-weight:bold; }
.italic        { font-style:italic; }
.underline     { border-bottom:1px solid; }
.highlight     { background:#ffc; }
 
.img-left      { float:left;margin:4px 10px 4px 0; }
.img-right     { float:right;margin:4px 0 4px 10px; }
 
.nopadding     { padding:0; }
.noindent      { margin-left:0;padding-left:0; }
.nobullet      { list-style:none;list-style-image:none; }

