@font-face {
    font-family: josefin_sansregular;
    src: url('josefinsans-regular-webfont.woff2') format('woff2'),
         url('josefinsans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	font-display: fallback;}
body{background:radial-gradient(#64FF64,#0F210F);color:#64FF64;font-family: 'josefin_sansregular', sans-serif;line-height:1.4;text-align:center}
header{background-color:rgba(15,33,15,0.8);border-radius:1em;box-shadow:0px 5px 5px 0px rgba(100, 255, 100, 0.8)}
h1{font-size:2em;color:rgba(10,28,10,0.9);text-shadow:2px 1px 0px rgba(10,28,10,0.7)}
em span{position:fixed;right:-5000px;bottom:1%;font-size:1em;max-width:90%;z-index:100;font-weight:normal;text-align:left; transform:scale(0) rotate(-90deg);transition:all 1s ease}
.cadre a,.cadre a:visited{color:rgba(100,255,100,1)}
.box1{max-width:100%;margin:5px auto;padding:8px 8px}
table{z-index:20;text-align:left;}
td,th{background-color:rgba(15,33,15,0.9);padding-top:10px;padding-left:10px;padding-right:10px;border-radius:1em;box-shadow:0px 5px 5px 0px rgba(10, 28, 10, 0.9), 0px 5px 5px 0px rgba(100, 255, 100, 0.9) inset}
figure{padding:0;margin:0}
th{font-weight:bold}
td figure img{transform:rotate(180deg) scale(0);position:fixed; left:0%; top:0%;transition:all 1s ease;}
td figcaption{text-decoration:underline;cursor:pointer}
.enligne{display:inline-block;width:100px;height:100px;vertical-align:middle}
.actualite{position:fixed;right:3px;top:3px;max-width:10%;font-size:0.8em;text-align:left}
.gauche{position:absolute;left:3%;top:5%}
.droite{position:absolute;right:3%;top:5%}
.centre{text-align:center}
.invisible{display:none}.text-gauche{text-align:left; margin-right: 1em; margin-left: 2em}.middle{vertical-align:middle}.cadre{margin:0.3em auto;background-color:rgba(15,33,15,0.9);padding:0.3em 0.3em;border-radius:0.5em;box-shadow:0px 5px 5px 0px rgba(10, 28, 10, 0.9), 0px 5px 5px 0px rgba(100, 255, 100, 0.9) inset;z-index:10}.cadreb{margin:0.3em auto;background-color:rgba(15,33,15,0.9);padding:0.3em 0.3em;border-radius:0.5em;box-shadow:0px 5px 5px 0px rgba(10, 28, 10, 0.9), 0px 5px 5px 0px rgba(100, 255, 100, 0.9) inset;z-index:10}.bloc{max-width:95%}.flotted{float:right}.flotteg{float:left}.disptab{display:table}
figure{padding:0;margin:0}.imageenligne{position:relative;display:inline-block;height:65px;width:150px}
.slideenligne{position:relative;display:inline-block;height:160px;width:160px;margin:0.8em}.presentation{position:relative;display:inline-block;height:65px;width:300px}.cube{margin:0px 2% 0px 2%;width:100px;height:100px;transform:rotateX(-220deg) rotateY(45deg) translateZ(-50px);transform-style:preserve-3d;z-index:1}img{border-radius:1em}.cadre img,td figure img{max-width:50%; height:auto;}table,video{max-width:100%}video{height:auto}.cube div{transition:transform 1s;position:absolute;width:100px;height:100px;font-weight:bold;font-size:25px;color:rgba(100,255,100,0.9);background-color:rgba(15,33,15,0.7);border-radius:1em;box-shadow:0px 5px 5px 0px rgba(0, 0, 0, 0.7),0px 5px 5px 0px rgba(60, 188, 60, 0.5) inset}@media only screen and (min-width : 801px){html{font-size:1.3em}.cube{transform:scale(1)}}@media only screen and (max-width : 800px){html{font-size:0.8em}.cube,.actualite,.message,nav ul ul ul{display:none}nav a{font-size:1.7em}}@media only screen and (min-resolution : 144dpi){html{font-size:0.7em}.cube,.actualite{display:none}nav a{font-size:1.8em}}.sContent div{display:inline-block;width:400px}.message{width:400px;height:4em;margin:auto;padding:1%;overflow:hidden;line-height:0.8;color:rgba(15,30,18,0.9);border-radius:1.5em;background:radial-gradient(rgba(100, 255, 100,1),rgba(15, 33, 15,0.5))}.ligne1{font-weight:bold;font-size:3em;text-shadow:2px 2px 0px rgba(10,28,10,0.7)}.ligne2{font-weight:normal;font-size:1.1em;text-shadow:1px 1px 0px rgba(10,28,10,0.7)}.sContent{position:relative;top:5px;left:0;width:800px;padding:0;margin:0;animation-name:AutoSlide;animation-duration:10s;animation-iteration-count:infinite}nav ul,nav ul ul{padding:0;margin:0;text-align:center;font-weight:bold}nav ul li{display:inline-block;vertical-align:top;position:relative;background:rgba(60,132,60,0.8);transition:0.8s all ease-in-out}nav ul li li{display:block}nav ul a,nav ul a:visited{display:block;padding:0.1em 1em;text-decoration:none;color:rgba(15,33,15,0.9)}nav ul ul li a{padding:0.1em 0.1em}nav ul ul{position:absolute;z-index:1000;min-width:100%;white-space:nowrap}nav ul ul ul{left:100%;top:0;overflow:hidden;max-width:0;min-width:0;transition:0.8s all ease-in-out}nav ul li li li{max-height:inherit}nav ul ul li{max-height:0;overflow:hidden;transition:all 1s ease-in-out}
h2,p:first-letter{font-size:1.5em;font-weight:normal;text-shadow:2px 2px 0px rgba(10,28,10,0.8)}em{text-decoration:underline}.front{transform:translateZ(50px)}.back{transform:translateZ(-50px)}.left{transform:rotateY(90deg) translateZ(50px )}.right{transform:rotateY(-90deg) translateZ(50px)}.up{transform:rotateX(90deg) translateZ(50px)}.bottom{transform:rotateX(-90deg) translateZ(50px)}.cube.rotation1{animation:rotateCube 8s infinite ease-in-out}.cube.rotation2{animation:rotateCube2 8s infinite ease-in-out}@keyframes rotateCube{from{transform:rotateX( 0deg ) rotateY( 0deg );}to{transform:rotateX( -360deg ) rotateY( -360deg );}}@keyframes rotateCube2{from{transform:rotateX(0deg ) rotateY(0deg );}to{transform:rotateX(360deg ) rotateY( 360deg );}}
td figure img:hover{transform:rotate(0deg) scale(0.8);}em:hover span,em:focus span{position:fixed;right:1%;text-decoration:none;transform:scale(1) rotate(0)}
td figure:hover img{transform:rotate(0deg) scale(1);z-index:150}nav ul li:hover li{max-height:15em;overflow:visible}nav ul ul li:hover ul{max-width:25em}nav ul li:hover{background:rgba(100,255,100,0.8)}.loupe{border-radius:1em;transition:all 0.5s ease-in-out;margin-left:1em;}.loupe:hover{transform:scale(2);z-index:100;}@keyframes AutoSlide{from{left:0px;transform:rotateX(90deg);transform-style:preserve-3d;}25%{transform:rotateX(0deg);transform-style:preserve-3d;}49%{left:0px;transform:rotateX(90deg);transform-style:preserve-3d;}50%{left:-400px;transform:rotateX(90deg);transform-style:preserve-3d;}75%{transform:rotateX(0deg);transform-style:preserve-3d;}99%{left:-400px;transform:rotateX(90deg);transform-style:preserve-3d;}to{left:0px;transform:rotateX(90deg);transform-style:preserve-3d;}}.cube:hover .front{transform:translateZ( 75px )}.cube:hover .back{transform:translateZ( -75px )}.cube:hover .left{transform:rotateY( 90deg ) translateZ( 75px )}.cube:hover .right{transform:rotateY( -90deg ) translateZ( 75px )}.cube:hover .up{transform:rotateX(90deg) translateZ( 75px )}.cube:hover .bottom{transform:rotateX(-90deg) translateZ( 75px )}
@keyframes KoratSlide {
	0%, 10%, 100% {
		left: 0%;
	}
	25%, 35% {
		left: -100%;
	}
	40%, 55% {
		left: -200%;
	}
	60%, 70% {
		left: -300%;
	}
	75%, 80% {
		left: -400%;
	}
		85%, 90% {
		left: -500%;
	}
			95%, 99.99% {
		left: -600%;
	}
}
.koratslide {
	position: relative;
	width: 295px;
	height: 221px;
	margin:  0;
	overflow: hidden;
}
.chatonslide {
	position: relative;
	width: 400px;
	height: 400px;
	margin:  0;
	overflow: hidden;
}
.figureenligne figure {transform:scale(0.5);transition:all 1s ease;}
.figureenligne figure:hover {transform:scale(1);}
.figureenligne figcaption{font-size:2em;}
.figureenligne{position:relative;display:inline-block;width:250px;height:450px;z-index:20;transition:z-index;}
.figureenligne:hover{z-index:50}
.sContent5 li {
	display: inline;
}
.sContent5 {
	position: absolute; 
	top: 0px;
	left: 0px;
	width: 700%;
    font-size:0;
	padding :0;
	margin : 0;
	animation-name: KoratSlide;
	animation-duration: 25s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}
