@media only screen and (min-device-width: 200px) and (max-device-width: 640px) and (orientation : portrait){

html
{
	width: 100%;
	height:100%;
	overflow: hidden;
}


#perso_site
{
	width:0%;
	height:0%;
	visibility:hidden;
}

.grille_perso {
	width: 100%;
	position: relative;
	-webkit-backface-visibility: hidden;
}

.grille_perso > div {
	width: 100%;
	position: relative;
	opacity: 1;
}

.grille_perso > div:hover {
	width: 100%;
	position: relative;
	opacity: 0.9;
}

.grille_perso figure img{
	width:75%;
	margin-top:0%;
}

.grille_perso figure {
	width:100%;
	text-align:center;
}

#menu_fix
{
	width:300%;
	visibility:hidden;
	position:fixed;
	-webkit-transform: translateY(190%);
	transform: translateY(190%);
	-webkit-transition: -webkit-transform 0.5s, visibility 0s 0.5s;
	transition: transform 0.5s, visibility 0s 0.5s;
	top:0%;
	left:-100%;
	opacity:0.9;
}

#menu_fix:hover
{
	width:300%;
	visibility:hidden;
	-webkit-transform: translateY(350%);
	transform: translateY(350%);
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
	left:-100%;
	opacity:0.6;
}

#menu_fix ul 
{
	position: absolute;
	width: 100%;
	text-align: center;
	margin-left: -2.5em;
	margin-top:-5em;
}

#menu_fix ul li
{
	list-style-type: none;
	display: inline-block;
	width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	opacity:0.6;
	background:#000;
}

#menu_fix ul li a
{
	font-size:1.2em;
	font-weight:600;
}


#main_lay
{
	width:400%;
	left:-150%;
	position:absolute;
	top:0%;
}

#blocs_pop
{
	width:100%;
	margin-top:20%;
}

.bloc_pop
{
	width:100%;
	margin:1%;
	float:left;
	text-align:center;
}

#trig
{
	position:absolute;
	width:80%;
	height:30px;
	left:10%;
	top:0%;
	opacity:0;
	background-color:transparent;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

#trig:hover
{
	position:absolute;
	width:80%;
	height:30px;
	left:10%;
	top:0%;
	opacity:1;
	background-color:transparent;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

#shadow img
{
	width:50%;
	position: absolute;
	/*box-shadow: 5px 5px 10px -5px;*/
	-webkit-transform-origin: 0 50%;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.fig_perso
{
	visibility:hidden;
	float:right;
	width:0%;
}

#bio
{
	visibility:hidden;
	width:0%;
}

#main
{
	width:100%;
	overflow-y:auto;
	overflow-x:hidden;
	color:white;
	text-align:center;
	float:left;
	margin-top:20%;
}

#main:hover
{
	overflow-y:auto;
	overflow-x:hidden;
	width:100%;
	float:left;
	text-align:center;
	margin-top:20%;
}

.article
{
	position:relative;
	width:100%;
	height:44%;
	float:left;
	margin:1%;
}

.thumb_art
{
	width:97%;
	float:left;
	margin-bottom: 5%;
}

.thumb_art img
{
	width:97%;
	height:95%;
	float:left;
	border: 3px solid white;
	box-shadow: 0px 2px 10px 0px black;
}

#zone_pv2
{
	list-style-type: none;
	width: 70%;
	position:relative;
	left:2%;
	top:-15%;
	visibility:visible;
}

#zone_pv
{
	list-style-type: none;
	width: 70%;
	position:relative;
	left:2%;
	top:0%;
	visibility:hidden;
}

.btn_champi
{
	display: inline-block;
	width: 31%;
}


.img_champi
{
	width:100%;
	
}

#time
{
	visibility:hidden;
}

#share
{
	visibility:hidden;
}

#main h3
{
	font-size:1em;
	position:absolute;
	margin-top:52%;
	background:#000;
	opacity:0.6;
	width:94%;
}

.vid_art
{
	width:100%;
	height:50%;
}

#main h1
{
	font-size:1.5em;
	margin-top:5%;
}

#list_bord
{
	overflow: hidden;
	width:0%;
	text-align:center;
	visibility:hidden;
}

#back {
width: 60px;
height: 40px;
position: absolute;
left: 10px;
top: 10px;
overflow: hidden;
border: none;
background: url(img/back.png) no-repeat center center;
text-indent: 200%;
color: transparent;
outline: none;
z-index: 100;
}


#main_article
{
	font-family: 'eras_light_itcregular';
	font-weight:600;
	font-size:1em;
	width: 95%;
	text-align: justify;
	margin: auto;
}

#slider1_container
{
	position: relative; 
	top: -25px; 
	left: 0px; 
	height: 400px;
	visibility:visible;
}

#shadow img
{
	left:20%;
}


}

@media only screen and (min-device-width: 200px) and (max-device-width: 640px) and (orientation : landscape){

#slider1_container
{
	position: relative; 
	top: 0px; 
	left: 0px; 
	height: 0px;
	visibility:hidden;
}

#menu_fix
{
	width:300%;
	visibility:hidden;
}

#menu_fix:hover
{
	width:300%;
}

#menu_fix ul 
{
	position: absolute;
	width: 100%;
	text-align: center;
	margin-left: -2.5em;
	margin-top:-5em;
}

#menu_fix ul li
{
	list-style-type: none;
	display: inline-block;
	width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	opacity:0.6;
	background:#000;
}

#menu_fix ul li a
{
	font-size:1.2em;
	font-weight:600;
}

#main_lay
{
	width:250%;
	left:-75%;
	position:absolute;
	margin-top:-7%;
}

#trig
{
	position:absolute;
	width:50%;
	height:30px;
	left:25%;
	margin-top:-7%;
	opacity:0;
	background-color:transparent;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

#trig:hover
{
	position:absolute;
	width:50%;
	height:30px;
	left:25%;
	margin-top:-7%;
	opacity:1;
	background-color:transparent;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	transition: opacity 0.4s;
}


#blocs_pop
{
	width:100%;
	margin-top:5%;
}

#teaser
{
	position:relative;
	width:80%;
	height:20%;
}

.bloc_pop
{
	width:30%;
	float:left;
	text-align:center;
}

.bloc_pop
{
	width:30%;
	float:left;
	text-align:center;
}

.bloc_pop button
{
	position: relative;
	width:100%;
	font-family: 'code_lightregular';
	font-weight:800;
	font-size: 1em;
	color:white;
	background: #10E780;
	margin-left:10%;
	margin-top: 7%;
	border: 0px solid white;
}

#bio
{
	visibility:hidden;
	width:0%;
}

#main
{
	width:100%;
	position:absolute;
	overflow-y: auto;
	overflow-x: hidden;
	color:white;
	text-align:center;
	float:left;
}

#main:hover
{
	overflow-y: auto;
	overflow-x: hidden;
	width:100%;
	float:left;
	text-align:center;
	position:absolute;
}

.article
{
	width:70%;
	float:right;
	margin-right:15%;
}

.thumb_art
{
	width:80%;
	float:right;
	margin-bottom: 5%;
}

.thumb_art img
{
	width:97%;
	float:right;
	border: 3px solid white;
	box-shadow: 0px 2px 10px 0px black;
}

#time
{
	visibility:hidden;
}

#share
{
	visibility:hidden;
}

#main h3
{
	font-size:1em;
	position:absolute;
	margin-top:30%;
	background:#000;
	opacity:0.6;
	width:55%;
	margin-left:15%;
}

.vid_art
{
	width:70%;
	position:relative;
	left:0%;
}

#main h1
{
	font-size:1.5em;
	margin-top:50%;
}

#list_bord
{
	overflow: hidden;
	width:0%;
	text-align:center;
	visibility:hidden;
}

#back 
{
	width: 60px;
	height: 40px;
	position: absolute;
	left: 10px;
	top: 10px;
	overflow: hidden;
	border: none;
	background: url(img/back.png) no-repeat center center;
	text-indent: 200%;
	color: transparent;
	outline: none;
	z-index: 100;
}

#main_article
{
	font-family: 'eras_light_itcregular';
	font-weight:600;
	font-size:1em;
	width: 95%;
	text-align: justify;
	margin: auto;
}

}