@font-face {
  	font-family: 'Hero';
  	src: url('../fonts/Hero.eot?') format('eot'), url('../fonts/Hero.woff') format('woff'), url('../fonts/Hero.ttf') format('truetype');
}

* {
		margin: 0;
		padding: 0;
		border: 0;
		outline: none;
}

html, body, ol, ul, li, h2, h3, h4, h5, h6, p, a, td {
		font-family: 'Hero', sans-serif;
}

html {
	height: 100%;
}

body {
		height: 100%;
		font-size: 100%;
		color: black;
		overflow: hidden;
		background: white url(../img/bubbles.jpg) repeat-y left top;
		/*background: white url(../img/fond2.png) repeat-y left top;*/
}

img {
			display: block;
			max-width: 100%;
			height: auto;
			border : 0;
}

h1 {
		font-size: 3em;
		font-weight: normal;
		margin-top: 0;
		margin-bottom: 1em;
		text-align: center;
		color: #ff6a0b;
}

h2 {
		font-size: 2.4em;
		font-weight: normal;
		text-align: center;
		margin: 1.6em 0;
		color: #254c4c;
		margin-bottom: 1em;
}

h3 {
		font-size: 1.4em;
		line-height: 2.1em;
		font-weight: normal;
		color: #434343;
		margin-top: 2em;
		margin-bottom: 2em;
		text-transform: uppercase;
		text-align: center;
}

h4 {
		font-size: 1.2em;
		font-weight: normal;
		margin: 1.2em 0 0.8em 0;
		margin-bottom: 0.5em;
}

h5 {
		font-size: 1em;
		font-weight: bold;
		clear: left;
		text-align: center;
		padding-top: 2em;
		margin-top: 2em;
}

p {
		font-size: 1em;
		line-height: 100%;
		padding-top: 0.3em;
}

a {
		font-size: 90%;
		color: #264d4d;
}

/************************************/
/*								MENU							*/
/************************************/

#menu li {
	float: left;
	color: #fff;
	/*background: #666;*/
	background: rgba(0,0,0, 0.5);
}
#menu li.active {
	/*background: #666;*/
	background: rgba(0,0,0, 0.5);
	color: #fff;
}
#menu li a {
	text-decoration: none;
	color: #fff;
}
#menu li.active a:hover {
	color: #fff;
}
#menu li:hover {
	color: #666;
	background: #b79c85;
}
#menu li a, #menu li.active a {
	padding: 0.6em 1.2em;
	display: block;
}
#menu li.active a {
	color: #fff;
}
#menu li a:hover {
	color: rgba(0,0,0, 0.5);
}
#menu {
	list-style-type: none;
	position: fixed;
	top: 0;
	left: 0;
	height: 40px;
	z-index: 70;
	width: 100%;
	padding: 0;
	margin: 0;
}

.choix-langue {
	position: absolute;
	top: 2.2em;
	right: 2em;
}

/************************************/

.fullpage {
		width: 100%;
		max-width: 1200px;
}

.s-and-g {
		position: absolute;
		width: 34.5vw;
		max-width: 420px;
		margin-left: 5%;
}

.frise {
		position: absolute;
		width: 35%;
		margin-top: 18em;
		margin-left: 5%;
}

.article {
		width: 45%;
		margin-top: 3em;
		margin-left: 55%;
}

.diaporama {
		margin-bottom: 1em;
}

.diaporama::after {
		content: '';
    display: block;
    clear: both;
}

.diaporama-element {
		float: left;
		width: 16.6666%;
}

#diaporama-show img {
		width: 100%;
		max-width: 400px;
		margin: 0 auto;
}

#diaporama-show {
		position: absolute;
		z-index: 1000;
		width: 100%;
		top: 6em;
		display: none;
}

.pannel {
		width: 90%;
		max-width: 1200px;
		margin: 0 auto;
}

.head {

}

.head-img {
		float: left;
		width: 35%;
		margin: 0 3% 0.5em 0;
}

.head p {
		font-size: 1.1em;
		color: #b79c85;
		padding-top: 2%;
		padding-right: 3%;
}

.more-img {
		float: right;
		margin: 0 7%;
}

/************************************/
/*						WMC Player						*/
/************************************/

#static_container {
		display: none;
}

#wmc-player {
		display: none;
}

.wmc-player-pannel {
		width: 98%;
		margin: 0 auto;
		overflow: scroll;
}

.player {
		width: 32%;
		min-width: 368px;
		margin: 0.8em auto;
		padding: 0;
		background-color: black;
		border: 8px solid gray;
		border-radius: 0.4em;
		text-align: center;
	}

#control-pannel {
	background: linear-gradient(#999, #000), #c9c5c9;
	padding: 0.8em 0;
	border-radius: 0.1em;
}

#duration {
	width: 30%;
	min-width: 120px;
	margin: 0.6em auto 0 auto;
	background-color: white;
	padding: 0.2em 0;
	border-radius: 0.4em;
	font-family: 'Courrier, monospace';
	font-size: 90%;
}

/*.wmc-player-button, .wmc-player-button-smaller {
	display: inline-block;
	font-family: 'Courrier, monospace';
	font-size: 80%;
	background: radial-gradient(circle,#fff,#eee);
	border-radius: 10em;
	border: 0 solid rgba(208,208,208,1.000);
	width: 3em;
	height: 3em;
	vertical-align: middle;
}
.wmc-player-button {
	padding: .6em;
	width: 3em;
	height: 3em;
}
.wmc-player-button-smaller {
	padding: .4em;
	width: 2em;
	height: 2em;
}
.wmc-player-button:hover, .wmc-player-button-smaller:hover {
	background: radial-gradient(circle,#f5f5f5, #b9b9b9);
}*/

#chainButton, .wmc-player-button, .wmc-player-button-smaller {
	display: inline-block;
	font-family: 'Courrier, monospace';
	font-size: 0.8rem;
	width: 8%;
	vertical-align: middle;
	opacity: 0.9;
	border: 0px solid gray;
	border-radius: 0.2rem;
	background-color: white;
}

.wmc-player-button, .wmc-player-button-smaller {
	padding: 0.5em 0;
}

#chainButton {
	padding: 0.4em 0;
}

.wmc-player-playlist {
	list-style-position: inside;
	background-color: #efefef;
	margin: 0;
	padding: 0.4em 0;
}
.wmc-player-playlist li {
	font-size: 90%;
	text-align: left;
	cursor: pointer;
	padding: 0.1em 0 0.1em 5%;
}

ul.audio-setup {
	margin-top: 1em;
	margin-left: 20%;
}

ul.audio-setup li {
	font-size: 90%;
}

.pro-infos {
	width: 80%;
	margin-left: 10%;
}

.pro-list {
	margin-bottom: 1em;
	margin-left: 10%;
	list-style-type: none;
}

.pro-list li {
	font-size: 90%;
	padding-left: 5%;
}

#reponse h2 {
	margin: 1.6em 0;
	text-align: center;
}

#reponse p {
	text-align: center;
}

/************************************/
/*							PHOTOS							*/
/************************************/

#mask {
	position: fixed;
	z-index: 2010;
	width: 100%;
	height: 100%;
	min-height: 100vh;
	top:0;
	left:0;
	background-color: black;
	opacity: 0.7;
}

#lightbox {
	position: relative;
	z-index: 2010;
	display: none;
	width: 100%;
	height: 100%;
	overflow: hidden;
	top: 2.7em;
	cursor: pointer;
}

#loader {
	position: absolute;
	z-index: 2020;
	top: 40%;
	left: 35%;
	width: 30%;
}

.ajax-loader {
	width: 100%;
}

#img-container {
	position: absolute;
	z-index: 2100;
	width: 100%;
	top: 3.1em;
	left: 0;
}

.diapo {
	/*height: 100%;*/
}

.thumbs-wrapper {
	width: 96%;
	max-width: 1176px;
	overflow: scroll;
	margin: 0 auto;
}

.thumbs-box {
	width: auto;
	max-width: 1176px;
	margin: 1em auto 2em auto;
}

.thumbs-box-element {
	float: left;
	width: 24%;
	margin-top: 1em;
	margin-left: 1%;
	cursor: pointer;
	max-width: 300px;
	max-height: 200px;
	min-width: 180px;
	overflow: hidden;
}

#caption {
	text-align: center;
	margin: 1.1em 0;
	font-size: 1.2rem;
}

.caption-text {

}

#prevImg, #nextImg {
	color: white;
	cursor: pointer;
}

.caption-text, #prevImg, #nextImg {
	color: white;
	background-color: black;
	opacity: 0.8;
	padding: 1em;
}

.credit-photo {
	clear: both;
	float: none;
	width: 100%;
	margin-top: 2em;
	text-align: right;
}

.credit-photo p {
	font-size: 0.9rem;
	padding-right: 1%;
}

/************************************/
/*							Videos							*/
/************************************/

.video-wrapper {
	width: 100%;
	margin: 0 auto;
}

.video-wrapper img:hover {
	cursor: hand;
}

/************************************/
/*							Divers							*/
/************************************/

.espace-pro, .contact {
		width: 75%;
		max-width: 900px;
		margin: 0 auto;
}

.espace-pro p, .espace-pro li {
		color: white;
}

.links-table {
		width: 100%;
		max-width: 1000px;
		margin: 0 auto;
		border: 1px solid #264d4d;
}

ul.pro-list {
		margin-top: 0.4rem;
		margin-left: 1%;
		list-style-position: inside;
}

ul.liens {
		width: 96%;
		margin-left: 2%;
		list-style-position: inside;
}

ul.liens li {
		margin-top: 0.4rem;
}

.downloads {
		margin-top: 0.4rem;
}

.downloads a {
		color: steelblue;
}

.caution {
		text-align: center;
		font-size: 0.9em;
}

.plus {
		text-align: right;
		margin-top: 2rem;
}

/************************************/
/*							Medias							*/
/************************************/

/*iPhone 14 Pro, iPhone 15 and iPhone 15 Pro*/
/* 1179×2556 pixels at 460ppi */
@media only screen 
    and (width: 393px) 
    and (height: 852px) 
    and (-webkit-device-pixel-ratio: 3) {
	    	h3 {
		    		line-height: 2.1em;
		    }
		    .wmc-player-pannel {
		    		width: 100%;
		    		padding: 0;
		    }
    }

/*iPhone 15 Plus and 15 Pro Max*/
/* 1284×2778 pixels at 460ppi */
@media only screen 
    and (width: 430px) 
    and (height: 932px) 
    and (orientation: portrait) {
	    	h3 {
		    		line-height: 2.1em;
		    }
		    .wmc-player-pannel {
		    		width: 100%;
		    		padding: 0;
		    }
    }

/*iPhone 12, iPhone 12 Pro, iPhone 13, iPhone 13 Pro, and iPhone 14*/
/* 1170×2532 pixels at 460ppi */
@media only screen 
    and (width: 390px) 
    and (height: 844px) 
    and (orientation: portrait) {
	    	h3 {
	    			line-height: 2.1em;
	    	}
    		#menu {
						display: none;
				}
				.s-and-g {
						position: static;
						width: 50%;
						margin-top: 0;
						margin-left: 25%;
				}
				.frise {
						position: static;
						width: 90%;
						margin-top: 0;
						margin-left: 5%;
				}
				.article {
						width: 96%;
						margin-top: 1em;
						margin-left: 2%;
				}
				#player_toggle {
						display: none;
				}
				.wmc-player-pannel {
		    		width: 100%;
		    		padding: 0;
		    }
				.player {
						width: 90%;
						margin: 0 auto;
						min-width: none;
						padding: 0;
				}
    }

/*iPhone 12 Pro Max, iPhone 13 Pro Max, and iPhone 14 Plus*/
/* 1284×2778 pixels at 458ppi */
@media only screen 
    and (width: 428px) 
    and (height: 926px) 
    and (-webkit-device-pixel-ratio: 3) {
    		h3 {
		    		line-height: 2.1em;
		    }
		    .wmc-player-pannel {
		    		width: 100%;
		    		padding: 0;
		    }
    }

/*iPhone X, iPhone Xs, iPhone 11 Pro, iPhone 12 Mini, and iPhone 13 Mini*/
/* 1080×2340 pixels at 476ppi */
@media only screen 
    and (width: 375px) 
    and (height: 812px) 
    and (-webkit-device-pixel-ratio: 3) {
    		h3 {
		    		line-height: 2.1em;
		    }
		    .wmc-player-pannel {
		    		width: 100%;
		    		padding: 0;
		    }
    }

/*iPhone XR, and iPhone 11*/
/* 828×1792 pixels at 326ppi */
@media only screen 
    and (width: 414px) 
    and (height: 896px) 
    and (-webkit-device-pixel-ratio: 2) {
    		h3 {
		    		line-height: 2.1em;
		    }
		    .wmc-player-pannel {
		    		width: 100%;
		    		padding: 0;
		    }
    }

/*iPhone Xs Max, and iPhone 11 Pro Max*/
/* 1242×2688 pixels at 458ppi */
@media only screen 
    and (width: 414px) 
    and (height: 896px) 
    and (-webkit-device-pixel-ratio: 3) {
    		h3 {
		    		line-height: 2.1em;
		    }
		    .wmc-player-pannel {
		    		width: 100%;
		    		padding: 0;
		    }
    }

/*iPhone 7 (2016), iPhone 8 (2017), and iPhone SE (1st to 3rd gen)*/
/* 750×1334 pixels at 326ppi */
@media only screen 
    and (width: 375px) 
    and (height: 667px) 
    and (-webkit-device-pixel-ratio: 2) {
    		h3 {
		    		line-height: 2.1em;
		    }
		    .wmc-player-pannel {
		    		width: 100%;
		    		padding: 0;
		    }
    }

/* iPhone 6/7/8 in portrait */
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : portrait) {
		#menu {
				display: none;
		}
		.s-and-g {
				position: static;
				width: 90%;
				margin-top: 1em;
				margin-left: 5%;
		}
		.frise {
					position: static;
					width: 90%;
					margin-top: 19em;
					margin-left: 5%;
		}
		.article {
				width: 96%;
				margin-top: 3em;
				margin-left: 2%;
		}
		#player_toggle {
				display: none;
		}
		.wmc-player-pannel {
    		width: 100%;
    		padding: 0;
    }
		.player {
				width: 90%;
				min-width: none;
				padding: 0;
		}
}