html, body {
    margin: 0;
    padding: 0;
	background-color:#ffffff;
}

html{
	/*background:url('images/fondecran.png') 50% 0% no-repeat;*/
	background-color:#ffffff;
  
}

body {
  color:black;
  font:cursive;
  font-family:arial;
  font-size:12px;
  text-align: justify;
  /*cursor: url('images/curseur/curseur.cur') 48 0, pointer;*/
}

h1 {
    font-size: 15px; 
    
    text-align: center;

  
}

#pp a:link, #pp a:visited, #pp a:active, #pp a:hover{
	cursor:default;
}

p,ul,li,td {
    color: black; 
}

ul{
	margin:0;
	padding:0;
}

img{
	border:none;
	/*cursor: url('images/curseur/curseur.cur') 48 0, pointer;*/
}

@font-face {
  font-family: 'jayfreres';
  src: url('font/jayfreres.eot');
  src: url('font/jayfreres.woff') format('woff'),
        url('font/jayfreres.svg#abcd') format('svg'),
  		 url('font/jayfreres.ttf') format('truetype');  
}

a:link {
    color: black;
    text-decoration: none;
	/*cursor: url('images/curseur/curseur.cur') 48 0, pointer;*/
}
a:visited {
    color: black;
}
a:active {
    color:black;
}
a:hover {
    color:#d50330;
    text-decoration: none;
}

a.nonsouligne:link { 
	text-decoration:none;  
	color: black;
}
a.nonsouligne:visited {
    color: black;
}
a.nonsouligne:active {
    color:black;
}
a.nonsouligne:hover {
    color:#d50330;
    text-decoration: none;
}

a.poker:link { 
	text-decoration:none;  
	color: white;
}
a.poker:visited {
    color: white;
}
a.poker:active {
    color:white;
}
a.poker:hover {
    color:#grey;
    text-decoration: none;
}

a.pp:link { 
	text-decoration:none;  
	color: black;
	cursor:default;
}
a.pp:visited {
    color: black;
    cursor:default;
}
a.pp:active {
    color:black;
    cursor:default;
}
a.pp:hover {
    color:#grey;
    text-decoration: none;
    cursor:default;
}

#logo{

	
}

#coordonnee{
	float:left;
	margin-top:80px;
	width:100%;
	font-size:15px;
	line-height:17px;
	padding-left:3%;
	text-align:center;
	color:black;
}

#boutonacf{

	position:absolute;
	margin:-2px 80px 140px -400px;
	width:800px;
	left:50%;
	height:100px;	
	opacity:1;
	border:solid 2px black;	
	background:url('images/logo2.png') 50% 50% no-repeat;
	border-radius:0 0 100px 100px;
}
#page{
	margin-left: auto;
    margin-right: auto;
	width:100%;
}
#texte {	
	position:absolute;
	height:auto;
	margin:110vh 0px 0 0;
	padding:0px;
	width:100%;
	text-align:justify;
	color:black;
	cursor:default;
	-webkit-animation: pp 322s ease 0s forwards; 
	-moz-animation: pp 322s ease 0s forwards; 
	-ms-animation: pp 322s ease 0s forwards; 
	-o-animation: pp 322s ease 0s forwards; 
	animation: pp 322s ease 0s forwards; 
}
#bandeautexte{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:auto;
}
#diapo{
	position:absolute;
	margin-top:265px;
	width:960px;
	height:265px;
	background-color:rgba(0,0,0,1);
	
}
#clic a{
	position:absolute;
	width:100%;
	height:1080px;
	z-index:1000;
}

#pp{
	font-size:15px;
	line-height:15px;
}

#entrer a{
	display:block;
	position:absolute;
	text-align:center;
	top:50vh;
	margin:-158px 0 0 -158px;
	width:316px;
	height:316px;
	left:50%;
	background:url('images/entrer.png') 50% 50% no-repeat;
	background-size:316px auto;
	transition:background-size 0.1s;
}
#entrer a:hover{
	background-size:300px auto;
}

@media (max-width: 800px) {
  	#pp{
  		display:none;
  	}  	
  	#boutonacf{
		position:absolute;
		margin:-2px -2px 0px -2px;
		width:100%;
		left:0%;
		height:200px;	
		opacity:1;
		border:solid 2px black;
		background:url('images/logo1.png') 50% 50% no-repeat;
		background-size:100% auto;
		background-color:white;
		border-radius:0 0 100px 100px;
	}
  	#logo{
		
		width:100%;
		height:100px;
		float:left;
		margin-left:0;
	}
	#coordonnee{
		float:right;
		
		margin-top:150px;
		width:80%;
		font-size:15px;
		line-height:17px;
		padding:0% 10%;
		text-align:center;
		color:black;
	}
	#entrer a{
		display:block;
		position:absolute;
		text-align:center;
		top:70vh;
		margin:-125px 0 0 -125px;
		width:250px;
		height:250px;
		left:50%;
		background:url('images/entrer.png') 50% 50% no-repeat;
		background-size:250px auto;
		transition:background-size 0.1s;
	}
	#entrer a:hover{
		background-size:240px auto;
	}
}

@media (max-width: 400px) {
	#boutonacf{
		position:absolute;
		margin:-2px -2px 0px -2px;
		width:100%;
		left:0%;
		height:150px;	
		opacity:1;
		border:solid 2px black;
		background:url('images/logo1.png') 50% 50% no-repeat;
		background-size:100% auto;
		background-color:white;
		border-radius:0 0 100px 100px;
	}
	#coordonnee{
		float:right;		
		margin-top:100px;
		width:80%;
		font-size:15px;
		line-height:17px;
		padding:0% 10%;
		text-align:center;
		color:black;
	}
}

@-webkit-keyframes pp{ 
	from { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; } 
	99% { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; }
	to { opacity: 1; filter: alpha(opacity = 100); -moz-opacity: 1; } 
}
@-moz-keyframes pp{ 
from { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; } 
	99% { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; }
	to { opacity: 1; filter: alpha(opacity = 100); -moz-opacity: 1; } 
} 
@-ms-keyframes pp{
from { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; } 
	99% { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; }
	to { opacity: 1; filter: alpha(opacity = 100); -moz-opacity: 1; } 
} 
@-o-keyframes pp{
from { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; } 
	99% { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; }
	to { opacity: 1; filter: alpha(opacity = 100); -moz-opacity: 1; } 
} 
@keyframes pp{ 
from { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; } 
	99% { opacity: 0; filter: alpha(opacity = 0); -moz-opacity: 0; }
	to { opacity: 1; filter: alpha(opacity = 100); -moz-opacity: 1; } 
} 

#mentions{
	position:absolute;
	top:88vh;
	left:10%;
	color:white;
	text-shadow:0 0 1px black;
}
#mentions a{
	color:white;
}

#asco a{
	position:absolute;
	top:90vh;
	right:10%;
	width:125px;
	height:45px;
	margin:3px 0 2px 6%;
	background:url('./images/asco-blanc-transparent.png') 50% 50% no-repeat;
}
#asco a:hover{
	
	background:url('./images/asco-noir.png') 50% 50% no-repeat;
}