/*
Theme Name:     Custom Theme
Author:         C2Web
Author URI:     http://www.c2w.fr
Template:       c2web_framework
*/

/*
Indication :
font-family: "Font Awesome 5 Free";
font-family: "Font Awesome 5 Regular";
font-family: "Font Awesome 5 Solid";
*/

body{
  background:#000;
}

header{
	position: fixed;
	z-index: 100;
	top: 0;
	left: 0;
	width: 100%;
	-webkit-transition: 0.3s all;
	-o-transition: 0.3s all;
	transition: 0.3s all;
  display: flex;
}

header.mini{
	background:rgba(0,0,0,1);
	padding-top: 0.5rem;
}

.container-menu a{
	text-transform: uppercase;
}

header .container-menu{
	text-align: right;
}

/* Menu desktop header */

header .menu{
	text-align: center;
	padding:0;
  display: flex;
  flex-direction: row;
  list-style-type: none;
  justify-content: flex-end;
}

header .menu ul{
  padding: 0;
  margin: 0;
}

header .menu li{
  position: relative;
  margin: 0;
  padding: 0;
  font-size: 1.2rem;
}

header .menu li a{
  display: block;
  color:var(--couleur1);
}

header .menu > li + li{
  margin-left: 1rem;
}

header .menu > li > a{
  padding:0.5rem 0.5rem;
  text-decoration: none;
}

header .menu .sub-menu{
  position: absolute;
  left: 0;
  top: 100%;
  height:auto;
  overflow: hidden;
  max-height: 0;
  transition:0.2s all ease;
  -webkit-transition:0.2s all ease;
  list-style-type: none;
  background:var(--couleur1);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  text-align: left;
}

header .menu .sub-menu > li{
  flex:1;
}

header .menu li:hover > .sub-menu{
  max-height: 100vh;
  transition:0.5s all ease;
  -webkit-transition:0.5s all ease;
}

/* Menu desktop footer */

footer .menu{
	padding:0;
  display: flex;
}

footer a{
  color:#FFF;
  text-decoration: none;
}

footer a:hover{
  color:var(--couleur3);
  text-decoration: none;
}

footer .menu li{
	list-style-type: none;
}

footer .menu li + li{
  margin-left: 1rem;
}

h1{
  color:var(--couleur1);
  margin-top: 2.5rem;
  margin-bottom: 1.5rem;
}

body.single h1,
body.page h1{
  color:var(--couleur-texte);
}

body.single #main-container > .container,
body.page #main-container > .container{
  background:var(--couleur2);
}

/******************************/
/* galerie gutenberg homogène */
/******************************/

:root{
	--gallery-image-width : 260px;
	--gallery-image-height : 260px;
}

ul.blocks-gallery-grid{
	display: flex;
	justify-content: flex-start;
	padding : 0px;
    flex-wrap : wrap;
    height : auto;
}

li.blocks-gallery-item::before{
	display: none;
	content : '';
}

li.blocks-gallery-item a img{
	-webkit-transition: all .3s;
	   -moz-transition: all .3s;
	    -ms-transition: all .3s;
	     -o-transition: all .3s;
	        transition: all .3s;
}


li.blocks-gallery-item:hover a img{
	-webkit-transform: scale(1.02);
	   -moz-transform: scale(1.02);
	    -ms-transform: scale(1.02);
	     -o-transform: scale(1.02);
	        transform: scale(1.02);

}

.wp-block-gallery.columns-3 li.blocks-gallery-item {
    width: var(--gallery-image-width);
    height : var(--gallery-image-height);
    margin-right: 35px;
    position: relative;
    flex : none;
    display : block;
    margin-bottom : 50px;
}

.wp-block-gallery.columns-3 .blocks-gallery-item:nth-of-type(3n) {
    margin-right: 35px;
}

li.blocks-gallery-item figure{
	width : 100%;
	height : auto;
	margin: auto;
}

li.blocks-gallery-item figure figcaption.blocks-gallery-item__caption{
	position: absolute;
	padding : 16px 5px;
	background : transparent;
	bottom : -50px;
	color : var(--couleur-texte);
	font-size : 1.5em;
}

figure.wp-block-gallery:not(.is-cropped) figure{
	align-items: center;
	justify-content: center;
}

.blocks-gallery-caption{
	display: none;
}

/******************************/
/* fin galerie gutenberg homogène */
/******************************/

/* Carte OpenStreetMaps */
.leaflet-control-attribution{
  display: none;
}

.leaflet-popup{
  display: none;
}

.leaflet-marker-pane img{
  cursor: grab;
}


.liste-posts{
  display: flex;
  flex-wrap: wrap;
}

.liste-posts > article{
  width: 50%;
}

.extrait-article{
  padding:1rem;
  user-select: none;
}

.extrait-article > .entry-content{
  background:var(--couleur2);
  display: flex;
  flex-direction: column;
  height: 100%;
  position: relative;
  padding:0.5rem 1rem;
  padding-bottom: 2rem;
  line-height: 1.4;
  border-radius: 4px;
}

.extrait-article .ligne_head{
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  margin-bottom: 1rem;
}

.extrait-article .ligne_head .cat{
  width: 49px;
}

.extrait-article > .entry-content a{
  text-decoration: none;
}

.extrait-article > .entry-content a:hover{
  color:var(--couleur3);
}

.extrait-article > .entry-content h2{
  display: flex;
  flex-direction: column;
  flex:1;
  margin: 0;
}

.extrait-article > .entry-content h2 span{
  font-size: 1rem;
}

.extrait-article > .entry-content .flag{
  position: absolute;
  bottom: 0.5rem;
  left: 1rem;
  font-size: 1.1rem;
  line-height: 1;
  display: flex;
  align-items: center;
  text-decoration: none;
}

.extrait-article > .entry-content .flag img{
  margin-right: 0.5rem;
}

body.single .post-meta{
  border:1px solid rgba(0,0,0,0.3);
  display: flex;
  justify-content: flex-end;
  align-items: center;
  border-radius: 1rem;
  padding:0.25rem 1rem;
  margin-bottom: 2.5rem;
}

body.single .post-meta .meta-date{
  flex:1;
}

body.single .post-meta a{
  text-decoration: none;
}

body.single .post-meta > * + *{
  margin-left: 1rem;
}

#comments{
  padding-top: 3rem;
  margin-top: 4rem;
  border-top:1px solid rgba(0,0,0,0.3);
}

#comments h2{
  margin-bottom: 2rem;
}

#comments ol{
  list-style-type: none;
}

#comments .comment-content{
  padding:1rem;
  background:#FFF;
  border-radius: 1rem;
  margin-top: 0.5rem;
}

#comments .comment-content p:last-child{
  margin-bottom: 0;
}

#comments ol > li + li{
  margin-top: 2rem;
}

.page-numbers{
  user-select: none;
}

.page-numbers li{
  background:var(--couleur2);
  border-radius: 99em;
  border:none;
}

.page-numbers li a,
.page-numbers li span{
  text-decoration: none;
  display: flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border:1px solid var(--couleur2);
  border-radius: 99em;
}

.listing-videos{
  display: flex;
  flex-wrap:wrap;
  width: 100%;
}

.container-vignette-video{
  width: 216px;
  margin-bottom: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vignette-video{
  width: 100%;
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
  width: 95%;
  height: 196px;
  background-size: cover;
  background-repeat:no-repeat;
  background-position: center;
}

.vignette-video span{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  color:#FFF;
  background:rgba(255,255,255,0.2);
  padding:0.1rem 0.5rem;
  font-size: 1.1rem;
  font-weight: 500;
  transition:0.3s all ease;
}

.vignette-video:hover{
  transform: scale(1.03);
}

.vignette-video:hover span{
  background:rgba(255,255,255,0.7);
  color:#000;
}