/*
 Theme Name:   vdaube child
 Theme URI:    https://alouest-web.com
 Description:  vdaube-underscores Child Theme
 Author:       Pierre Réguer
 Author URI:   https://alouest-web.com
 Template:     vdaube
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, responsive-layout, accessibility-ready
 Text Domain:  vdaube-child
*/

.site-main {
	margin-top: 80px;
	}

#page {
    padding: 85px 2vw 0 2vw;
	}
.pleine-largeur {
    margin: 0 -2vw;
	}

#content {
	width: 95%;
    max-width: 1280px;
    margin: 0 auto;
	}


a:hover, div:hover, img:hover, .menu-item:hover  {
    transition-property: all;
    transition-duration: .2s;
    transition-timing-function: ease-in;
	}
a, div, img, .menu-item  {
    transition-property: all;
    transition-duration: .05s;
    transition-timing-function: ease-out;
	}

.p-clear {
	clear: both;
	}

/*________EN_TETE _____________________________________________*/


.site-branding {
    max-width: 1280px;
    margin: 0 auto;
    text-decoration: none;
    color: #be1421;
	}
.nom-du-site {
	float: left;
	}
.site-title {
	font-size: 2.4em;
	font-weight: lighter;
	margin: 0; 
	}
.gras {
	font-weight: bold;
	}	
.site-title a,  .site-title a:hover, .site-title a:active{
	text-decoration: none;
	color: #be1421
	}		
.site-description {
	margin-top: -0.4em;
	font-size: 0.9em;
	}

#bandeau {
  float:left;
  width: 100%;
	}

header {
	margin-bottom: 140px;
	}



/*________PIED DE PAGE _____________________________________________*/
#colophon {
    text-align: left;
    background-color: #be1421;
    color: #fff;
    height: 300px;
    padding: 80px 4% 20px 4%;
    margin: 0 -4% 0 -4%;
	}
#colophon a, #colophon a:visited {
    color: #fff;
	}
#colophon a:hover {
    color: #f3e2e3;
	}

#largeur-site {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
    height: 220px;   
	}

#picto-adresse {
	display: block;
	float: left;
	}
#adresse {
	float: left;
	line-height: 0.9em;
    font-size: 1em;
    margin-left: 1em;
	}
#adresse a {		
	text-decoration: none;
	}
#adresse a:hover {		
	font-weight: bold;
	}
.reseaux-sociaux {
	float: right;
	margin-right: 100px;
	}

.reseaux-sociaux a {
	margin-left: 10px;
	display: inline-block;
	}

@media screen and (max-width: 640px) {
.reseaux-sociaux {
    margin-right: 25px;
    margin-top: 80px;
    }
}


#bas-de-footer {
    position: absolute;
    bottom: 10px;
    display: inline-block;
    width: 500px;
    margin-left: -250px;
    left: 50%;
    font-size: 0.8em;
    text-align: center;
	}
	
/*________FIN PIED DE PAGE _____________________________________________*/


/*________ AJUSTEMENTS DE MARGES POUR SMARTPHONE ______________________*/
@media screen and (max-width: 640px) {

    #page {
      padding: 85px 4vw 0 4vw;
    }
    .mobmenur-container {
      right: 4vw !important;
    }
    .reseaux-sociaux {
      margin-right: 0;
      margin-top: 80px;
    }    
    .pleine-largeur {
    margin: 0 -4vw;
    }
    #content {
    width: 100%;
    }
    .encadres-home {
    margin: 0 0;
    }

}
/*________ FIN AJUSTEMENTS DE MARGES POUR SMARTPHONE ______________________*/



/*________ANIMATIONS ET TRANSITIONS _____________________________________________*/
a {
	transition: 0.3s;
	}

/*________IMAGES _____________________________________________*/

img {
    margin-top: 0.5em;
    margin-bottom: 1.5em;
	}

.wp-block-image figcaption {
    margin-top: -1.5em;
    margin-bottom: 4em;
	font-style:italic;
	}

.wp-block-image figcaption {
    font-style: normal;
    text-align: center;
    }


/*________ Typographie _____________________________________________*/

body {
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 0.9em;
  }
  
p {
    margin-bottom: 0.4em;
    margin-top: 0.4em;
	}

.entry-title {
    text-align: center;
	}

h1 {
    font-size: 1.8em;
    margin: 0.67em 0;
	}

h2 {
    font-size: 2.2em;
    line-height: 1em;
	font-weight: bold;
	}

h2:first-child {
    margin-top: 0;
	}

h3 {
	font-size: 1.18em;
	font-weight: bold;
	}

h4 {
	font-size: 1.2em;
    font-weight: bold;
	margin-top: 2em;
	}


ul, ol { margin: 0 0 1.5em -1em; }
li { margin-top: 0.5em; }

.gras {
	font-weight: bold;
	}

a, a:visited {
	color: #be1421;
}

/*________MENU TOGGLE_____________________________________________*/
.mobmenur-container {
    right: 30px !important;
	}
.mobmenur-container img {
    max-height: 40px !important;
	}


/*________MENU DESKTOP_____________________________________________*/


.main-navigation ul {
    display: table; 
    width: 100%;
	}
	
.main-navigation {
    float: none;
    max-width: 1000px;
    margin: 0 auto;
	}
	
.main-navigation li {
    float: none;
    display: table-cell;
    width: 12.5%;
    height: 100%;
    vertical-align: middle;
	}
.main-navigation a {
    display: block;
    text-decoration: none;
    color: #111;
    text-align: center;
    padding: 5px;
	line-height: 1.3em;
	}
.main-navigation ul ul li {
    display: block;
    width: 100%;
	}
.main-navigation ul ul a {
    width: 200px;
    padding: 6px 20px 6px 40px;
    text-transform: uppercase;
    font-size: 0.8em;
    text-align: left;
	}
.menu-item {
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 80% 5%;
	line-height: 1.5em;
    padding-bottom: 1em;
	}
.menu-item:hover {
    background-size: 80% 16%;
	}


/*________FIN MENU DESKTOP_____________________________________________*/

/*________PAGE D'ACCUEIL DESKTOP_______________________________________*/

.encadres-home {
    float: left;
    max-width: 20%;
    }
/*
.encadres-home::after {
    content: "…";
    position: absolute;
    right: 0;
    bottom: 1px;
    background-color: #fff;
}
*/
.encadres-home h2 {
    font-size: 1.8em;
    margin-bottom: 0;
    }
.encadres-home p {
    margin-bottom: 0;
    margin-top: 0;
    line-height : 1.2em;
	max-height: 10.8em;
    overflow: hidden;
    text-align: justify;
    position:relative;
	display: -webkit-box;
    -webkit-line-clamp: 9;
    -webkit-box-orient: vertical;
    }


.fleche-home {
	display: block;
	float: left;
    margin-left: 3%;
    margin-top: 11.15em;
    width: 4.5%;
    }


	


#img-breves {
    display: block;
    float: left;
    margin-right: 30px;
    margin-left: 20%;
	width: 175px;
    }	

#univers h2 {
    color: #be1421;
    font-size: 1.8em; 
    margin-top: 40px;
    }
	
.picto-nav {
	float:left;
	text-align: center;
	text-decoration: none;
	margin-right: 120px;
	margin-right: 9%;
	margin-bottom: 30px;
    font-size: 1.3em;
    width: 7%;	
	}	
.picto-nav img {
	margin-bottom: 0;
	}	

#expo-permanente {
	position: relative;
	background: url(https://valeriedaube.com/wp-content/themes/vdaube-child/img/expo-permanente.jpg) no-repeat right bottom;
	background-size: contain;
	width: 44vw;
	max-width: 585px;
	height: 44vw;
	margin-bottom: 50px;
	margin-top: 35px;
	float: left;
	color: #fff;
    }
    	
#expo-temporaire {
	position: relative; 
	background: url(https://valeriedaube.com/wp-content/themes/vdaube-child/img/expo-temporaire.jpg) no-repeat right bottom;
	background-size: contain;
	width: 44vw;
	max-width: 585px;
	height: 44vw;
	margin-bottom: 50px;  
	margin-top: 35px;  
	float: right;
    }	

#expo-permanente h2, #expo-temporaire h2, .interieur-expo img {
    font-size: 1.9em;
    float: right;
    margin-right: 20vw;
    margin-left: 1vw;
    margin-bottom: 0;
    color: #fff;
	}  

.interieur-expo {
	position: absolute;
    top: 50%; /* poussé de la moitié de hauteur du référent */
    transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
	}


.lien-expo {
	display: block;
	width: 44vw;
	max-width: 585px;
	height: 44vw;
	}
	
/*________FIN PAGE D'ACCUEIL DESKTOP_______________________________________*/

/*________PAGE D'ACCUEIL SMARTPHONE_______________________________________*/

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

.encadres-home {
    max-width: 100%;
    margin: 0 10px;
    }
.fleche-home {
	float: right;
    margin-top: 0px;
    width: 100%;
    }
.fleche-home img {
    float: right;
}    
	
#img-breves {
	float: none;
    margin: 40px auto 20px auto;
    }		
.picto-nav {
    width: 22%;	
	}	


#expo-permanente {
	width: 88vw;
	height: 88vw;
	float: none;
	margin-right: auto;
    margin-left: aUto
    }
    	
#expo-temporaire {
    width: 88vw;
	height: 88vw;
	float: none;
	margin-right: auto;
    margin-left: aUto
    }	


} /*fermeture media queries*/



/*________FIN PAGE D'ACCUEIL SMARTPHONE____________________________________*/


/*__________Styles pour affichage par vignettes_______________*/
.article-vignette h2 {
    font-size: 1em ;
    color: #d4065a;
    line-height: 1.6em;
   }
.article-vignette h2 a {
    color: #be1421;
	text-decoration: none;
   }   
   
.article-vignette {
    text-align: center;
    max-width: 20%; 
	height:29vw;
    max-height: 500px; 
    overflow: hidden; 
    float: left; 
    margin : 15px 2% !important; 
    padding: 5px;
   }

.article-vignette header {
    margin : 0 auto;
}   
#page-vignettes {
    padding-left: 15%;
    padding-right: 15%;
}

#nav-vignettes {
	float:left;
	width: 100%;
}

#nav-vignettes::before{
  display: table;
  content: "";
  clear: both;
}

.intro-blog {
    margin-bottom: 5em;
}
   
@media screen and (max-width: 640px) {
.article-vignette {
    max-width: 100%; 
    display: block;
    float: none;
    margin: 0 auto;
	height: auto;
   }
   .article-vignette header {
    margin : 0 auto;
    }
}
   /*FIN Styles pour affichage par vignettes*/





/*________FORMULAIRES_____________________________________________*/

div.wpforms-container-full {
    margin-top: 60px;
	}
.wpforms-form {
    padding : 20px 0 30px 0;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
	}

.formulaire-annexe {
    margin-left: 30px !important;
    margin-top: -10px !important;
	}
.formulaire-annexe .wpforms-field-label {
    font-weight: normal !important;
	}
#wpforms-64 {
	 border-bottom: 8px solid #165CFF;
	}

/*________FIN FORMULAIRES_____________________________________________*/



