@charset "UTF-8";
/* CSS Document */

/*
Theme Name: OT Lieuvin Pays d'Auge
Theme URI: 
Description: Theme de l'Office de Tourisme Lieuvin Pays d'Auge
Version: 1.0
Author: Krea3
Author URI: http://www.krea3.fr
Text Domain: krea3
*/



/*************************************************************************/
/*****************min-width:481px et max-width:890px**********************/

body{
	font-size:15px;
}

#page_annuaire #top-header, #page_annuaire header{
    position: relative !important;
    padding: 0 56px 0 0;
    display: block !important;
    clear: both !important;
	top:0 !important;
}

#logo-site{
	margin:0;
	padding:0;
	width:170px;
	position:absolute;
	top:0;
	left:80px;
}

#menu #carte-petite{
	top:70px;
	left:0;
}

#menu #carte-petite img {
    margin: 10px 0 0 40px;
	height: 75px;
	float: left;
}

main{
	padding-top:0;
}

main.largeur92{
	width:100%;
	margin-top:0;
}

#conteneur{
	width:100%;
	margin:0 auto 0 auto;
	z-index:0;
}

/*******************header*********************/

header {
	background: rgba(255,255,255,0.7);
	position:absolute;
}
@media screen and (max-width:760px){
#logo-site-accueil{
	bottom: auto;
	top: 45%;
	right: 60px;
}

#logo-site-accueil img {
    max-width: 200px;
}
}

@media screen and (min-width:760px){
#logo-site-accueil{
	bottom: auto;
	top: 50%;
	right: 20px;
}

#logo-site-accueil img {
    max-width: 250px;
}
}

nav#menu-principal{
	width:100%;
}

#nav ul.children ul{
	background:transparent !important;
}

#nav ul.children ul a {
    color: #fff !important;
}

#menu #logo-site img {
    opacity: 1;
}

a#voir-carnet-voyage {
    margin: 0 70px 0 0;
}

#top-header #meteo {
    margin: 8px 15px 0 0;
}

#recherche_site input[type="text"] {
    width: 89% !important;
}

#searchform input[type="submit"] {
    height: 50px !important;
    width: 50px !important;
}

@media screen and (max-width:660px){
#top-header {
    height: 56px;
	position: relative;
	padding: 0 56px 0 0;
}

a#voir-carnet-voyage {
    padding: 5px 10px;
}

#top-header #meteo {
    margin: 2px 0;
	float:left;
}

#langue {
    margin: 3px;
}

#langue img {
    height: 20px;
}

#google_translate_element {
    margin: 4px 0;
}

.goog-te-gadget-simple{
	font-size:1em;
}

a#voir-carnet-voyage {
    float: none;
    text-align: left;
    margin: 0;
    position: absolute;
    top: 30px;
    width: 100%;
    z-index: 1000;
    left: 0;
}

#menu #logo-site img{
	opacity:1;
}

#top-header #meteo img {
    height: 20px;
	margin:0;
}

.picto-temperature span {
    font-size: 1em !important;
}

.goog-te-gadget-simple .goog-te-menu-value span {
    margin: 0 3px;
}

.goog-te-menu-value{
	margin:0 !important;
}

header {
    top: 56px;
    position: absolute !important;
	background: rgba(255,255,255,0.7);
}

/*Form de recherche*/

#volet{
	position:absolute;
}

#volet a.ouvrir,
#volet a.fermer {
	width:56px;
	height:56px;
}

#volet a.ouvrir {
	left:-56px;
}

#volet a.ouvrir img, #volet a.fermer img{
	margin:12px 0;
}

#recherche_header {
    height: 56px;
}

#recherche_site input[type="text"] {
    margin: 8px 0 0 0 !important;
    width: 80% !important;
}

#searchform input[type="submit"] {
    height: 56px !important;
    width: 56px !important;
}
/**********Fin recherche************/
}
/***************fin header*********************/
#fond-video {
    max-height: 100%;
}	
@media screen and (max-width:760px){	
#video-accueil {
    /*height: 108vh !important;*/
	height: 100vh !important;
	max-height:600px !important;
}
}

@media screen and (min-width:760px){	
#video-accueil {
    height: 480px !important;
	max-height: 80vh !important;
}
}

#bloc-texte-accueil h2.titre-blc-texte {
    width: 30%;
}
/******************acces rapides*********************/
#acces-rapides {
    display:none;
}


/*****************fin acces rapides*****************/


/************************Page d'accueil**************************************/

/**********************ligne1**********************************/

@media screen and (min-width:660px){
#btn-carte-trait {
    border-top: 1px solid #ccc;
	border-left:none;
}

.btn-carte img {
    width: 40px;
}

#agenda-accueil li:first-child {
    width: 60% !important;
    margin: 0 0 25px 40%;
}

#agenda-accueil li {
    width: 48%;
}

#agenda-liens-triangle {
    border-width: 0 30px 231px 0;
}

#bloc-agenda-liens {
    width: 38%;
}
}


@media screen and (max-width:770px){
ul#agenda-accueil li span.meta-date {
    font-size: 0.8em;
}
}

.agenda.hover-effect .bloc-au-survol {
    padding: 10px;
}

@media screen and (max-width:660px){

#ligne1{
	display:block;
	width:100%;
}

#gauche-ligne1{
	display:block;
	width:100%;
	padding:20px 3% 30px 40px;
	border-right:none;
	background-color:#eee;
}

#droite-ligne1{
	display:block;
	width:100%;
	padding:20px 3% 0 40px;
}

#bloc-agenda-liens {
    width:90%;
    position: relative;
}

#agenda-liens-triangle {
    border-width: 0 70px 200px 0;
}

#agenda-accueil li, #agenda-accueil li:first-child{
    width: 90% !important;
    display: block !important;
	margin:10px auto !important;
}

.gallery-full-css .carte-item {
    margin:0 auto !important;
    max-width: 400px !important;
}
}
/*******************fin ligne1*********************************/

/*******************fin ligne1*********************************/
@media screen and (min-width:660px) @media screen and (max-width:700px){
	#gauche-ligne1 {
    width: 40%;}
	
	#droite-ligne1 {
    width: 60%;
	}
	
	#agenda-liens-triangle {
    border-width: 0 20px 231px 0;
	}
	
	#ligne1 #agenda-liens {
    padding: 10px 10px 10px 0;
	}
}

@media screen and (max-width:700px){
	#ligne2 li {
    width: calc(100% / 2) !important;
	}
}
/*******************ligne3*********************************/
#ligne3 {
    position: relative;
    padding: 40px 0;
}

#ligne3 img {
    width: 130px;
}

/*******************fin ligne3*********************************/


/*Décalage à cause accès rapides gauche*/
@media screen and (min-width:768px){}

/*Pour n'afficher l'outil carnet de route qu'à partir de l'ipad portrait 768px */
@media screen and (max-width:767px){}


/***************page****************************/

#image-header-page{
	padding-top:0;
}

/*Titre pour les déclinaisons Musée, Théâtre, Médiathèque, Cinéma*/
.titre-img-declinaison{
	top:150px;
	font-size:2.8em;
}

span#titre-declinaison{
	padding:10px;
}

span.trait-declinaison{
	height:10px;
	width:100px;
	background-color:#000;
}

#la-page{
	display:block;
	width:100%;
	padding:0 0 0 0;
	margin:0;
	overflow:hidden;
}

blockquote{
    margin: 20px -10px 60px -10px;
	padding: 30px 20px;
}

@media screen and (min-width:760px){
	blockquote{
    padding: 30px 20px;
}	
}

@media screen and (min-width:768px){
	#la-page{
		padding-left:70px;
	}
}

/*Pour le menu (filtres) des annuaires*/
#gauche{
	float:none;
	position:absolute;
    top:0;
	left:-100%;
	display: block;
    margin:0;
    padding:0;
    transition: all 500ms ease 0s;
    /*width: 330px;*/
	width:100%;
    z-index:3; /*pour passer par dessus le tel des blocs annuaire*/
}

#gauche:hover{
	left:0;
	
}

#bt-filtrer{
	display:block;
    background-color:#374D59;
	color:#FFF;
	font-family: 'Heebo', sans-serif;
	font-weight:300;
	font-size:0.7em;
	text-transform:uppercase;
	text-align:center;
    padding:15px 5px 15px 5px;
	margin:0;
    width:70px;
	position:absolute;
	top:0;
	right:-70px;
}

.sidebar ul#menu_pages{display:none;}

.sidebar ul#menu_annuaire{
	margin:0 0 0 0;
    width:100%;
	border:10px solid #374D59;
}

@media screen and (min-width:768px){
	#bt-filtrer{
	text-align:right;
    padding:15px 15px 15px 5px;
    width:140px;
	right:-140px;
	}
	
	.sidebar ul#menu_annuaire{
	padding-left:70px;
}
}

/*Fin du menu (filtres) des annuaires*/
/***************************************/

#content{
	float:none;
	width:100%;
	height:auto !important;
	min-height:100px;
	padding:10px 10px 30px 10px;
	margin:0 0 0 0;
	color:#666;
}

#content_large{
	width:100%;
	padding:10px 10px 30px 10px !important;
	margin:0 0 0 0;
	border-top:none;
	color:#666;
}

.main-page-large #fil_ariane, .main-fiche-annuaire #fil_ariane {
    padding: 5px 10px;
}

li#krea3outils_print a{
    background: #eee url(../images/icons_outils_print.png) no-repeat center left;
}

@media screen and (max-width:767px){
#ajouter-carnet-voyage a {
    font-size: 0.9em;
}

#fil_ariane {
    margin:6px 0;
	padding: 5px 10px;
}
}

@media screen and (min-width:767px){
#fil_ariane {
	padding: 5px 10px 5px 80px !important;
}

.listing .listing-item {
    width: 300px;
    height: 225px;
}
#content_large .listing ul {
    width: 650px;
}
}

.nav-fiche, .nav-actus {
    width: 100%;
}

#content_large h1 {
    padding: 5px 0 0 0;
    margin: 0 0 15px 0;
}

#fil_ariane {
    color: #666;
    text-shadow: none;
}

#fil_ariane a{
    color: #333;
}

#btn-agenda-mois{
	float:none !important;
	margin:0 auto 20px auto !important;
	clear:both !important;
	max-width:271px;
	display:block !important;
}

#categories-annuaire-prefiltre ul, #je-suis-no-js ul {
    margin: 10px -10px;
	padding: 10px;
}

.main-page-large {
    margin: 0;
} 
/*****************FICHE AGENDA**********************/
#entete-fiche {
	padding: 10px 20px 10px 20px !important;
	margin: 0 -10px 20px -10px;
	display: block;
	position: relative;
	clear: both;
	width: calc(100% + 20px);
}

.entete-fiche-annuaire{
	padding: 10px 10px !important;
	margin: 0 0 20px 0 !important;
	width: 100% !important;
}

#entete-fiche h1{
	margin: 0 0 20px 0 !important;
}

ul#date-manif-fiche li {
    top: auto;
    left: auto;
    height: auto;
    width: auto;
    position: relative;
}

#content_large #colonne1-agenda, #content_large #colonne2-agenda, #content_large #colonne1-annuaire, #content_large #colonne2-annuaire {
    padding: 10px;
}

#coordonnees-fiche {
    position: relative !important;
    display: block;
    width: 100% !important;
}

.bloc-fiche{
	position:relative !important;
	padding-right:0 !important;
	max-height:100% !important;
}
/*****************FIN FICHE AGENDA**********************/


/*Déclinaisons Musée, Théâtre, Médiathèque, Cinéma*/
#logo-declinaison{
	width:120px;
	margin:-10px 20px 10px -10px;
}

.footer-declinaison{
	margin-bottom:40px;
}

#horaires-declinaison{
		margin:0 0 40px 0;
}

@media screen and (max-width:767px){
	#horaires-declinaison{
		display:block;
		width:100%;
		margin:0 0 40px 0;
		padding-top:20px;
	}

	#gauche-horaires{
		display:block;
		width:100%;
	}

	#milieu-horaires,
	#droite-horaires{
		display:block;
		width:50%;
		float:left;
		padding:10px 20px 10px 30px;
	}

	#milieu-horaires{
		border-left:none;
		border-right:none;
	}

	#droite-horaires{
		border-left:1px solid #4c5356;
	}
}


/*Fin déclinaisons Musée, Théâtre, Médiathèque, Cinéma*/

/***********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******************************/
/*******************ANNUAIRE*********************/
.la-page-annuaire{
	min-height:auto !important;
}

.main-page-annuaire {
	margin: 0 auto 0 auto;
}

#image-header-annuaire {
    height: auto;
}

.la-page-annuaire .listing li.un-bloc-listing {
}

#gauche-annuaire-fixed, .la-page-annuaire-top #gauche-annuaire-fixed, .la-page-annuaire-bottom #gauche-annuaire-fixed{
	position:relative !important;
	top:auto !important;
	left: auto !important;
	right:auto !important;
	bottom:auto !important;
	height:auto !important;
	width:100% !important;
	max-width:100% !important;
	min-height: 500px;
}

.la-page-annuaire #carte-annuaire, .la-page-annuaire #cbp-vm{
	display:block !important;
	clear:both !important;
	width:100% !important;
	height:auto !important;
}

@media screen and (max-width:767px){
#gauche-annuaire {
	padding: 10px;
}
}

@media screen and (min-width:767px){
#gauche-annuaire {
	padding: 10px 10px 10px 90px;
}
}

#gauche-annuaire {
width: 40%;
}

.la-page-annuaire #liste-annuaire {
    width: 58%;
}

.la-page-annuaire-bottom #carte-annuaire-fixed, .la-page-annuaire-top #carte-annuaire-fixed, #carte-annuaire-fixed{
	position:relative !important;
	top:auto !important;
	left:auto !important;
	bottom:auto !important;
	right:auto !important;
	width: 100% !important;
	display: block !important;
	clear: both;
	margin:0 0 20px 0;
}

@media screen and (max-width:667px){
	#gauche-annuaire, #liste-annuaire {
    width: 100% !important;
    display: block !important;
    clear: both;
    float: none !important;
    height: auto !important;
    min-height: auto !important;
    padding: 10px;
}

#gauche-annuaire-fixed, .la-page-annuaire-top #gauche-annuaire-fixed, .la-page-annuaire-bottom #gauche-annuaire-fixed {
	position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    height: auto !important;
    width: 100% !important;
    max-width: 100% !important;
}

.la-page-annuaire #liste-annuaire {
    width: 100%;
	float:none;
	display:block;
	clear:both;
}

}

/******************Fiche annuaire*************/
.main-fiche-annuaire {
    margin: 0 auto 0 auto !important;
}
/******************Fin Fiche annuaire*************/

/*******************FIN ANNUAIRE*********************/


/****************Page rechercher**************/
#la-page #searchform input[type="text"] {
    height: 50px !important;
}
/****************Fin Page rechercher**************/

/*****************Page normandie*********************/
.main-page{
	margin-top:0;
}

.main-normandie-large #content_large {
    padding: 30px 10px 30px 0 !important;
    background: #a92535 url(../images/lions-normandie.png) no-repeat scroll right 19px / 100px auto;
}

.main-normandie-large ul.liens_enfants li h4{
    font-size:1em;
}

.main-normandie-large ul.liens_enfants{
    display:block;
	clear:both;
	margin: 50px -30px 0 -30px;
	background:transparent;
}

.main-normandie-large .image-large {
    margin-right: -10px;
	margin-left: -70px;
	width: calc(100% + 80px);
	max-width: calc(100% + 80px) !important;
}
/*****************Fin Page normandie*********************/

/****************Page temoignages***************/
.main-single-temoignages #content_large {
    padding: 0 10px 80px 10px !important;
}

@media screen and (max-width:767px){
.main-single-temoignages .image-large {
    margin: 50px -10px 50px -60px !important;
    width: calc(100% + 70px) !important;
    max-width: calc(100% + 70px) !important;
}
}

@media screen and (min-width:767px){
.main-single-temoignages .image-large {
    margin: 50px -20px 50px -80px !important;
    width: calc(100% + 100px) !important;
    max-width: calc(100% + 100px) !important;
}
}

@media screen and (max-width:767px){
.main-single-temoignages #entete-fiche {
    padding: 10px 20px 10px 70px !important;
    margin: 0 -10px 30px -60px !important;
    width: calc(100% + 70px) !important;
}
}

@media screen and (min-width:767px){
.main-single-temoignages #entete-fiche {
    padding: 10px 20px 10px 80px !important;
	margin: 0 -10px 30px -80px !important;
	width: calc(100% + 90px) !important;
}
}

@media screen and (max-width:767px){
.main-single-temoignages blockquote {
    margin: 20px -20px 20px -60px !important;
    width: calc(100% + 70px) !important;
    padding: 20px 20px 20px 70px !important;
}
}

@media screen and (min-width:767px){
.main-single-temoignages blockquote {
    margin: 20px -20px 20px -80px !important;
    width: calc(100% + 100px) !important;
    padding: 20px 20px 20px 80px !important;
}
}
/****************FIN Page temoignages***************/

/*****************CARTE interractive**********/

#bt-filtrer {
	background-color: #e8e8e8;
    color: #333;
    padding: 15px 5px 15px 24px;
    width: 120px;
    right: -120px;
	margin:20px 0 0 0;
}

.page_carto #map_canvas {
    margin: 60px 0 0 0;
}

/*****************FIN CARTE interractive**********/

/****************footer*********************/ 

@media screen and (max-width:767px){
#top-footer {
    padding: 15px 20px;
}

#bloc-liens-gauche {
    display: block;
    width: 100%;
}

#bloc-coordonnees {
    width: 70%;
}

#footer-liens-droite {
    padding: 0 0 0 15px;
}

ul#menu_footer {
    display: block;
    width: 100%;
    margin: 20px 0 0 0;
}

#footer-suivre{
	display:none;
}
/************fin footer*********************/ 
}