/*article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;} */

/****************************************************/
@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'codropsicons';
	src:url('../fonts/codropsicons/codropsicons.eot');
	src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
		url('../fonts/codropsicons/codropsicons.woff') format('woff'),
		url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
		url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}
@font-face {
	font-family: 'typicons';
	src:url('../fonts/typicons/typicons.eot');
	src:url('../fonts/typicons/typicons.eot?#iefix') format('embedded-opentype'),
		url('../fonts/typicons/typicons.ttf') format('truetype'),
		url('../fonts/typicons/typicons.woff') format('woff'),
		url('../fonts/typicons/typicons.svg#typicons') format('svg');
	font-weight: normal;
	font-style: normal;
}

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

/*.codrops-header,.codrops-top {font-family: 'Lato', Arial, sans-serif;}*/

.codrops-header {margin: 0 auto 3em;padding: 3em;text-align: center;}

.codrops-header h1 {margin: 0;font-weight: 300;font-size: 2.625em;line-height: 1.3;}

.codrops-header span {display: block;padding: 0 0 0.6em 0.1em;font-size: 60%;color: #aca89a;}

/* To Navigation Style */
.codrops-top {width: 100%;text-transform: uppercase;font-size: 0.69em;line-height: 2.2;font-weight: 700;background: rgba(255,255,255,0.3);}

.codrops-top a {display: inline-block;padding: 0 1em;text-decoration: none;letter-spacing: 0.1em;}

.codrops-top a:hover {background: rgba(255,255,255,0.4);color: #333;}

.codrops-top span.right {float: right;}

.codrops-top span.right a {	display: block;	float: left;}

.codrops-icon:before {margin: 0 4px;text-transform: none;font-weight: normal;font-style: normal;font-variant: normal;font-family: 'codropsicons';line-height: 1;speak: none;-webkit-font-smoothing: antialiased;}

.codrops-icon-drop:before {	content: "\e001";}

.codrops-icon-prev:before {	content: "\e004";}

.main {max-width: 69em;margin: 0 auto;}

.codrops-demos a,button {border: none;padding: 0.6em 1.2em;background: #a9a9a9;color: #fff;font-size: 1em;letter-spacing: 1px;text-transform: uppercase;cursor: pointer;display: inline-block;margin:15px;border-radius: 2px;font-weight: 400;outline: none;}

.codrops-demos a:hover,.codrops-demos a:active,.codrops-demos a.current-demo {background: #777;}

button {/*font-size: 75%;background: #ed8151;*/}

button:hover,button:active {background: #e86a32;}

.related {text-align: center;font-size: 1.5em;margin-top: 3em;clear: both;padding: 3em 0;}

.related a {font-weight: 700;font-size: 0.9em;}

@media screen and (max-width: 46.0625em) {
	.codrops-header {margin-bottom: 0;padding-bottom: 1em;}
	.column {width: 100%;min-width: auto;min-height: 0;padding: 2em;text-align: center;}
	.column p {font-size: 1.5em;}
	.column:nth-child(2) {text-align: center;box-shadow: 0 -1px 0 rgba(0,0,0,0.1);}
}

@media screen and (max-width: 25em) {
	.codrops-header {font-size: 80%;}
	.codrops-top {font-size: 120%;}
	.codrops-icon span {display: none;}
}

nav .panel-title >a::before {
	font-family: 'typicons';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	margin-right: 10px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

/***************** Component *****************/

html, body, .perspective {width: 100%;height: 100%;}

.perspective {background: #aaa;position: relative;}

.containerm {min-height: 100%;position: relative;outline: 1px solid rgba(0,0,0,0);z-index: 10;-webkit-transform: translateZ(0) translateX(0) rotateY(0deg); transform: translateZ(0) translateX(0) rotateY(0deg);background:#fff;}

.containerm::after {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 0px;opacity: 0;background: rgba(0,0,0,0.2);-webkit-transition: opacity 0.4s, height 0s 0.4s;transition: opacity 0.4s, height 0s 0.4s;}

.wrapper {position: relative;}

.component {margin: 0 auto;width: 60%;text-align: justify;font-size: 1.5em;}

/* Modal view */
.perspective.modalview {position: fixed;-webkit-perspective: 1500px;perspective: 1500px;z-index:9;}
.perspective.modalview.animate {z-index:8;}

.modalview .containerm {position: absolute;width: 100%;height: 100%;overflow:scroll;}
.modalview.animate .containerm{cursor: pointer;-webkit-backface-visibility: hidden;backface-visibility: hidden;overflow:hidden;z-index:6;}

.modalview .wrapper {-webkit-transform: translateZ(-1px); /* solves a rendering bug in Chrome on Windows */}

.animate .containerm::after {opacity: 1;height: 101%;-webkit-transition: opacity 0.3s;transition: opacity 0.3s;}

/* Outer Nav */
.outer-nav {position: absolute;height: auto;font-size: 1.4em;z-index:9;}

.outer-nav.vertical {-webkit-transform-style: preserve-3d;transform-style: preserve-3d;background:#3B9CBC;height:100%}

.outer-nav.horizontal {left: 50%;width: 75%;max-width: 1000px;text-align: center;-webkit-transform: translateX(-50%);transform: translateX(-50%);}

.outer-nav.left {left: 5%;}
.outer-nav.right {right: 25%;}
.outer-nav.top {top: 25%;}
.outer-nav.bottom {bottom: 25%;}

.outer-nav a {
	display: inline-block;
	white-space: nowrap;
	font-weight: 300;
	color: #fff;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.outer-nav a:hover {color: #fff;}
.outer-nav a:hover::before {color: #81bc00;}
.outer-nav.vertical a {display: block;}
.outer-nav.horizontal a {margin: 15px 20px;}

.outer-nav a::before {display: inline-block;font-family: 'typicons';speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;margin-right: 10px;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-webkit-backface-visibility: hidden;backface-visibility: hidden;/*-moz-transform: scale(1, -1);-webkit-transform: scale(1, -1);-o-transform: scale(1, -1);-ms-transform: scale(1, -1);transform: scale(1, -1);*/}

/* Individual Effects */

/* Effect airbnb
.effect-airbnb {
	background-image: url(../images/background-eolienne.jpg);
	background-size: cover;
}
*  */
.effect-airbnb {
background: rgba(34,51,87,1);
background: url(img/barre-noire.png) repeat,-moz-linear-gradient(45deg, rgba(34,51,87,1) 0%, rgba(52,133,219,1) 100%);
background: url(img/barre-noire.png) repeat,-webkit-gradient(left bottom, right top, color-stop(0%, rgba(34,51,87,1)), color-stop(100%, rgba(52,133,219,1)));
background: url(img/barre-noire.png) repeat,-webkit-linear-gradient(45deg, rgba(34,51,87,1) 0%, rgba(52,133,219,1) 100%);
background: url(img/barre-noire.png) repeat,-o-linear-gradient(45deg, rgba(34,51,87,1) 0%, rgba(52,133,219,1) 100%);
background: url(img/barre-noire.png) repeat,-ms-linear-gradient(45deg, rgba(34,51,87,1) 0%, rgba(52,133,219,1) 100%);
background: url(img/barre-noire.png) repeat,linear-gradient(45deg, rgba(34,51,87,1) 0%, rgba(52,133,219,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#223357', endColorstr='#3485db', GradientType=1 );
}

.effect-airbnb .containerm {
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transform-origin: 0% 50%;
	transform-origin: 0% 50%;
}

.effect-airbnb.animate .containerm {
	-webkit-transform: translateZ(-2000px) translateX(90%) rotateY(-45deg);
	transform: translateZ(-2000px) translateX(90%) rotateY(-45deg);
}


.no-csstransforms3d .effect-airbnb.animate .containerm {
	left: 75%;
}

.effect-airbnb .outer-nav a {
	opacity: 0;
	-webkit-transform: translateX(-150px);
	transform: translateX(-150px);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
}

.effect-airbnb.animate .outer-nav a {
	opacity: 1;
	-webkit-transform: translateX(0);
	transform: translateX(0);
}

.effect-airbnb.animate .outer-nav a:nth-child(2) {
	-webkit-transition-delay: 0.04s;
	transition-delay: 0.04s;
}

.effect-airbnb.animate .outer-nav a:nth-child(3) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}

.effect-airbnb.animate .outer-nav a:nth-child(4) {
	-webkit-transition-delay: 0.12s;
	transition-delay: 0.12s;
}

.effect-airbnb.animate .outer-nav a:nth-child(5) {
	-webkit-transition-delay: 0.16s;
	transition-delay: 0.16s;
}

.effect-airbnb.animate .outer-nav a:nth-child(6) {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.effect-airbnb.animate .outer-nav a:nth-child(7) {
	-webkit-transition-delay: 0.24s;
	transition-delay: 0.24s;
}

/* Effect Move Left */
.effect-moveleft {
	background: #f4f3f1;
}

.effect-moveleft .containerm {
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}

.effect-moveleft .containerm::after {
	background: rgba(255,255,255,0.6);
}

.effect-moveleft.animate .containerm {
	-webkit-transform: translateX(-50%) rotateY(45deg) translateZ(-50px);
	transform: translateX(-50%) rotateY(45deg) translateZ(-50px);
}

.no-csstransforms3d .effect-moveleft.animate .containerm {
	left: -75%;
}

.effect-moveleft .outer-nav a {
	color: #e86a32;
	opacity: 0;
	-webkit-transform: translateX(100px) translateZ(-1000px);
	transform: translateX(100px) translateZ(-1000px);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
}

.effect-moveleft .outer-nav a:hover {
	color: #333;
}

.effect-moveleft.animate .outer-nav a {
	opacity: 1;
	-webkit-transform: translateX(0) translateZ(0);
	transform: translateX(0) translateZ(0);
}

.effect-moveleft.animate .outer-nav a:nth-child(2) {
	-webkit-transition-delay: 0.04s;
	transition-delay: 0.04s;
}

.effect-moveleft.animate .outer-nav a:nth-child(3) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}

.effect-moveleft.animate .outer-nav a:nth-child(4) {
	-webkit-transition-delay: 0.12s;
	transition-delay: 0.12s;
}

.effect-moveleft.animate .outer-nav a:nth-child(5) {
	-webkit-transition-delay: 0.16s;
	transition-delay: 0.16s;
}

.effect-moveleft.animate .outer-nav a:nth-child(6) {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.effect-moveleft.animate .outer-nav a:nth-child(7) {
	-webkit-transition-delay: 0.24s;
	transition-delay: 0.24s;
}

/* Effect Rotate Left */
.effect-rotateleft {
	background: #e96e4f;
}

.effect-rotateleft .containerm {
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transform-origin: 0% 50%;
	transform-origin: 0% 50%;
}

.effect-rotateleft .containerm::after {
	background: rgba(255,255,255,0.6);
}

.effect-rotateleft.animate .containerm {
	-webkit-transform: translateZ(-1800px) translateX(-50%) rotateY(45deg);
	transform: translateZ(-1800px) translateX(-50%) rotateY(45deg);
}

.no-csstransforms3d .effect-rotateleft.animate .containerm {
	left: -75%;
}

.effect-rotateleft .outer-nav a {
	opacity: 0;
	-webkit-transform: translateX(350px) translateZ(-1000px);
	transform: translateX(350px) translateZ(-1000px);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
}

.effect-rotateleft.animate .outer-nav a {
	opacity: 1;
	-webkit-transform: translateX(0) translateZ(0);
	transform: translateX(0) translateZ(0);
}

.effect-rotateleft.animate .outer-nav a:nth-child(2) {
	-webkit-transition-delay: 0.04s;
	transition-delay: 0.04s;
}

.effect-rotateleft.animate .outer-nav a:nth-child(3) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}

.effect-rotateleft.animate .outer-nav a:nth-child(4) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}

.effect-rotateleft.animate .outer-nav a:nth-child(5) {
	-webkit-transition-delay: 0.16s;
	transition-delay: 0.16s;
}

.effect-rotateleft.animate .outer-nav a:nth-child(6) {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.effect-rotateleft.animate .outer-nav a:nth-child(7) {
	-webkit-transition-delay: 0.24s;
	transition-delay: 0.24s;
}

/* Effect Move Down */
.effect-movedown {
	background: #34495e;
}

.effect-movedown .containerm {
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}

.effect-movedown .containerm::after {
	background: rgba(52, 73, 94, 0.5);
}

.effect-movedown.animate .containerm {
	-webkit-transform: translateY(100%) translateZ(-1500px);
	transform: translateY(100%) translateZ(-1500px);
}

.no-csstransforms3d .effect-movedown.animate .containerm {
	top: 75%;
}

.effect-movedown .outer-nav a {
	opacity: 0;
	-webkit-transform: translateY(-20px);
	transform: translateY(-20px);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
}

.effect-movedown .outer-nav a:hover {
	color: #ed8151;
}

.effect-movedown.animate .outer-nav a {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

.effect-movedown.animate .outer-nav a:nth-child(2) {
	-webkit-transition-delay: 0.04s;
	transition-delay: 0.04s;
}

.effect-movedown.animate .outer-nav a:nth-child(3) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}

.effect-movedown.animate .outer-nav a:nth-child(4) {
	-webkit-transition-delay: 0.12s;
	transition-delay: 0.12s;
}

.effect-movedown.animate .outer-nav a:nth-child(5) {
	-webkit-transition-delay: 0.16s;
	transition-delay: 0.16s;
}

.effect-movedown.animate .outer-nav a:nth-child(6) {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.effect-movedown.animate .outer-nav a:nth-child(7) {
	-webkit-transition-delay: 0.24s;
	transition-delay: 0.24s;
}

/* Effect Rotate Top */
.effect-rotatetop {
	background: #edcdbb;
}

.effect-rotatetop .containerm {
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}

.effect-rotatetop .containerm::after {
	background: rgba(94,59,43,0.6);
}

.effect-rotatetop.animate .containerm {
	-webkit-transform: translateZ(-1500px) translateY(-50%) rotateX(-45deg);
	transform: translateZ(-1500px) translateY(-50%) rotateX(-45deg);
}

.no-csstransforms3d .effect-rotatetop.animate .containerm {
	top: -75%;
}

.effect-rotatetop .outer-nav a {
	opacity: 0;
	color: #ed8151;
	-webkit-transform: translateY(200px) translateZ(-1000px);
	transform: translateY(200px) translateZ(-1000px);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
}

.effect-rotatetop .outer-nav a:hover {color: #777;}

.effect-rotatetop.animate .outer-nav a {
	opacity: 1;
	-webkit-transform: translateY(0) translateZ(0);
	transform: translateY(0) translateZ(0);
}

.effect-rotatetop.animate .outer-nav a:nth-child(2) {
	-webkit-transition-delay: 0.04s;
	transition-delay: 0.04s;
}

.effect-rotatetop.animate .outer-nav a:nth-child(3) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}

.effect-rotatetop.animate .outer-nav a:nth-child(4) {
	-webkit-transition-delay: 0.12s;
	transition-delay: 0.12s;
}

.effect-rotatetop.animate .outer-nav a:nth-child(5) {
	-webkit-transition-delay: 0.16s;
	transition-delay: 0.16s;
}

.effect-rotatetop.animate .outer-nav a:nth-child(6) {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.effect-rotatetop.animate .outer-nav a:nth-child(7) {
	-webkit-transition-delay: 0.24s;
	transition-delay: 0.24s;
}

/* Effect Lay Down */
.effect-laydown {background: #b8b6b4;}

.effect-laydown .containerm {
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transform-origin: 50% 150%;
	transform-origin: 50% 150%;
}

.effect-laydown.animate .containerm {
	-webkit-transform: translateZ(-1500px) rotateX(80deg);
	transform: translateZ(-1500px) rotateX(80deg);
}

.no-csstransforms3d .effect-laydown.animate .containerm {top: 75%;}

.effect-laydown .outer-nav a {
	opacity: 0;
	-webkit-transform: translateY(-200px) translateZ(-1000px);
	transform: translateY(-200px) translateZ(-1000px);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
}

.effect-laydown.animate .outer-nav a {
	opacity: 1;
	-webkit-transform: translateY(0) translateZ(0);
	transform: translateY(0) translateZ(0);
}

.effect-laydown.animate .outer-nav a:nth-child(7){
	-webkit-transition-delay: 0.0s;
	transition-delay: 0.0s;
}

.effect-laydown.animate .outer-nav a:nth-child(6) {
	-webkit-transition-delay: 0.04s;
	transition-delay: 0.04s;
}

.effect-laydown.animate .outer-nav a:nth-child(5) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}

.effect-laydown.animate .outer-nav a:nth-child(4) {
	-webkit-transition-delay: 0.12s;
	transition-delay: 0.12s;
}

.effect-laydown.animate .outer-nav a:nth-child(3) {
	-webkit-transition-delay: 0.16s;
	transition-delay: 0.16s;
}

.effect-laydown.animate .outer-nav a:nth-child(2) {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.effect-laydown.animate .outer-nav a:first-child {
	-webkit-transition-delay: 0.24s;
	transition-delay: 0.24s;
}

/* Media Queries */

@media screen and (min-width: 767px){
	.outer-nav.left {left: 25%;}
}

@media screen and (max-width: 77em) {
	.outer-nav.top {top: 15%;}
	.outer-nav.bottom {bottom: 15%;}
}

@media screen and (max-width: 36.625em), screen and (max-height: 41.75em) {
	.outer-nav.top {top: 5%;}
	.outer-nav.bottom {bottom: 5%;}
	.outer-nav.horizontal {font-size: 1.7em;width: 6.2em;}
	.outer-nav.horizontal a {display: block;text-align: left;}
	/* Special Case */
	.effect-rotatetop .outer-nav.horizontal {width: 95%;bottom: auto;top: 50%;}
	.effect-rotatetop .outer-nav.horizontal a {display: inline-block;}
}

@media screen and (max-width: 31em), screen and (max-height: 36.2em) {
	.outer-nav.horizontal,	.outer-nav.vertical {font-size: 1.2em;overflow:scroll;}
	.outer-nav.vertical{overflow-x:hidden;-ms-overflow-style: -ms-autohiding-scrollbar;}
	.outer-nav.right {right: auto;left: 50%;	}
}