@charset "UTF-8";
/*
Theme Name: krea3
Theme URI: https://www.krea3.fr/
Description: Theme parent pour les clients Krea3
Version: 3.1
Author: Krea3
Author URI: http://www.krea3.fr
Text Domain: krea3
Domain Path: /languages
*/
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
/************************html, body, main************************************************************/
html,body{width:100%}
html{scroll-behavior:smooth}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
body{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;font-size:100%;color:#666;background:#fff}
main{width:100%;padding:0}
.clearer{display:block;width:100%;clear:both;}
/************************ Ligne outils ************************************************************/
#ligne-outils{}
/*****************Fil d'ariane***********************************************************************/
#fil_ariane{margin:0 0 0 0;padding:15px 10px 10px 0;text-align:left;font-size:0.75em;float:left;}
#fil_ariane a{text-decoration:none;}
#fil_ariane a:hover{text-decoration:underline;}
/**********************Outils***********************************************************************/
#outils{width:auto;display:table;float:right;}
#outils ul{display:table-cell;vertical-align:middle;list-style-type:none;}
#outils ul li{}
#outils ul li a{display:block;text-decoration:none;}
#outils ul li a:hover{}
#outils li#krea3outils_print{}
li#krea3outils_selectpages a{background:url(assets/images/icons_outils_ajouter.png) no-repeat center left;}
li#krea3outils_print a{background:url(assets/images/icons_outils_print.png) no-repeat center left;}
li#krea3outils_friend a{background:url(assets/images/icons_outils_friend.png) no-repeat center left;}
#outils ul li a span{display:none;}
/******************Image header**************************************************************************/
#image-header-page{width:100%;height:auto;position:relative;display:block;}
#image-header-accueil{width:100%;height:auto;position:relative;display:block;}
#image-header-page img{display:block;width:100%;height:auto;}
#image-header-accueil img{display:block;width:100%;height:auto;}
/******************carnet-voyage-header-page**************************************************************************/
#carnet-voyage-header-page{width:100%;height:auto;position:relative;display:block;}
#carnet-voyage-header-page #map_canvas{display:block;width:100%;height:auto;border:none;}
/******************La page*********************************************************************************/
#la-page{}
#content{float:left;width:75%;height:auto !important;min-height:400px;}
#content_large{clear:both;width:100%;position:relative;}
/* les galeries gutenberg recadrer ne marche pas avec ces propriétés */
/*#content img, #content_large img{max-width:100%;height:auto;}*/
#content strong, #content_large strong{ /*font-weight:700;*/}
/*************************************** Gauche ************************************************************/
#gauche{display:block;float:left;width:25%;}
/****************************Menu page********************************************************************/
.sidebar{}
/*bouton filtrer pour les petits écrans*/
#bt-filtrer{display:none;}
.sidebar ul#menu_pages,
.sidebar ul#menu_annuaire{height:auto !important;height:40px;min-height:40px; font-size:1em;}
.sidebar ul .pagenav{}
.sidebar ul#menu_pages .pagenav{}
.sidebar ul#menu_annuaire .pagenav{}
.sidebar ul .pagenav ul{text-transform:none;text-align:left;margin-top:10px;}
/*Les pages (niveau3)*/
.sidebar ul .pagenav ul ul{}
.sidebar ul li{list-style-type:none;}
.sidebar ul a{}
.sidebar ul#menu_pages a{font-weight:400;}
.sidebar ul#menu_annuaire a{font-weight:300;}
/*mettre une majuscule aux mois dans les actus (demande Beuzeville) */
.sidebar ul#menu_pages.menu-actu a:first-letter{text-transform:uppercase;}
.sidebar ul ul li:first-child{}
.sidebar ul ul li ul li:first-child{}
.sidebar ul li.has_children{}
.sidebar ul li.has_children ul{}
.sidebar ul li.has_children a{}
.sidebar ul li.has_children a:hover{}
.sidebar ul ul{}
.sidebar ul ul li{}
.sidebar ul ul ul li{}
.sidebar ul li.has_no_children a{}
.sidebar ul li.has_no_children a:hover{}
.sidebar ul#menu_pages li.current_page_item > a, .sidebar ul#menu_annuaire li.current_page_item > a{}
.sidebar ul li.current_page_item.has_children a{}
/*****************Menu déroulant gauche*****************************************************************************/
.sidebar ul li.pagenav ul li.niv-2 ul{display:none;}
.sidebar ul li.pagenav ul li.niv-2.taxonomy_item.page_item.has_children ul{display:block;}
.sidebar ul li.pagenav ul li.current_page_item ul{display:block;}
.sidebar ul li.pagenav ul li.current_page_parent ul{display:block;}
.sidebar ul li.pagenav ul li.current_page_ancestor ul{display:block;}
/**************Sidebar carto**********************************************************************************************/
#sidebar-carto{margin:0;padding:40px 30px 40px 0;font-family:sans-serif;font-size:1em;}
.filtres-carte{margin:0;padding:0 0 0 20px;}
.filtres-carte #titre-filtrer{display:block;padding:0 0 15px 0;margin-bottom:15px;}
.filtres-carte > ul {margin:0;padding:0;}
/** Les types ex: Agenda, Associations, Localisations... **/
.filtres-carte > ul > li {display: block;margin:0;padding:0;height:auto;height: 60px;overflow: hidden;border-top:none;}
.filtres-carte > ul > li > div{height: 60px;display:table;width:100%;}
.filtres-carte > ul > li[data-color="filtre-actif"].show div, .filtres-carte > ul > li[data-color="filtre-actif"] div:hover {/*background: rgba(0,0,0,0.1);*/}
.filtres-carte > ul > li > div > a{display:table-cell;vertical-align:middle;margin:0;padding:0 50px 0 0;position:relative;}
/*:after ou before pour appeler l'icone*/
.filtres-carte > ul > li > div > a:after {display: none;font-family: "Font Awesome 5 Solid";content: "\f078";}
/*c'est sur le svg qu'on stylise l'icone car font awesome mettra un svg*/
.filtres-carte > ul > li > div > a > .svg-inline--fa {position: absolute;width: 40px;top:20px;right: 0;-webkit-transition: left .4s ease;-moz-transition: left .4s ease;-o-transition: left .4s ease;transition: left .4s ease;}
.filtres-carte > ul > li.show > div > a:after{content: "\f00d";}
/*affichage du conteneur (bloc) des sous catégories quand on clique*/
.filtres-carte > ul > li.show, .filtres-carte > ul > li > ul.children > li {height: auto;overflow: visible;}
/*Une sous catégorie*/
.filtres-carte > ul > li ul li {height:auto;min-height: 42px;cursor: pointer;opacity: 0;position: relative;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;-webkit-transform: translate3d(-20px, 0, 0);-moz-transform: translate3d(-20px, 0, 0);transform: translate3d(-20px, 0, 0);}
#sidebar-carto ul ul li:first-child {border-top: none;}
/*affichage des sous catégories (texte) quand on clique*/
.filtres-carte > ul > li.show li{opacity: 1 !important;-webkit-transform: translate3d(0, 0, 0) !important;-moz-transform: translate3d(0, 0, 0) !important;transform: translate3d(0, 0, 0) !important;padding-right:0;position:relative;}
.filtres-carte > ul > li.show li span{display:block;position:relative;width:100%;padding-right:40px;}
/*La case à cocher / C'est sur :after ou before pour appeler l'icone*/
.filtres-carte > ul > li > ul > li > span:after, .filtres-carte ul.children > li > span:after {font-family: "Font Awesome 5 Solid";display:none; /* masquer le :after pour le svg */content: "\f192"; }
/*La case à cocher mode "cochée"*/
.filtres-carte > ul > li > ul > li.show > span:after, .filtres-carte ul.children > li.show > span:after {content: "\f111";display:none; }
/*Positionnement et couleur case à cocher FontAwesome 5 / c'est sur le svg qu'on stylise l'icone car font awesome mettra un svg*/
.filtres-carte > ul > li > ul > li > span > svg{position: absolute !important;width: 40px;right: 0;bottom:3px;-webkit-transition: left .4s ease;-moz-transition: left .4s ease;-o-transition: left .4s ease;transition: left .4s ease;}
/****************************Formulaire de contact************************************************************/
.krea3_formulaire label{display: block;width: 35%;float: left;padding: 10px;text-align: right;font-size: 1em;}
.descriptioncontact{display: block;font-size: 0.75em;margin: 4px 0 20px 0;padding-left: calc(35% + 10px);}
.krea3_formulaire input, .krea3_formulaire select,
.krea3_formulaire textarea{width: 45%;margin-left:10px;border: #EBEBEB 1px solid;font-size: 1em;padding: 10px;}
.krea3_formulaire input[type="submit"]{width: auto;height: auto;border: none;margin: 0 0 0 calc(35% + 10px);cursor:pointer;}
/****************************Plan du site********************************************************************/
#krea3_plan_site ul{margin:0 0 0 0;padding:0 5px 10px 0;}
/*niveau 1*/
#krea3_plan_site li{list-style-type:none;margin:10px 0 40px 0;padding:0 4% 0 4%;}
#krea3_plan_site > li{padding:30px 4% 30px 4%;}
#krea3_plan_site li a{text-decoration:none;display:block;position:relative;}
/**************************Styles à dupliquer dans tinymce.css**********************************************/
a{word-break: break-word;}
a.fancybox{text-decoration:none;}
img{border:none;max-width:100%;}
/******************************Liens Enfants / Menu page par défaut****************************************/
/*****************************moteur recherche site*********************************************************/
ul#recherche_site{
list-style-type:none;
margin:0 0 0 0;
padding:4px 0 0 0;
display:inline-block;
}
ul#recherche_site label{display:none;}
#searchform input[type="text"]{
border:rgba(0,0,0,0.1);
height:40px;
display:block;
float:left;
margin:0 10px 0 0;
padding:0 10px 0 10px;
width:180px;
font-size:1em;
}
#searchform input[type="submit"]{
font-weight:normal;
font-size:0px;/* pour cacher le texte*/
text-indent: -5000px;/* pour cacher le texte*/
display:block;
float:left;
height:40px;
width:40px;
background-position:0 -225px;
margin:0;
padding:0;
}
#searchform input[type="submit"]:hover{cursor:pointer;}
#content #searchform input[type="text"]{}
#content #searchform input[type="submit"]{}
/***************************Page de résultats *****************************************************************/
/*Le formulaire quand aucun résultat*/
#la-page #searchform{text-align:center;}
#la-page #searchform div{display:inline-block;}
#la-page #searchform input[type="text"]{
background: rgba(0,0,0,0.1) none repeat scroll 0 0;
border: medium none !important;
color: #333 !important;
font-size: 1.6em !important;
font-weight: 300 !important;
height: 40px !important;
margin: 0 10px 0 0 !important;
text-align: center;
width:70% !important;
max-width:400px!important;
}
#la-page #searchform input[type="submit"]{
border:1px solid #F0F0F0;
background-color:#F0F0F0;
}
label.screen-reader-text{display:none;} /*Pour cacher le "Recherche pour" des résultats de recherche*/
.page-resultats-recherche div.hentry{
display:block;
padding:0 0 20px 0;
margin:20px 0 20px 0;
border-bottom:1px solid #eee;
}
/*Le titre lien d'un résultat*/
h3.entry-title a{text-decoration:none;}
h3.entry-title a:hover{text-decoration:underline;}
/*Résultats suivants / précédents*/
#nav-above, #nav-below{clear:both;}
#nav-above{margin:0 0 20px 0;}
#nav-below{margin:30px 0 0 0;}
/*********************************************************************************************/
/* =Fin des styles généraux du site
---------------------------------------------------------------------------------------------*/
/****************************************/
/*Ci-dessous style des annuaires / agenda / actus / navigation / carto
/***************************************/
#erreur_contact_prestataire{
color:#fff;
padding: 20px;
margin-bottom: 10px;
}
#erreur_contact_prestataire.error{
background-color:#bf2b21;
}
#erreur_contact_prestataire.success{
background-color:#34AC18;
}
/****************video accueil***************************************/
#video-accueil{
position:relative;
width: 100%;
height: 100vh; /*vh correspond à viewport height, 1vh = 1% de la hauteur de la fenêtre*/
padding-top:0;
}
/*Image de fond quand js désactivé (car la vidéo ne s'affiche pas sans js)*/
#fond-video-no-js{
position:absolute;
top:0;
width:100%;
background: url(assets/images/video.jpg) no-repeat;
background-size:cover;
height:80vh;
z-index:-1;
}
@media screen and (max-width:767px){
#video-accueil{
height: 50vh; /**/
/***height: 50vh; vh correspond à viewport height, 1vh = 1% de la hauteur de la fenêtre*/
}
#fond-video-no-js{
height:50vh;
}
}
#diapo-accueil video{z-index:999!important;}
/****************Fin video accueil***************************************/
/****************FAQ***************************************/
#faq{
font-family:sans-serif;
}
/*La question*/
#faq h3{
padding:10px 0 10px 0;
font-family: sans-serif;
font-weight:400;
color:#4a6a92;
font-size:1.6em;
margin-top:30px;
background-color:#FFF;
border:none;
border-bottom:1px solid rgba(0,0,0,0.1);
}
#faq h3 span{
margin-right:20px;
margin-left:10px;
}
/*La réponse*/
#faq .ui-widget-content{
border:1px solid rgba(0,0,0,0.1);
border:none;
padding:20px 0 40px 0;
font-size:1.1em;
font-weight:400;
}
/************Fin FAQ***************************************/
/*********************Abonnement Newsletter************************************/
ul#inscription-newsletter{
margin:0;
padding:0;
list-style-type:none;
font-family:sans-serif;
color:#FFF;
}
ul#inscription-newsletter h2.widgettitle{
display:none;
}
ul#inscription-newsletter li{
margin:0;
padding:0;
}
ul#inscription-newsletter form.subscribe-form{
text-align:center;
padding:40px 30px 40px 30px;
background-color:#F0F0F0;
}
ul#inscription-newsletter form.subscribe-form input{
display:inline-block;
vertical-align: middle;
margin:0;
padding:0;
}
ul#inscription-newsletter form.subscribe-form input[type="text"]{
background-color:rgba(0,0,0,0.1);
border:none;
color:#333;
font-size: 1.2em;
font-weight: 300;
height: 42px;
margin:0 10px 0 0;
text-align: center;
width:65%;
max-width:400px;
}
/*Couleur du placeholder "votre@email.com" Rq : ne pas les regrouper sinon ça ne fonctionne pas*/
ul#inscription-newsletter ::-webkit-input-placeholder {
color: rgba(0,0,0,0.7);
}
ul#inscription-newsletter :-moz-placeholder { /* Firefox 18- */
color: rgba(0,0,0,0.7);
}
ul#inscription-newsletter ::-moz-placeholder { /* Firefox 19+ */
color: rgba(0,0,0,0.7);
}
ul#inscription-newsletter :-ms-input-placeholder {
color: rgba(0,0,0,0.7);
}
/*Fin couleur du placeholder*/
ul#inscription-newsletter form.subscribe-form input[type="submit"]{
border:1px solid #f6a8a3;
color:#FFF;
font-size:1.2em;
font-weight:300;
height:40px;
width:60px;
background-color:#f6a8a3;
margin:0;
padding:0;
border-radius:5px;
}
ul#inscription-newsletter p.success,
ul#inscription-newsletter div.response{
text-align:center;
font-size:1.3em;
color:#333;
font-weight:600;
}
ul#inscription-newsletter p.success{
border:1px solid #f6a8a3 !important;
padding:10px;
margin:5px 0 5px 0;
}
/*********************Fin Abonnement Newsletter********************************/
/********************Page rando***********************/
#mb_module{
position:relative;
z-index:0; /*Sinon certains éléments du module ign rando passe par dessus le menu*/
}
/****************Fin Page rando***********************/
/*********************Page carnet de voyage********************************/
#ajouter-carnet-voyage{
display:table-cell;
vertical-align:middle;
padding:0 10px 0 10px;
}
#ajouter-carnet-voyage a{
text-decoration:none;
font-family: sans-serif;
color:#A9A8A7;
text-transform:uppercase;
font-weight:600;
font-size:1.3em;
}
#ajouter-carnet-voyage a:hover{
text-decoration:underline;
color:#666;
}
#ajouter-carnet-voyage a svg{
color:#f6a8a3;
}
/*Page carnet de voyage*/
ul#nav_popup_carnet{
margin:0 0 20px 0;
padding:0;
text-align:center;
font-family:sans-serif;
}
ul#nav_popup_carnet li{
display:inline-block;
margin:5px;
padding:0;
}
ul#nav_popup_carnet li a{
display:block;
border:1px solid rgba(0,0,0,0.03);
background-color:#82bfdd;
padding:10px;
font-size:1.1em;
font-weight:400;
text-decoration:none;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
ul#nav_popup_carnet li:last-child a{
background-color:#f6a8a3;
}
ul#nav_popup_carnet li a svg{
margin-right:5px;
color:rgba(0,0,0,0.4);
}
ul#nav_popup_carnet li a:hover{
border:1px solid #333;
}
/*Carnet de voyage avec carte : un numéro correspond à un picto de la carte*/
.carnet-voyage-number{
display: inline-block;
color: #FFF;
padding: 0 10px 0 10px;
border-radius: 5px;
}
/*********************Fin Page carnet de voyage********************************/
/* =Médias
--------------------------------------------------------------------------------------- */
/* couleur des bordures des vignettes des galeries */
.plusgallery a:hover {
background-color: #FFF !important;
}
/* intensité du masque de fond d'une galerie */
#pgzoomview {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.8);
}
/* couleur des liens de navigation (flèches) des galeries */
#pgzoomview a:hover {
background-color: #656565 !important;
}
/* =Réglages diaporamas
----------------------------------------------- */
.camera_thumbs_cont {
background: none!important;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
overflow: hidden;
position: relative;
width: 100%;
clear: both!important;
}
.camera_thumbs_cont > div {
clear: both !important;
float: left;
height: 150px;
width: 100%;
}
.camera_thumbs_cont ul {
overflow: hidden;
padding: 3px 4px 8px;
position: relative;
text-align: center;
width: 100% !important;
}
/* contrainte pour le diapo dans les pages */
#owl-carousel{
width:100%;
max-width: 1300px;
}
@media screen and (max-width: 768px){
#owl-carousel{max-width: 700px;}
}
/* =vidéos
----------------------------------------------- */
/* besoin d'un padding pour les vidéos mp4 */
.wp-video{
padding-bottom: 50px;
}
/* =Cartographie interactive
--------------------------------------------------------------------------------------- */
/* En mode carte, on affiche la carte et on masque la grille */
.cbp-vm-view-map #map_canvas {
display: block;
}
/* =Langues
---------------------------------------------------------------------------------------------*/
.fa.icone-langue{
height: 47px;
width: 70px;
margin-right:-20px;
}
.fa.icone-langue.algerien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/algerien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.allemand {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/allemand.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.americain {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/americain.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.andorre {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/Andorra.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.anglais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/anglais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.arabe {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/arabe.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.argentin {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/argentin.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.armenien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/armenien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.australien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/australien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.belge {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/belge.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.bresilien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/bresilien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.canadien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/canadien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.chinois {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/chinois.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.danois {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/danois.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.espagnol {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/espagnol.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.finlandais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/Finland.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.francais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/francais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.greque {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/greque.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.hebreu {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/hebreu.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.indien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/indien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.irlandais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/irlandais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.islandais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/islandais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.israelien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/israel.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.italien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/italien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.japonais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/japonais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.luxembourgeois {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/Luxembourg.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.madagascard {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/Madagascard.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.maltais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/Malta.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.marocain {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/marocain.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.mexicain {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/mexicain.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.monaco {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/Monaco.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.neerlandais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/neerlandais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.neo-zelandais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/neo-zelandais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.nepalais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/nepalais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.nigerien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/Niger.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.nigeria {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/Nigeria.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.norvegien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/norvegien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.peruvien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/peruvien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.polonais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/polonais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.portugais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/portugais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.roumain {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/roumain.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.russe {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/russe.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.senegalais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/senegalais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.suedois {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/suedois.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.suisse {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/suisse.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.thailandais {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/thailandais.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.tunisien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/tunisien.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.turc {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/turque.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.turque {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/turque.png") no-repeat scroll 100% 100% / 50% 50%;
}
.fa.icone-langue.vietnamien {
background: rgba(0, 0, 0, 0) url("images/pictos/flags/vietnamien.png") no-repeat scroll 100% 100% / 50% 50%;
}
/* =Table responsive pour les prix et les périodes
--------------------------------------------------------------------------------------- */
.footable {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
border-spacing: 0;
color: #444;
font-family: sans-serif;
font-size: 14px;
width: 100%;
}
.footable.breakpoint > tbody > tr > td.expand {
background: url('assets/images/footable/plus.png') no-repeat 5px center;
padding-left: 40px;
}
.footable.breakpoint > tbody > tr.footable-detail-show > td.expand {
background: url('assets/images/footable/minus.png') no-repeat 5px center;
}
.footable.breakpoint > tbody > tr.footable-row-detail {
background: #58585a none repeat scroll 0 0;
color: #ffffff;
}
.footable > tbody > tr:hover {
background: #58585a;
color: #fff;
}
.footable.breakpoint > tbody > tr:hover:not(.footable-row-detail) {
cursor: pointer;
}
.footable > tbody > tr > td, .footable > thead > tr > th {
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
padding: 10px;
text-align: left;
}
.footable > thead > tr > th, .footable > thead > tr > td {
background-color: #58585a;
color: #fff;
border-top: none;
text-shadow: 0 1px 0 rgba(255,255,255,.5);
position: relative;
}
.footable > tbody img {
vertical-align:middle;
}
/**********Boutons de partage facebook, twitter, g+ *****/
#partager{
position:fixed;
z-index:2000;
right:0;
top:200px;
background-color:rgba(0,0,0,0.1);
padding:8px 0 8px 3px;
border-top-left-radius:3px;
border-bottom-left-radius:3px;
}
#share_buttons{
display:block;
margin:0;
padding:0;
}
#share_buttons a{
display:block;
width:32px;
height:32px;
margin:8px;
padding:0;
}
/******Fin Boutons de partage facebook, twitter, g+ *****/
/***Outil taille du texte***/
#taille_texte{
}
#taille_texte span{
display:block;
color:#000;
margin:0 auto;
}
.jfontsize-button {
display:inline-block;
width:40px;
height:40px;
/*background-color:#f7f7f7;*/
float:right;
margin:0;
}
.jfontsize-button:hover {
border:none;
}
.jfontsize-disabled, .jfontsize-disabled:hover {
}
/***Fin Outil taille du texte***/
#recherche-top{
display:inline-block;
vertical-align:middle;
}
/****************tableau responsive*************************************/
table.tableau-responsive{
width:100%;
max-width:700px;
border-collapse: collapse;
font-family:sans-serif;
font-size:1.4em;
color:#333;
margin:30px 0 30px 0;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box; /* Firefox, other Gecko */
box-sizing: border-box; /* Opera/IE 8+ */
}
/*Le titre du tableau "Vols charters..."*/
table.tableau-responsive caption{
font-size:2em;
line-height:0.8em;
color:#333;
padding:10px;
text-align:left;
font-weight:400;
}
table.tableau-responsive caption span{
font-size:0.7em;
color:#3BA8C9;
font-weight:300;
}
/* Zebra striping */
table.tableau-responsive tr:nth-of-type(odd) {
background:#f7f7f7;
}
table.tableau-responsive th {
background:#333;
color: white;
font-weight:300;
}
table.tableau-responsive td, th {
padding: 6px;
/*border: 1px solid #ccc;*/
border-bottom:2px solid #333;
text-align: left;
font-weight:300;
}
/*Les jours*/
/*entete des jours*/
table.tableau-responsive th.jour-th{
width:165px;
}
table.tableau-responsive th.jour-th .jour-th-small{display:none;} /*Intitulé "Jours" seulement visibles sur petits écrans*/
table.tableau-responsive th.jour-th ul{
list-style-type:none;
margin:0;
padding:0;
}
table.tableau-responsive th.jour-th ul li{
display:block;
float:left;
width:20px;
text-align:center;
border-right:1px solid rgba(0,0,0,0.1);
}
/*Les noms des Destinations*/
table.tableau-responsive td.destination-td{
text-transform:uppercase;
font-weight:bold;
}
/*Fin des noms des Destinations*/
/*Les noms des Arrivées*/
table.tableau-responsive td.arrivee-td a{
color:#333;
font-weight:300;
}
table.tableau-responsive td.arrivee-td a:hover{
color:#3BA8C9;
}
/*Fin des noms des Arrivées*/
/*les blocs des jours dans le tableau*/
table.tableau-responsive td.jour-td ul{
list-style-type:none;
margin:0;
padding:0;
}
table.tableau-responsive td.jour-td ul li{
display:block;
float:left;
width:20px;
height:35px;
text-align:center;
border-right:1px solid rgba(0,0,0,0.1);
background-color:transparent;
}
table.tableau-responsive td.jour-td ul li:first-child{border-left:1px solid rgba(0,0,0,0.1);}
/*Les week-ends*/
table.tableau-responsive td.jour-td ul li.sam.off,
table.tableau-responsive td.jour-td ul li.dim.off{
background-color:rgba(0,0,0,0.05);
}
table.tableau-responsive td.jour-td ul li.on{
background-color:#3BA8C9;
border-right:1px solid rgba(255,255,255,0.5);
}
/*table.tableau-responsive td.jour-td ul li span{display:none;}*/ /* Lettres L M M J V S D seulement visibles sur petits écrans*/
/*les blocs des jours dans le tableau*/
table.tableau-responsive td.jour-td ul li span{display:inline-block; padding-top:7px; color:rgba(0,0,0,0.3);}
table.tableau-responsive td.jour-td ul li.on span{color:#FFF;}
table.tableau-responsive td.jour-td ul li.mar span,
table.tableau-responsive td.jour-td ul li.mer span{}
table.tableau-responsive td.jour-td ul li.mar span:first-letter,
table.tableau-responsive td.jour-td ul li.mer span:first-letter{
}
/*fin des blocs des jours dans le tableau*/
/*Les Nouveautés*/
table.tableau-responsive tr.nouveaute-fr,
table.tableau-responsive tr.nouveaute-en{
}
table.tableau-responsive tr.nouveaute-fr td.arrivee-td a,
table.tableau-responsive tr.nouveaute-en td.arrivee-td a{
color:#3BA8C9;
font-weight:400;
}
table.tableau-responsive tr.nouveaute-fr td.arrivee-td a:hover,
table.tableau-responsive tr.nouveaute-en td.arrivee-td a:hover{
color:#333;
}
table.tableau-responsive tr.nouveaute-fr td.arrivee-td a:before,
table.tableau-responsive tr.nouveaute-en td.arrivee-td a:before{
font-size:0.6em;
text-transform:uppercase;
display:inline-block;
vertical-align:middle;
border:1px solid #3BA8C9;
font-weight:400;
padding:3px;
border-radius:3px;
margin-right:5px;
}
table.tableau-responsive tr.nouveaute-fr td.arrivee-td a:before{content:"Nouveau";}
table.tableau-responsive tr.nouveaute-en td.arrivee-td a:before{content:"New";}
/*Les vols secs*/
table.tableau-responsive tr.vol-sec{
background-color:#E6F1F7;
}
table.tableau-responsive tr.vol-sec td.arrivee-td a:after{
content:url(images/etoile-vol-sec.png);
display:inline-block;
width:18px;
height:18px;
margin-left:5px;
}
/*Le footer du tableau*/
table.tableau-responsive tfoot p{
margin:0;
padding:0;
font-size:0.9em;
}
table.tableau-responsive tfoot p.legende-vol-sec{
color:#e65733;
font-weight:400;
}
table.tableau-responsive tfoot p.legende-vol-sec:before{
content:url(images/etoile-vol-sec.png);
display:inline-block;
width:18px;
height:18px;
margin-right:5px;
}
/****************************************/
/************RESPONSIVE******************/
@media only screen and (max-width:1023px) {
/* Force table to not be like tables anymore */
table.tableau-responsive,
table.tableau-responsive caption,
table.tableau-responsive thead,
table.tableau-responsive tbody,
table.tableau-responsive th,
table.tableau-responsive td,
table.tableau-responsive tr {
display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
table.tableau-responsive thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
table.tableau-responsive tr { border: 1px solid #ccc; }
table.tableau-responsive td {
/* Behave like a "row" */
border: none;
border-bottom: 1px solid #eee;
position: relative;
padding-left: 50%;
white-space: normal;
text-align:left;
}
table.tableau-responsive td:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
text-align:left;
font-weight: bold;
}
/*On récupère le data title pour l'afficher*/
table.tableau-responsive td:before { content: attr(data-title); }
table.tableau-responsive tfoot td{
padding-left:6px;
}
table.tableau-responsive tfoot td:before{
width:0%;
}
}
/****************fin tableau responsive********************************/
/***********************************************************************/
.cookiebanner{
background:rgba(0,0,0,0.8) !important;
width:300px;
bottom:20px !important;
right:20px !important;
left:auto !important;
max-width:100%;
z-index:200;
padding:30px !important;
}
.cookiebanner a{
color:#FFF;
}
.cookiebanner-close{
background-color:#FFF !important;
padding:2px 4px 2px 4px !important;
margin-left:10px;
border-radius:5px;
}
/***********************Page carto*********************/
/******************************************************/
/***Partie gauche***/
.page_carto #filtres{
max-width: 100%;
width: 300px;
display: block;
float: left;
padding: 0;
}
.page_carto #filtres form.recherche-listing {
background-color: #f4f4f4;
margin: 0;
padding: 0 5px;
background-color:#F4F4F4;
padding:8px 5px 8px 5px;
margin:0 0 20px 0;
text-align:left;
}
form.recherche-listing fieldset{
padding:0;
border:none;
}
.page_carto #header_filtres {
background-color: #f0f0f0;
padding: 5px 5px 15px;
margin:10px 0 0 0;
}
.page_carto #nb_result{
background: transparent none repeat scroll 0 0 !important;
font-family:sans-serif;
color: #194b5e;
font-size: 2.2em;
font-weight:700;
margin: 15px 0 12px;
padding: 5px 0;
}
.page_carto #nb_result #label{
font-size:0.75em;
}
.page_carto #recherche-cartographie fieldset {
display: block;
margin: 0 auto;
width: 95%;
}
.page_carto span.titre_filtre {
font-size: 1em;
color: #666666;
display: block;
padding: 10px 0;
text-align: center;
text-transform: uppercase;
}
.page_carto input#nouvelle_recherche_agenda {
background: #567898;
border: 1px solid #567898;
font-size: 1.2em;
height: auto;
text-transform: uppercase;
transition: all 0.5s ease-in 0s;
width: 90%;
color:#FFF;
font-family:sans-serif;
font-size:0.8em;
padding:10px;
margin:0 5px 0 5px;
}
.page_carto #reset_recherche_carto {
border: 1px solid #666;
color: #666 !important;
display: block;
font-size: 0.75em;
font-style: italic;
margin:10px 0 0 0;
max-width: 100%;
padding:7px;
text-decoration: none;
text-transform: none;
transition: all 0.5s ease-in 0s;
cursor:pointer;
text-align:center;
width:115px;
}
.page_carto ul{
list-style-type:none;
padding-left:0;
text-align:left;
}
.page_carto ul li{
margin-left:0;
}
.page_carto #filtres .filtre {
padding: 10px;
}
.page_carto #filtres .filtre h4{
cursor: pointer;
}
.page_carto #filtres .filtre h4::before {
content: "\f078";
font-family: FontAwesome;
margin-right: 10px;
}
.page_carto #filtres .filtre h4.active::before {
content: "\f077";
font-family: FontAwesome;
}
/***FIN Partie gauche***/
/***Partie droite***/
.page_carto #cbp-vm.card {
width: calc(100% - 330px);
margin:10px 0;
}
.page_carto .cbp-vm-switcher {
float: right;
padding: 0;
}
.page_carto #map_canvas{
border:none;
}
/*infos bulle*/
.info-windows {
border-radius: 5px;
background:#fff;
padding: 10px;
min-width:300px;
}
.info-windows .lien-itineraire{
background-color: #eee;
border: medium none;
border-radius: 3px;
color: #333;
display: inline-block;
float: left;
clear: both;
font-weight: bold;
margin: 0 10px 5px 0;
padding: 10px;
text-align: center;
width: auto;
font-size: 1em;
text-decoration: none;
}
.i-box i{
margin:0 10px 0 0;
}
.i-box h3 {
border-bottom: 1px solid #eee;
font-family:sans-serif;
margin: 0 0 15px;
padding: 0 0 10px;
}
#map_canvas img, #carte img{
max-width: none;
}
.info-windows .i-box img.wp-post-image {
display: block;
float: left;
margin: 0 20px 20px 0;
max-width: 110px;
width: 110px;
height:auto;
}
.i-box p {
display: block;
margin: 20px 0 15px 20px;
}
/*Boutons*/
.i-box #show-itineraire {
background-color: #eee;
border: medium none;
border-radius: 3px;
color: #333;
display: inline-block;
/*float: left;*/
font-weight: bold;
margin: 0 0 5px 0;
padding: 10px;
text-align: center;
width: auto;
cursor:pointer;
font-size:1em;
}
.i-box .lien-savoir-bulle {
background-color: #666;
border: medium none;
border-radius: 3px;
color: #fff;
display: inline-block;
/*float: left;*/
clear:both;
font-weight: bold;
margin: 0 0 5px 0;
padding: 10px;
text-align: center;
width: auto;
font-size:1em;
text-decoration:none;
}
/*Fin Boutons*/
/*infos bulle*/
/*Itineraire*/
.page_carto #titre_calcul_itineraire {
/*color: #6f984f;
font-size: 1.8em;
font-weight: 600;
margin: 45px 0 20px;
padding: 0;
text-transform: uppercase;*/
font-weight:300;
font-size:2em;
}
.page_carto #wrapper_input_calcul_itineraire input {
background: #ededed none repeat scroll 0 0;
border: medium none;
color: #333;
font-family:sans-serif;
font-size: 1.8em;
font-weight: 300;
height: 50px;
margin: 0 auto 20px;
text-align: center;
width: 50%;
}
.page_carto .adp{
width:100%;
}
/***FIN Partie droite***/
/***************RESPONSIVE******************/
@media screen and (max-width:770px) {
.page_carto #filtres{
width: 100%;
clear:both;
float:none;
margin:0 !important;
}
.page_carto #cbp-vm.card {
width: 100%;
}
/***itinéraire***/
.page_carto #wrapper_itineraire{
padding:0;
width:100%;
}
.page_carto #wrapper_input_calcul_itineraire input{
width:100%;
}
.page_carto .adp table{
width:100%;
}
/***fin itinéraire***/
}
/********************Fin page carto*********************/
/******************************************************/
/*************Page Listing des ACTUS*********************/
/*Listing*/
.extrait_actu_page{
border-bottom:1px solid #eee;
margin:0 0 20px 0;
padding:20px;
clear:both;
font-size:0.9em;
}
.extrait_actu_page h2{
margin:0;
padding:0 0 10px 0;
color:#333;
font-size:1.6em;
}
.extrait_actu_page h2 a{
text-decoration:none;
font-weight:400;
color:#333;
}
.extrait_actu_page h2 a:hover{
text-decoration:underline;
}
.extrait_actu_page small{
display:block;
margin:15px 0 0 0;
color:#194b5e;
font-weight:700;
text-transform:uppercase;
font-size:0.7em;
font-family:sans-serif;
color:#333;
}
.extrait_actu_page .vignette{
/*width:30%;*/
max-width:350px;
height:auto;
float:left;
border:1px solid #eee;
margin:0 20px 10px 0;
padding:0;
}
.extrait_actu_page .vignette img{
display:block;
width:100%;
height:auto;
}
.extrait_actu_page a.lire_actu{
}
.extrait_actu_page a.lire_actu:hover{
}
/*fin listing*/
#date_publication_article_single{
display:block;
font-family:sans-serif;
text-align:right;
margin:20px 0 0 0;
color:#194b5e;
font-weight:400;
text-transform:uppercase;
font-size:0.7em;
}
/***************Fin page listing ACTUS***************************/
/********************************************************************************/
/******Page Listing des AGENDA / ANNUAIRES *****/
/*********************/
/*Formulaire de recherche agenda*/
form.recherche-listing{
background-color:#f8f8f8;
padding:8px 5px 8px 5px;
margin:0 auto 20px auto;
width:100%;
max-width:1090px;
text-align:center;
}
form.recherche-listing fieldset,
form.recherche-listing p{
display:inline-block;
vertical-align:middle;
}
form.recherche-listing p{
margin:5px;
}
form.recherche-listing fieldset{
padding:0;
border:none;
}
form.recherche-listing input{
border:1px solid #FFF;
padding:10px;
}
form.recherche-listing input[type="button"]{
background-color:#33AA6E;
border:1px solid #33AA6E;
color:#FFF;
text-transform:uppercase;
}
form.recherche-listing input[type="button"]:hover{
opacity:0.7;
}
/*le select*/
span.select-wrapper {
position: relative;
display: inline-block;
background-color:#FFF;
}
.select-wrapper select {
color:#666;
display: inline-block;
border: 1px solid #fff;
background-color:#FFF;
padding:8px 20px 8px 8px;
margin: 0;
font: inherit;
outline:none; /* remove focus ring from Webkit */
line-height: 1.2;
-webkit-appearance:none; /* remove the strong OSX influence from Webkit */
}
/* for Webkit's CSS-only solution */
@media screen and (-webkit-min-device-pixel-ratio:0) {
.select-wrapper select {
padding-right:30px;
}
}
/* Since we removed the default focus styles, we have to add our own */
.select-wrapper select:focus {
-webkit-box-shadow: 0 0 3px 1px #eee;
-moz-box-shadow: 0 0 3px 1px #eee;
box-shadow: 0 0 3px 1px #eee;
}
/* Style de la flèche */
.select-wrapper:after {
font-family: FontAwesome;
content:"\f107";
position: absolute;
top: 0;
right: 0;
bottom: 0;
font-size:1.6em;
padding:0 7px 0 7px;
line-height:35px;
background-color:#dbdbdb;
color: #FFF;
pointer-events:none;
}
/*:after ou before pour appeler l'icone*/
.select-wrapper:after {
display: none;
font-family: "Font Awesome 5 Solid";
content: "\f107";
}
/*c'est sur le svg qu'on stylise l'icone car font awesome mettra un svg*/
.select-wrapper > .svg-inline--fa {
position: absolute;
top: 0;
right: 0;
bottom: 0;
font-size:2.45em;
padding:0 7px 0 7px;
line-height:35px;
background-color:#dbdbdb;
color: #FFF;
pointer-events:none;
}
.no-pointer-events .select-wrapper:after {
content: none;
}
/*Fin select*/
/*Bouton Réinitialiser*/
a#reset_recherche_agenda,
a#reset_recherche_annuaire,
a#reset_recherche_carto{
background-color:#FFF;
border:1px solid rgba(0,0,0,0.1);
color:#E84627;
color:#666;
font-size:1em;
font-weight:300;
font-family: sans-serif;
text-decoration:none;
padding:10px;
margin:0 5px 0 5px;
display:inline-block;
}
a#reset_recherche_carto{color:#E84627;}
a#reset_recherche_agenda:hover,
a#reset_recherche_annuaire:hover,
a#reset_recherche_carto:hover{
border:1px solid rgba(0,0,0,0.3);
}
/*Bouton Rechercher quand javascript désactivé*/
input#nouvelle_recherche_agenda{
background-color:#565859;
border:1px solid #565859;
color:#FFF;
font-family: sans-serif;
font-size:0.8em;
padding:10px;
margin:0 5px 0 5px;
}
/*Image loading (chargement des résultats)*/
#spinner{
text-align:center;
}
/* masquer un élément quand js activé */
.listing-hidden{display:none; visibility:hidden;}
/* afficher un élément quand js désactivé */
.listing-visible{display:block; visibility:visible;}
/*Fin Formulaire de recherche agenda*/
/*********************/
/*********************/
/*Formulaire de recherche annuaire*/
#filtres-annuaires{
display:block;
float:left;
width:22%;
padding:10px 0 10px 0;
margin:0 0 20px 0;
}
#filtres-annuaires form fieldset{
border:none;
padding:0;
}
ul#la-recherche-annuaire{
list-style-type:none;
margin:0;
padding:20px;
background-color:#F8F8F8;
}
/*Blocs "Afficher les résultats" et "Affinez..." */
ul#la-recherche-annuaire li.bloc-recherche{
margin:0;
padding:0;
border-bottom:1px solid rgba(0,0,0,0.05);
}
/*Bloc "Afficher" */
ul#la-recherche-annuaire li.bloc-recherche1{
border-top:1px solid rgba(0,0,0,0.05);
padding:0 0 20px 0;
}
/*Titre "Afficher les résultats" et "Affinez..."*/
.titre-recherche-annuaire{
display:block;
margin:20px 0 0 0;
font-size:1.2em;
font-weight:bold;
color:#333;
}
li.bloc-recherche ul{
list-style-type:none;
margin:10px 0 0 0;
padding:0 0 20px 0;
}
/*Les liens de catégorie ou type*/
li.bloc-recherche li a{
text-decoration:none;
color:#666;
font-weight:normal;
}
.bloc-recherche li.current_page_item a{
color:#333;
font-weight:bold;
}
/*Boutons nouvelle recherche et réinitialiser*/
.bloc-recherche li.bouton-recherche-annuaire{
margin:0;
padding:0;
}
li.bouton-recherche-annuaire input#nouvelle_recherche_annuaire{
font-size:0.8em;
padding:3px 10px 3px 10px;
color:#FFF;
background-color:#565859;
border:1px solid #565859;
font-weight:normal;
margin:0 0 10px 0;
}
input#nouvelle_recherche_annuaire:hover{
background-color:transparent;
}
/*Ce lien s'affiche quand js désactivé*/
li.bouton-recherche-annuaire a{
color:#565859;
font-weight:bold;
text-decoration:underline;
font-size:0.8em;
}
/*Fin Boutons nouvelle recherche et réinitialiser*/
/*Les filtres dans Affinez votre recherche*/
li.bloc-de-filtres{
margin:20px 0 0 0;
padding:0;
}
/*L'intitulé du bloc de filtre ex : Localisation*/
span.type-de-filtre{
font-weight:bold;
color:#333;
}
li.bloc-de-filtres ul{
font-size:0.9em;
}
li.bloc-de-filtres ul input[type="checkbox"]{
margin-right:7px;
}
/*Fin des filtres dans Affinez votre recherche*/
/*Fin Formulaire de recherche annuaire*/
/*********************/
/****PAGINATION listing*****/
/* conteneur de la pagination */
.listing-pagination{
clear:both;
text-transform: uppercase;
display: block;
padding:30px 0 0 0;
}
/* un element contenant un numero de page */
.page-numbers{
background:#f8f8f8 !important;;
border-radius: 4px;
font-size: 12px;
margin: 0 2px 1.5em !important;
overflow: hidden;
padding: 8px 14px !important;
color: #333 !important;
text-decoration: none;
transition: all 0.3s ease 0s;
}
/* passage de la souris sur un lien de la pagination */
a.page-numbers:focus, a.page-numbers:hover,
span.page-numbers.current{
background-color: #333!important;
color: #fff!important;
}
/* icone pages precedentes */
/*a.page-numbers.prev::before{
font-family:"FontAwesome";
content: "\f053";
}*/
/* icone pages suivantes */
/*a.page-numbers.next::after{
font-family:"FontAwesome";
content: "\f054";
}*/
/*= Pagination loader - ajout François*/
#pagination-loader {
width: 40px;
height: 40px;
margin: 1.5em auto;
background: #ccc;
border-radius: 50%;
-webkit-animation: pulse 1s infinite alternate;
animation: pulse 1s infinite alternate;
display: none;
}
@-webkit-keyframes pulse {
from {
opacity: 1;
width: 40px;
height: 40px;
}
to {
opacity: 0.5;
width: 35px;
height: 35px;
}
}
@keyframes pulse {
from {
opacity: 1;
width: 40px;
height: 40px;
}
to {
opacity: 0.5;
width: 35px;
height: 35px;
}
}
/******FIN PAGINATION listing*****/
/*********************/
/* Le listing annuaire / agenda */
/* Le wrapper du listing : une div > une section > un ul */
.listing{
margin:0;
padding:0;
text-align:center;
font-family: sans-serif;
}
.listing ul{
display:block;
margin:0 auto 0 auto;
text-align:center;
list-style-type:none;
padding:0;
}
#content .listing ul{width:1110px;}
#content_large .listing ul{width:1480px;}
/* Fin wrapper du listing*/
/* Un bloc */
.listing li.un-bloc-listing{
display:block;
float:left;
margin:8px;
padding:0;
background-color:#fff;
border:1px solid rgba(0,0,0,0.1);
}
/* Le contenu d'un bloc agenda*/
.listing .listing-item-agenda{
width:350px;
height:350px;
display:block;
position:relative;
overflow:hidden;
}
/* Le contenu d'un bloc annuaire*/
.listing .listing-item,
.listing .listing-item-annuaire{
width:350px;
height:350px;
display:block;
position:relative;
overflow:hidden;
}
/* L'image */
.listing .listing-item img{
display:block;
width:100%;
height:auto;
position:relative;
z-index:0;
}
/* La date (Agenda)*/
.date-manif-listing{
position:absolute;
top:10px;
left: 50%; /* poussé de la moitié de hauteur du référent */
transform: translateX(-50%); /* tiré de la moitié de sa propre hauteur */
font-weight:500;
display:block;
margin-bottom:10px;
font-size:1em;
background-color:#f6a8a3;
border-radius:2px;
padding:0 5px 0 5px;
color:#FFF;
z-index:2;
text-transform:uppercase;
}
.date-manif-listing .agenda_jour_texte,
.date-manif-listing .du-au{
font-weight:300;
font-size:0.8em;
}
.date-manif-listing .saut-ligne-date{
display:block;
}
/* Fin de la date */
/* Bloc de texte en absolu sur fond couleur dans un bloc listing : ex la ville (Annuaire)*/
.texte-absolute-listing{
position: absolute;
top: 10px;
left: 50%;
transform: translateX(-50%);
font-weight: 400;
display: block;
margin-bottom: 10px;
font-size: 0.8em;
background-color: rgb(79, 68, 100);
color: rgb(255, 255, 255);
z-index: 2;
text-transform: uppercase;
border-radius: 2px;
padding: 3px 5px;
}
.texte-absolute-listing p {
font-weight: 100;
display: block;
font-size: 1em;
color: rgb(255, 255, 255);
z-index: 2;
margin: 0px;
text-transform:uppercase;
}
/*Le picto*/
.texte-absolute-listing p > span{
padding-right: 5px;
}
/* Fin bloc de texte en absolu */
/* Le lien avec effet de survol contenant le titre et le résumé*/
.listing .listing-item > a,
.listing .listing-item > .commerce{
display:block;
text-decoration:none;
font-weight:100;
color:#333;
width:100%;
height:150%;
position:absolute;
z-index:1;
bottom:-50%;
background-color:rgba(0,0,0,0.1);
-webkit-transition: background-color 1s ease, bottom 1s ease;
-moz-transition: background-color 1s ease, bottom 1s ease;
-ms-transition: background-color 1s ease, bottom 1s ease;
-o-transition: background-color 1s ease, bottom 1s ease;
transition: background-color 1s ease, bottom 1s ease;
}
.listing .listing-item > a:hover,
.listing .listing-item > .commerce:hover{
background-color:rgba(255,255,255,1);
bottom:0%;
}
/* Le titre */
.listing .listing-item a h3,
.listing .listing-item .commerce h3{
margin:0;
display:table;
width:100%;
height:66.66%;
position:relative;
color:#333;
font-weight:700;
font-size:1.2em;
padding-bottom:0;
}
/* span pour bien positionner le texte du titre*/
.listing .listing-item a h3 > span,
.listing .listing-item .commerce h3 > span{
display:table-cell;
vertical-align:bottom;
width:100%;
text-align:center;
}
/* span pour styliser titre*/
.listing .listing-item a h3 span span.bordure-titre-listing,
.listing .listing-item .commerce h3 span span.bordure-titre-listing{
display:block;
background-color:rgba(255,255,255,0.9);
padding:10px;
height:auto;
min-height:88px;
word-break: break-word;
}
/* La catégorie (hébergement, annuaire et agenda) ou la rubrique parent (pages)*/
.listing .listing-item a h3 span.type{
display:block;
text-transform:uppercase;
font-weight:400;
font-size:0.65em;
}
/*Icon appareil photo pour listing photothèque*/
.listing .listing-item a h3 span.type svg{
color:#f6a8a3;
}
/*La ville pour le listing agenda*/
.listing .listing-item a h3 span.ville-agenda-listing{
display:inline-block;
background-color:#DBDBDB;
padding:0 3px 0 3px;
border-radius:2px;
margin-right:5px;
}
/*Le tarif pour le listing agenda*/
span.tarifs-manif-listing{
font-weight:400;
font-size:0.9em;
}
span.tarifs-manif-listing span.agenda.tarif{
display:inline-block;
padding:0 3px 0 3px;
}
/* Classement Hébergement (etoiles, epis, etc)*/
.listing .listing-item a h3 span.icones{
display:block;
font-weight:300;
font-size:0.6em;
padding-top:5px;
}
.listing .listing-item a h3 span.icones svg.fa-pagelines{color:#746493;}
.listing .listing-item a h3 span.icones svg.fa-star{color:#4f4464;}
.listing .listing-item a h3 span.icones svg.fa-key{color:#8b8793;}
/*Infos et réservation Hébergement*/
.bt-resa-bloc-listing{
display:inline-block;
padding:10px;
margin-top:5px;
border:2px solid #f6a8a3;
font-weight:700;
font-size:0.9em;
text-transform: uppercase;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-ms-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
}
.bt-resa-bloc-listing:hover{
background-color:#f6a8a3;
}
/* Le résumé (visible au survol) */
.listing .listing-item a p,
.listing .listing-item .commerce p{
font-size:0.9em;
font-weight:100;
padding:5px 10px 10px 10px;
margin:0;
}
/*RESPONSIVE listing Annuaires Agenda*/
@media screen and (min-width:1280px) and (max-width:1550px){
#content_large .listing ul{width:1110px;}
#content .listing ul{width:740px;}
}
@media screen and (min-width:768px) and (max-width:1279px){
#content_large .listing ul,
#content .listing ul{width:740px;}
}
@media screen and (min-width:430px) and (max-width:767px){
#content_large .listing ul,
#content .listing ul{width:370px;}
}
@media screen and (max-width:429px){
#content_large .listing li.un-bloc-listing,
#content .listing li.un-bloc-listing{
margin:10px 0 10px 0;
}
#content_large .listing ul,
#content .listing ul{
width:280px;
}
#content_large .listing .listing-item,
#content .listing .listing-item{
width:280px;
height:280px;
display:block;
position: relative;
}
}
/******************************************************/
/************Listing CENTRALE HEBERGEMENTS spécificités (carte et liste côte à côte)*************/
#centrale-dispo-container::after {
clear: both;
}
#centrale-dispo-container::before, #centrale-dispo-container::after {
content: "";
display: block;
height: 0;
overflow: hidden;
}
/* Div qui contient la liste des hébergements dans listing de la centrale*/
#centrale-dispo-container article{
float: left;
width:750px;
padding:0;
}
/* Div qui contient la carte du listing de la centrale*/
#centrale-dispo-container aside.centrale-dispo {
width: calc(100% - 750px);
float: left;
}
#centrale-dispo-container aside.centrale-dispo.sticky {
top: 130px !important;
}
/*Mise en avant d'un bloc listing quand sélectionné sur la carte*/
.listing li.un-bloc-listing.selected{
border:1px solid rgba(0,0,0,0.4);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
-o-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
}
.listing li.un-bloc-listing.selected .texte-absolute-listing{
background-color:#F6A8A3;
}
@media screen and (min-width:1024px){
/*Pour que la liste ne dépasse pas de son conteneur (car pour les autres annuaires sans carte à côté on a des tailles fixes supérieures au 750px de #centrale-dispo-container article)*/
#centrale-dispo-container article ul.listing-centrale{
width:100%;
}
}
@media screen and (min-width:1024px) and (max-width:1279px){
/* Div qui contient la liste des hébergements dans listing de la centrale*/
#centrale-dispo-container article{width:600px;}
/* Div qui contient la carte du listing de la centrale*/
#centrale-dispo-container aside.centrale-dispo {width: calc(100% - 600px);}
.listing-centrale .listing-item-annuaire{
width:280px;
height:280px;
}
}
@media screen and (max-width:1023px){
/* Div qui contient la liste des hébergements dans listing de la centrale*/
#centrale-dispo-container article{
float:none;
width:100%;
}
/* Div qui contient la carte du listing de la centrale*/
#centrale-dispo-container aside.centrale-dispo {
float:none;
clear:both;
width:100%;
}
}
/*********Fin listing centrale spécificités*************/
/******************************************************/
/* Fin listing annuaire / agenda */
/*Afficher sous catégories d'un annuaire préfiltré*/
#categories-annuaire-prefiltre{
margin:20px 0 10px 0;
padding:0;
}
#categories-annuaire-prefiltre #titre-filtrer{
display:inline-block;
background-color:#146E8D;
color:#FFF;
font-family: sans-serif;
font-weight:300;
font-size:0.7em;
text-transform:uppercase;
text-align:center;
padding:10px;
margin:0;
}
#categories-annuaire-prefiltre ul{
border:1px solid #eee;
margin:0;
padding:15px 20px 15px 20px;
font-family:sans-serif;
}
#categories-annuaire-prefiltre ul li{
border: 1px solid #565859;
color: #565859;
display: inline-block;
margin:5px;
padding:0;
}
#categories-annuaire-prefiltre ul li a{
color: #333;
font-weight:300;
font-size:0.85em;
text-decoration: none;
display:block;
border:2px solid #FFF;
padding: 3px 10px;
-webkit-transition: border 1s ease;
-moz-transition: border 1s ease;
-ms-transition: border 1s ease;
-o-transition: border 1s ease;
transition: border 1s ease;
}
#categories-annuaire-prefiltre ul li a:hover{
border:2px solid #565859;
}
/*Filtre actif*/
#categories-annuaire-prefiltre ul li.filtre-actif{
border:1px solid #146E8D;
}
#categories-annuaire-prefiltre ul li.filtre-actif a,
#categories-annuaire-prefiltre ul li.filtre-actif a:hover{
border:2px solid #146E8D;
color:#146E8D;
}
/*Fin afficher sous catégories d'un annuaire préfiltré*/
/*RESPONSIVE Annuaires*/
@media screen and (max-width:767px){
/*****************ANNUAIRES*******************/
#filtres-annuaires, #conteneur-listing-annuaire{
width:100%;
float:none;
clear:both;
margin:0;
}
#conteneur-listing-annuaire{
padding:0;
}
/*****************FIN ANNUAIRES*******************/
}
@media screen and (max-width:480px){
.description-annuaire-listing img{
margin:0 0 20px 0;
width:100%;
}
}
/**Fin Page Listing AGENDA ANNUAIRES*****/
/**********************************/
/**************************************************************/
/****** Entete titre + nav dans single annuaire/ agenda / actu*****/
#entete-fiche,
#entete-listing{
display:table;
width:100%;
margin:0 auto 20px auto;
}
#entete-fiche{
padding-bottom:0px;
margin-bottom:30px;
}
h1.titre-fiche{border-bottom:none;}
h1.titre-fiche,
h2.titre-fiche,
h1.titre-listing,
h2.titre-listing{
display:table-cell; /*h1 est dans un table-cell comme le bloc navigation */
vertical-align:middle;
}
/*Pour le style bloc navigation voir plus loin .nav-fiche .nav-actus*/
/***Fin Entete titre + nav single annuaire/ agenda / actu*****/
/************************************************************/
#repere-sticky-fiche{
/*border:2px solid red;*/
}
/******Page single d'un agenda/annuaire*****/
#colonne1-agenda, #colonne1-annuaire{
display:block;
float:left;
width:66%;
padding:0;
}
#colonne1-agenda-large, #colonne1-annuaire-large{
display:block;
float:none;
width:100%;
padding:0;
}
/* La date de la manif*/
ul#date-manif-fiche{
list-style-type:none;
margin:0 0 30px 0;
padding:0;
font-family: sans-serif;
}
ul#date-manif-fiche li{
display:inline-block;
border:5px solid #333;
padding:10px;
margin:0 10px 10px 0;
color:#333;
font-size:1.3em;
font-weight:700;
}
/* Fin date de la manif*/
/**Icon + infos : Famille / chiens acceptés / Groupes / Mobilité réduite, etc.**/
#colonne1-agenda p.btn,
#colonne1-agenda-large p.btn,
#colonne1-annuaire p.btn,
#colonne1-annuaire-large p.btn{
display:inline-block;
border:1px solid rgba(0,0,0,0.1);
padding:5px 10px 5px 5px;
border-radius:2px;
}
/*Icones fontawesome / ne pas mettre le style sur i qui se retrouve commenté mais sur la balise svg*/
#colonne1-agenda p.btn svg,
#colonne1-agenda-large p.btn svg,
#colonne1-annuaire p.btn svg,
#colonne1-annuaire-large p.btn svg{
margin:0 10px 0 10px;
}
#annuaire-taxonomies,
#commerce-taxonomies,
#entreprise-taxonomies,
#association-taxonomies,
#hebergement-taxonomies,
#agenda-taxonomies{
clear:both;
padding:0 0 5px 0;
margin:10px 0 20px 0;
font-family:sans-serif;
font-weight:300;
border-top:1px solid rgba(0,0,0,0.1);
border-bottom:1px solid rgba(0,0,0,0.1);
}
#annuaire-taxonomies span.taxo,
#commerce-taxonomies span.taxo,
#entreprise-taxonomies span.taxo,
#association-taxonomies span.taxo,
#hebergement-taxonomies span.taxo,
#agenda-taxonomies span.taxo{
font-weight:600;
color:#333;
}
.tranche-prix{
margin:20px 0 0 0;
font-style:italic;
color:#838383;
font-size:0.9em;
font-weight:200;
}
#colonne2-agenda, #colonne2-annuaire{
display:block;
width:30%;
float:right;
padding:0 0 30px 0;
font-family:sans-serif;
color: #565859;
font-weight:300;
}
.bloc-fiche{
border-top:1px solid rgba(0,0,0,0.1);
padding:20px 0 20px 0;
margin:20px 0 20px 0;
}
#description-fiche{
padding:20px;
margin:20px 0 20px 0;
background-color:#f3f7fa;
}
#description-fiche p{
font-size:1.1em;
}
.bloc-fiche h2,
#description-fiche h2{
font-size:2.2em;
margin:0;
padding:20px 0 10px 0;
}
/****************Fiche rando**********************/
#informations-rando-fiche a{
background-color:transparent;
color: #333;
text-decoration:none;
}
.options-annuaire.options-rando{
background-color:#4f4464;
color:#FFF;
border-radius:10px;
padding:20px;
margin:20px 0 20px 0;
}
.options-annuaire.options-rando h3{
color:#FFF;
text-align:center;
margin:0;
padding:20px 0 20px 0;
}
.options-annuaire.options-rando ul{
list-style-type:none;
color:#FFF;
margin:0;
padding:0;
}
.options-annuaire.options-rando ul li{
color:#FFF;
border-bottom:1px solid rgba(0,0,0,0.2);
padding:5px 0 5px 0;
}
.options-annuaire.options-rando ul li:first-child{
border-top:1px solid rgba(0,0,0,0.2);
}
.options-annuaire.options-rando ul li svg{
display:inline-block;
vertical-align: middle;
margin-right:10px;
}
/*************fin fiche rando*******************/
/*************Responsive des fiches***************/
/*Quand page large*/
@media screen and (max-width:1023px){
#content_large #colonne1-agenda,
#content_large #colonne2-agenda,
#content_large #colonne1-annuaire,
#content_large #colonne2-annuaire{
width:100%;
display:block;
clear:both;
padding:0;
}
#content_large #colonne2-agenda,
#content_large #colonne2-annuaire{
margin-top:20px;
}
}
/*Quand page avec menu de gauche (catégories annuaires)*/
@media screen and (max-width:1279px){
#content #colonne1-agenda,
#content #colonne2-agenda,
#content #colonne1-annuaire,
#content #colonne2-annuaire{
width:100%;
display:block;
clear:both;
padding:0;
}
#content #colonne2-agenda,
#content #colonne2-annuaire{
margin-top:20px;
}
}
/**********Fin responsive des fiches***************/
/*****************************************************/
/*************** Le bloc Coordonnées ****************/
#coordonnees-fiche{
position:relative;
display:block;
clear:both;
color:#666;
}
/*L'organisateur*/
#organisateur-agenda{
}
#organisateur-agenda > span{
display:inline-block;
color:#333;
font-weight:600;
}
#organisateur-agenda p{
display:inline-block;
margin:0;
padding:0;
}
/* L'adresse */
#coordonnees-fiche .adresse-fiche{
padding:10px 0 10px 0;
margin:0 0 10px 0;
}
#coordonnees-fiche .adresse-fiche > span{
display:inline-block;
background-color:rgba(0,0,0,0.3);
border-radius:5px;
padding:5px;
font-size:1.4em;
margin-bottom:10px;
}
/*masquer le span gps de la div.adresse-fiche dans les coordonnées de la fiche annuaire*/
#coordonnees-fiche .adresse-fiche > span[itemprop="geo"]{
display: none;
}
/*masquer la tranche de prix car nécessaire pour SEO mais pas intéressant sur les fiches*/
span.hidden[itemprop="priceRange"]{
display:none;
}
#coordonnees-fiche p.btn{
display:inline-block;
border:5px solid #333;
padding:10px 15px 10px 15px;
border-radius:2px;
color:#333;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
#coordonnees-fiche p.btn:hover{
border:5px solid #333;
background-color:rgba(0,0,0,0.03);
}
#coordonnees-fiche p.btn a{
color:#333;
font-weight:600;
text-decoration:none;
}
#coordonnees-fiche p.btn a:hover,
#coordonnees-fiche p.btn a:active{
text-decoration:underline;
}
#coordonnees-fiche p.btn a:hover,
#coordonnees-fiche p.btn a:active{
text-decoration:underline;
}
/*Icones fontawesome / ne pas mettre le style sur i qui se retrouve commenté mais sur la balise svg*/
#coordonnees-fiche p.btn svg,
#coordonnees-fiche p.btn svg{
margin:0 10px 0 10px;
}
#coordonnees-fiche ul{
list-style-type: none;
}
/*************************************/
/******************Les tarifs*********/
#tarifs-fiche{
padding-bottom:10px;
}
/*L'intitulé de tarif*/
/*Pas le même code html selons les différents annuaires agenda, parfois un p parfois un span*/
#tarifs-fiche span.tarif,
#tarifs-fiche p.tarif{
display:block;
float:left;
margin:0 10px 10px 0;
padding:0 10px 0 0;
border-right:1px solid #333;
color:#333;
font-weight:600;
}
/*Le prix*/
#tarifs-fiche span.tarif > span,
#tarifs-fiche p.tarif > span{
font-size:1.5em;
}
/*************************************/
/*******Fin des tarifs***************/
/*************************************/
/*******Periodes ouverture***********/
#informations-ouverture-fiches{
}
ul.les-periodes-ouverture{
margin:0;
padding:0;
list-style-type:none;
}
/*Une période d'ouverture : Du ... au ...*/
ul.les-periodes-ouverture > li{
margin:0 0 20px 0;
color:#333;
font-weight:600;
font-size:1.2em;
}
ul.les-periodes-ouverture > li:last-child{
margin-bottom:0;
}
/*Ensemble de ligne horaire d'une période Lundi : de 9h00 à 20h00 Mardi : de 9h00 à 20h00 etc. */
ul.les-periodes-ouverture > li ul{
margin:10px 0 0 0;
padding:0 0 0 20px;
list-style-type:none;
font-weight:300;
font-size:0.8em;
}
/*Une seule ligne horaire Lundi : de 9h00 à 20h00 */
ul.les-periodes-ouverture > li ul li.periode_jour_horaires{
}
/*Complement horaire */
ul.les-periodes-ouverture > li ul li.complement_horaires{
padding:5px 0 0 0;
color:#4a6a92;
font-weight:400;
font-size:1.1em;
}
/*Jour de fermeture */
ul.les-periodes-ouverture > li ul li.jour_fermeture_horaires{
padding:5px 0 0 0;
color:#333;
font-weight:400;
font-size:1.1em;
}
/*************************************/
/***Fin Periodes ouverture***********/
/*****************************************************/
/**********Adresse / Carte / calcul itinéraire********/
/*Le lieu / Adresse*/
.adresse-fiche > span:first-child{
display:none; /*on cache le texte "Lieu" car on l'a mis en h2 avant*/
}
/*L'adresse*/
/*Rq pas le même code html selon annuaire !?! */
.adresse-fiche .address,
.adresse-fiche > p{
color:#333;
font-weight:600;
padding-bottom:20px;
font-size:1.1em;
}
#carte-fiche{
display:block;
clear:both;
}
/*Le lien Itinéraire*/
a.btn_itineraire{
display:block;
text-align:center;
padding:20px;
background-color:#FFF;
border:5px solid #333;
color:#333;
text-decoration:none;
font-size:1.1em;
margin-top:20px;
border-radius:2px;
font-weight:300;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
a.btn_itineraire:hover{
background-color:#F4F3F2;
border:5px solid #333;
color:#333;
}
a.btn_itineraire svg{
margin-right:10px;
font-size:1.4em;
vertical-align:middle;
}
/****** Fin Adresse / Carte / calcul itinéraire********/
/*****************************************************/
/*****************************************************/
/**********Form contact prestataire******************/
.krea3_formulaire input#submit-contact-prestataire{
margin-left:0;
margin-top:20px;
}
/****** Fin Form contact prestataire******************/
/*****************************************************/
/*****************************************************/
/***************Offres associées / Suggestions********/
#listing-offres-associees{
padding-top:10px;
width: 100%;
max-width: 1245px;
margin: 0 auto 0 auto;
}
#content_large #listing-offres-associees ul{
width:100%;
}
/*espace entre les blocs offres associées*/
#listing-offres-associees li.un-bloc-listing{
margin:4px;
}
#listing-offres-associees .listing-item{
width:300px;
height:300px;
}
@media screen and (min-width:1280px) and (max-width:1365px){
#listing-offres-associees .listing-item{
width:280px;
height:280px;
}
}
@media screen and (min-width:768px) and (max-width:1279px){
#content_large #listing-offres-associees ul{
width:730px;
}
#listing-offres-associees .listing-item{
width:350px;
height:350px;
}
}
@media screen and (min-width:640px) and (max-width:767px){
#content_large #listing-offres-associees ul{
width:580px;
}
#listing-offres-associees .listing-item{
width:280px;
height:280px;
}
}
@media screen and (max-width:639px){
#content_large #listing-offres-associees ul{
width:100%;
max-width:310px;
}
#listing-offres-associees .listing-item{
width:300px;
height:300px;
}
}
/*@media screen and (min-width:768px) and (max-width:1279px){
#listing-offres-associees ul{width:740px;}
}
@media screen and (min-width:430px) and (max-width:767px){
#listing-offres-associees ul{width:370px;}
}
@media screen and (max-width:429px){
#listing-offres-associees li.un-bloc-listing{
margin:10px 0 10px 0;
}
#listing-offres-associees ul{
width:280px;
}
#listing-offres-associees .listing-item{
width:280px;
height:280px;
display:block;
position: relative;
}
}*/
/*****************************************************/
/*************** Le bloc réservation ****************/
#sticky-bloc-fiche{
padding:20px;
border:none;
background-color:#FFF;
border:1px solid rgba(0,0,0,0.1);
position:relative;
display:block;
clear:both;
text-align:center;
color:#333;
margin:0 0 30px 0;
}
#sticky-bloc-fiche h2{
margin:0;
padding:10px 0 15px 0;
color:#333;
font-weight:400;
font-family:sans-serif;
}
/*Le lien Je réserve*/
a.btn_je_reserve{
display:block;
padding:20px;
background-color:#f6a8a3;
color:#333;
text-decoration:none;
font-size:1.1em;
margin-top:30px;
border-radius:2px;
font-weight:700;
text-transform:uppercase;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
a.btn_je_reserve:hover{
background-color:#333;
color:#FFF;
}
a.btn_je_reserve svg{
margin-right:10px;
font-size:1.4em;
vertical-align:middle;
}
/* L'adresse */
#sticky-bloc-fiche .adresse-fiche{
padding:15px 0 0 0;
margin:20px 0 20px 0;
border-top:1px solid rgba(0,0,0,0.1);
border-bottom:1px solid rgba(0,0,0,0.1);
}
#sticky-bloc-fiche .adresse-fiche p{
color:#333;
}
/* Les liens tel, fax*/
#sticky-bloc-fiche p.btn a{
color:#333;
font-weight:400;
font-size:1.2em;
text-decoration:none;
}
#sticky-bloc-fiche p.btn a:hover,
#sticky-bloc-fiche p.btn a:active{
text-decoration:underline;
}
/*Icones fontawesome / ne pas mettre le style sur i qui se retrouve commenté mais sur la balise svg*/
#sticky-bloc-fiche p.btn svg,
#sticky-bloc-fiche p.btn svg{
margin:0 10px 0 10px;
color:#333;
}
/*Liens mail et site*/
#sticky-bloc-fiche p.btn_site,
#sticky-bloc-fiche p.btn_mail{
border-top:1px solid rgba(0,0,0,0.1);
padding:15px 0 0 0;
margin:20px 0 0 0;
}
#sticky-bloc-fiche p.btn_site{
border-bottom:1px solid rgba(0,0,0,0.1);
padding-bottom:20px;
}
#sticky-bloc-fiche p.btn_site a,
#sticky-bloc-fiche p.btn_mail a{
display:block;
overflow-wrap:break-word;
font-weight:200;
font-size:1em;
}
/*************Fin du bloc réservation ****************/
/*****************************************************/
.ui-menu .ui-menu-item{
font-size:1.2em;
padding:5px;
}
.adp, .adp table {
margin: 0 auto;
width: 70%;
}
#carte-fiche .adp-directions, #carte-fiche .adp-summary{
color:#565859 !important;
font-size:1.3em;
}
#carte-fiche .adp-legal{
color:#565859;
}
#carte-fiche .adp-placemark {
background:#565859 none repeat scroll 0 0;
border: 1px solid #565859;
font-weight:600 !important;
color:#fff;
font-size:1.3em;
}
/*******Liens sociaux fiche*****/
ul#liens-sociaux-fiche{
margin:20px 0 20px 0;
padding:0;
list-style-type:none;
}
ul#liens-sociaux-fiche li{
}
ul#liens-sociaux-fiche li a{
display:table;
text-decoration:none;
font-weight:normal;
}
ul#liens-sociaux-fiche span.icon-social:before{
font-family: FontAwesome;
display:table-cell;
content: "\f09a";
vertical-align: middle;
padding:10px;
background-color:#333;
color:#FFF;
border-radius:2px;
}
ul#liens-sociaux-fiche span.text-social{
display:table-cell;
vertical-align: middle;
display:none;
}
/*****Fin liens sociaux fiche **/
/*******HEBERGEMENT*********/
#barre-icones-entete{
list-style-type:none;
text-align:center;
padding:0;
margin:0;
}
#barre-icones-entete ul{
padding:0;
margin:0;
}
#barre-icones-entete li{
display:inline-block;
}
/*******FIN HEBERGEMENT*********/
/******Fin Page single d'un agenda*****/
/*********************FIN AGENDA ANNUAIRES********************/
/*************************************************************************/
/****La navigation interne (annuaires, agenda, actus, resultats recherche...)****/
/*Le bloc contenant les éléments de navigation*/
.nav{
list-style-type:none;
}
/*Cas 1 le bloc est dans annuaires / agenda / actu */
.nav-listing,
.nav-fiche,
.nav-actus{
margin:0;
padding-left:10px;
padding-right:10px;
display:table-cell;
vertical-align:middle;
min-width:100px;
}
.nav-fiche{/*largeur à ajouter selon le nombre de boutons de nav (varie selon site avec carnet de voyage, pdf, etc.)*/}
.nav-actus{width:200px;}
/*flèches de pagination actu en bas de page*/
#nav-bas-listing .nav-actus{min-width:none; width:100%; padding-left:0; float:right;}
.nav-listing li,
.nav-fiche li,
.nav-actus li{
display:inline-block;
margin:0;
padding:0;
}
/* les icones retour précédent suivant */
.nav-actus .svg-inline--fa{
width: 40px;
height: 40px;
}
/*Pour les fiches (page single)*/
@media screen and (max-width:1023px) {
#entete-fiche{
display:block;
}
h1.titre-fiche{
display:block;
}
.nav-fiche,
.nav-actus{
margin:0;
padding-left:0;
display:block;
}
}
/*Pour page listing annuaires / agenda */
@media screen and (max-width:480px) {
#entete-listing{
display:block;
}
h1.titre-listing{
display:block;
}
.nav-listing{
margin:0;
padding-left:0;
display:block;
}
}
/*Fin cas 1*/
/*Cas 2 le bloc est dans résultats de recherche */
.nav-results{
margin:0;
display:table;
width:100%;
}
.nav-results-top{padding:0 0 10px 0;}
.nav-results-bottom{padding:30px 0 10px 0;}
.nav-results li{
display:table-cell;
width:50%;
}
/*Positionnement des boutons résultats suivants et résultats précédents*/
.nav-results li.nav-precedent{padding-right:10px;}
.nav-results li.nav-suivant{padding-left:10px;}
.nav-results li.nav-precedent a{float:left;}
.nav-results li.nav-suivant a{float:right;}
/*Fin cas 2*/
/*Un bouton de navigation*/
.nav li a{
display:table;
color:#333;
text-decoration:none;
font-weight:normal;
-webkit-transition: background-color 3s ease;
-moz-transition: background-color 3s ease;
-ms-transition: background-color 3s ease;
-o-transition: background-color 3s ease;
transition: background-color 3s ease;
}
/*Couleur bouton au survol*/
.nav li a:hover{
background-color: #333;
}
/*Pour les boutons mode liste et mode carte*/
.nav li a.cbp-vm-selected{
background-color: #333;
}
/*Régler ici la couleur pour chaque bouton si besoin*/
.nav li.nav-mode-liste a,
.nav li.nav-mode-carte a{background-color:transparent; color:#bdbdbd;}
.nav li.nav-mode-carte a{margin-right:10px;}
.nav li.nav-mode-liste a.cbp-vm-selected,
.nav li.nav-mode-carte a.cbp-vm-selected{background-color:transparent; color:#333;}
.nav li.nav-retour-agenda a{}
.nav li.nav-retour-agenda a:hover{}
.nav li.nav-retour-annuaire a{background-color:transparent; color:#333; margin-right:15px;}
.nav li.nav-retour-annuaire a:hover{}
.nav li.nav-precedent a{}
.nav li.nav-precedent a:hover{}
.nav li.nav-suivant a{}
.nav li.nav-suivant a:hover{}
.nav li.nav-ajout-carnet a{}
.nav li.nav-ajout-carnet a:hover{}
.nav li.nav-suppression-carnet a{}
.nav li.nav-suppression-carnet a:hover{}
.nav li.nav-pdf a{}
.nav li.nav-pdf a:hover{}
.nav li a span{
display:table-cell;
vertical-align:middle;
}
/* L'icone */
.nav li a span.icon-nav{
padding:15px;
}
/* Le texte */
.nav li a span.text-nav{padding:15px 15px 15px 0; font-family:sans-serif; font-weight:100;}
.nav li.nav-suivant span.text-nav{padding:15px 0 15px 15px;}
/*On cache le texte dans annuaires / agenda / actu*/
.nav-listing li a span.text-nav,
.nav-fiche li a span.text-nav,
.nav-actus li a span.text-nav{display:none;}
/*Sauf pour le carnet de voyage*/
.nav-fiche li.nav-ajout-carnet a span.text-nav, .nav-actus li.nav-ajout-carnet a span.text-nav,
.nav-fiche li.nav-suppression-carnet a span.text-nav, .nav-actus li.nav-suppression-carnet a span.text-nav{
display:table-cell;
}
/***Appel des img icones des liens de navigation****/
.nav li span.icon-nav:before{
font-family: "Font Awesome 5 Solid";
display: none;
}
/*Mode liste*/
.nav li.nav-mode-liste span.icon-nav:before{content: "\f00a";}
/*Mode carte*/
.nav li.nav-mode-carte span.icon-nav:before{content: "\f041";}
/* retour listing agenda */
.nav li.nav-retour-agenda span.icon-nav:before{content: "\f053";}
/* retour listing annuaire */
.nav li.nav-retour-annuaire span.icon-nav:before{content: "\f00a";}
/* fleches précédent / suivant */
.nav li.nav-precedent span.icon-nav:before{content: "\f053";}
.nav li.nav-suivant span.icon-nav:before{content: "\f054";}
/*Ajout / suppression carnet de voyage*/
.nav li.nav-ajout-carnet span.icon-nav:before{content: "\f067";}
.nav li.nav-suppression-carnet span.icon-nav:before{content: "\f1f8";}
/*Générer un pdf*/
.nav li.nav-pdf span.icon-nav:before{content: "\f1c1";}
/*Fermer le wrapper itineraire*/
.nav li.nav-fermer-itineraire span.icon-nav:before{content: "\f00d";}
/*Ouvrir l'itineraire sur Google Maps*/
.nav li.nav-google-map span.icon-nav:before{content: "\f278";}
/****Fin navigation interne (annuaires, agenda, resultats recherche...)****/
/*************************************************************************/
/****************************************/
/*Ci-dessous styles ajoutés par Gaylord et François pour leurs outils, peaufinage possible / à conserver*/
/***************************************/
/* Flèche retour en haut de page */
#scroll{
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4);
border-radius: 4px;
bottom: 4%;
color: #FFFFFF;
cursor: pointer;
font-size: 16px;
line-height: 40px;
position: fixed;
right: 20px;
text-align: center;
transition: background-color 0.3s linear 0s;
width: 40px;
z-index: 2000;
display: block;}
#scroll a{text-decoration:none; color:#FFF;}
/*fin flèche retour haut de page*/
/******************************************
* Align box
******************************************/
img.centered, .aligncenter, div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}
img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
/**
* css pour les légendes
*/
/*On style le bloc image*/
.wp-caption {border:1px solid #eee; padding:10px; max-width:100%; background-color:#FFF;}
/*Ajout d'espace pour aérer autour de l'image*/
.alignleft{margin-right:10px;}
.alignright{margin-left:10px;}
/*On centre l'image.*/
.wp-caption img {margin:0;padding:0;border:0 none; max-width:100%;}
/*Alignement, taille et couleur de la légende*/
.wp-caption p,.wp-caption-text {font-family:sans-serif;text-align:center;font-size:1em;line-height:1.4em;font-weight:bold; color:#333; padding:10px 0 0 0;margin:0; font-weight:400;}
/*Ajout des arrondis sur le caption*/
.wp-caption {-moz-border-radius:0px;-khtml-border-radius:0px;-webkit-border-radius:0px;border-radius:0px}
/*Ajout d'une ombre sous le caption*/
.wp-caption{/*-moz-box-shadow:0 3px 4px rgba(0,0,0,.5);-webkit-box-shadow:0 3px 4px rgba(0,0,0,.5);box-shadow:0 3px 4px rgba(0,0,0,.5); */ -moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none; }
.resize {width: 160px;height : auto;}
.resize {width: auto;height : 120px;}
/*Ajout François pour ses outils */
.nav-previous a, .nav-next a{padding:10px 20px;}
/* =Cartographie annuaires + single
---------------------------------------------------------------------------------------------*/
#map_canvas{
box-shadow:none !important;
border:8px solid #fff;
}
.cbp-vm-switcher #map_canvas{
width: 100%;
}
h4#titre_calcul_itineraire{
font-weight:400;
padding-bottom:10px;
}
#wrapper_itineraire{
padding:20px;
margin-bottom:20px;
text-align:center;
border:2px solid #E8E8E8;
}
#wrapper_input_calcul_itineraire{
margin:0;
}
#directionsPanel{
margin-top:2em;
}
#google_map_itineraire, #generer_itineraire_pdf{
/*margin-top:30px;*/
}
#fermer_itineraire{
margin:30px auto 0 auto;
float:none;
/*display:block;*/
clear:both;
max-width:100px;
}
.adp-summary, .adp-legal {
margin: 20px auto;
padding: 0 3px 3px;
text-align: center;
width: 50%;
}
#calcul-itineraire-fiche #carte {
height: 400px;
width: 100%;
}
.info-windows{
border-radius:5px;
padding:10px;
}
.i-box p{
display:block;
margin:20px 0 15px 20px;
}
.i-box h3{
font-family: sans-serif;
border-bottom:1px solid #eee;
padding:0 0 10px 0;
margin:0 0 15px 0;
}
.info-windows .i-box img.wp-post-image {
float: left;
max-width: 110px !important;
width: 110px !important;
margin:0 20px 20px 0;
display:block;
}
#map_canvas img { max-width: none; } /* résoudre le bug en Responsive Design */
#pano img { border: none !important; max-width: none !important;} /* résoudre le bug en Responsive Design */
#map img { max-width: none; } /* résoudre le bug en Responsive Design */
#carte img{max-width: none; }
/* =Listings
---------------------------------------------------------------------------------------------*/
/* masquer un élément */
.listing-hidden{display:none;visibility: hidden;}
/* afficher un élément */
.listing-visible{display: block;visibility: visible;}
/* une grille responsive simple */
.cbp-vm-switcher .row {width : 100%;}
.cbp-vm-switcher .row > div {margin : 0 0.5% 1%;float: left;min-height:370px;}
.cbp-vm-switcher .row > div h2 {font-size: 1.2em;}
.cbp-vm-switcher .row .w-1 { width : 7.3%; }
.cbp-vm-switcher .row .w-2 { width : 15.6%; }
.cbp-vm-switcher .row .w-3 { width : 24%; }
.cbp-vm-switcher .row .w-4 { width : 32.3%; }
.cbp-vm-switcher .row .w-5 { width : 40.6%; }
.cbp-vm-switcher .row .w-6 { width : 49%; }
.cbp-vm-switcher .row .w-7 { width : 57.3%; }
.cbp-vm-switcher .row .w-8 { width : 65.6%; }
.cbp-vm-switcher .row .w-9 { width : 74%; }
.cbp-vm-switcher .row .w-10 { width : 82.3%; }
.cbp-vm-switcher .row .w-11 { width : 90.6%; }
.cbp-vm-switcher .row .w-12 { width : 99%; }
@media only screen and (max-width:500px) {
.cbp-vm-switcher .row {width : 100%;}
.cbp-vm-switcher .row > div { margin : 0 1%;}
.w-1, .w-2, .w-3, .w-4, .w-5, .w-6, .w-7, .w-8, .w-9, .w-10, .w-11, .w-12 { width : 98%; float : none;}
}
/*! Remodal - v0.1.6 - 2014-05-16
* https://github.com/VodkaBears/remodal
* Copyright (c) 2014 VodkaBears; */
/* ==========================================================================
Remodal necessary styles
========================================================================== */
/* Hide scroll bar */
html.remodal_lock, body.remodal_lock {
overflow: hidden;
}
/* Anti FOUC */
.remodal, [data-remodal-id] {
visibility: hidden;
}
/* Overlay necessary styles */
.remodal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10000;
display: none;
overflow: auto;
-webkit-overflow-scrolling: touch;
text-align: center;
}
.remodal-overlay:after {
display: inline-block;
height: 100%;
margin-left: -0.05em;
content: '';
}
/* Fix iPad, iPhone glitches */
.remodal-overlay > * {
-webkit-transform: translateZ(0px);
}
/* Modal dialog necessary styles */
.remodal {
position: relative;
display: inline-block;
}
/* ==========================================================================
Remodal default theme
========================================================================== */
/* Default theme font */
@import url(http://fonts.googleapis.com/css?family=Exo+2:700,400&subset=latin,cyrillic);
.remodal, .remodal * {
font-family:sans-serif;
}
/* Background for effects */
.remodal-bg {
-webkit-transition: -webkit-filter 0.2s linear;
-moz-transition: -moz-filter 0.2s linear;
-o-transition: -o-filter 0.2s linear;
transition: filter 0.2s linear;
}
body.remodal_active .remodal-bg {
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
}
/* Overlay default theme styles */
.remodal-overlay {
opacity: 0;
background: rgba(33, 36, 46, 0.95);
-webkit-transition: opacity 0.2s linear;
-moz-transition: opacity 0.2s linear;
-o-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
}
body.remodal_active .remodal-overlay {
opacity: 1;
}
/* Modal dialog default theme styles */
.remodal {
width: 100%;
min-height: 100%;
padding: 35px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 16px;
background: #f4f4f4;
background-clip: padding-box;
color: #182a3c;
-webkit-box-shadow: 0px 0px 8px #171a24;
box-shadow: 0px 0px 8px #171a24;
-webkit-transform: scale(0.95);
-moz-transform: scale(0.95);
-ms-transform: scale(0.95);
-o-transform: scale(0.95);
transform: scale(0.95);
-webkit-transition: -webkit-transform 0.2s linear;
-moz-transition: -moz-transform 0.2s linear;
-o-transition: -o-transform 0.2s linear;
transition: transform 0.2s linear;
}
body.remodal_active .remodal {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
/* Modal dialog vertical align */
.remodal, .remodal-overlay:after {
vertical-align: middle;
}
/* Close button */
.remodal-close {
position: absolute;
top: 5px;
right: 5px;
width: 28px;
height: 28px;
text-decoration: none;
-webkit-border-radius: 50%;
border-radius: 50%;
border: 2px solid #3e5368;
-webkit-transition: background 0.2s linear;
-moz-transition: background 0.2s linear;
-o-transition: background 0.2s linear;
transition: background 0.2s linear;
}
.remodal-close:after {
display: block;
font-size: 28px;
font-family: sans-serif;
content: "×";
line-height: 23px;
cursor: pointer;
text-decoration: none;
color: #3e5368;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.remodal-close:hover, .remodal-close:active {
background: #3e5368;
}
.remodal-close:hover.remodal-close:after, .remodal-close:active.remodal-close:after {
color: #f4f4f4;
}
/* Dialog buttons */
.remodal-confirm, .remodal-cancel {
display: inline-block;
width: 120px;
padding: 9px 0;
margin: 0 0 5px 0;
font-size: 10pt;
cursor: pointer;
text-decoration: none;
text-align: center;
-webkit-border-radius: 50px;
border-radius: 50px;
background-clip: padding-box;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.remodal-confirm {
border: 2px solid #16a085;
background: #f4f4f4;
color: #16a085;
}
.remodal-confirm:hover, .remodal-confirm:active {
background: #16a085;
color: #f4f4f4;
}
.remodal-cancel {
border: 2px solid #c0392b;
background: #f4f4f4;
color: #c0392b;
}
.remodal-cancel:hover, .remodal-cancel:active {
background: #c0392b;
color: #f4f4f4;
}
/* Media queries
========================================================================== */
@media only screen and (min-width: 40.063em) /* min-width 641px */ {
.remodal {
max-width: 700px;
margin: 20px auto;
min-height: 0;
-webkit-border-radius: 6px;
border-radius: 6px;
}
}
/************************************************************************************************/
/***********************************A personnaliser à chaque site********************************/
.remodal {
background: url(assets/images/post-it/fond_postit.png) #FFF no-repeat scroll top center;
/*background-size:contain;*/
border-radius: 6px;
margin: 20px auto;
max-width: 700px;
min-height: 0;
padding-top:70px;
color:#666;
}
.remodal h1,
.remodal h2,
.remodal p,
.remodal ul,
.remodal ol{text-align:left;}
.remodal h1 {color:#3f474c; font-size:1.7em; margin:0 0 15px 0; padding:0; font-family: sans-serif; font-weight:700;}
.remodal h2 {color:#3a9cc1; font-size:1.4em; margin:15px 0 10px 0; padding:0; font-family: sans-serif; font-weight:700;}
.remodal-confirm {
background: none repeat scroll 0 0 #f4f4f4;
background-color:#3f474c;
border:2px solid rgba(0,0,0,0.1);
color:#FFF;
font-family:sans-serif;
font-weight:600;
font-size:0.9em;
}
.remodal-confirm:active,
.remodal-confirm:hover {
background: #3a9cc1;
color: #f4f4f4;
}
/* Close button */
.remodal-close {
border: 2px solid #3a9cc1;
}
.remodal-close:after {
color: #3a9cc1;
}
.remodal-close:hover, .remodal-close:active {
background: #3a9cc1;
}
.remodal-close:hover.remodal-close:after, .remodal-close:active.remodal-close:after {
color: #fff;
}
/*****************************formulaires administrables***********************************************/
form.visual-form-builder{
font-family:inherit;
margin:20px 0;
}
form.visual-form-builder li{width:auto !important;}
.visual-form-builder ul{
list-style:none;
margin:0 14px;
padding:0;
font-size:0.8em;
}
.visual-form-builder li{
clear:both;
margin:0;
padding:6px 1% 9px;
width:64%;
list-style-type:none;
}
.visual-form-builder li div span, span.full input, span.full select{
display:block;
float:left;
width:100%;
}
.visual-form-builder span.left{
float:left;
width:48%;
}
.visual-form-builder span.right{
float:right;
width:48%;
}
.visual-form-builder span.right input, .visual-form-builder span.right select, .visual-form-builder span.left input, .visual-form-builder span.left select{width:100%;}
.visual-form-builder span.time{float:left;margin:0 0.3em 0 0;}
.visual-form-builder li div label, .visual-form-builder li span label{font-size:90%;}
.visual-form-builder fieldset{
background-color:#F8F8F8;
border-radius:3px;
border:1px solid #eee;
margin:15px 0;
clear:both;
}
.visual-form-builder .legend{
margin:5px 14px;
padding:0 6px;
color:#990000;
border-bottom:1px solid #eee;
font-size:inherit;
}
.visual-form-builder .legend h3{font-size:20px;}
.visual-form-builder label, label.desc{
display:block;
margin:0;
padding-bottom:3px;
color:#000;
}
label.desc, span.vfb-desc-address{font-weight:bold;}
.visual-form-builder label.choice{
font-size:100%;
line-height:150%;
margin:-17px 0 0 23px;
padding:0 0 5px;
width:88%;
}
.visual-form-builder label span{
color:#BC1212;
vertical-align:middle;
}
input.text, textarea.textarea, select.select{
font-size:100%;
font-family:inherit;
margin:0;
padding:2px 0;
border:1px solid #D3D3D3;
}
input.medium, select.medium{width:50%;}
input.large, select.large, textarea.textarea{width:100%;}
textarea.medium{height:10em;}
textarea.large{height:20em;}
.submit{font-size:1.1em;}
input.checkbox, input.radio{
font-size:1.1em;
display:block;
height:13px;
width:13px;
margin:4px 0 0;
}
label.error{
color:red;
font-weight:bold;
font-size:90%;
}
input.error, select.error, textarea.error{border:1px solid red;}
p#form_success{
color:green;
font-weight:bold;
}
#ui-datepicker-div { display: none; }
.ed_button{
font-family: sans-serif;
font-size:12px;
background-image: -moz-linear-gradient(top, #fcfcfc 0%, #e9e8e8 100%);
background-image: -o-linear-gradient(top, #fcfcfc 0%, #e9e8e8 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fcfcfc), color-stop(1, #e9e8e8));
background-image: linear-gradient(top, #fcfcfc 0%, #e9e8e8 100%);
min-width:26px;
margin:3px 1px 4px;
padding:2px 4px;
box-shadow:0 1px 0 #e3e3e3;
border-radius:3px 3px 3px 3px;
border:#C3C3C3 1px solid;
text-transform:lowercase;
}
.ed_button:hover{
background:none repeat scroll 0 0 #dddddd;
border-color:#aaaaaa;
cursor:pointer;
}
.ed_button.ed_bold{font-weight:bold;}
.ed_button.ed_italic{font-style:italic;}
.ed_button.ed_link{color:#0000FF;text-decoration:underline;}
.ed_button.ed_del{text-decoration:line-through;}
.item-instructions{background-color:#e3e3e3;border-radius:3px;}
form.visual-form-builder input#sendmail{
background-color:#333;
border:1px solid #333;
color:#FFF;
padding:10px;
margin-top:20px;
cursor: pointer;
border-radius:3px;
}
form.visual-form-builder input#sendmail:hover{
background-color:#3e3e3e;
border:1px solid #3e3e3e;
}
form.visual-form-builder span.vfb-address-desc{
font-weight:bold;
}
form.visual-form-builder span.vfb-address-desc span{
color: #BC1212;
}
/*****************************fin formulaires administrables ***********************************************/
/* =jQuery UI
--------------------------------------------------------------------------------------- */
/* Rechercher par nom */
.ui-autocomplete {
background-image: none;
background-color: #347491;
color: #fff;
text-decoration: none;
}
.ui-menu .ui-menu-item {
background-image: none !important;
background-color: #ffffff;
color: #666;
}
.ui-menu .ui-menu-item:hover, .ui-menu .ui-menu-item.ui-state-focus {
background-image: none !important;
background-color: #333;
color: #ffffff;
/*font-size: 0.8em;*/
}
.ui-menu .ui-menu-item a {
color: #ffffff;
border: none !important;
font-size: 0.8em;
}
.ui-menu .ui-menu-item :hover {
background: #ffffff none;
color: #000000;
}
/* Titre accordeon ferme */
#infos-fiche h3.ui-accordion .ui-accordion-header {
cursor: pointer;
position: relative;
margin-top: 1px;
zoom: 1;
}
#infos-fiche h3.ui-helper-reset {
margin: 10px 0 0 0;
padding: 0;
outline: 0;
line-height: 1.3;
text-decoration: none;
font-size: 100%;
list-style: none;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
border: 1px solid #f1f1f1;
background: #FBFBFB;
font-weight: normal;
color: #106470;
}
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited{
color: #106470;
text-decoration: none;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus{
font-weight: normal;
border: 1px solid #f1f1f1;
background: #ededed;
color: #666;
}
.ui-state-hover a, .ui-state-hover a:hover {
color: #666;
text-decoration: none;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active
{
border: 1px solid #f1f1f1;
background: #ffffff;
font-weight: normal;
color: #666;
}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited
{
color: #666;
text-decoration: none;
}
.ui-widget :active {
outline: none;
}
/* Partie qui s'ouvre */
.ui-widget-content {
border: 1px solid #f1f1f1;
background-color: #ffffff;
color: #666;
font-size: 0.8em;
z-index: 80 !important;
}
/*les span adresse, tel, email, etc.*/
.ui-widget-content span {
font-weight: bold;
}
/* Supprimer icone du carnet du ui dialog */
.ui-widget-header {
background: none;
background-color: #666;
color: #FFF;
}
/* Replacer le titre du ui dialog a gauche */
span#ui-id-1 {
padding: 0;
}
/* Slider */
.ui-slider .ui-slider-handle {
background-color: #666;
}
.ui-slider-range {
background-color: #333;
}
.ui-accordion .ui-accordion-header {
margin-bottom: 0;
margin-top: 2px;
font-size: 1em;
}
.ui-widget.ui-datepicker {
font-size: 90%;
padding: 0;
width: auto
}
/* partie haute du calendrier */
.ui-widget.ui-datepicker.ui-widget-content {
font-family:sans-serif;
background: #F4F4F4;
border: none;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
z-index: 200 !important
}
.ui-widget.ui-datepicker.ui-widget-content span{
color: #fff;
}
.ui-widget.ui-datepicker .ui-datepicker-header {
border: none;
background: #666;
font-weight: normal;
font-size: 15px
}
.ui-widget.ui-datepicker .ui-datepicker-header .ui-state-hover {
background: transparent;
border-color: transparent;
cursor: pointer;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0
}
/* les textes */
.ui-widget.ui-datepicker .ui-datepicker-title {
margin-top: .4em;
margin-bottom: .3em;
color: #666;
}
.ui-widget.ui-datepicker .ui-datepicker-prev-hover,
.ui-widget.ui-datepicker .ui-datepicker-next-hover,
.ui-widget.ui-datepicker .ui-datepicker-next,
.ui-widget.ui-datepicker .ui-datepicker-prev{
top: .9em;
border: none
}
.ui-widget.ui-datepicker .ui-datepicker-prev-hover {
left: 2px
}
.ui-widget.ui-datepicker .ui-datepicker-next-hover {
right: 2px
}
.ui-widget.ui-datepicker .ui-datepicker-next span, .ui-widget.ui-datepicker .ui-datepicker-prev span
{
background-position: -32px 0;
margin-top: 0;
top: 0;
font-weight: normal
}
.ui-widget.ui-datepicker .ui-datepicker-prev span {
background-position: -96px 0
}
.ui-widget.ui-datepicker table {
margin: 0
}
.ui-widget.ui-datepicker thead {
background-color: #666;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
}
.ui-widget.ui-datepicker th {
padding: 1em 0;
font-size: 13px;
font-weight: normal;
color: #333;
border: none;
}
/* couleur des cases du tableau */
.ui-widget.ui-datepicker td {
border: none;
padding: 0;
background: #F1F1F1;
opacity: 1;
}
.ui-widget.ui-datepicker td .ui-state-default {
background: transparent;
border: none;
text-align: center;
padding: .5em;
margin: 0;
font-weight: normal;
font-size: 16px;
color: #333;
}
.ui-widget.ui-datepicker td .ui-state-active, .ui-widget.ui-datepicker td .ui-state-hover
{
background: #666;
color:#FFF;
}
.ui-widget.ui-datepicker .ui-state-disabled, .ui-widget.ui-datepicker .ui-widget-content .ui-state-disabled,
.ui-widget.ui-datepicker .ui-widget-header .ui-state-disabled {
opacity: 1;
filter: Alpha(Opacity = 100);
background-image: none
}
.ui-widget.ui-datepicker .ui-state-disabled .ui-state-default,
.ui-widget.ui-datepicker .ui-widget-content .ui-state-disabled .ui-state-default,
.ui-widget.ui-datepicker .ui-widget-header .ui-state-disabled .ui-state-default
{
opacity: 0.5
}
.ui-datepicker-header.ui-widget-header {
border: none !important;
}
/* =Profils / tags
---------------------------------------------------------------------------------------------*/
/*page je suis*/
#je-suis-no-js{
background-color:#F8F8F8;
font-family:sans-serif;
text-align:center;
color:#666;
font-weight:100;
font-size:1em;
padding:20px;
margin:30px auto 30px auto;
}
#je-suis-no-js span{
font-size:1.2em;
display:inline-block;
padding:0 0 15px 0;
vertical-align: middle;
text-transform:uppercase;
color:#333;
font-weight:700;
}
/*#je-suis-no-js span:after{
font-family: FontAwesome;
content: '\f2be';
padding-left:10px;
font-size:1.5em;
display:inline-block;
vertical-align: middle;
}*/
#je-suis-no-js ul{
margin:0;
padding:0;
list-style:none;
}
#je-suis-no-js ul li{
display:inline-block;
margin:5px;
border:1px solid #f6a8a3;
font-size:1.8em;
}
#je-suis-no-js ul li a{
display:block;
color:#333;
font-weight:400;
text-decoration:none;
padding:5px 10px 5px 10px;
border:1px solid #F8F8F8;
-webkit-transition: border 1s ease;
-moz-transition: border 1s ease;
-ms-transition: border 1s ease;
-o-transition: border 1s ease;
transition: border 1s ease;
}
#je-suis-no-js ul li a:hover,
#je-suis-no-js ul li a:focus{
border:1px solid #f6a8a3;
}
#je-suis-no-js ul li a:focus{
color:#FFF;
background-color:#f6a8a3;
font-weight:200;
}
/*fin de Je suis quand js désactivé*/
/*Filtres dans une page profil de Je suis*/
#filtres-dans-je-suis{
margin:20px 0 10px 0;
padding:0;
}
#filtres-dans-je-suis #titre-filtrer{
display:inline-block;
background-color:#146E8D;
color:#FFF;
font-family:sans-serif;
font-weight:300;
font-size:0.7em;
text-transform:uppercase;
text-align:center;
padding:10px;
margin:0;
}
#filtres-dans-je-suis ul{
border:1px solid #eee;
margin:0;
padding:15px 20px 15px 20px;
font-family:sans-serif;
}
#filtres-dans-je-suis ul li{
border: 1px solid #4c5356;
color: #4c5356;
display: inline-block;
margin:5px;
padding:0;
}
#filtres-dans-je-suis ul li a{
color: #333;
font-weight:300;
font-size:0.85em;
text-decoration: none;
display:block;
border:2px solid #FFF;
padding: 3px 10px;
-webkit-transition: border 1s ease;
-moz-transition: border 1s ease;
-ms-transition: border 1s ease;
-o-transition: border 1s ease;
transition: border 1s ease;
}
#filtres-dans-je-suis ul li a:hover,
#filtres-dans-je-suis ul li a:focus{
border:2px solid #4c5356;
}
/*Filtre actif*/
#filtres-dans-je-suis ul li.filtre-actif{
border:1px solid #146E8D;
}
#filtres-dans-je-suis ul li.filtre-actif a,
#filtres-dans-je-suis ul li.filtre-actif a:hover,
#filtres-dans-je-suis ul li.filtre-actif a:focus{
border:2px solid #146E8D;
color:#146E8D;
}
/* =Disponibilités hébergements
---------------------------------------------------------------------------------------------*/
form#recherche-dispo{
max-width:100%;
margin-bottom:0;
}
#centrale-dispo-container{
margin-top:20px;
}
#choix-dates-centrale,
#prix-filtres-effacer-centrale{
display:inline-block;
vertical-align: middle;
}
span.duree_sejour{
display: inline-block;
vertical-align: middle;
color: #4a6a92;
font-weight: 400;
}
/*Bouton recherche centrale dispo*/
a#rechercher_hebergements,
a#plus_criteres_centrale,
a#reset_recherche_centrale,
a#afficher_tarifs,
.centrale.annuler-criteres,
.centrale.reset-criteres,
.centrale.appliquer-criteres{
background-color:#FFF;
border:1px solid rgba(0,0,0,0.1);
color:#E84627;
color:#666;
font-size:1em;
font-weight:300;
font-family:sans-serif;
text-decoration:none;
padding:10px;
margin:0 5px 0 5px;
display:inline-block;
}
a#plus_criteres_centrale,
a#afficher_tarifs{
color:#E84627;
}
a#rechercher_hebergements:hover,
a#plus_criteres_centrale:hover,
a#reset_recherche_centrale:hover,
a#afficher_tarifs:hover,
.centrale.annuler-criteres:hover,
.centrale.reset-criteres:hover{
border:1px solid rgba(0,0,0,0.3);
}
.centrale.appliquer-criteres{
color:#333;
border:2px solid #E84627;
font-weight:600;
}
.centrale.appliquer-criteres:hover{
color:#E84627;
}
a#afficher_tarifs.active,
a#plus_criteres_centrale.active{
background-color:#E84627;
color:#FFF;
}
/* tarifs */
#wrapper-tarifs {
margin:20px 0 20px 0;
padding:20px;
background-color:#FFF;
border:1px solid rgba(0,0,0,0.1);
}
#tarifs-chiffres{
padding:0 0 10px 0;
color:#E84627;
}
#slider-tarif{
width: 100%;
max-width: 300px;
margin: 0 auto 0 auto;
}
#actions-tarif{
padding-top:5px;
}
button.bt-effacer-tarif,
button.bt-appliquer-tarif{
background-color:#FFF;
font-size:1em;
font-family:sans-serif;
text-decoration:none;
padding:10px;
margin:5px;
display:inline-block;
}
button.bt-effacer-tarif{
border:1px solid rgba(0,0,0,0.1);
color:#666;
font-weight:300;
}
button.bt-effacer-tarif:hover{
border:1px solid rgba(0,0,0,0.3);
}
button.bt-appliquer-tarif{
color:#333;
border:2px solid #E84627;
font-weight:600;
}
button.bt-appliquer-tarif:hover{
color:#E84627;
}
/* div plus_de_criteres*/
/*Les critères : s'ouvre au clic sur "Plus de critères"*/
.plus_de_criteres{
border:1px solid rgba(0,0,0,0.1);
/*overflow-y: scroll;*/
position: relative;
}
.plus_de_criteres .filtres.centrale.plus-de-criteres{
height: 350px;
padding:0 20px 20px 20px;
clear: both;
overflow: scroll;
}
.plus_de_criteres .filtres.centrale.plus-de-criteres div {
clear: both;
width:100%;
max-width:1000px;
margin:0 auto 0 auto;
}
.filtres.centrale.plus-de-criteres div p{
width: 100%;
border-bottom: 1px solid #f8f8f8;
text-align: left;
padding:20px 0 5px 0;
}
.plus_de_criteres span.titre-filtre {
color:#333;
font-weight:bold;
}
.plus_de_criteres ul {
list-style-type: none;
clear: both;
padding-left: 0;
padding-bottom: 20px;
}
.plus_de_criteres li {
width: 50%;
float: left;
margin-bottom: 8px;
cursor: pointer;
}
/*Annuler / Supprimer les filtres séléctionnés / Appliquer*/
.buttons.centrale.plus-de-criteres{
background-color:#FFF;
border-top:1px solid rgba(0,0,0,0.1);
/*position:absolute;*/
position:relative;
bottom:0;
left:0;
/*transform: translateY(100%);
width:calc(100% + 2px);*/
padding:15px 10px 15px 10px;
text-align: right;
}
.buttons.centrale.plus-de-criteres a{
margin:3px;
}
/*********************************************************************************************/
/* =Disponibilités fiches hébergements
---------------------------------------------------------------------------------------------*/
/* legende Dispo / S'affiche au dessus des calendriers dans la fiche */
.code-dispo {
margin:20px 0 10px 0;
font-family:sans-serif;
width: 100%;
}
.code-dispo > span {
display:inline-block;
margin-right: 30px;
font-size: 1em;
color:#333;
}
span.carre {
width: 30px;
height: 30px;
border:1px solid rgba(0,0,0,0.1);
margin-right: 10px;
display: inline-block;
vertical-align:middle;
}
span.dispo {
}
span.dispo .carre {
background-color: #FFF;
}
span.complet {
}
span.complet .carre {
background:url(assets/images/hachures.png) #fff;
}
/* calendrier des dispos dans les fiches hebergement */
/*Un bloc calendrier = Titre + Mois + Jours semaines et cases*/
.calendar_wrapper {
display:inline-block;
vertical-align:top;
width:48%;
padding:20px 10px 10px 10px;
margin:10px 5px 10px 5px;
border:1px solid rgba(0,0,0,0.1);
}
/*Titre chambre*/
.calendar_wrapper h3{
color:#333;
font-size:1.1em;
margin:0;
padding:0;
font-weight:700;
text-transform:uppercase;
}
/*Conteneur Mois + Année + flèches*/
.custom-header {
display:block;
padding:5px 5px 0 5px;
margin:10px 0 5px 0;
height:auto;
min-height:30px;
position: relative;
text-align:center;
}
/*Mois + année*/
.custom-header span.custom-month {
text-transform: uppercase;
font-weight: 300;
font-size: 18px;
line-height:20px;
margin:0;
padding:0 40px 0 40px; /*pour laisser la place aux flèches de navigation*/
}
/*L'année seule, nécessaire en js pour François mais à cacher*/
.custom-header span.custom-year{display:none;}
/******************/
/*Les flèches de navigation calendrier*/
/*le conteneur des 2 flèches*/
.custom-header nav{
position:absolute;
width:100%;
top:0;
left:0;
}
/*les flèches*/
.custom-header nav span.custom-prev,
.custom-header nav span.custom-next{
display:block;
position: absolute;
top:0;
width: 30px;
height: 30px;
text-align:center;
cursor:pointer;
}
.custom-header nav span.custom-prev{left:0;}
.custom-header nav span.custom-next{right:0;}
.custom-header nav span:before {
font-family: FontAwesome;
font-size:14px;
display:inline-block;
vertical-align: middle;
}
.custom-header nav span.custom-prev:before {
content: '\f053';
}
.custom-header nav span.custom-next:before {
content: '\f054';
}
/*Fin des flèches de navigation calendrier*/
/******************/
/*Conteneur Jours semaines et cases*/
.fc-calendar-container {
position: relative;
height: 350px;
width: auto;
padding: 10px;
background: #F4F3F2;
}
/*Jours semaines et cases*/
.fc-calendar {
width: 100%;
height: 100%;
}
/* Lun Mar Mer Jeu Ven Sam Dim */
.fc-calendar .fc-head {
height: 30px;
line-height: 30px;
background: transparent;
color: #333;
font-family:sans-serif;
font-weight: bold;
text-transform: uppercase;
font-size: 12px;
}
/* Le conteneur des cases */
.fc-calendar .fc-body {
position: relative;
width: 100%;
height: 100%;
height: -moz-calc(100% - 30px);
height: -webkit-calc(100% - 30px);
height: calc(100% - 30px);
border: 1px solid #F4F3F2;
border-bottom: none;
padding-bottom: 4px;
}
/*Une ligne / semaine du calendrier*/
.fc-calendar .fc-row {
width: calc(100% + 7px);
border-bottom: 1px solid #F4F3F2;
}
.fc-calendar .fc-row:last-child {
border-bottom: none;
}
/*Différents cas : 4, 5 ou 6 lignes selon les mois*/
.fc-four-rows .fc-row {
height: 25%;
}
.fc-five-rows .fc-row {
height: 20%;
}
.fc-six-rows .fc-row {
height: 16.66%;
height: -moz-calc(100%/6);
height: -webkit-calc(100%/6);
height: calc(100%/6);
}
/*Un jour Lun Mar, etc.*/
.fc-calendar .fc-head > div,
/*Une case*/
.fc-calendar .fc-row > div{
float: left;
height: 100%;
width: 14.28%; /* 100% / 7 */
width: -moz-calc(100%/7);
width: -webkit-calc(100%/7);
width: calc(100%/7 - 1px);
position: relative;
text-align: center;
}
.fc-calendar .fc-row > div{cursor: pointer;}
/* IE 9 is rounding up the calc it seems */
.ie9 .fc-calendar .fc-row > div,
.ie9 .fc-calendar .fc-head > div {
width: calc(100%/7 - 1px);/* 14.2%;*/
}
/*Une case jour*/
.fc-calendar .fc-row > div {
border-right: 1px solid #F4F3F2;
overflow: hidden;
position: relative;
background: #fff;
cursor: pointer;
display:table;
}
.fc-calendar .fc-row > div:last-child,
.fc-calendar .fc-head > div:last-child {
border-right: none;
}
/*Le chiffre d'une case jour*/
.fc-calendar .fc-row > div > span.fc-date {
display:table-cell;
padding:4px;
vertical-align:middle;
font-weight:700;
color:#333;
}
/*On peut choisir d'avoir le nom du jour ex : "Ven 1", dans chaque case
Ici on cache le jour "Ven""*/
.fc-calendar .fc-row > div > span.fc-weekday {
display: none;
}
/*Aujourd'hui*/
.fc-calendar .fc-row > div.fc-today {
background:#f6a8a3;
box-shadow: inset 0 -1px 1px rgba(0,0,0,0.1);
}
.fc-calendar .fc-row > div.fc-today > span.fc-date{
color: #fff;
font-weight:300;
}
/*.fc-calendar .fc-row > div.fc-out {
opacity: 0.6;
}*/
/*Case jour vide*/
.fc-calendar .fc-row > div:empty {
background: transparent;
}
/*Case jour complet*/
.fc-calendar .fc-row > div.complet{background:url(assets/images/hachures.png) #fff;}
.fc-calendar .fc-row > div.complet.fc-today {background:url(assets/images/hachures.png) #f6a8a3;}
.fc-calendar .fc-row > div.complet > span.fc-date,
.fc-calendar .fc-row > div.complet.fc-today > span.fc-date{
color:rgba(0,0,0,0.2);
text-decoration: line-through;
font-weight:300;
}
/*Case jour en attente*/
.fc-calendar .fc-row > div.attente,
.fc-calendar .fc-row > div.attente.fc-today {
background:url(assets/images/hachures.png) #82bfdd;
}
.fc-calendar .fc-row > div.attente > span.fc-date,
.fc-calendar .fc-row > div.attente.fc-today > span.fc-date{
color:rgba(0,0,0,0.2);
text-decoration: line-through;
font-weight:300;
}
/*Le petit cadenas pour que les prestataires se connectent*/
#annuaire-disponibilites > a{
display:block;
padding:10px 0 0 0;
clear:both;
}
/*RESPONSIVE*/
@media screen and (max-width:1280px) {
.fc-calendar-container {
height: 280px;
}
.fc-calendar .fc-row > div > span.fc-date {
font-size: 15px;
}
}
@media screen and (max-width:639px) {
.calendar_wrapper {
width:100%;
}
}
/*Pas de custom inner dans code source, style inutile ?*/
/*.custom-inner {
background: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.custom-inner:before,
.custom-inner:after {
content: '';
width: 99%;
height: 50%;
position: absolute;
background: #f6f6f6;
bottom: -4px;
left: 0.5%;
z-index: -1;
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.custom-inner:after {
content: '';
width: 98%;
bottom: -7px;
left: 1%;
z-index: -2;
}*/
/*Pas de custom content reveal dans code source, style inutile ?*/
/*.custom-content-reveal {
background: #f6f6f6;
background: rgba(246, 246, 246, 0.9);
width: 100%;
height: 100%;
position: absolute;
z-index: 100;
top: 100%;
left: 0px;
text-align: center;
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
-o-transition: all 0.6s ease-in-out;
-ms-transition: all 0.6s ease-in-out;
transition: all 0.6s ease-in-out;
}
.custom-content-reveal span.custom-content-close {
position: absolute;
top: 15px;
right: 10px;
width: 20px;
height: 20px;
text-align: center;
background: #bc0824;
box-shadow: 0 1px 1px rgba(0,0,0,0.1);
cursor: pointer;
line-height: 13px;
padding: 0;
}
.custom-content-reveal span.custom-content-close:after {
content: 'x';
font-size: 18px;
color: #fff;
}
.custom-content-reveal a,
.custom-content-reveal span {
font-size: 22px;
padding: 10px 30px;
display: block;
}
.custom-content-reveal h4 {
text-transform: uppercase;
font-size: 13px;
font-weight: 300;
letter-spacing: 3px;
color: #777;
padding: 20px;
background: #fff;
border-bottom: 1px solid #ddd;
border-top: 5px solid #bc0824;
box-shadow: 0 1px rgba(255,255,255,0.9);
margin-bottom: 30px;
}
.custom-content-reveal span {
color: #888;
}
.custom-content-reveal a {
color: #bc0824;
}
.custom-content-reveal a:hover {
color: #333;
}
*/
/* Fin personnalisation des elements du calendrier des dispos */
/**********************************************************/
/*Lien je suis disponible*/
#je-suis-disponible{
display:block;
float:right;
margin:0 5px 5px 5px;
}
@media screen and (max-width:480px){
#je-suis-disponible{
clear:both;
}
}
#je-suis-disponible a{
display:block;
background-color:#82bfdd;
padding:5px;
border-radius:2px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
#je-suis-disponible a:hover{
background-color:#333;
color:#FFF;
}
#je-suis-disponible a:before{
display:inline-block;
vertical-align:middle;
content:'Je suis disponible';
padding-right:5px;
font-size:0.8em;
font-weight:400;
}
#je-suis-disponible a svg{
display:inline-block;
vertical-align:middle;
}
/*Fin lien je suis disponible*/
/*Lien de deconnexion*/
#deconnexion-prestataire{
display:block;
float:right;
margin:0 5px 5px 5px;
}
#deconnexion-prestataire a{
display:block;
background-color:#F6A8A3;
padding:5px;
border-radius:2px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
#deconnexion-prestataire a:hover{
background-color:#333;
color:#FFF;
}
#deconnexion-prestataire a:before{
display:inline-block;
vertical-align:middle;
content:'Déconnexion';
padding-right:5px;
font-size:0.8em;
font-weight:400;
}
#deconnexion-prestataire a svg{
display:inline-block;
vertical-align:middle;
}
/*Fin lien de déconnexion*/
#h1-prestataire{
display:block;
clear:both;
}
@media screen and (max-width:479px) {
#h1-prestataire{
font-size:2.8em;
}
}
/*l'adresse email du prestataire : "Bienvenue (adresse email)"*/
#h1-prestataire span#adresse-mail-presta{
display:block;
font-size:0.7em;
}
/*bouton mettre à jour les tarifs*/
input#submit-tarifs{
font-family:sans-serif;
text-transform:uppercase;
width:auto;
height:auto;
border:none;
background-color:#333;
color:#FFF;
font-weight:400;
margin:0;
padding:10px 20px 10px 20px;
font-size:0.8em;
font-weight:normal;
text-align:center;
border-radius:20px;
}
input#submit-tarifs:hover,
input#submit-tarifs:focus{
background-color:#666;
cursor:pointer;
}
/**********Page d'un pretataire connecté*************/
/******Fin Page d'un pretataire connecté*************/
/* = Fin disponibilités fiches hébergements
---------------------------------------------------------------------------------------------*/
/*******************************************************
Styles pour le widget réserver
*******************************************************/
.md-modal {
z-index: 2000;
font-family:sans-serif;
}
.md-show {
visibility: visible;
/*Par défaut le formulaire est centré mais cela est gênant sur Honfleur car
les 2 form Hébergement et Billetterie ne sont pas de même hauteur*/
top:20vh;
transform: translateX(-50%) translateY(0);
}
@media screen and (max-width:500px){
.md-show {
top:5px;
position:absolute; /*on retire le fixed car on peut avoir besoin de scroller pour remplir le form*/
}
}
.md-overlay {
z-index: 1002; /*pour passer par dessus le menu*/
}
.md-content {
color: #333;
background: #e74c3c;
}
/*L'onglet Votre hébergement ou Billetterie*/
.md-content ul.tabs li{
background:rgba(255,255,255,0.7);
color:#666;
text-transform:uppercase;
font-size:0.8em;
}
/*L'onglet Votre hébergement ou Billetterie actif*/
.md-content ul.tabs li.current{
background:#f6a8a3;
color:#333;
font-weight:700;
}
/*La couleur de fond du formulaire*/
.md-content .tab-content{
background: #FFF;
border:4px solid #f6a8a3;
}
/*Je ne vois pas de h3 dans la source !?!?*/
/*.md-content h3 {
text-align: center;
font-size: 2.4em;
font-weight: 300;
opacity: 0.8;
background: rgba(0,0,0,0.1);
border-radius: 3px 3px 0 0;
}*/
.md-content > div {
font-weight: 400;
font-size: 1em;
}
.md-content > div fieldset{
border:1px solid rgba(0,0,0,0.1);
}
.md-content > div legend {
color:#4a6a92;
font-family: sans-serif;
font-size:1.2em;
}
.md-content #content-tab-billetterie{
margin-top:15px;
padding:0 15px 15px 15px;
border:1px solid rgba(0,0,0,0.1);
position:relative;
}
.md-content span#title-billeterie{
color:#4a6a92;
font-family: sans-serif;
font-size:1.2em;
background-color:#FFF;
position:absolute;
top:0;
left:15px;
transform: translateY(-50%);
}
.md-content p.texte-billetterie{
font-size:1.3em;
font-weight:700;
margin-top:30px;
}
.md-content > div p {
margin: 0;
padding: 10px 0;
}
.md-content > div label{
width:40%;
padding-right:10px;
color:#333;
font-weight:700;
text-align:right;
display:inline-block;
}
.md-content > div div.bloc-dates-hebergement{
/*border-top:2px solid #f6a8a3;*/
background-color:#F0F0F0;
margin-top:10px;
padding:10px 10px 0 10px;
}
.md-content > div div.bloc-dates-hebergement label{
color:#4a6a92;
font-weight:400;
}
/*Je n'ai pas de date précise*/
.md-content > div#tab-hebergement fieldset > p.pas-de-date-precise {
/*border-bottom:2px solid #f6a8a3;*/
margin-bottom:10px;
padding-bottom:10px;
background-color:#F0F0F0;
text-align:center;
/*font-style:italic;*/
}
.md-content > div#tab-hebergement fieldset > p.pas-de-date-precise label{
width:auto;
color:#333;
font-weight:bold;
}
/*block qui contient le lien "Rechercher un hébergement" et "Acheter et Réserver" */
.md-content p.boutons-form-je-reserve {
text-align:center;
}
.md-content p.boutons-form-je-reserve a{
display:inline-block;
padding:10px;
background-color:#f6a8a3;
color:#333;
border-radius:2px;
text-decoration:none;
font-weight:300;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.md-content p.boutons-form-je-reserve a:hover{
background-color:#333;
color:#FFF;
}
@media screen and (max-width:768px){
.md-content > div label{
width:100%;
padding:0;
text-align:left;
}
.md-content > div p {
padding: 5px 0;
}
.md-content > div div.bloc-dates-hebergement{
padding-top:0;
}
}
/*Je ne vois pas de ul dans la source !?!?
.md-content > div ul {
margin: 0;
padding: 0 0 30px 20px;
}
.md-content > div ul li {
padding: 5px 0;
}
*/
/*Le bouton Fermer*/
.md-content button {
border:4px solid #f6a8a3;
border-radius:2px;
background-color:#f6a8a3;
color:#333;
margin:10px auto 10px auto;
padding:10px 15px 10px 15px;
font-size:0.8em;
font-weight:300;
text-transform:uppercase;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.md-content button:hover{
background-color:#333;
border:4px solid #333;
color:#FFF;
cursor: pointer;
}
/*.md-content button:before{
font-family: FontAwesome;
content:"\f00d";
display:inline-block;
vertical-align:baseline;
padding:0 10px 0 0;
}*/
/*Fin du bouton Fermer*/
/* Pour avoir un fond transparent sous le bloc formulaire*/
md-show.md-effect-12 ~ .md-overlay {
background: transparent;
}
.md-effect-12 .md-content h3,
.md-effect-12 .md-content {
background: transparent;
}
/* Fin pour avoir un fond transparent sous le bloc formulaire*/
/*Le form conteneur de la phrase*/
#nl-form{
margin:0;
padding:20px;
clear:both;
}
#nl-form a {
border-bottom: 1px solid #201e1b;
color: #201e1b;
text-decoration: none;
transition: color 0.3s ease 0s;
}
/*Le bouton "Qu'avez-vous à me proposer ?"*/
.nl-button{
background: none repeat scroll 0 0 #39332E;
border: 0 none !important;
border-radius: 3px;
color: #fff !important;
display: inline-block;
font-size: 1.1rem;
font-weight: 200;
line-height: 1.1rem;
padding: 0.833em 1.667em;
text-align: center;
text-decoration: none;
transition: all 0.3s ease 0s;
margin-top:10px;
cursor:pointer;
}
/*Fin bouton "Qu'avez-vous à me proposer ?"*/
#nl-form .title-normal, .title-light, .title-normal {
margin-bottom: 10px;
text-shadow: 0 2px 0 rgba(0, 0, 0, 0.3), 2px 2px 8px rgba(0, 0, 0, 0.1), 0 0 50px rgba(0, 0, 0, 0.5);
transition: all 0.3s ease 0s;
}
#nl-form .title-large.title-normal, .title-large.title-normal, .title-light.title-large {
font-size: 3.5rem;
line-height: 5.1rem;
}
#nl-form .title-medium.title-normal, .title-light.title-medium, .title-medium.title-normal {
font-size: 2.1rem;
line-height: 2.1rem;
}
#nl-form .title-small.title-normal, .title-light.title-small, .title-small.title-normal {
font-size: 1.8rem;
line-height: 1.8rem;
}
.title-normal {
font-size: 4rem;
line-height: 5.5rem;
text-shadow: 0 2px 0 rgba(0, 0, 0, 0.2), 0 0 8px rgba(0, 0, 0, 0.4), 0 0 75px rgba(0, 0, 0, 0.7);
}
.title-group {
margin: 0 auto;
padding: 6.429em 0;
text-align: center;
transition: all 0.3s ease 0s;
width: 100%;
}
.title-group.title-group-small {
padding: 1em 0;
}
.title-group.title-group-xsmall {
padding: 0;
}
#nl-form .title-group .title-small.title-normal, .title-group #nl-form .title-small.title-normal, .title-group .title-light.title-small, .title-group .title-small.title-normal {
margin: 0;
}
@media screen and (max-width: 1300px) {
.title-group {
max-width: 90%;
}
}
@media screen and (max-width: 620px) {
.title-group {
max-width: 100%;
}
}
/*La phrase*/
#nl-form .title-normal {
font-size: 2rem;
line-height: 2.6rem;
/*text-shadow: 0 2px 0 rgba(0, 0, 0, 0.2), 0 0 8px rgba(0, 0, 0, 0.4), 0 0 75px rgba(0, 0, 0, 0.7);*/
text-shadow:none;
color:#39332E;
}
.nl-form ul {
list-style: none outside none;
margin: 0;
padding: 0;
}
.nl-form button, .nl-form input, .nl-form select {
-moz-appearance: none;
background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
border: 0 none;
color: inherit;
display: inline-block;
font-family: inherit;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
margin: 0;
padding: 0;
}
.nl-form input:focus {
outline: 0 none;
}
.nl-field {
display: inline-block;
position: relative;
}
.nl-field.nl-field-open {
z-index: 10000;
}
.nl-field-toggle, .nl-form input, .nl-form select {
border-bottom: 3px solid #a3161c !important;
cursor: pointer;
display: inline-block;
line-height: inherit;
/*margin-right: 40px;*/
position: relative;
text-decoration: none;
}
/* La flèche du select*/
/*.nl-field-toggle:after, .nl-form input:after, .nl-form select:after {
content: "\f078";
font-family: FontAwesome,sans-serif;
font-size: 0.5rem;
position: absolute;
right: -20px;
top: 5px;
transition: all 0.1s ease 0s;
color:#A3161C;
}*/
/*Le texte sélectionné*/
.nl-field-toggle, .nl-form input, .nl-form select {
color: #58585A !important;
}
/*les choix ouverts*/
.nl-field ul {
background: none repeat scroll 0 0 #a3161c;
left: -0.5em;
list-style: none outside none;
margin: 0;
opacity: 0;
padding: 0;
position: absolute;
top: 160%;
transform: translateY(-40%) scale(0.9);
transition: visibility 0s ease 0.3s, opacity 0.3s ease 0s, transform 0.3s ease 0s;
visibility: hidden;
}
.nl-field.nl-field-open ul {
opacity: 1;
transform: translateY(-100%) scale(1);
transition: visibility 0s ease 0s, opacity 0.3s ease 0s, transform 0.3s ease 0s;
visibility: visible;
}
.nl-field ul li {
color: #fff;
position: relative;
}
.nl-dd ul li {
cursor: pointer;
font-size: 1.2rem;
line-height: 3.5rem;
margin: 0;
padding: 0 2.5em 0 0.5em;
text-align: left;
text-shadow: none;
white-space: nowrap;
}
.nl-dd ul li.nl-dd-checked {
color: #201e1b;
}
/*Select au survol*/
.no-touch .nl-dd ul li:hover {
background: none repeat scroll 0 0 /*rgba(255, 255, 255, 0.2)*/ #97141a;
}
.nl-dd ul li.nl-dd-checked:before, .nl-field-go:before, .nl-submit:before {
font-family: FontAwesome,sans-serif;
font-style: normal;
font-variant: normal;
font-weight: 400;
text-transform: none;
}
/*Icon checked du select*/
/*.nl-dd ul li.nl-dd-checked:before {
content: "\f00c";
font-size: 1.5rem;
line-height: 40px;
position: absolute;
right: 0.8em;
top:0.4em;
}*/
.nl-ti-text ul {
min-width: 8em;
}
.nl-ti-text ul li.nl-ti-input input {
border-bottom: 0 none;
color: #fff;
padding: 0.2em 2em 0.2em 0.5em;
width: 100%;
}
.nl-form .nl-field-go {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.1);
color: transparent;
cursor: pointer;
height: 100%;
position: absolute;
right: 0;
text-align: center;
top: 0;
width: 1.8em;
}
.nl-field-go:before {
color: #fff;
content: "";
display: block;
font-size: 75%;
line-height: 2.5;
width: 100%;
}
.nl-ti-text ul li.nl-ti-example {
border-top: 1px dashed rgba(255, 255, 255, 0.7);
color: rgba(0, 0, 0, 0.2);
font-size: 40%;
font-style: italic;
font-weight: 400;
padding: 0.4em 1em;
}
.nl-ti-text ul li.nl-ti-example em {
color: #fff;
}
.nl-submit-wrap {
margin-top: 0.4em;
}
.nl-form .nl-submit {
background: none repeat scroll 0 0 #a3161c;
color: #fff;
cursor: pointer;
font-size: 40%;
font-weight: 700;
letter-spacing: 3px;
line-height: 3;
padding: 0 1em 0 0;
position: relative;
text-transform: uppercase;
}
.nl-submit:before {
background: none repeat scroll 0 0 #a3161c;
color: #fff;
content: "";
float: left;
margin: 0 0.8em 0 0;
padding: 0 0.7em;
}
.nl-overlay {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
height: 100%;
left: 0;
opacity: 0;
position: fixed;
top: 0;
transition: visibility 0s ease 0.3s, opacity 0.3s ease 0s;
visibility: hidden;
width: 100%;
z-index: 900;
}
.nl-field.nl-field-open ~ .nl-overlay, .nl-overlay.open {
opacity: 1;
transition-delay: 0s;
visibility: visible;
}
.line-dashed {
border-bottom: 2px dashed #a3161c !important;
color: #ffcc7b !important;
cursor: pointer;
display: inline-block;
text-align: left;
width: 400px;
}
.line-dashed span {
text-shadow: none;
}
@media screen and (max-width: 600px) {
.line-dashed {
max-width: 80%;
}
}
@media screen and (max-width: 760px) {
/*La phrase*/
#nl-form .title-light, #nl-form .title-normal {
font-size: 1.4rem;
line-height: 2.3rem;
}
.nl-field-toggle, .nl-form input, .nl-form select {
/*margin-right: 35px;*/
}
.nl-field-toggle:after, .nl-form input:after, .nl-form select:after {
font-size: 1.6rem;
position: relative;
right: -5px;
top: 0;
}
.nl-field {
position: static;
}
.nl-field ul {
left: 0;
position: fixed;
top: 45px;
width: 100%;
z-index: 901;
}
.nl-field.nl-field-open ul {
transform: none;
}
/*text dans le select ouvert*/
.nl-dd ul li {
font-size: 1rem;
line-height: 3.5rem;
}
}
@media screen and (max-width: 480px) {
/*La phrase*/
#nl-form .title-light, #nl-form .title-normal {
font-size: 1.4rem;
line-height: 2.3rem;
}
.nl-field-toggle, .nl-form input, .nl-form select {
display: inline;
/*margin-right: 10px;*/
}
.nl-field-toggle:after, .nl-form input:after, .nl-form select:after {
font-size: 1.6rem;
position: relative;
right: -5px;
top: 0;
}
/*text dans le select ouvert*/
.nl-dd ul li {
font-size: 1rem;
line-height: 3.5rem;
}
}
/********css selon resolution / Responsive*****/
/*css_very_big.css*/
@media screen and (min-width:1024px) {
body{
/*max-width:1300px;*/
margin:0 auto 0 auto;
font-size:18px;
}
@media screen and (max-width:1279px){
#autres-sites{
position:relative;
}
header{
position:relative;
top:0;
}
#logo-site{
margin:0 0 0 90px;
}
#top-header{
width: calc(100% - 280px);
margin: 0 0 0 280px;
}
nav#menu-principal{
/*width:100%;
text-align:left;
margin:0;
padding-left:0;
position:absolute;
top:0;
left:0;
z-index:1000;*/ /* Pour passer par dessus diapo accueil*/
}
.toggleMenu {
height: 100px !important;
}
/*Le diaporama*/
#diapo-accueil{
position:relative;
margin-top:0;
}
#ligne1 h2{
font-size:4em;
padding:60px 20px 60px 20px;
}
#texte-survol-carte-svg p{
font-size:0.9em;
}
#fond-ligne3{
background-position:top 130px center;
border-bottom:40px solid #FFF;
}
#ligne3{
background-size:500px 444px;
padding:250px 0 40px 0;
}
.bloc-thematique-accueil h2{
width:120px;
}
.bloc-thematique-accueil{
padding:60px 0 0 0;
}
#image-header-page{
margin-top:0;
}
}
@media screen and (orientation: landscape){
#top-footer{
padding-right:120px;
}
}
}
/*css_big.cs*/
@media screen and (max-width:1023px) and (min-width:891px) {
body{
font-size:17px;
}
main.largeur92{
width:100%;
}
/************************Page d'accueil**************************************/
/*******************header*********************/
#autres-sites{
position:relative;
}
header{
border-bottom:none;
position:relative;
top:0;
}
#logo-site{
margin:0 0 0 90px;
}
#top-header{
width: calc(100% - 280px);
margin: 0 0 0 280px;
}
nav#menu-principal{
width:100%;
text-align:left;
margin:0;
padding-left:0;
position:absolute;
top:0;
left:0;
z-index:1000; /* Pour passer par dessus diapo accueil*/
}
.toggleMenu {
height: 100px !important;
}
#menu{
border-bottom:none;
background-color:transparent;
}
/******************fin header*******************/
/*Le diaporama*/
#diapo-accueil{
position:relative;
margin-top:0;
}
/**********************ligne1**********************************/
#fond-ligne1{
}
#ligne1{
display:block;
width:100%;
}
#ligne1 h2{
width:100%;
padding:0;
margin:40px 0 40px 0;
text-align:center;
}
#thematiques-accueil{
display:block;
margin:0 auto 0 auto;
width:100%;
max-width:710px;
}
.colonne-thematique{
display:block;
width:100%;
margin:0;
padding:0;
}
.colonne-thematique a{
display:block;
float:left;
width:50%;
margin:0;
padding:0;
border:5px solid #FFF;
}
.colonne-thematique.milieu{
display:block;
float:left;
width:50%;
margin:0;
padding:0;
}
.colonne-thematique.milieu a{
display:block;
width:100%;
margin:0;
padding:0;
}
.colonne-thematique a > span{
position:absolute;
left:50% !important;
transform: translate(-50%, -50%)!important;
}
/*******************fin ligne1*********************************/
/***********************ligne2*********************************/
#texte-survol-carte-svg h3{
font-size:2.2em;
}
#texte-survol-carte-svg p{
font-size:0.9em;
}
/*******************fin ligne2*********************************/
/***********************ligne3*********************************/
#fond-ligne3{
background-position:top 130px center;
border-bottom:40px solid #FFF;
}
#ligne3{
background-size:500px 444px;
padding:250px 0 40px 0;
}
.bloc-thematique-accueil h2{
width:120px;
}
.bloc-thematique-accueil{
padding:60px 0 0 0;
}
/*******************fin ligne3*********************************/
/***********************ligne4*********************************/
#mur-instagram{
width:70%;
}
#facebook-accueil{
width:30%;
}
/*******************fin ligne4*********************************/
/***************page****************************/
#image-header-page{
margin-top:0;
}
/****************footer*********************/
@media screen and (orientation: landscape){
#top-footer{
padding-right:60px;
}
}
ul#menu_footer{
max-width:650px;
margin:0 auto 0 auto;
}
/*Partenaires footer*/
ul#partenaires-footer{
padding-bottom:40px;
max-width:600px;
}
ul#partenaires-footer li{
padding: 0 10px 0 10px;
}
/************fin footer*********************/
}
/*css_small.css*/
@media screen and (max-width:890px) and (min-width:481px) {
body{
font-size:15px;
}
main{
}
main#main-accueil{
}
main.largeur92{
width:100%;
}
#conteneur{
width:100%;
margin:0 auto 0 auto;
z-index:0;
}
/*******************header*********************/
#autres-sites{
display:none;
}
header{
border-bottom:none;
position:relative;
height:90px;
top:0;
}
#logo-site{
width: 110px;
margin: 15px 0 0 70px;
}
nav#menu-principal{
width:100%;
text-align:left;
margin:0;
padding-left:0;
position:absolute;
top:0;
left:0;
z-index:1000; /* Pour passer par dessus diapo accueil*/
}
#nav li li a{
border:none !important;
}
#menu{
border-bottom:none;
background-color:transparent;
}
#top-header{
width: calc(100% - 200px);
margin: 0 0 0 200px;
}
@media screen and (max-width:639px){
ul#acces-rapides-header{
display:block;
height:auto;
margin:0;
padding:10px 5px 0 0;
border-left:none;
border-bottom:none;
}
ul#acces-rapides-header li{
display:block;
float:left;
padding:0 3px 0 3px;
}
ul#acces-rapides-header li a{
display:inline-block;
}
}
#searchform input[type="text"]{
width:160px;
}
#searchform input[type="submit"]{
}
#outils{
/*display:none;*/
}
/*hauteur de diapo différente selon l'orientation du téléphone*/
@media screen and (orientation: landscape){
#taille_texte{
top:95px;
}
/*Bouton agenda fixe*/
#volet a.ouvrir {
top:220px;
left:-100px;
width:100px;
height:75px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
}
#volet a.ouvrir h2{
font-size:1.8em !important;
}
#agenda-cote{
padding-top:10px;
}
.agenda.accueil {
max-width: 250px;
}
#top-footer{
padding-right:60px;
}
}
/***************fin header*********************/
/************************Page d'accueil**************************************/
/*Le diaporama*/
#diapo-accueil{
position:relative;
margin-top:0;
}
/*hauteur de diapo différente selon l'orientation du téléphone*/
@media screen and (orientation: portrait){
#diapo-accueil{
position:relative;
width:100%;
height:50vh;
}
}
/**********************ligne1**********************************/
#fond-ligne1{
}
#ligne1{
display:block;
width:100%;
}
#ligne1 h2{
width:100%;
padding:0;
margin:40px 0 40px 0;
text-align:center;
font-size:3.5em;
}
#thematiques-accueil{
display:block;
margin:0 auto 0 auto;
width:100%;
max-width:710px;
}
.colonne-thematique{
display:block;
width:100%;
margin:0;
padding:0;
}
.colonne-thematique a{
display:block;
float:left;
width:50%;
margin:0;
padding:0;
border:3px solid #FFF;
}
.colonne-thematique.milieu{
display:block;
float:left;
width:50%;
margin:0;
padding:0;
}
.colonne-thematique.milieu a{
display:block;
width:100%;
margin:0;
padding:0;
}
.colonne-thematique a > span{
position:absolute;
left:50% !important;
transform: translate(-50%, -50%)!important;
}
/*******************fin ligne1*********************************/
/**********************ligne2**********************************/
#fond-ligne2{
padding-bottom:30px;
}
#ligne2{
display:block;
width:100%;
margin:0;
}
#gauche-ligne2,
#droite-ligne2{
display:block;
width:100%;
margin:0;
padding:0;
}
#droite-ligne2{
max-width:600px;
margin:0 auto 0 auto;
}
#gauche-ligne2{
height:auto;
min-height:250px;
}
#texte-survol-carte-svg{
position:absolute;
bottom:0;
padding:20px;
margin:0 20px 0 20px;
}
#texte-survol-carte-svg h3{
font-size:2em;
}
#texte-survol-carte-svg p{
font-size:0.9em;
}
/*******************fin ligne2*********************************/
/**********************ligne3***********************************/
#fond-ligne3{
background-position:top 100px center;
}
#ligne3{
background-size:400px 356px;
padding:180px 0 40px 0;
}
.bloc-thematique-accueil{
display:block;
position:relative;
width:80%;
max-width:400px;
float:none;
margin:20px auto 0 auto;
padding:78px 0 30px 0;
}
/*******************fin ligne3*********************************/
/**********************ligne4***********************************/
#fond-ligne4{
}
#ligne4{
display:block;
width:100%;
}
#mur-instagram{
display:block;
width:100%;
}
#facebook-accueil{
display:block;
width:100%;
}
/******************fin ligne4***********************************/
/*********************FIn page accueil*******************/
/***************page****************************/
h1{
font-size:3.7em !important;
padding: 10px 0 50px 0;
}
#image-header-page{
margin-top:0;
}
#la-page{
display:block;
width:100%;
padding:0 0 0 0;
margin:0;
overflow:hidden;
}
/***************************************/
/*Pour le menu (filtres) des annuaires*/
/*#gauche*/
#gauche {
float: none;
position: absolute;
top: 0;
left: -100%;
display: block;
margin: 0;
padding: 0;
transition: all 500ms ease 0s;
width: 100%;
z-index: 3;
background-color:#FFF;
}
/*#gauche:hover*/
#gauche:hover{
left:0;
}
#bt-filtrer{
display:block;
background-color:#1268b3;
color:#FFF;
font-weight:400;
font-size:0.9em;
text-transform:uppercase;
text-align:center;
padding:15px 5px 15px 5px;
margin:0;
width:70px;
position:absolute;
top:0;
right:-70px;
}
.sidebar{
border-bottom:7px solid #1268b3;
}
.sidebar ul#menu_pages{display:none;}
.sidebar ul#menu_annuaire,
.sidebar #filtres-carte{
margin:0 0 0 0;
width:100%;
padding:10px 30px 20px 10px;
}
#sidebar-carto{
padding-right:0;
}
/*Pour laisser la place au bouton "Filtrer" quand il y a des annuaires*/
#fil_ariane{
/*margin-left:80px;
text-align:right;*/
}
/*Fin du menu (filtres) des annuaires*/
/***************************************/
#content{
float:none;
width:100%;
height:auto !important;
min-height:100px;
padding:10px 15px 30px 15px;
margin:0 0 0 0;
color:#666;
border-right:none;
}
#content_large{
width:100%;
padding:10px 15px 30px 15px;
margin:0 0 0 0;
border-top:none;
color:#666;
}
/***********fin page****************************/
/***************form contact envoyer ami***********/
.krea3_formulaire p.obligatoire{
margin-left:0%;
}
.krea3_formulaire fieldset{
padding:10px 15px 100px 15px;
}
.krea3_formulaire label{
display: block;
width:100%; /*En % pour un meilleur rendu lors du changement de taille du texte*/
float:none;
padding-right:0;
text-align:left;
font-size:1em;
}
.krea3_formulaire input, .krea3_formulaire select,
.krea3_formulaire textarea{
margin-left: 0%;
width:100%; /*En % pour un meilleur rendu lors du changement de taille du texte*/
margin-bottom:10px;
}
/***********fin form contact envoyer ami***********/
/******************************Liens Enfants / Menu page par défaut********************************/
/****************************Liens Enfants / fin menu page par défaut******************************/
/****************footer*********************/
#carte-situation{
max-width:300px;
}
@media screen and (max-width:639px){
#top-footer{
display:block;
}
#gauche-footer{
display:block;
width:100%;
padding:10px 0 0 0;
}
a#contact-footer,
a#newsletter-footer,
a#brochures-footer{
display:inline-block;
}
#milieu-footer{
display:block;
width:100%;
padding:10px 0 10px 0;
}
#carte-situation{
display:block;
width:100%;
max-width:300px;
}
}
ul#menu_footer{
max-width:650px;
margin:0 auto 0 auto;
}
/*Partenaires footer*/
ul#partenaires-footer{
padding-bottom:40px;
}
ul#partenaires-footer li{
height:60px;
padding: 0 10px 0 10px;
}
/************fin footer*********************/
}
/*css_tiny.css*/
@media screen and (max-width:480px) {
body{
font-size:15px;
}
main{
}
main#main-accueil{
}
main.largeur92{
width:100%;
}
#conteneur{
width:100%;
margin:0 auto 0 auto;
z-index:0;
}
/*******************header*********************/
#autres-sites{
display:none;
}
header{
border-bottom:none;
position:relative;
height:90px!important;
top:0;
}
#logo-site{
width:85px;
margin:5px 10px 0 -10px;
}
nav#menu-principal{
width:100%;
text-align:left;
margin:0;
padding-left:0;
position:absolute;
top:0;
left:0;
z-index:1000; /* Pour passer par dessus diapo accueil*/
}
#nav li li a{
border:none !important;
}
#menu{
border-bottom:none;
background-color:transparent;
}
#top-header {
width: calc(100% - 110px);
margin: 0 0 0 110px;
}
ul#acces-rapides-header{
display:block;
height:auto;
margin:0;
padding:10px 5px 0 0;
border-left:none;
border-bottom:none;
}
ul#acces-rapides-header li{
display:block;
float:left;
padding:0 5px 0 5px;
}
ul#acces-rapides-header li a{
display:inline-block;
}
/*Form de recherche*/
#recherche-top{
display:block;
padding:0;
margin-top:35px;
}
#searchform input[type="submit"]{
}
#searchform input[type="text"]{
width:110px;
}
/*Pour tous petits écrans*/
@media screen and (max-width:240px){
}
#outils{
clear:both;
}
/*Bouton agenda fixe*/
#volet a.ouvrir {
top:100px;
left:-100px;
width:100px;
height:75px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
}
body.home #volet a.ouvrir{
top:250px;
}
#volet a.ouvrir h2{
font-size:1.8em !important;
}
/***************fin header*********************/
/************************Page d'accueil**************************************/
/*Le diaporama*/
#diapo-accueil{
position:relative;
width:100%;
height:200px;
margin-top:0;
}
#slogan-diapo{
bottom:0;
width:75%;
padding:20px 20px 50px 20px;
font-size:2.3em;
}
/*les petits points*/
.slides-pagination {
bottom:20px !important;
}
/*la flèche*/
.down-arrow{
display:none;
}
/**********************ligne1**********************************/
/*La phrase : Je suis / j'ai envie de / dans*/
#nl-form .title-normal {
font-size: 2.4em;
line-height: 1.4em;
}
.krea3-phrase-choix{
padding:8px 0 8px 0;
border-bottom: 1px solid rgba(0,0,0,0.1);
}
/*Bouton Surprenez-moi*/
.nl-button {
font-size:0.9em;
}
/*******************fin ligne1*********************************/
/**********************ligne2**********************************/
ul#liens-carto-accueil{
text-align:center;
padding:0 10px 0 10px;
}
/*******************fin ligne2*********************************/
/**********************ligne3***********************************/
.bloc-thematique-accueil h2{
width:100px;
}
.bloc-thematique-accueil{
display:block;
position:relative;
width:100%;
max-width:350px;
float:none;
margin:20px auto 0 auto;
padding:50px 0 30px 0;
}
/******************fin ligne3***********************************/
/**********************ligne4***********************************/
#mur-instagram{
display:block;
width:100%;
}
#facebook-accueil{
display:block;
width:100%;
}
/******************fin ligne4***********************************/
/*********************FIn page accueil*******************/
/***************page****************************/
h1{
font-size:3em !important;
padding: 10px 0 50px 0;
}
h2{
font-size:2.7em !important;
}
blockquote {
margin: 40px 0 40px 0;
padding: 20px;
}
#image-header-page{
margin-top:0;
}
#la-page{
display:block;
width:100%;
padding:0;
margin:0;
overflow:hidden; /*pour le menu (filtres) des annuaires*/
}
/***************************************/
/*Pour le menu (filtres) des annuaires*/
/*#gauche*/
#gauche {
float: none;
position: absolute;
top: 0;
left: -100%;
display: block;
margin: 0;
padding: 0;
transition: all 500ms ease 0s;
width: 100%;
z-index: 3;
background-color:#FFF;
}
/*#gauche:hover*/
#gauche:hover{
left:0;
}
#bt-filtrer{
display:block;
background-color:#1268b3;
color:#FFF;
font-weight:400;
font-size:0.9em;
text-transform:uppercase;
text-align:center;
padding:15px 5px 15px 5px;
margin:0;
width:70px;
position:absolute;
top:0;
right:-70px;
}
.sidebar{
border-bottom:7px solid #1268b3;
}
.sidebar ul#menu_pages{display:none;}
.sidebar ul#menu_actus{
margin:0 0 0 0;
width:100%;
padding:10px 30px 20px 10px;
}
/*Pour laisser la place au bouton "Filtrer" quand il y a des annuaires*/
#fil_ariane{
/*margin-left:80px;
text-align:right;*/
}
/*Fin du menu (filtres) des annuaires*/
/***************************************/
#content{
float:none;
width:100%;
height:auto !important;
min-height:100px;
padding:10px 15px 30px 15px;
margin:0 0 0 0;
color:#666;
border-right:none;
}
#content_large{
width:100%;
padding:10px 15px 30px 15px;
margin:0 0 0 0;
border-top:none;
color:#666;
}
#ligne-outils{
margin-right:0;
padding:0;
margin:0;
}
#outils #afficher-carnet-voyage,
#taille_texte,
#trad-google{
display:none;
}
/***********fin page****************************/
/***************form contact envoyer ami***********/
.krea3_formulaire p.obligatoire{
margin-left:0%;
}
.krea3_formulaire fieldset{
padding:10px 15px 50px 15px;
}
.krea3_formulaire label{
display: block;
width:100%; /*En % pour un meilleur rendu lors du changement de taille du texte*/
float:none;
padding-right:0;
text-align:left;
font-size:1em;
}
.krea3_formulaire input, .krea3_formulaire select,
.krea3_formulaire textarea{
margin-left: 0%;
width:100%; /*En % pour un meilleur rendu lors du changement de taille du texte*/
margin-bottom:10px;
}
/***********fin form contact envoyer ami***********/
/******************************Liens Enfants / Menu page par défaut********************************/
ul.liens_enfants li{
display:block;
margin:0 auto 10px auto;
}
/****************************Liens Enfants / fin menu page par défaut******************************/
/****************footer*********************/
#top-footer{
display:block;
}
#gauche-footer{
display:block;
width:100%;
padding:10px 0 0 0;
}
a#contact-footer,
a#newsletter-footer,
a#brochures-footer{
display:inline-block;
}
#milieu-footer{
display:block;
width:100%;
padding:10px 0 10px 0;
}
.adresse-postale h2{
font-size:2em !important;
}
#carte-situation{
display:block;
width:100%;
max-width:300px;
}
ul#liens-carte-situation li a{
font-size:1.8em;
}
ul#menu_footer{
border-top:1px solid rgba(255,255,255,0.15);
border-bottom:none;
padding:15px 0 15px 0;
}
ul#menu_footer li{
margin: 3px 0 3px 0;
}
/*Partenaires footer*/
ul#partenaires-footer{
padding-bottom:40px;
}
ul#partenaires-footer li{
height:60px;
padding: 0 10px 0 10px;
}
/*Fin partenaires footer*/
}
/********Fin css selon resolution / Responsive*****/
/* position du recaptcha en bas à droite */
.grecaptcha-badge{
bottom:70px !important;
}
p span.term{
display: inline-block;
border: 1px solid rgba(0,0,0,0.1);
padding: 5px 10px 5px 5px;
border-radius: 2px;
margin-right: 0.8em;
background-color: #15A8A6;
margin-bottom: 0.8em;
color: #000;
}
/********La meteto*****/
.gallery-full-css .control-operator:target ~ .controls .control-button {
color: #ccc;
color: rgba(255, 255, 255, 0.4);
border-bottom:none;
}
.gallery-full-css .control-button:first-of-type,
.gallery-full-css .control-operator:nth-of-type(1):target ~ .controls .control-button:nth-of-type(1),
.gallery-full-css .control-operator:nth-of-type(2):target ~ .controls .control-button:nth-of-type(2),
.gallery-full-css .control-operator:nth-of-type(3):target ~ .controls .control-button:nth-of-type(3),
.gallery-full-css .control-operator:nth-of-type(4):target ~ .controls .control-button:nth-of-type(4),
.gallery-full-css .control-operator:nth-of-type(5):target ~ .controls .control-button:nth-of-type(5) {
color: white;
color: rgba(255, 255, 255, 0.8);
border-bottom:1px solid #4a6a92;
}
.gallery-full-css .carte-item:first-of-type {
position: static;
top: 0;
left: 0;
pointer-events: auto;
opacity: 1;
}
.gallery-full-css .carte-item {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
opacity: 0;
transition: opacity .5s;
}
.gallery-full-css .control-operator {
display: none;
}
.gallery-full-css .control-operator:target ~ .carte-item {
pointer-events: none;
opacity: 0;
animation: none;
}
.gallery-full-css .control-operator:target ~ .controls .control-button {
animation: none;
}
@keyframes controlAnimation-2 {
0% {
color: #ccc;
color: rgba(255, 255, 255, 0.4);
}
14.3%,
50% {
color: white;
color: rgba(255, 255, 255, 0.8);
}
64.3%,
100% {
color: #ccc;
color: rgba(255, 255, 255, 0.4);
}
}
@keyframes galleryAnimation-2 {
0% {
opacity: 0;
}
14.3%,
50% {
opacity: 1;
}
64.3%,
100% {
opacity: 0;
}
}
.gallery-full-css .control-operator:nth-of-type(1):target ~ .carte-item:nth-of-type(1) {
pointer-events: auto;
opacity: 1;
}
.gallery-full-css .control-operator:nth-of-type(2):target ~ .carte-item:nth-of-type(2) {
pointer-events: auto;
opacity: 1;
}
.items-2.autoplay .control-button {
animation: controlAnimation-2 14s infinite;
}
.items-2.autoplay .carte-item {
animation: galleryAnimation-2 14s infinite;
}
.items-2 .control-button:nth-of-type(1),
.items-2 .carte-item:nth-of-type(1) {
animation-delay: -2s;
}
.items-2 .control-button:nth-of-type(2),
.items-2 .carte-item:nth-of-type(2) {
animation-delay: 5s;
}
@keyframes controlAnimation-3 {
0% {
color: #ccc;
color: rgba(255, 255, 255, 0.4);
}
9.5%,
33.3% {
color: white;
color: rgba(255, 255, 255, 0.8);
}
42.9%,
100% {
color: #ccc;
color: rgba(255, 255, 255, 0.4);
}
}
@keyframes galleryAnimation-3 {
0% {
opacity: 0;
}
9.5%,
33.3% {
opacity: 1;
}
42.9%,
100% {
opacity: 0;
}
}
.gallery-full-css .control-operator:nth-of-type(1):target ~ .carte-item:nth-of-type(1) {
pointer-events: auto;
opacity: 1;
}
.gallery-full-css .control-operator:nth-of-type(2):target ~ .carte-item:nth-of-type(2) {
pointer-events: auto;
opacity: 1;
}
.gallery-full-css .control-operator:nth-of-type(3):target ~ .carte-item:nth-of-type(3) {
pointer-events: auto;
opacity: 1;
}
.gallery-full-css .control-operator:nth-of-type(4):target ~ .carte-item:nth-of-type(4) {
pointer-events: auto;
opacity: 1;
}
.gallery-full-css .control-operator:nth-of-type(5):target ~ .carte-item:nth-of-type(5) {
pointer-events: auto;
opacity: 1;
}
.items-3.autoplay .control-button {
animation: controlAnimation-3 21s infinite;
}
.items-3.autoplay .carte-item {
animation: galleryAnimation-3 21s infinite;
}
.items-3 .control-button:nth-of-type(1),
.items-3 .carte-item:nth-of-type(1) {
animation-delay: -2s;
}
.items-3 .control-button:nth-of-type(2),
.items-3 .carte-item:nth-of-type(2) {
animation-delay: 5s;
}
.items-3 .control-button:nth-of-type(3),
.items-3 .carte-item:nth-of-type(3) {
animation-delay: 12s;
}
.items-5.autoplay .control-button {
animation: controlAnimation-5 35s infinite;
}
.items-5.autoplay .item {
animation: galleryAnimation-5 35s infinite;
}
.items-5 .control-button:nth-of-type(1),
.items-5 .item:nth-of-type(1) {
animation-delay: -2s;
}
.items-5 .control-button:nth-of-type(2),
.items-5 .item:nth-of-type(2) {
animation-delay: 5s;
}
.items-5 .control-button:nth-of-type(3),
.items-5 .item:nth-of-type(3) {
animation-delay: 12s;
}
.items-5 .control-button:nth-of-type(4),
.items-5 .item:nth-of-type(4) {
animation-delay: 19s;
}
.items-5 .control-button:nth-of-type(5),
.items-5 .item:nth-of-type(5) {
animation-delay: 26s;
}
#la-meteo .gallery-full-css{
position: relative;
margin: 0;
padding: 0;
}
/*Div qui contient toute la météo*/
#la-meteo .gallery-full-css .carte-item {
width:100%;
margin:20px 0 20px 0;
padding:0;
height:auto;
overflow: hidden;
text-align: center;
background-color:#FFF;
font-family: sans-serif; }
/*La div qui contient les div Matin / Aprem / Soir*/
figure .krea3meteo_jour{
margin:40px 0 20px 0;
text-align: center;
clear:both;
}
/*Les 3 div Matin / Aprem / Soir*/
figure .krea3meteo_matin, figure .krea3meteo_apres-midi, figure .krea3meteo_soir{
display: inline-block;
width:30%;
height:220px;
margin:10px 10px 10px 10px;
padding-top:20px;
color:#333;
font-family: sans-serif;
font-weight:400;
font-size:1.3em;
/*text-shadow: 1px 1px 2px #25211e;*/
}
/*Les blocs matin midi soir*/
figure .krea3meteo_matin{background: linear-gradient(to right, #fdd5c1, #82bfdd);}
figure .krea3meteo_apres-midi{background-color:#82bfdd;}
figure .krea3meteo_soir{background: linear-gradient(to right, #82bfdd, #0f2950);}
/*Les intitulés matin midi soir*/
figure .krea3meteo_matin span.periode-meteo,
figure .krea3meteo_apres-midi span.periode-meteo,
figure .krea3meteo_soir span.periode-meteo{
font-family: sans-serif;
display:block;
margin:0;
padding:0 0 20px 0;
font-size:1.7em;
}
figure .krea3meteo_matin span.periode-meteo{color:rgba(0,0,0,0.4);}
figure .krea3meteo_apres-midi span.periode-meteo{color:rgba(0,0,0,0.4)}
figure .krea3meteo_soir span.periode-meteo{color:rgba(0,0,0,0.4)}
/*Picto + température*/
.picto-temperature{
font-size:2em;
font-weight:bold;
margin:0 auto 0 auto;
padding:5px 0 0 0;
}
figure .krea3meteo_matin .picto-temperature{color:#fff;}
figure .krea3meteo_apres-midi .picto-temperature{color:#fff;}
figure .krea3meteo_soir .picto-temperature{color:#fff;}
.picto-temperature img{
display:inline-block;
vertical-align:middle;
}
/*Vent*/
.vent-meteo{
color:#FFF;
font-style:italic;
}
/*Pour la météo d'Aujourd'hui qui a besoin d'un petit ajustement*/
#krea3meteogen .carte-item:first-of-type{
position:relative;
top:20px;
}
/*Aujourd'hui / Demain / Lundi / etc.*/
#la-meteo .gallery-full-css .controls {
position: absolute;
top: -3px;
left: 0;
text-align: center;
}
#krea3meteogen .carte-item, #krea3meteogen .controls{
font-family: sans-serif;
left:0;
background:#FFF;
width:100%;
margin:10px auto 0 auto;
padding:0;
display:block;
}
/*La couleur d'un lien Aujourd'hui / Demain*/
#la-meteo .gallery-full-css .control-button {
color:#0f2950 !important;
background-color:transparent !important;
font-weight:400;
display:inline-block;
margin:0 10px 20px 10px;
}
#la-meteo .gallery-full-css .control-button:hover {
color:#0f2950 !important;
}
/*Pour que le lien Aujourd'hui soit de la même couleur que les autres quand il n'est pas sélectionnée*/
#la-meteo .gallery-full-css .control-operator:target ~ .controls .control-button {
color:#666;
border-bottom:none;
}
/*La période sélectionnée (Aujourd'hui, demain, etc)*/
#la-meteo .gallery-full-css .control-button:first-of-type,
#la-meteo .gallery-full-css .control-operator:nth-of-type(1):target ~ .controls .control-button:nth-of-type(1),
#la-meteo .gallery-full-css .control-operator:nth-of-type(2):target ~ .controls .control-button:nth-of-type(2),
#la-meteo .gallery-full-css .control-operator:nth-of-type(3):target ~ .controls .control-button:nth-of-type(3),
#la-meteo .gallery-full-css .control-operator:nth-of-type(4):target ~ .controls .control-button:nth-of-type(4),
#la-meteo .gallery-full-css .control-operator:nth-of-type(5):target ~ .controls .control-button:nth-of-type(5) {
border-bottom:5px solid #e58072;
padding-bottom:5px;
}
/*LE RESPONSIVE*/
@media screen and (max-width:700px){
/*La div qui contient les div Matin / Aprem / Soir*/
/*Besoin d'un margin plus grand quand Aujourd'hui / DEmain / LUndi / etc. est sur 2 lignes*/
figure .krea3meteo_jour{
margin:80px 0 20px 0;
}
}
@media screen and (max-width:699px){
#la-meteo{
height:750px; /*Sinon la météo recouvre le pied de page*/
}
/*La div qui contient les div Matin / Aprem / Soir*/
figure .krea3meteo_jour{
margin:80px 0 20px 0;
}
figure .krea3meteo_matin, figure .krea3meteo_apres-midi, figure .krea3meteo_soir{
display:block;
width:100%;
height:200px;
margin:10px 0 10px 0;
}
}
.nav-fiche .nav-suivant, .nav-fiche .nav-precedent{
display:none !important;
}
/***********************************************************************/
.krea3_formulaire .phrase_form_contact_rgpd {
text-align: center;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
}
label[for="rgpd"] {
width: 100% !important;
text-align: center !important;
background: #F2F2F2;
border-radius: 5px;
padding: 20px;
margin: 0;
}
label[for="rgpd"] input#rgpd {
width: 20px;
}
/* La description du champ*/
.descriptioncontact{
display:block;
font-size:0.75em;
color:#333;
margin: 5px 0 20px 0;
padding-left: calc(35% + 15px);
}
@media screen and (max-width:890px){
.descriptioncontact{
padding-left:0;
}
}
ul.row.ul-list-type-none,
ul.row{
list-style-type: none!important;
}
/*************************** Agenda ***************************************/
/*------------------
Event section
---------------------*/
.event-video {
border-radius: 14px;
overflow: hidden;
position: relative;
margin-right: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 576px) {
.event-video {
margin-right: 0;
margin-bottom: 50px;
}
}
.event-video img {
width: 100%;
}
.event-video .video-popup {
position: absolute;
left: calc(50% - 43px);
top: calc(50% - 42px);
}
.event-item {
margin-bottom: 30px;
border-radius: 14px;
overflow: hidden;
-webkit-box-shadow: 0px 5px 6px rgba(72, 105, 114, 0.15);
box-shadow: 0px 5px 6px rgba(72, 105, 114, 0.15);
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}
.event-item:hover {
-webkit-box-shadow: 0px 12px 32px rgba(72, 105, 114, 0.15);
box-shadow: 0px 12px 32px rgba(72, 105, 114, 0.15);
}
.event-item:last-child {
margin-bottom: 0;
}
.event-item .ei-img {
width: 222px;
float: left;
margin-right: 30px;
}
@media (max-width: 420px) {
.event-item .ei-img {
width: 100%;
float: none;
}
}
.event-item .ei-text {
overflow: hidden;
padding-top: 30px;
padding-right: 15px;
}
@media (max-width: 576px) {
.event-item .ei-text {
padding-top: 15px;
}
}
@media (max-width: 420px) {
.event-item .ei-text {
padding: 30px 15px;
}
}
.event-item .ei-text h4 {
font-weight: 400;
font-family: sans-serif;
margin-bottom: 15px;
}
.event-item .ei-text h4 a {
color: #333333;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.event-item .ei-text h4 a:hover {
color: #f65d5d;
}
.event-item .ei-text ul {
list-style: none;
}
.event-item .ei-text ul li {
font-size: 14px;
margin-bottom: 5px;
}
.event-item .ei-text ul li i {
color: #f65d5d;
font-size: 16px;
position: relative;
top: 3px;
margin-right: 10px;
}
.events-page-section .event-item {
margin-bottom: 50px;
}
.event-filter-warp {
padding: 35px 45px;
border-radius: 13px;
margin-top: -60px;
position: relative;
z-index: 999;
background: #fff;
-webkit-box-shadow: 0px 5px 6px rgba(72, 105, 114, 0.15);
box-shadow: 0px 5px 6px rgba(72, 105, 114, 0.15);
}
@media (max-width: 420px) {
.event-filter-warp {
padding: 35px 20px;
}
}
.event-filter-warp p {
padding-top: 10px;
margin-bottom: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1200px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 576px) {
.event-filter-warp p {
padding-top: 0;
margin-bottom: 15px;
}
}
.event-filter-form {
margin-left: -30px;
text-align: right;
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
.event-filter-form {
text-align: left;
margin-left: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 576px) {
.event-filter-form {
text-align: center;
margin-left: 0;
}
}
.event-filter-form .ef-item {
width: 202px;
position: relative;
display: inline-block;
margin-right: 9px;
}
@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 576px) {
.event-filter-form .ef-item {
width: 100%;
margin-right: 0;
margin-bottom: 10px;
}
}
.event-filter-form .ef-item input {
width: 100%;
height: 49px;
padding-left: 29px;
padding-right: 40px;
border-radius: 50px;
border: 1px solid #e6e6e6;
background: #fafafa;
font-size: 14px;
}
.event-filter-form .ef-item i {
position: absolute;
right: 20px;
top: 16px;
font-size: 16px;
color: #a6a6a6;
}
@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 576px) {
.event-filter-form .site-btn {
margin-top: 10px;
}
}
/*********************************************Formulaire***************************/
/***********STYLES RGPD************/
.cc-color-override-1845025546.cc-revoke{
border: 1px solid #eee !important;
}
.cc-color-override-1845025546.cc-window{
border-top: 1px solid #eee !important;
}
.krea3_formulaire .phrase_form_contact_rgpd{
text-align:center;
border-top:1px solid #fff;
border-bottom:1px solid #fff;
}
label[for="rgpd"] {
width: 100% !important;
text-align: center !important;
border:1px solid #eee;
border-radius: 5px;
padding: 20px;
margin: 0;
}
label[for="rgpd"] input#rgpd {
width: 20px;
}
.krea3_formulaire{
font-family: sans-serif;
font-weight:300;
}
.krea3_formulaire p.obligatoire{
margin-left:30%;
padding:0 0 10px 0;
color:#be092c;
}
p.error{
text-align:center;
background-color:#fc4d60;
color:#FFF;
font-weight:300;
padding:10px;
margin:0 0 20px 0;
}
.krea3_formulaire p{
margin:2px 0 2px 0;
clear:both;
background-color:transparent;
}
.krea3_formulaire fieldset{
margin-bottom: 10px;
margin-top:0;
padding:20px 10px 20px 10px;
border:1px solid #eee;
background-color:#f8f8f8;
}
.krea3_formulaire fieldset legend.obligatoire{
padding: 0 10px;
font-size: 1.1em;
margin-left:35%;
color:#ab0e13;
font-weight:500;
}
@media screen and (max-width:890px){
.krea3_formulaire fieldset legend.obligatoire{
margin-left:0;
}
}
/* Label */
.krea3_formulaire label{
color:#000;
display: block;
width:35%; /*En % pour un meilleur rendu lors du changement de taille du texte*/
float: left;
padding-right: 5px;
text-align: right;
font-size:1.1em;
font-weight:300;
}
/* La description du champ*/
.descriptioncontact{
display:block;
font-size:0.75em;
margin:0 0 20px 0;
padding-left:calc(35% + 10px);
color:#333;
}
@media screen and (max-width:890px){
.descriptioncontact{
padding-left:0;
}
}
.krea3_formulaire input, .krea3_formulaire select,
.krea3_formulaire textarea{
margin-left: 1%;
width:45%; /*En % pour un meilleur rendu lors du changement de taille du texte*/
border: #EBEBEB 1px solid;
font-size: 1.2em;
font-family: sans-serif;
}
.krea3_formulaire input[type="submit"]{
font-family: sans-serif;
text-transform:uppercase;
width:auto;
height:auto;
border:none;
background-color:#1f3966;
color:#FFF;
font-weight:400;
margin:0 45%;
padding:10px 20px 10px 20px;
font-size:1.2em;
font-weight:normal;
text-align:center;
}
@media screen and (max-width:890px){
.krea3_formulaire input[type="submit"]{
margin-left:0;
}
}
.krea3_formulaire input[type="submit"]:hover,
.krea3_formulaire input[type="submit"]:focus{
background-color:#ea1c23;
cursor:pointer;
}
/*********************************** Fin Formulaire***********************************************/