@charset "UTF-8";
/*
Designed by Jean Loup Couegnas
/*/
.main {
    position:relative;
    z-index:100;
    font-size:0.8em;
    background-color: rgba(180,180,180,.36);
}

#summary .card {
    margin-bottom: 32px;
    position: relative;
    border: none;
}
#summary .chapeau {
    left: 3px;
    right:3px;
    bottom:3px;
    position: absolute;
    display: block;
    background-color: rgba(255,255,255,0.8); 
    color: #333;
    padding: 16px;
    overflow: hidden;
    margin-top:12px;
    font-size: 0.8em;

}
#summary .card {
    padding: 0;
    margin: 0;
}
#summary img{
    border: 3px solid #EEE;
    border-radius: 12px;
}
#summary .card:hover img {
    border: 3px solid #333;
}
#summary a {
    background-color: rgba(45,76,121,0.4);
    color:white;
    text-align: center;
    text-decoration: none;
    border: none;
    text-align: center;
    padding: 16px;
    margin: 30% 0 0 ;
    position: absolute;
    top: 16px;
    left: 16px;
    right: 16px;
    font-size: 1.2rem;
    border-radius: 16px;
    overflow-x: hidden;
}
#summary .card:hover a{
    background-color: rgba(45,76,121,0.7);
}
.reservation h2, .contacter h2 { display:block;} /* Exceptions */

h3 { }
h4 { }
h5 { }

.texte {
	position: relative;
	background-color:rgba(255,255,255,0.95); 
	border-top:1px solid white;
	font-size:1.2em; 
}

#photos {
	list-style:none;
	padding:0;
	margin:0;
}
#photos li {
	list-style:none;
	padding:0;
	margin:0;
	
}
#photos img {
    border-radius:0;
}
.photos li a { 
    border-radius:0;
}
.photos ul { list-style:none; padding:20px 0 0 0; margin:0;}
.photos li a { 
    border-radius:0;
}
objet {
    margin:0 -20px ;
}

/* ///////////////////////////////// */
/*  MODE D'AFFICHAGE	 */


/* MENU ACTION */
#action {list-style:none; min-height:30px; margin:0 -28px; text-align:center; padding:20px 10px; box-shadow: 0px -5px 5px -5px rgba(0, 0, 0, 0.3) inset;
background: -moz-linear-gradient(top,  rgba(238,238,238,0.1) 0%, rgba(153,153,153,0.5) 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,238,238,0.1)), color-stop(100%,rgba(153,153,153,0.5))); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top,  rgba(238,238,238,0.1) 0%,rgba(153,153,153,0.5) 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top,  rgba(238,238,238,0.1) 0%,rgba(153,153,153,0.5) 100%); /* Opera 11.10+ */

background: -ms-linear-gradient(top,  rgba(238,238,238,0.1) 0%,rgba(153,153,153,0.5) 100%); /* IE10+ */

background: linear-gradient(top,  rgba(238,238,238,0.1) 0%,rgba(153,153,153,0.5) 100%); /* W3C */

}
#action li { display:inline-block;  padding:0; margin:2px;  text-align:center;}
#action a {
    text-align:center;
    display:block;
    margin:0px;
    padding:6px 10px 6px 6px;
    color:white;
    font-size:14px;   
    border-radius:16px;
    text-decoration:none; border:2px solid white; box-shadow:1px 1px 4px #999
}
#action a:hover { text-decoration:none; background-color:#333 }
#action a:before { content:"▸"; margin:0 6px 0 0; padding:2px 6px; background-color:rgba(255,255,255,0.2); border-radius:12px; }
a.bt_tarif { background-color:#FF9D00;}
a.bt_doc { background-color:#FF9D00;}
a.bt_res { background-color:#F15F23;}
a.bt_video { background-color:#00BBD5;} 
a.bt_services { background-color:#B5D334;} 

.row.tarifs { background:white; padding:20px; margin:0}

#chapeau { padding-bottom:1px; position:relative;} /*border-bottom:5px solid rgba(0,0,0,0.1);*/
#chapeau .texte {
	background-color:rgba(200, 200,200,0.2) ;
	font: 1.4em normal "ubuntu", sans-serif;	position:relative;
	z-index: 50;
	padding:50px 50px 100px 50px;
	border-right:10px solid rgba(0,0,0,0.1)

} /* Le contenu du chapeau est soit un texte*/ 
.page_vie_camping1 #chapeau .texte, .page_vie_camping2 #chapeau .texte { background-color:rgba(230, 239,206,0.4) ;}
.page_preparer_venue1 #chapeau .texte, .page_preparer_venue2 #chapeau .texte {	background-color:rgba(255,157,0,0.4) ;}
.page_decouvrir_region1 #chapeau .texte, .page_decouvrir_region2 #chapeau .texte {  background-color:rgba(204, 241,247,0.4) ;}

/* Le contenu du chapeau est soit un menu (définit dans menu.css */ 
#chapeau .sub_menu_vertical { /* design dans menu.css */ 
	border-right:10px solid rgba(0,0,0,0.1) ;
}
.page_vie_camping1 #chapeau .sub_menu_vertical, .page_vie_camping2 #chapeau .sub_menu_vertical { background-color:rgba(230, 239,206,0.4) ;}
.page_preparer_venue1 #chapeau .sub_menu_vertical, .page_preparer_venue2 #chapeau .sub_menu_vertical {	background-color:rgba(255,157,0,0.4) ;}
.page_decouvrir_region1 #chapeau .sub_menu_vertical, .page_decouvrir_region2 #chapeau .sub_menu_vertical {  background-color:rgba(204, 241,247,0.4) ;}

.page_vie_camping1 #Breadcrumb, .page_vie_camping2 #Breadcrumb {
	background-color: rgba(128,175,11,0.2);
}
.page_vie_camping1 #Breadcrumb h1,.page_vie_camping2 #Breadcrumb h1 {
	color: rgb(128,175,11);
}
.page_vie_camping1 #Breadcrumb h1 a, .page_vie_camping2 #Breadcrumb h1 a {
	color: rgb(128,175,11);
}
.page_preparer_venue1 #Breadcrumb, .page_preparer_venue2 #Breadcrumb {
	background-color: rgba(241,95,35,0.2);
}
.page_preparer_venue1 #Breadcrumb h1,.page_preparer_venue2 #Breadcrumb h1 {
	color: rgb(241,95,35);
}
.page_preparer_venue1 #Breadcrumb h1 a, .page_preparer_venue2 #Breadcrumb h1 a {
	color: rgb(241,95,35);
}
.page_decouvrir_region1 #Breadcrumb, .page_decouvrir_region2 #Breadcrumb {
	background-color: rgba(0,137,209,0.2);
}
.page_decouvrir_region1 #Breadcrumb h1,.page_decouvrir_region2 #Breadcrumb h1 {
	color: rgb(0,137,209);
}
.page_decouvrir_region1 #Breadcrumb h1 a, .page_decouvrir_region2 #Breadcrumb h1 a {
	color: rgb(0,137,209);
}

#chapeau a.suite { position:absolute; bottom:10px; left:45%; margin:0 auto; white-space:nowrap; font-size:1.5em; background-color:rgba(0,0,0,0.3); color:white; border-radius:2em; padding:10px}
#chapeau a.suite:hover { background-position: top right;}

#chapeau .diapo {
	overflow:hidden;
	margin:0;
	padding:0;
	
}
#chapeau .diapo img { min-width:100%}
.chapeau_txt { 
    bottom:0; 
    left: 0;
    right: 0;
    background-color:rgba(0,0,0,0.50); color:white; padding:16px 24px; font-size:1.1em; text-shadow:1px 1px 4px rgba(0,0,0,0.5)}


#texte {position: relative; }
#texte .texte { margin:0;}

#texte_menu .texte { margin:0;  }
#texte_menu { margin:0;  }


#texte_image .texte { margin:0; }
#texte_image .photos img {}
#texte_image .texte img.full { width:100%}
#texte_image .photos li{  padding:1em; margin:0;}
#texte_image .photos li a {
    display:block;
    padding:0px;
    margin:0;
    text-decoration:none; 
    border:4px solid white;
    box-shadow:1px 1px 10px rgb(155,155,155);
}
#texte_image .photos li a:hover{box-shadow:1px 1px 10px #000;}

#content_footer {background-color: rgba(128,128,128, 0.1); }
#content_footer .photos { margin:0; }
#content_footer .photos img { max-width:100%; padding:0;}
#content_footer .photos ul {
    padding:16px 0 0 0;
    margin:0;
}
#content_footer .photos li { padding:0; margin:0; }
#content_footer .photos li a { 
    display:block;
    padding:0;
    margin:0 4px 8px 4px;
    text-decoration:none;
    border:8px solid white;
    box-shadow:none;

}
#content_footer .photos li a:hover{box-shadow:1px 1px 10px #000;}

#content_footer .photos li a:hover{box-shadow:1px 1px 10px #000;}


/* CAS DE LAYOUT avec AMORCES 

// Si l'amorce est avant le contenu et qu'il n'y en a qu'une : ma liste doit flotter à droite et doit avoir un largeur d'un tiers
// S'il y 3 amorces = ma liste a l'attribut tiers, ce qui veut dire que ma liste ul tient sur toute la largeur mais que ses filles "li" tiennent sur un tiers de largeur et sont flottantes
		
*/
#amorces { padding:0; margin:2em 0 0 0; list-style:none; border-bottom-right-radius:16px; font-size:1.1em; }
#amorces h3 { color:white; border-radius:10px 10px 0 0; padding:0.4em 1em 0.2em 1em; margin:0 -12px 12px -12px; font-size:1.2em; }
#amorces div { margin:0 0 12px 0; padding: 0 12px 0 0; border-radius:16px;}
#amorces div div, #amorces div div:last-child, #amorces div:last-child div, #amorces div:last-child div:last-child{ margin:0; padding:0 12px 12px 12px;}
#amorces div ul, #amorces div li { padding-left:0; margin-left:0; list-style:square inside;}
/*
#amorces.right {float:right; width:30%; margin-left:4%;}
#amorces.right li { margin:0px;  }
#amorces.right h3 { margin:-10px -10px 5px -10px; }
*/
.amo_vie_camping1 h3 { background-color:rgb(128,175,11);	}
.amo_vie_camping2 h3 { background-color:rgb(181,211,52);	}
.amo_preparer_venue1 h3 { background-color:rgb(241,95,35);	}
.amo_preparer_venue2 h3 { background-color:rgb(255,157,0);	}
.amo_decouvrir_region1 h3 { background-color:rgb(0,137,209);}
.amo_decouvrir_region2 h3 { background-color:rgb(0,187,213);}

.amo_vie_camping1 { background-color:rgba(128,175,11,0.2);	}
.amo_vie_camping2 { background-color:rgba(181,211,52,0.2);	}
.amo_preparer_venue1 { background-color:rgba(241,95,35,0.2);	}
.amo_preparer_venue2 { background-color:rgba(255,157,0,0.2);	}
.amo_decouvrir_region1 { background-color:rgba(0,137,209,0.2);}
.amo_decouvrir_region2 { background-color:rgba(0,187,213,0.2);}


#reserver { 
    background-color:rgba(0,137,209,0.1);
}
#reserver .card {
    border: 5px solid rgb(0,137,209) ;
    background-color: rgba(248,248,248) !important;
}

#reserver .title {
    background-color:rgb(0,137,209);
    color:white !important;
}


@media screen and (min-width: 768px) {
    h2 { line-height:32px}   
    #summary a span {
        font-size: 1.3rem;
}
 

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    #summary a span {
        font-size: 1.5rem;
    }
}