@import url('http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700');
@import url('http://fonts.googleapis.com/css?family=Open+Sans:400,700');


/*******************************************************************************************/
/************************************* COMMUN ************************************************/
/*******************************************************************************************/
body{
	padding: 0px;
	margin: 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.home 
{
	background: #223f5d;
}
.memoContent{
	padding: 0px;
	margin: 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	width: 986px;
}
a{
	text-decoration: none;
}
.center{
	width: 986px;
	margin: 0 auto;
	position: relative;
	background: transparent;
}
img{
	border:none;
}
h2{
	color: #eff1f2;
	font-weight: 700;
	text-transform: uppercase;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 26px;
	background: transparent;
}

#header{
	background: url(../MEMOimages/header_home.png) top center no-repeat;
	height: 86px;
	width: 100%;
	position: absolute;
	top: 100px;
	left: 0px;
	z-index: 500;
}
#logo {
	float: left;
}
#navigation{
	float: right;
	width: 675px;
	padding-top: 25px;
}
#navigation ul, #navigation ul li{
	margin: 0px;
	padding: 0px;
}
#navigation ul li{
	list-style: none;
}
#navigation ul li a{
	display: block;
	float: left;
	font-weight: 700;
	font-size: 18px;
	color: #373e42;
	text-transform: uppercase;
	font-family: 'Open Sans Condensed', sans-serif;
	padding: 7px 20px 0px 20px;
	height: 32px;
	background: url(../MEMOimages/nav_separateur.gif) left center no-repeat;
}#navigation ul li a:hover, #navigation ul li a.selected{
	color: #2f8fc3;
}
#navigation ul li:first-child a{
	background: none;
}
.content{
	padding-bottom: 0px;
}

.content h2{
	color: #eff1f2;
	font-weight: 700;
	text-transform: uppercase;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 26px;
	background: transparent;
}



/*******************************************************************************************/
/************************************* HOME ************************************************/
/*******************************************************************************************/

.home .moteur{
	background: url(../MEMOimages/moteur.png) top center no-repeat;
	height: 84px;
	width: 100%;
	margin-top: -35px;
	position: relative;
}

.blc_droit 
{
	background: #223f5d;
}

.zone_circuit{
	float: left;
	width: 476px;
	position: relative;
	background: #223f5d;

}

.zone_circuit .bt_all{
	position:absolute;
	top: 33px;
	right: 0px;
	color: #9daab6;
	font-size: 14px;
	font-weight: 700;
}.zone_circuit .bt_all:hover{
	color: #eff1f2;
}

.circuit 
{
    background: #eff1f2;
}

.circuit .detail{
	float:left;
	width: 264px;
	height: 116px;
	background: #eff1f2;
	overflow: hidden;
	padding-left: 15px;
	margin: 0;
	padding-top: 15px;
}
.circuit .detail .title{
	font-weight: 400;
	color: #206EAE;
	font-size: 16px;
	font-family: 'Open Sans', sans-serif;
	margin: 0px 0px 5px 0px;
	display: block;
}.circuit .detail .title:hover{
	color: #51B1E6;
}
.circuit .detail span{
	display: block;
	width: 65px;
	float: left;
	font-weight: 700;
	font-size: 10px;
	color: #474848;
	line-height: 10px;
	padding-left: 23px;
}
.circuit .detail .calendrier{
	background: url(../MEMOimages/picto_calendrier.png) center left no-repeat;
}
.circuit .detail .etiquette{
	background: url(../MEMOimages/picto_etiquette.png) center left no-repeat;
	margin-left: -8px;
}
.circuit .detail .perso{
	background: url(../MEMOimages/picto_perso.png) center left no-repeat;
	margin-left: 8px;
}
.circuit .detail .description{
	margin-top: 5px;
	padding-top: 5px;
	border-top: 1px solid #e1e3e4;
	color: #9d9e9e;
	line-height: 10px;
	font-size: 10px;
}
.circuit .visuel{
	float: right; 
	position: relative;
}
.circuit .visuel .masque{
	display: block;
	position: absolute;
	width: 48px;
	height: 131px;
	top: 0px;
	left: -1px;
	background:url(../MEMOimages/citcuit_masque.png);
}
.selection{
	float: left;
	width: 420px;
	height: 23px;
	background:url(../MEMOimages/circuit_selection.jpg) top left no-repeat;
	color: #3f4347;
	font-size: 12px;
	padding: 9px 0px 0px 56px;
}.selection span{
	color: #f0f4f4;
	font-weight: 700;
}
.selection:hover{
	color: #f0f4f4;
}.selection:hover span{
	color: #3f4347;
}

.zone_themes{
	position: relative;
	width: 475px;
	float: left;
	margin-left: 35px;
    background: #223f5d;

}
.zone_themes .bt_all{
	position:absolute;
	top: 33px;
	right: 0px;
	color: #9daab6;
	font-size: 14px;
	font-weight: 700;
}.zone_themes .bt_all:hover{
	color: #eff1f2;
}
.slider_theme{
	position: relative;
}
.slider_theme .theme_description{
	position: absolute;
	bottom: 20px;
	right: 30px;
	width: 260px;
	text-align: right;
	font-size: 14px;
	color: #1f3305;
}
.slider_theme #left{
	position: absolute;
	top: 30px;
	right: 60px;
	background: url(../MEMOimages/left_right.png) 0px 0px no-repeat;
	width: 20px;
	height: 20px;
	cursor: pointer;
}
.slider_theme #right{
	position: absolute;
	top: 30px;
	right: 30px;
	background: url(../MEMOimages/left_right.png) 0px -20px no-repeat;
	width: 20px;
	height: 20px;
	cursor: pointer;
}

#presentation{
	float: left;
	width: 470px;
	text-align: justify;
	font-size: 14px;
	color: #eff1f2;
	margin: 40px 0px 0px 35px;
    background: #223f5d;

}
#zone_temoignage{
	float :left;
	width: 207px;
	height: 293px;
	background:url(../MEMOimages/bulle_temoignage.jpg) bottom left no-repeat;
	margin: 40px 0px 0px 13px;
	position: relative;
    background-color: #223f5d;
}
#zone_temoignage h3{
	position: absolute;
	top: 0px;
	right: 0px;
	font-size: 20px;
	color: #51b1e6;
	font-weight: 300;
	margin: 0px;
	font-family: 'Open Sans', sans-serif;
	text-transform: uppercase;
}
#zone_temoignage .temoignage{
	position: absolute;
	top: 60px;
	left: 50px;
	
	width: 138px;
	height: 127px;
	overflow: hidden;
	text-align: center;
	
	color: #eff1f2;
	font-size: 11px;
	font-weight: 700;
	font-style: italic;
}
#zone_temoignage .temoignage span{
	color: #13608a;
	font-size: 16px;
}

#zone_temoignage .bt_learn_more{
	position: absolute;
	right: 0px;
	bottom: 10px;
	color: #eff1f2;
	font-size: 14px;
	font-weight: 700;
	text-shadow: 0px 0px 2px #000000;
    filter: dropshadow(color=#000000, offx=0, offy=0);
	opacity: 0.6;
}#zone_temoignage .bt_learn_more:hover{
	opacity: 1;
}

.zone_map{
	background:url(../MEMOimages/zone_map.jpg) top center no-repeat;
	height: 538px;
	position: relative;
}
.zone_map .bt_map{
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -164px;
	margin-top: -164px;
	background: url(../MEMOimages/bt_map.png) 0px 0px no-repeat;
	height: 328px;
	width: 328px;
}.zone_map .bt_map:hover{
	background-position: 0px -328px;
}




/*******************************************************************************************/
/************************************* PAGE CMS / lieu *************************************/
/*******************************************************************************************/
.page .content{
	margin-top: 70px;
}.page .content2{
	margin-top: 0px;
}
.page .moteur{
	background: url(../MEMOimages/moteur_2.png) top center no-repeat;
	height: 100px;
	width: 100%;
	position: relative;
	top: -6px;
}
.page .content .center{
	background: #ffffff;
	padding-bottom: 0px;
}
.page .content2 .center{
	background: #ffffff;
	padding-bottom: 0px;
}
.page .moteur #where{
	top: 33px;
}
.page .moteur .field{
	top: 33px;
}

.page .moteur #submit{
	top: 38px;

}

#breadcrum{
	padding: 0px 0px 0px 10px;
	color: #13608a;
	
}
#breadcrum a{
	color: #13608a;
}#breadcrum a:hover{
	color: #51b1e6;
}


#lieu .zone_title{
	padding-left: 10px;
	width: 976px;
	float: left;
	position:relative;
}#lieu .zone_title .bt_autres_lieux{
	position: absolute;
	top: 20px;
	right: 10px;
	font-weight: 700;
	color: #373e42;
	font-family: 'Open Sans Condensed', sans-serif;
}#lieu .zone_title .bt_autres_lieux:hover{
	color: #51b1e6;
}
#lieu .col_gauche{
	float: left;
	width: 492px;
}

.lieu_slider{
	height: 400px;
}

.lieu_slider .miniatures img{
	margin: 3px;
}

#lieu .description{
	padding: 10px 25px;
	color: #3f4347;
}
#lieu h3{
	color: #000000;
	font-size: 24px;
	font-family: 'Open Sans Condensed', sans-serif;
	margin: 10px 0px;
}
#lieu .historique{
	padding: 10px 25px;
	color: #3f4347;
}

#lieu .col_gauche ul li{
	list-style: none;
	display: block;
	background: url(../MEMOimages/etoile.gif) center left no-repeat;
	padding-left: 30px;
	margin: 10px 0px 20px 0px;
}

#lieu .temoignage{
	padding: 10px 25px;
	position: relative;
}
#lieu .temoignage .commentaire{
	background: #51b1e6;
	color: #ffffff;
	font-style: italic;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	padding: 20px 60px;
	width: 180px;
	margin-left: 130px;
	position: relative;
	margin-bottom: 30px;
}
#lieu .temoignage .avis{
	position: absolute;
	right:0px;
	top: 27px;
	color: #373e42;
	text-decoration: underline;
}
#lieu .temoignage .commentaire span{
	display: block;
	width: 97px;
	height: 22px;
	background: url(../MEMOimages/commentaire.gif);
	position: absolute;
	bottom: -22px;
	left: 10px;
}
#lieu .temoignage .name{
	color: #2890c9;
	font-weight: 700;
}
#lieu .col_droite{
	float: left;
	width: 493px;
}
#lieu .itineraire{
	padding: 0px 25px 10px 25px;
	color: #666f77;
}
#lieu .itineraire a{
	color: #666f77;
}#lieu .itineraire a:hover{
	color: #51B1E6;
}
#lieu .itineraire h3{
	color: #13608a;
	font-size: 24px;
	font-family: 'Open Sans Condensed', sans-serif;
}
#lieu .col_droite ul li{
	list-style: none;
	display: block;
	background: url(../MEMOimages/fleche.gif) center left no-repeat;
	padding-left: 60px;
	margin: 5px 0px;
}
#lieu .infos_pratiques{
	background: #51b1e6;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	padding: 10px 20px;
	color: #ffffff;
	margin: 0px 20px;
}	
#lieu .infos_pratiques h3{
	font-size: 24px;
	color: #13608a;
	font-family: 'Open Sans Condensed', sans-serif;
	margin: 0px;
}
#lieu .infos_pratiques strong{
	color: #13608a;
}
#lieu .logements{
	padding: 0px 0px 10px 17px;
	color: #666f77;
}
#lieu .logements h3{
	padding-left: 10px;
}
.logement{
	margin-top: 4px;
}
.logement .detail{
	float:right;
	width: 279px;
	height: 121px;
	background: #eff1f2;
	overflow: hidden;
	padding-left: 0px;
	padding-top: 10px;
}
#lieu .col_droite .logement .detail .title{
	display:block;
	font-weight: 400;
	color: #51b1e6;
	font-size: 18px;
	font-family: 'Open Sans', sans-serif ;
	margin: 0px 0px 5px 0px;
	padding-left: 0px ;
}#lieu .col_droite .logement .detail .title:hover{
	color: #13608A;
}
.logement .detail span{
	display: block;
	width: 55px;
	float: left;
	font-weight: 700;
	font-size: 10px;
	color: #474848;
	line-height: 10px;
	padding-left: 23px;
}
.logement .detail .prix{
	background: url(../MEMOimages/picto_prix.png) center left no-repeat;
}
.logement .detail .etiquette{
	background: url(../MEMOimages/picto_etiquette.png) center left no-repeat;
	
}
.logement .detail .perso{
	background: url(../MEMOimages/picto_perso.png) center left no-repeat;
	margin-left: 8px;
}
.logement .detail .intro{
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid #e1e3e4;
	color: #9d9e9e;
	line-height: 10px;
	font-size: 10px;
}
.logement .visuel{
	float: left; 
	position: relative;
}
.logement .visuel .masque{
	display: block;
	position: absolute;
	width: 49px;
	height: 131px;
	top: 0px;
	right: 0px;
	background:url(../MEMOimages/logement_masque.png);
}

/*******************************************************************************************/
/*************************************** LISTING *******************************************/
/*******************************************************************************************/
.page_listing .content .center{
	padding-bottom: 0px !important;
}
.zone_title{
	padding-left: 15px;
	position: relative;
}
.zone_title h1{
	font-size: 26px;
	font-family: 'Open Sans Condensed', sans-serif ;
	
}
.share{
	position: absolute;
	top: 10px;
	right: 30px;
}
#listing{

}
.list_element{
	
}
.list_element .map{
	width: 271px;
	height: 189px;
	float: right;
}
.list_element .visuel{
	float: right;
	position: relative;
	-webkit-box-shadow: 8px 0px 10px -8px #000000;
box-shadow: 8px 0px 10px -8px #000000;
}
.list_element .visuel .masque{
	position:absolute;
	top: 0px;
	left: 0px;
	background: url(../MEMOimages/list_element_masque.png) top left no-repeat;
	width: 59px;
	height: 189px;
}
.list_element .detail{
	background: #eff1f2;
	height: 179px;
	width: 636px;
	padding: 10px 0px 0px 20px;
}
.list_element .detail .title{
	display:block;
	font-weight: 400;
	color: #1862a1;
	font-size: 24px;
	font-family: 'Open Sans', sans-serif ;
	padding-left: 0px ;
}.list_element .detail .title:hover{
	color: #51b1e6;
}
.list_element .detail span{
	display: block;
	width: 55px;
	float: left;
	font-weight: 700;
	font-size: 10px;
	color: #474848;
	line-height: 10px;
	padding-left: 23px;
	
}
.list_element .detail .calendrier{
	background: url(../MEMOimages/picto_calendrier.png) center left no-repeat;
}
.list_element .detail .prix{
	background: url(../MEMOimages/picto_prix.png) center left no-repeat;
}
.list_element .detail .etiquette{
	background: url(../MEMOimages/picto_etiquette.png) center left no-repeat;
	
}
.list_element .detail .tourisme{
	background: url(../MEMOimages/picto_tourisme.png) center left no-repeat;
	margin-left: 15px;
}
.list_element .detail .perso{
	background: url(../MEMOimages/picto_perso.png) center left no-repeat;
	margin-left: 8px;
}
.list_element .detail .intro{
	font-family: 'Open Sans', sans-serif ;
	color: #1d1d1d;
	font-style: italic;
	font-size: 16px;
}
.list_element .selection{
	width: 930px;
	background-color: #B0B7C1;
	float: left;
}
.interets{
	padding: 9px 10px 9px 0px;
	border-bottom: 1px solid #e2e4e5;
	margin: 7px 0px; 
	border-top: 1px solid #e2e4e5;
	font-size: 11px;
	line-height: 15px;
	color: #595959;
}




.clearnone{
	width: 100%;
	height: 20px;
}

.zone_gmaps
{
	width: 493px;
	height: 338px;
}















/*---------------------------- css hacks -------------------------------*/

/*  "Clearing floats" avec div suplementaire */
.colclear {
	clear: both;
	height: 1px;
	line-height: 1%;
	font-size: 1px;
}

/*  "Clearing floats" avec div d�j� pr�sent */
.clearboth {
	clear: both;
}

/* 
This piece of code is for clearing the floats without structural markup
Don't modify it
*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-table;
	min-height: 0px;
}

/* Hides from IE-mac */
* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}
/* End hide from IE-mac */