@keyframes glisse {
	0% { transform: translateX(-100%); }
	50% { transform: translateX(-100); }
	100% { transform: translateX(0); }
}
@keyframes fondu {
	0% { opacity:1; }
	50% { opacity:0.5; }
	100% { opacity:1; }
}
@keyframes déroule {
	0% { transform: scaleY(0%); }
	50% { transform: scaleY(50%); }
	100% { transform: scaleY(100%); }
}
@keyframes puces {
	0% { transform: scaleY(0%); }
	25% { transform: scaleY(50%); }
	50% { transform: scaleY(100%); }
	75% { transform: scaleY(50%); }
	100% { transform: scaleY(0%); }
}


html {
	width:100%;			height:100%;
	font-family:Arial;
	scrollbar-width: auto;		scrollbar-color:rgb(140,250,140) rgb(190,250,190);
}

body {
	width:100%;			height:100%;
	text-align:center;		margin:0px;
}

li { width:100%; }

form { margin:0px; }

textarea {
	width:300px;			height:300px;
	border:solid black 5px;		border-radius:5px;
	font-weight:bold;
}

input[type="range"]::-moz-range-progress {
	background-color:green; 
}
input[type="range"]::-moz-range-track {  
	background-color:#43e5f7;
}

h1 { margin:0px; font-size:40px; }
h2 { margin:0px; font-size:30px; }
h3 { margin:0px; font-size:20px; }
h4 { margin:0px; font-size:15px; }
a { color:green; }

table {
	border-radius:5px;
	border-style:none;
}

th {
	border-radius:5px;
	background-color:rgb(140,250,140);
	border-style:none;
}

td {
	background-color:rgb(180,250,180);
	border-radius:5px;
	border-style:none;
}

.puces_animées {
	display:inline-block;
	animation:1s ease-out 0s 1 puces;
	animation-iteration-count:infinite;
	font-size:50px;
}


.menu {
	position:fixed;
	left:0px;			top:0px;
	width:100%;			min-height:100px;
	background-color:rgb(180, 250, 180);
	z-index:100;
}

.sous-menu {
	animation:0.15s ease-out 0s 1 déroule;
	display:none;			position:absolute;
	width:230px;			#height:60px;
	border:none;			border-radius:5px;
	font-weight:bold;		font-size:20px;
}

.ctn_btn { display:inline-block; }
.ctn_btn:hover .sous-menu { display:block;		position:fixed; }

.affichage {
	width:auto;			min-height:150%;
	margin:105px 5px 105px 5px;
	background-color:rgb(200, 250, 200);
}

.infos {
	display:inline-block;	cursor:pointer;
	width:30px;		height:30px;
	font-size:20px;
	text-align:center;	font-weight:bold;
	color:grey;		background-color:white;
	border:solid grey 1px;	border-radius:30px;
}
.infos:hover {
	background-color:rgb(228,255,204);
}

.forfait {
	display:inline-block;
	width:200px;	height:100%;
	background-color:red;
	margin:5px;
}

.pied_de_page {
	position:fixed;			bottom:0px;
	width:100%;			height:100px;
	background-color:rgb(180, 250, 180);
}

.colonne_1 {
	float:left;
	width:50%;	height:100%;
}

.colonne_2 {
	float:right;
	width:50%;	height:100%;
}

.affichage_2 {
	width:100%;			height:60%;
	background-color:rgb(150,250,150);
	margin:auto;			float:left;
	margin:5px;			margin-bottom:100px;
}

.btn_menu {
	width:230px;			height:30px;
	background-color:rgb(140, 250, 140);
	border:none;			border-radius:5px;
	font-weight:bold;		font-size:15px;
	margin:0px;			padding:0px;
}
.btn_menu:hover {
	background-color:rgb(130, 250, 130);
	border:none;			border-radius:10px;
}

.btn_menu_accueil {
	width:400px;			height:150px;
	background-color:rgb(140, 250, 140);
	border:none;			border-radius:5px;
	font-weight:bold;		font-size:15px;
	margin:5px;			padding:0px;
}
.btn_menu_accueil:hover {
	background-color:rgb(130, 250, 130);
	border:none;			border-radius:10px;
}

.btn_demi_journée {
	width:100px;			height:75px;
	background-color:rgb(160,250,160);
	border:none;			border-radius:5px;
	padding:0px;			margin:0px;
}
.btn_demi_journée:hover { background-color:rgb(150,250,150); }


.btn_lien {
	background:none;	color:green;
	border:none;		text-decoration:underline;
	cursor:pointer;
}
.btn_lien:hover { background:none; }

.formulaire {
	width:300px;
	background-color:white;
	border:none;			border-radius:3px;
	resize:none;			font-weight:bold;
}
.formulaire::placeholder { color:rgb(120, 150, 120);	font-weight:normal; }

.ctn_70 { width:70%;	text-align:justify;		margin:auto; }
