/* css document */

/*************************************************************/
/****** CLUBAVENTURE V3 - home page | TOURISPORT COMPANY *****/
/*************************************************************/

/* NOTES:

- Les "_" devant certaines r�gles css indiquent que la r�gle est sp�cifique � IE6; cela peremt d'�viter d'avoir recours � des r�gles conditionnelles.

*/

* {
	margin:0;
	padding:0;
}

/************** REDEFINITION ************************************/
/**************     DE       ************************************/
/**************   BALISES    ************************************/

body {
	background:#F6F3E9;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
}

a {
	text-decoration:none;
	color:#000;
}

a:hover {
	text-decoration:underline;
}

/**************************************************/
/**************** STRUCTURE *********************/
/*************************************************/

/* NOTE: Cette partie de CSS ne g�re que le positionnement CSS des �l�ments de la home page */


/** Conteneur global **/
#global {
	background:#fff;
	width:920px;
	margin:0 auto; /* centre le conteneur principal */
	position:relative;
}

/** Gestion des news **/
#promo {
	background:#fff url(../images/home-v3/bg_global.png) repeat-x top;
	height:290px;
	margin:0 auto 10px auto; /* cr�e un espace blanc de s�paration entre le caroussel et la suite du contenu du site */
	padding:10px 10px 0 10px; /* fixe le remplissage pour qu'il soit identique sous tous les navigateurs*/
	position:relative;
	width:900px;
	z-index:0;
}
div#selectionVoyage {
	background:url(../images/home-v3/bg_selectionVoyages.png) repeat-x bottom;
	margin:0 0 5px 0;
}

/** Blocs � gauche **/
#recherche {
	height:230px;
	width:310px;
	float:right; /* pour que le bloc se positionne a gauche */
	padding:0px;
	margin:0 15px 0 0;
	clear:both; /* pour faire en sorte que le bloc suivant s'aligne en dessous de celui ci*/
	_margin:0 5px 0 0;
	_width:320px
}

#offres-speciales {
	background:url(../images/home-v3/fond-offres-speciales.png) no-repeat left top;
	height:40px;
	width:165px;
	float:left;
}


/**************************************************/
/****************** BLOCS ************************/
/*************************************************/

/***************** Bloc Recherche *****************/

#recherche select, #recherche input {
	background-color:#F2F2F2;
	border:none;
	font-size:10px;
}

#recherche select#mois_rpd {margin:5px 10px 0 0;}

#recherche div.fieldset {
	margin:0;
	padding:0;
}

#recherche div.fieldset {
	color:#42210B;
	margin:0;
	padding:0;
}

#recherche h2 {
	margin:0;
	padding:0;
	*margin:0;
	_margin:0;
}

#recherche p {
	margin:15px 0 0 0;
	padding:0;
}

.choix-destinations {
	width:135px;
	margin:0 20px 0 0;
}

.choix-pays {
	width:135px;
}

a.recherche-detaillee {
	color:#141F34;
	display:block;
	font-weight:bold;
	margin:10px 0 0 180px;
	text-decoration:underline;
}

a.resultat-recherche {
	background:#EC6E00;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	float:right;
	font-weight:bold;
	color:#FFFFFF;
	text-decoration:none;
	margin: 0px 4px 0 0px;
	line-height:12px;
	display:block; /* transforme la balise en ligne en balise bloc pour pouvoir le positionner */
	padding:5px 10px;
	width:100px;
	text-align:center;
	text-transform:uppercase;
	/* IE6 Specific Style */
	_margin:0 10px 0 0;
}

a.resultat-recherche:hover {
	background:#CF6100;
}

form#ptiblocrecherche {
	border:1px solid #B4B381;
	padding:0px 5px 5px 5px;
}

form#ptiblocrecherche h2 {
	margin:5px 0 10px 0;
	padding:0;
}

form.code-voyage {
	color:#42210B;
	font-style:italic;
	font-size:9px;
	padding:0;
}

input.champs-code-voyage {
	width:65px;
	font-size:9px;
	border:1px solid #fff;
	margin:0 5px 0 5px;
	padding:2px 5px;
}

/*#recherche input.bouton_ok {
	background:url(../images/home-v3/recherche-ok.png) no-repeat;
	border:none;
	color:#fff;
	font-size:9px;
}*/

#recherche input.bouton_ok {
	padding:1px 2px;
	font-size:9px;
	color:#fff;
	border:1px solid #fff;
	background-color: #EC6E00;
}

/***************** Bloc Offres sp�ciales *****************/

div#offresSpeciales{
	border:1px solid #B4B381;
	margin:5px 0;
	padding:5px;
	width:298px;
	_margin:5px 0 2px 0;
	_width:308px;
}

div#offresSpeciales h2{
	margin:0 0 5px 0;
}

ul.liste-offre-speciale {
	margin:0;
	padding:0;
}

ul.liste-offre-speciale li {
	border:1px solid #8F7C72;
	display:block; /* transforme la balise en ligne en balise bloc pour pouvoir le positionner */
	float:left;
	list-style-type:none;
	margin:2px 5px;
	padding:2px;
	text-align:center;
	width:133px;
}

ul.liste-offre-speciale li a {
	color:#EC6E00;
	font-size:9px;
	text-decoration:none;
	text-transform:uppercase;
	font-weight:bold;
}

ul.liste-offre-speciale li a:hover {
	color:#ff8500;
}




/*************** Colonne 1 ****************/

div#col1{
	background:#EEE9D6;
	/*border:1px solid #D1CDB6;*/
	float:left;
	margin:0 0 0 10px;
	width:205px;
}

div#col1 .entete{
	background:url(../images/home-v3/titres/les-choix-de-david.jpg) no-repeat center top;
	height:110px;
}

div.intro{
	border-left:1px solid #D1CDB6;
	border-right:1px solid #D1CDB6;
	padding:5px 15px;
}

	div#col1 .intro h3{
		color:#92272D;
		font-size:16px;
		line-height:19px;
		margin:0 0 3px 0;
	}
	
	div#col1 .intro h4{
		color:#92272D;
		font-size:11px;
		font-weight:bold;
		margin:0 0 5px 0;
	}

div#col1 ul {
	border-left:1px solid #D1CDB6;
	border-right:1px solid #D1CDB6;
	border-bottom:1px solid #D1CDB6;
	list-style:none;
	padding:10px 15px 5px 15px;
}

	div#col1 ul li{
		margin:0 0 10px 0;
	}

	div#col1 ul img {
		border: 0;
		float:left;
		margin:0 10px 0 0;
	}

	div#col1 ul li a span.choixPays{
		color:#92272D;
		display:block;
		font-size:10px;
		font-weight:bold;
		line-height:12px;
		margin:0 0 5px 33px;
		text-transform:uppercase;
	}
	
	div#col1 ul li a span.choixVoyage{
		color:#000;
		display:block;
		font-size:9px;
		font-weight:bold;
		margin:0 0 0px 33px;
		text-transform:uppercase;
	}
	
	div#col1 ul li a span.choixContenu{
		display:block;
		margin:0 0 0 33px;
	}

	div#col1 ul span.prix {
		font-size:14px;
		font-weight:bold;
		line-height:12px;
	}

/*************** Colonne 2 ****************/

div#col2{
	background:#fff;
	float:left;
	margin:15px 0 0 0;
	padding:0 25px;
	width:395px;
}

div#col2 h2{
	border-bottom:1px solid #999;
	padding:0 0 15px 0;
}

div#col2 ul li{
	border-top:1px solid #999999;
	clear:both;
	height:70px;
	list-style-type:none;
	margin:0 0 5px;
	padding:10px 0;
}

div#col2 ul li.last{
	border:none;
	clear:both;

}

div#col2 ul li span.imageActu{
	display:block;
	float:left;
	height:80px;
	margin:0 5px 0 0;
	width:80px;
	overflow:hidden;
}

div#col2 ul li span.imageActu a img{
	border:none;
	color:none;
	display:inline;
	margin:0!important;
	padding:0!important;
	width:80px;
}

div#col2 p{
	line-heigth:12px;
	margin:0 0 0 85px;
}

span.categorie{
	font-size:9px;
	font-weight:bold;
	line-height:12px;
	text-transform:uppercase;
}

span.titreActu {
	color:#801D23;
	font-size:11px;
	font-weight:bold;
	line-height:13px;
	padding:0 0 0 5px;
}

p.actuContent{
	height:38px;
	margin:0!important;
	overflow:hidden;
}

div#col2 a{
	color:#A28058;
	text-decoration:none;
}

a.actu{
	border-bottom:2px solid #999;
	color:#000!important;
	display:block;
	text-align:right;}
/*************** Colonne 3 ****************/

div#col3{
	float:left;
	margin:15px 0 10px 0;
	width:250px;
}

div.publicite{
	background:#fff;
	border:1px solid #D1CDB6;
	margin:0 0 10px 0;
	padding:10px;
}

div.publicite a img{
	border:none;
}

div#pub1{

}

div#pub1 a{
	display:block;
}

div#pub2 {
	height:105px;
	margin:15px 0 0 0;
}

div#pub2 a{
	display:block;
}

a.facebook{
	background:url(../images/home-v3/facebook.png) no-repeat left top;
	display:block;
	height:20px;
	line-height:20px;
	text-indent:30px;
	text-transform:uppercase;
}

/*************** Bloc onglets d�couverte offre de voyage ****************/

#onglet {
	width:900px;
	margin:15px auto 0 auto;
}

div.simpleTabs { 
	background:#D1CDB6;
}

ul.simpleTabsNavigation {  
	background:url(../images/home-v3/fond-li-onglet.png) repeat-x center top;
	height:27px;
	padding:0; 
	text-align:center;
}

ul.simpleTabsNavigation li {
	list-style:none; 
	display:block; 
	float:left;
	height:33px;
	margin:0; 
	padding:0;
	_width:223px;
}

ul.simpleTabsNavigation li:hover { 
	/*background:url(../images/home-v3/onglet-violet.png) no-repeat center bottom;*/
}

ul.simpleTabsNavigation li a {
	color:#3D3632;
	display:block;
	height:24px;
	padding:5px 28px; 
	font-size:11px; 
	font-weight:bold;
	text-decoration:none;
	text-transform:uppercase;
	_font-size:10px;
	_padding:5px 0;
}

ul.simpleTabsNavigation li a:hover { 
	background:#895770 url(../images/home-v3/fond-li-onglet-hover.png) no-repeat center top;
	color:#fff;
	text-decoration:none;
}

ul.simpleTabsNavigation li a.current {
	background:#895770 url(../images/home-v3/fond-li-onglet-hover.png) no-repeat center top;
	text-decoration:none;
	color:#fff;
}

div.simpleTabsContent {
	padding:10px 5px 10px 10px;
	margin:0 0 10px 0; 
	display:none;
}

div.simpleTabsContent.currentTab { 
	display:block; 
}

.simpleTabsContent p {
	padding:0 10px;
}

.simpleTabsContent .home-tab {
	margin:0 20px 0 0 !important;
	padding:0 !important;
	color:#fff;
	float:left;
	width:200px;
	_margin:0;
}

.home-tab h3 {
	margin:0;
	padding:0;
}

.home-tab span.h4 {
	color:#782E3F;
	display:block;
	font-size:12px;
	font-weight:bold;
	line-height:14px;
	margin:15px 0 5px 0;
}

.home-tab ul {
	list-style-type:none;
}

.home-tab a {
	display:block;
	font-size:10px;
	line-height:12px;
	margin:0 0 10px 0;
	padding:0 10px;
	text-decoration:none;
}

/**************************************************/
/****************** ROTATOR ***********************/
/**************************************************/

* ---------------------------------------------------- */
/* SLIDESHOW
/* ---------------------------------------------------- */
#slideshow {
	width: 900px !important;
	height:330px !important;
	z-index:0;
}

#slideshow ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	height: 1%; /* IE fix */
}

#slideshow ul:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
}            

/* ---------------------------------------------------- */
/* SLIDESHOW > SLIDES
/* ---------------------------------------------------- */
#slideshow .slides {
	background: url(../images/home-v3/bg_slide-carrousel.png) no-repeat right top;
	overflow: hidden;
	width: 900px!important;
	height:290px !important;
}

#slideshow .slide-nav ul {
}

#slideshow .slides li {
	height:290px !important;
	width: 650px!important;
	float: left;

}

/* ---------------------------------------------------- */
/* SLIDESHOW > NAVIGATION
/* ---------------------------------------------------- */
#slideshow .slides-nav {
	float:right;
	font-size:11px;
	height:30px !important;
	padding:0 0 0 5px;
	width:230px !important;
	z-index:100;
}

#slideshow .slides-nav li {
	background:#005573;
	border-bottom:1px solid #3F3E3B;
	border-radius:5px;
	cursor:pointer;
	float:left;
	height:10px !important;
	margin:15px 5px 0 0;
	width:20px !important;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}

#slideshow .slides-nav li a {
	cursor:pointer;
	display: block;
	margin:0 auto;
	/*padding: 7px;*/
	outline: none;
	color:#fff;
	text-decoration:none;
}

#slideshow .slides-nav li.on,
#slideshow .slides-nav li.on a {
	background:#91927B !important;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}

#slideshow .slides-nav li:hover,
#slideshow .slides-nav li.on a:hover {
	/*background:url(../images/caroussel/nav-hover.gif) repeat-x;*/
}

ul.slides-nav span img {
	float:left;
	border:1px solid #000;
	margin:0 7px 25px 0;
}

span.content{
	line-height:12px;
}

/* Background Images */

#slideshow #slide-one {
	background:transparent url(../images/caroussel/avant-premieres-2.jpg) no-repeat top right;
	z-index:1;
}

#slideshow #slide-two {
	background:transparent url(../images/caroussel/egypte.jpg) no-repeat top left;
	z-index:1;
	/*padding:15px 15px 15px 480px;
	_padding:15px 15px 15px 470px;*/
}

#slideshow #slide-three {
	background:transparent url(../images/caroussel/jordanie.jpg) no-repeat top left;
	z-index:1;
	/*padding:15px 15px 15px 480px;
	_padding:15px 15px 15px 470px;*/
}

#slideshow #slide-four {
	background:transparent url(../images/caroussel/maroc.jpg) no-repeat top left;
	z-index:1;
	/*padding:15px 15px 15px 480px;
	_padding:15px 15px 15px 470px;*/
}

#slideshow .contenu {	
	/*background:url(../images/caroussel/transparent_bg.png) repeat;*/
	padding:10px 20px 20px 20px;
	height:220px;
	width:210px;
	position:absolute;
	left:650px;
	top:40px;
	z-index:10000;
}

#slideshow .contenu-animation {	
	margin:0 auto;
	text-align:center;
}

#slideshow .contenu h2 {	
	color:#fff;
	font-style:italic;
	font-family: "Trebuchet MS",Trebuchet,Arial,Verdana,sans-serif;
	font-size:19px;
	line-height:22px;
}

#slideshow .contenu h3 {	
	color:#B2B493;
	font-size:12px;
	line-height:120%;
	margin:0 0 10px 0;
	text-transform:uppercase;
}

#slideshow .contenu p {	
	color:#B2B493;
	font-family: "Trebuchet MS",Trebuchet,Arial,Verdana,sans-serif;
	font-size:11px;
	font-weight:bold;
	line-height:18px;
	margin:5px 0;
}

#slideshow span.prix{
	color:#fff;
	display:block;
	margin:15px 0 0 0;
}

#slideshow span.prix strong{
	color:#fff;
	font-family:"Trebuchet MS";
	font-size:20px;
	font-weight:normal;
}

#slideshow .contenu a {	
	background:#EC6E00;
	bottom:20px;
	color:#fff;
	font-size:10px;
	padding:2px 5px;
	position:absolute;
	text-decoration:none;
	text-transform:uppercase;
}

#slideshow .contenu a:hover {	
	background:#FF7800;
}

.zone-url {
	background: transparent url(../images/caroussel/degrad.png) repeat-y right;
	display:block;
	position:absolute;
	top:0;
	left:0;
	height:290px;
	width:650px;
	_background:none;
}

/** Liens kaleidoscope ***/

.kalei-1 {
	background:url(../images/caroussel/kaleidoscope/madere2.jpg) no-repeat center top;
	display:block;
	position:absolute;
	top:20px;
	left:120px;
	height:155px;
	width:160px;
}

.kalei-1:hover {
	background:url(../images/caroussel/kaleidoscope/madere2-hover.jpg) no-repeat center top;
}

.kalei-2 {
	background:url(../images/caroussel/kaleidoscope/canaries.jpg) no-repeat center top;
	display:block;
	position:absolute;
	top:20px;
	left:325px;
	height:155px;
	width:160px;
}

.kalei-2:hover {
	background:url(../images/caroussel/kaleidoscope/canaries-hover.jpg) no-repeat center top;
}

.kalei-3 {
	background:url(../images/caroussel/kaleidoscope/italie-sicile.jpg) no-repeat center top;
	display:block;
	position:absolute;
	top:20px;
	left:520px;
	height:155px;
	width:160px;
}

.kalei-3:hover {
	background:url(../images/caroussel/kaleidoscope/italie-sicile-hover.jpg) no-repeat center top;
}

.kalei-4 {
	background:url(../images/caroussel/kaleidoscope/tunisie.jpg) no-repeat center top;
	display:block;
	position:absolute;
	top:175px;
	left:286px;
	height:155px;
	width:160px;
}

.kalei-4:hover {
	background:url(../images/caroussel/kaleidoscope/tunisie-hover.jpg) no-repeat center top;
}

.kalei-5 {
	background:url(../images/caroussel/kaleidoscope/argentine.jpg) no-repeat center top;
	display:block;
	position:absolute;
	top:175px;
	left:486px;
	height:173px;
	width:160px;
}

.kalei-5:hover {
	background:url(../images/caroussel/kaleidoscope/argentine-hover.jpg) no-repeat center top;
}          

/**************************************************/
/****************** CLASSES ***********************/
/**************************************************/

/*** Classes g�n�rales ***/

.clear {clear:both;} /* classe clear utilis�e pour "remettre" des elements flottants dans le flux*/

.lien-orange { 
	/* Lien qui s'aligne � droite*/
	text-decoration:none;
	color:#E8841E;
	font-size:9px;
	margin:0 0 0 100px
}

.lien-orange:hover { 
	text-decoration:underline;
}

.lien-en-savoir-plus {
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	text-decoration:none;
	color:#fff;
	background:#EC6E00;
	width:135px;
	height:13px;
	padding:5px;
	font-size:10px;
	line-height:10px;
	text-transform:uppercase;
	text-align:center;
}
.lien-en-savoir-plus:hover {
	background:#CF6100;
	text-decoration:none;
}

.img-gauche {
	float:left;
	margin:5px 5px 10px 5px;
}

/**************************************************/
/****************** FONTS ************************/
/*************************************************/

h1, h2 {
	margin:0;
	padding:0;
}

/**************************************************/
/*********** STYLE TEMPORAIRE ALSOLIA *************/
/**************************************************/
a.lien-logo {border:none;float:left;margin:7px 10px 0px 10px;}

a.lien-alsolia {color:#E25A24;display:block;font-size:13px;font-weight:bold;margin:10px 0 0 0;text-decoration:none;}

div#alsolia{
	color:#869559;
	margin:20px auto;
	text-align:justify;
	width:900px;
}

	div#alsolia p{
		margin:0 0 10px 0;
	}
	
span.mensu{
	background:transparent url(../images/caroussel/btn_mensualites_alsolia.png) no-repeat center top;
	display:block;
	font-family:"Trebuchet MS";
	font-size:14px;
	font-weight:bold;
	height:23px;
	line-height:23px;
	margin:15px 0 0 0;
	padding:0 5px 0 0;
	text-align:right;
	width:201px;
}
	span.mensu sup{
		font-size:10px;
		line-height:20px;
		vertical-align:top;
	}
	
	span.asterisque{font-family:verdana;}

/**************************************************/
/*********** STYLE ONGLETS ************************/
/**************************************************/
.ui-tabs {}
.ui-tabs .ui-tabs-nav { list-style: none; position: relative;}
/*.ui-tabs .ui-tabs-nav li { position: relative; float: left; border-bottom-width: 0 !important; padding: 0; }
.ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; }*/
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
 	background:#895770 url(../images/home-v3/fond-li-onglet-hover.png) no-repeat center top;
	color:#fff;
	text-decoration:none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; background: none; }
.ui-tabs .ui-tabs-hide { display: none !important; }