html {
	margin:0;
	padding:0;
}
body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 18px;
	color: #333;
	margin:0;
	padding:0;
	background-color:#000;
}
a {
	text-decoration:none;
	color:#333;	
}
p {
	margin-top:10px;
}
.cplease {
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	background:rgb(0,0,0);
	background:rgba(0,0,0,0.8);
	position:fixed;
	display:none;
	background-image:url(../img/arrowrotate.png);
	background-repeat: no-repeat;
	background-position:center center;
}
#mainframe {
	width:800px;
	height:550px;
	position:absolute;
	top:50%;
	margin-top:-270px;
	left:50%;
	margin-left:-400px;
	overflow:hidden;
}
.bottomdiv, .bottomclo {
	position:absolute;
	bottom:0px;
	height:20px;
	left:50px;
	color:#CCC;
	text-align:left;
	text-transform: uppercase;
	display:none;
}
.bottomclo {
	display:block;
	color:yellow;
}

.contactline {
	float:left;
	width:100%;
	margin-top:2px;
}
.contactlib {
	display:inline-block;
	float:left;
	width:100px;
	color:grey;
	font-size:12px;
	text-align:left;
	margin-left:6%;
}
.contactinput {
	display:inline-block;
	float:left;
	width:240px;
	text-align:left;
	padding-top:10px;
}
.inputg {
	display:inline-block;
	float:left;
	width:224px;
	height:20px;
	padding-left:6px;
	text-align:left;
	-moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
    border:0px;
	behavior: url(PIE.htc);
	background-color: rgb(153, 153, 153);
	font-family: Helvetica, sans-serif;
}
.inputareag {
	top:0px;
	font-family: Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
	text-align: left;
	background-color: rgb(153, 153, 153);
	color: #000;
	-moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	height: 70px;
	width: 224px;
	padding-left:6px;
	padding-top:6px;
}
input[type="button"].subcontact {
	font-size:12px;
	height:25px;
	width:100px;
	font-family:Helvetica, sans-serif;
	border:0;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	cursor:pointer;
	outline: none;
	color:rgb(0,0,0);
	background-color:rgb(255,255,255);
}
.classcont {
	font-family:Helvetica, sans-serif;
	color:white;
	font-size:12px;
}
.box
	{
	width:100%;
	max-width:1024px;
	height:768px;
	text-align:center;
	font-weight: 300;
	font-size: 20px;
	line-height: 36px;
	overflow:hidden;
}
.clear
	{
	clear:both;
}
.divtextb, .divtext {
	margin-top:18px;
	margin-left:6%;
	font-size:12px;
	color:grey;
	text-align:left;
	line-height:12px;
}
.titlediv {
	margin-left:6%;
	font-size:14px;
	color:white;
	text-align:left;
	margin-top:-6px;
}
.divtext {
	height:406px;
}
.container
	{
	max-width:900px;
	position:relative;
	margin-left:50px;
}
#menuarea, #volet1, #volet2 {
	text-transform: uppercase;
	position:absolute;
	height:525px;
	font-family:helvetica, arial, sans-serif;
	font-size:14px;
}
#divinfo {
	width:600px;
	height:25px;
	float:left;
	margin-top:525px;
}
#swipearea {
	position:absolute;
	margin-left:50px;
	height:525px;
}
#menuarea {
	z-index:1;
	top:0px;
	left:0px;
	width:50px;	
}
.idhome {
	cursor:pointer;
}
#volet1 {
	top:0px;
	left:-100px;
	background-color:#FFF;  
	opacity: 0;
	filter: alpha(opacity=0); /* For IE8 and earlier */
	min-width:160px;
	padding-left:20px;
	padding-right:25px;
	overflow:hidden;
}
#volet2 {
	top:0px;
	left:-100px;
	background-color:#FFF;  
	opacity: 0;
	filter: alpha(opacity=0); /* For IE8 and earlier */
	min-width:100px;
	overflow:hidden;
}
.menuarea-menu {
	position:relative;
	height:45px;
	width:50px;
	float:left;
	cursor:pointer;
	margin-top:0px;
}
.bullemenu {
	position:relative;
	height:15px;
	width:62px;
	float:left;
	cursor:pointer;
	margin-left:33px;
	margin-top:1px;
	background-image:url(../img/infobulle.png);
	background-repeat: no-repeat;
	padding-left:6px;
	font-size:10px;
	text-align:center;
	display:none;
}
.bulleplay {
	position:relative;
	height:15px;
	width:65px;
	float:left;
	cursor:pointer;
	margin-top:-26px;
	margin-left:33px;
	background-image:url(../img/infoplay.png);
	background-repeat: no-repeat;
	padding-left:12px;
	font-size:10px;
	text-align:center;
	display:none;
}
.menuarea-name {
	position:relative;
	background-image:url(../img/name.png);
	background-repeat: no-repeat;
	float:left;
	height:356px;
	width:50px;
}
.menuarea-info {
	position:relative;
	float:left;
	height:25px;
	width:50px;
	float:left;
	cursor:pointer;
	display:block;
}
.menuarea-controler-pause, .menuarea-controler-play {
	position:relative;
	float:left;
	height:25px;
	width:50px;
	float:left;
	cursor:pointer;
	display:block;
	margin-top:15px;
}
.menuarea-fullscreen-on, .menuarea-fullscreen-off {
	position:fixed;
	height:25px;
	width:50px;
	float:left;
	cursor:pointer;
	display:none;
	bottom:0px;
	margin-bottom:70px;
}
.menuarea-controler-play, .menuarea-fullscreen-off {
	display:none;
}
.menuline-home {
	margin-top:22px;
	margin-bottom:9px;
	width:15px;
	height:15px;
}
.menuline-off {
	margin-top:5px;
	cursor:pointer;
}
.menuline-on {
	margin-top:5px;
	font-weight:bold;
	cursor:pointer;
}
.menuline-bottom{
	bottom:10px;
	position:absolute;
	cursor:pointer;
}
.menuline-bottom-infos {
	bottom:60px;
	position:absolute;
	cursor:pointer;
}
.menuline-bottom-bio {
	bottom:40px;
	position:absolute;
	cursor:pointer;
}
.volet2-line {
	margin-left:20px;
	margin-right:20px;
	margin-top:5px;
	cursor:pointer;
}
.volet2-line:first-of-type {
	margin-top:46px;
}
.ico-first, .ico-notfirst {
	cursor:pointer;
	float:left;
	width:40px;
	height:25px;
	margin-left:0px;
}
.menuwoo {
	opacity: 1;
	filter: alpha(opacity=1); /* For IE8 and earlier */
	position: absolute;
	top:0;
	left:0;
}
.menuhaa {
	display:none;
}
.p0div0  {
	left: 0px; 
	top: 0px;
	width:1024px;
	height:768px;
}
h1, h2 {
	color:#FFF;
	font-family: "Oswald", serif;
	font-weight:500;
}
h1 {
	font-size: 2.0em;
	line-height:0.8em;
	letter-spacing: 3px;
}
h2 {
	font-size: 1.2em;
	line-height:0.7em;
	letter-spacing: 2px;
}
h3 {
	font-size: 1.0em;
	line-height:0.7em;
	letter-spacing: 1px;
}
img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto;
}



@media screen and (max-height : 768px) and (max-width : 768px){
	#mainframe {
		width:1024px;
		height:600px;
		position:absolute;
		top:0px;
		margin-top:0px;
		left:0px;
		margin-left:0px;
		overflow:hidden;
	}
	#volet1, #volet2 {
		text-transform: uppercase;
		position:absolute;
		height:525px;
		font-family:helvetica, arial, sans-serif;
		font-size:14px;
	}
	#menuarea {
		margin-top:10px;
		text-transform: uppercase;
		position:absolute;
		height:525px;
		font-family:helvetica, arial, sans-serif;
		font-size:14px;
		margin-left:-2px;
	}
	.menuarea-menu {
		height:31px;
	}
	.titlediv {
		margin-top:20px;
	}
	.menuarea-gillestrillard {
		width:50px;
		height:119px;
		position:relative;
		background-image:url(../img/gillestrillard-320.png);
		background-repeat: no-repeat;
		float:left;
	}
	.menuarea-info {
		position:fixed;
		padding-bottom:10px;
		bottom:0px;
	}
	.menuarea-controler-pause, .menuarea-controler-play {
		position:fixed;
		float:left;
		cursor:pointer;
		display:block;
		padding-bottom:40px;
		bottom:0px;
	}
	.bottomdiv {
		background-color:black;
		padding-right:15px;
		-moz-border-radius: 0px 10px 10px 0px;
  	 	-webkit-border-radius: 0px 10px 10px 0px;
	    -khtml-border-radius: 0px 10px 10px 0px;
    	border-radius: 0px 10px 10px 0px;
    	border:0px;
		behavior: url(PIE.htc);
	}
}
@media screen and (max-width : 480px) and (max-height : 480px){
	#mainframe {
		width:480px;
		height:320px;
		position:absolute;
		top:0px;
		margin-top:0px;
		left:0px;
		margin-left:0px;
		overflow:hidden;
	}
	.menuarea-menu {
		height:31px;
	}
	.menuarea-gillestrillard {
		width:50px;
		height:119px;
		position:relative;
		background-image:url(../img/gillestrillard-320.png);
		background-repeat: no-repeat;
		float:left;
	}
	#volet1, #volet2 {
		text-transform: uppercase;
		position:absolute;
		height:320px;
		font-family:helvetica, arial, sans-serif;
		font-size:14px;
	}
	#menuarea {
		margin-top:2px;
		text-transform: uppercase;
		position:absolute;
		height:318px;
		font-family:helvetica, arial, sans-serif;
		font-size:14px;
		margin-left:50px;
	}
	.menuarea-info {
		bottom:0px;
		padding-bottom:0px;
	}
	.titlediv {
		margin-top:20px;
	}
	.bottomdiv {
		background-color:black;
		padding-right:15px;
		-moz-border-radius: 0px 10px 10px 0px;
  	 	-webkit-border-radius: 0px 10px 10px 0px;
	    -khtml-border-radius: 0px 10px 10px 0px;
    	border-radius: 0px 10px 10px 0px;
    	border:0px;
		behavior: url(PIE.htc);
	}

}
@media screen and (max-device-width : 320px) and (max-device-height : 320px){
	#mainframe {
		width:480px;
		height:320px;
		position:absolute;
		top:0px;
		margin-top:0px;
		left:0px;
		margin-left:0px;
		overflow:hidden;
	}
	.menuarea-menu {
		height:31px;
	}
	.menuarea-gillestrillard {
		width:50px;
		height:119px;
		position:relative;
		background-image:url(../img/gillestrillard-320.png);
		background-repeat: no-repeat;
		float:left;
	}
	#volet1, #volet2 {
		text-transform: uppercase;
		position:absolute;
		height:320px;
		font-family:helvetica, arial, sans-serif;
		font-size:14px;
	}
	#menuarea {
		margin-top:4px;
		text-transform: uppercase;
		position:absolute;
		height:316px;
		font-family:helvetica, arial, sans-serif;
		font-size:14px;
		margin-left:-2px;
	}
	.menuarea-info {
		bottom:0px;
		margin-bottom:10px;
	}
	.titlediv {
		margin-top:20px;
	}
	.bottomdiv {
		background-color:black;
		padding-right:15px;
		-moz-border-radius: 0px 10px 10px 0px;
  	 	-webkit-border-radius: 0px 10px 10px 0px;
	    -khtml-border-radius: 0px 10px 10px 0px;
    	border-radius: 0px 10px 10px 0px;
    	border:0px;
		behavior: url(PIE.htc);
	}
}

