
/*-----------------------------------------------------
	1. Normalize 
-------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

/*-----------------------
	Font
------------------------*/
@font-face {
	font-family: "Leicester";
	src: url('../font/Leicester_text.ttf');
}
@font-face {
	font-family: "Leicester";
	font-style: bold;
	src: url('../font/Leicester_bold.ttf');
}
@font-face {
	font-family: "Leicester";
	font-weight: light;
	src: url('../font/Leicester_light.ttf');
}

/*-----------------------
	Styles
------------------------*/
@media (orientation: landscape) {
	body {
		background-color:black;
		height: auto;
		position: relative;
		display: grid;
		grid-template-rows: auto 1fr auto;
	}
}

@media (orientation: portrait) {
	body {
		background-color:black;
		height: auto;
		position: relative;
	}
}

@media (orientation: landscape) {
#background-home{background: url("../images/pigeon_noir_blanc_background_truncate.jpg");
		 background-size: cover;
		 background-repeat: no-repeat;
		 font-family: "MinionPro", "Times New Roman", Times, serif;
	     color:white;
	     width:100%;
	     height:100%;
	     min-height:999px;
		 margin:0;
	     font-size:16px;
		 background-color:black;
		}
}

@media (orientation: portrait) {
#background-home{background: url("../images/pigeon_noir_blanc_background_truncate_portrait.jpg");
		 background-size: cover;
		 background-repeat: no-repeat;
		 font-family: "MinionPro", "Times New Roman", Times, serif;
	     color:white;
	     width:100%;
	     height:100%;
	     min-height:999px;
		 margin:0;
	     font-size:16px;
		 background-color:black;}
}

@media (orientation: landscape) {
#background-other {
		background: url("../images/pigeon_noir_blanc_background_truncate_opaque.jpg");
		background-size: contain;
		background-repeat: no-repeat;
		font-family: "MinionPro", "Times New Roman", Times, serif;
		color:#777;
		width:100%;
		height:100%;
		min-height:999px;
		margin:0;
		background-color:black;
	}
}

@media (orientation: portrait) {
#background-other{background: url("../images/pigeon_noir_blanc_background_truncate_portrait_opaque.jpg");
		 background-size: contain;
		 background-repeat: no-repeat;
		 font-family: "MinionPro", "Times New Roman", Times, serif;
	     color:#777;
	     width:100%;
	     height:100%;
		 min-height:999px;
		 margin:0;
		 background-color:black;
		 overflow:scroll;}
}


@media (orientation: landscape) {
#textstyle {margin-left:20%;
	    margin-right:20%;
        padding:3%;
	    font-weight: normal;
	    font-size:20px;
        height: auto;
	   }
}

@media (orientation: portrait) {
#textstyle {margin-left:2%;
	    margin-right:2%;
        padding:8%;
	    font-weight: normal;
	    font-size:40px;
	   }
}

#video-premiere {
		padding: 3% 3% 3% 3%;
		display: flex;
		align-items: center;
		justify-content: center;
}
 
#video {
		padding: 0% 3% 3% 3%;
		display: flex;
		align-items: center;
		justify-content: center;
}

#video-derniere {
		padding: 0% 3% 6% 3%;
		display: flex;
		align-items: center;
		justify-content: center;
}

/* GALERIES */
#galeriesAnchor{position:relative; width:100%; padding:.5em 1em .4em 1em; text-align:center; margin-bottom:1em;}
#galeriesAnchor li{position:relative; margin:0 .7em; display:inline-block; text-transform:uppercase; font-family:arial; font-size:.8em; letter-spacing:1px;}
#galeriesAnchor li::after{content:""; position:absolute; top:.05em; right:-.8em; width:1px; height:80%;}
#galeriesAnchor li:last-child::after{display:none;}
#galeriesAnchor li a{color:#000; text-decoration:none;}

.galeries{position:relative; margin:0 auto; width:100%; padding: 1.5em; max-width:1500px;}
.galeries .galeriesTitle{position:relative; font-size:1.875em; text-transform:uppercase; margin-bottom:1em; margin-left:2%; clear:both; display:inline-block;}
.galeries .galeriesTitle::after{content:""; position:absolute; bottom:-.2em; left:0%; width:100%; height:2px; }
.galeries article{position:relative; width:25%; padding:0 2%; float:left; margin-bottom:4%;}
.galeries article:nth-child(4n+1){clear:left;}
.galeries article a{display:block; color:#000; text-decoration:none}
.galeries article a .img{position:relative; display:block;}
.galeries article a .img img{display:block; width:100%; height:auto;}
.galeries article a .img .overlay{position:absolute; top:0; left:0; height:100%; width:100%; color:#fff; text-align:center; -webkit-transition: all .2s linear; transition: all .2s linear; opacity:0;}
.galeries article a .img .overlay div{position:relative; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
.galeries article a:hover .img .overlay{opacity:1;}
.galeries article a h2{font-weight:bold; font-size:1.25em; margin:.7em 0 .5em 0; text-align:center;}
.galeries article a h3, .galeries article a h4{text-align:center; margin-bottom:.25em;}


.singleGaleries{position:relative; padding:3em;}
.singleGaleries .singleGaleriesCtt{position:relative; margin:0 auto; width:100%; max-width:800px;}
.singleGaleries .singleGaleriesTitle{color:#000; font-size:1.5em; text-transform:uppercase; font-weight:bold; margin-bottom:1em;}
.singleGaleries .singleGaleriesAnnee{margin-top:.5em;}
.singleGaleries .album{padding:1em; margin:2em auto;}
.gallery-item a{display:block; padding:0 .4em;}
.gallery-item a img{width:100%!important; height:auto !important; border:0 !important;}
.tos-caption > div{ padding:.75em 0 ; font-family:helvetica, arial, sans-serif; font-size:.8em;}
.singleGaleries .gallery-caption{display:none;}

.textZone .wp-video, 
.textZone .wp-video video{width:100% !important; height:auto !important;}



.tabContainer{position:relative; width:100%;   display:block;}
.tabContainer > .tab-links {padding:0 2%}
.tabContainer > .tab-links:after {display:block; clear:both;content:'';}
.tabContainer > .tab-links li {display:inline-block; margin:1em 1em 1em 0; float:left; list-style:none;}
.tabContainer > .tab-links a{position:relative; font-size:1.275em; text-transform:uppercase; width:100%; margin-right:2%; clear:both; display:inline-block; color:#000; text-decoration:none;}
.tabContainer .tab-content {padding:1em 0;}
.tabContainer .tab {display:none;}
.tabContainer .tab.active {display:block;}


/*-----------------------------------------------------
      Configuration header
-------------------------------------------------------*/
@media (orientation: landscape) {
header{position:relative; width:100%;  background-color: black; background-size:auto 75%; border-bottom:2px solid #777;}
header #logo{position:relative; left:50%; -webkit-transform:translateX(-50%); transform:translateX(-50%); display:inline-block;  width:60%; max-width:480px; padding:1.25em 0; top: 3}
header #logo img{display:block; width:100%; height:auto;}
header .menu{padding:0 10% 2em 10%; width:100%; text-align:center;}
header .menu li{position:relative; display:inline-block; margin:0 .5em}
	header .menu li::after{content:""; position:absolute; top:0; right:-.65em; width:1px; height:80%; background:#b2b2b2}
	header .menu li:last-child::after{display:none;}
header .menu li a{position:relative; display:inline-block; color:#777; text-decoration:none; font-size:1.125em;}
header .menu li a::after{content:""; position:absolute; bottom:-2px; left:0; width:0%; height:2px; -webkit-transition: all .2s linear; transition: all .2s linear;background-color:#777!important;}
header .menu li a:hover::after, .current-menu-item a::after, .current_page_item a::after{width:100% !important;}
}

@media (orientation: portrait) {
header{position:relative; width:100%;  background-color: black; background-size:auto 100%; border-bottom:5px solid #777;}
header #logo{position:relative; left:50%; -webkit-transform:translateX(-50%); transform:translateX(-50%); display:inline-block;  width:80%; padding:3.25em 0 1.2em 0; top: 3}
	header #logo img{display:block; width:100%; height:auto;}
header .menu{padding:1em 0 3em 0; width:100%; text-align:center;}
header .menu li{position:relative; display:inline-block; margin:0 .7em 0 .8em}
	header .menu li::after{content:""; position:absolute; top:0; right:-1em; width:2px; height:80%; background:#b2b2b2}
	header .menu li:last-child::after{display:none;}
header .menu li a{position:relative; display:inline-block; color:#777; text-decoration:none; font-size:2.5em;}
header .menu li a::after{content:""; position:absolute; bottom:-2px; left:0; width:0%; height:2px; -webkit-transition: all .2s linear; transition: all .2s linear;background-color:#777!important;}
header .menu li a:hover::after, .current-menu-item a::after, .current_page_item a::after{width:100% !important;}
}

@media (orientation: landscape) {
    footer{
	position:absolute;
	width:100%;
	background-color: black;
	background-size:auto 100%;
	border-top:2px solid #777;
	color:#777;
	font-family: "Leicester";
	font-weight: light;
	font-size: 20px;
	margin: 10px 0 0 0;
	min-height: 50px;
	bottom: 0;
    }
}
@media (orientation: portrait) {
    footer{
	position:absolute;
	width:100%;
	height:auto;
	background-color: black;
	background-size:auto 100%;
	border-top:5px solid #777;
	color:#777;
	font-family: "Leicester";
	font-weight: light;
	font-size: 40px;
	margin: 1px 0 0 0;
	clear:both;
	min-height: 3%;
    }
}

p {
	color:#777;
  text-align: right;
	padding: 10px 20px 10px 20px;
}
p span {
  float: left;
}




