/* arrière plan*/
#shadowing
{
	/*marges et position*/
	display: none;
	position: fixed;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	/*couleur*/
	background-color: #CCA;
	/*effect divers*/
	z-index:100;
	opacity:0.3;
	filter: alpha(opacity=50);
}

/*formulaire inscription*/
#box 
{
	/*marges et position*/
	display: none;
	position: fixed;
	top: 10%;
	left: 30%;
	width: 750px;
	height: 650px;
	padding: 48px;
	margin:0;
	/*couleur*/
	background-color: white;
	/*effect divers*/
	box-shadow: #aaa 2px 2px 20px 5px; 
	border-radius: 20px;
	z-index:1001;
	overflow: auto;
}

#boxtitle
{
	/*marge et position*/
	position:absolute;
	float:center;
	top:0;
	left:0;
	width:838px;
	height:24px;
	padding:0;
	padding-top:4px;
	padding-left:8px;
	margin:0;
	/*style de couleur*/
	background: linear-gradient(to right, rgb(216,245,005), rgb(228,224,133));
	color:black;
	/*style de carractères*/
	font-size:1.5em;
	text-transform:capitalize;
	text-align:center;

}
#box h4
{
	/*style de carractères*/
	font-size:1.4em;
	text-transform:capitalize;

}
#box select
{
/* styles de caractères */
font:Verdana, Geneva, sans-serif;
font-size: 14px; 
color: #4b4b4b; 
/* marge et taille */
width: 300px; 
height: 35px; 
padding: 0px 3px 0px 5px; 
margin: 0 0 20px 0;
/* couleur de fond */
background: #f1f2f4;
/* bordures */
border:1px solid #b6b7b9;
border-radius: 5px;
}
 
#box .input
{
/* styles de caractères */
font:Verdana, Geneva, sans-serif;
font-size: 14px; 
color: #4b4b4b; 
/* marge et taille */
width: 300px; 
height: 35px; 
padding: 5px 10px 0px 10px; 
margin: 0 0 20px 0;
/* couleur de fond */
background: #f1f2f4;
/* bordures */
border:1px solid #b6b7b9;
border-radius: 5px;

}
#box .label
{
/* positionnement marge et taille */
float: left; 
clear: left;
margin: 10px 20px 0 0;
width: 300px;
/* styles de caractères */
font:Verdana, Geneva, sans-serif;
font-size: 14px;
color: #445668;
text-align: right; 

}
#box .bouton
{
	/*marge et taille*/
	font-size:1.5em;
	margin-left: 12%;
	margin-top: 18px;
	width:130px;
	height:30px;
	/*bordure et effect*/
	border: none;
	box-shadow: #aaa 1px 1px 4px 3px;	
	border-radius: 5px;
	/*couleur*/
	background: linear-gradient(to right, rgb(216,245,005), rgb(228,224,133));

}
#box input:focus
{
/*effect de selesction*/
background: #d9dadc;
 }

/*formulaire de connection*/

#box1 
{
	display: none;
	position: fixed;
	top: 20%;
	left: 30%;
	width: 510px;
	height: 250px;
	padding: 48px;
	margin:0;
	background-color: white;
	box-shadow: #aaa 2px 2px 20px 5px; 
	border-radius: 20px;
	z-index:1001;
	overflow: auto;
}

#boxtitle1
{
	position:absolute;
	float:center;
	top:0;
	left:0;
	width:598px;
	height:24px;
	padding:0;
	padding-top:4px;
	padding-left:8px;
	margin:0;
	background: linear-gradient(to right, rgb(216,245,005), rgb(228,224,133));
	color:black;
	font-size:1.5em;
	text-transform:capitalize;
	text-align:center;

}
#box1 h4
{
	font-size:1.4em;
	text-transform:capitalize;

}

#box1 .input
{
/* styles de caractères */
font:Verdana, Geneva, sans-serif;
font-size: 14px; 
color: #4b4b4b; 
/* marge et taille */
width: 300px; 
height: 35px; 
padding: 5px 10px 0px 10px; 
margin: 0 0 20px 0;
/* couleur de fond */
background: #f1f2f4;
/* bordures */
border:1px solid #b6b7b9;
border-radius: 5px;

}
#box1 .label
{
/* positionnement marge et taille */
float: left; 
clear: left;
margin: 10px 20px 0 0;
width: 120px;
/* styles de caractères */
font:Verdana, Geneva, sans-serif;
font-size: 14px;
color: #445668;
text-align: right; 

}
#box1 .bouton
{
	font-size:1.5em;
	float:left;
	margin-left: 18%;
	margin-top: 18px;
	border: none;
	box-shadow: #aaa 1px 1px 4px 3px;
	width:130px;
	height:30px;
	border-radius: 5px;
	background: linear-gradient(to right, rgb(216,245,005), rgb(228,224,133));

}
#box1 input:focus
{
background: #d9dadc;
 }

/*formulaire de contact*/
#box2 
{
	display: none;
	position: fixed;
	top: 20%;
	left: 30%;
	width: 820px;
	height: 500px;
	padding: 48px;
	margin:0;
	background-color: white;
	box-shadow: #aaa 2px 2px 20px 5px; 
	border-radius: 20px;
	z-index:1001;
	overflow: auto;
}

#boxtitle2
{
	position:absolute;
	float:center;
	top:0;
	left:0;
	width:908px;
	height:24px;
	padding:0;
	padding-top:4px;
	padding-left:8px;
	margin:0;
	background: linear-gradient(to right, rgb(216,245,005), rgb(228,224,133));
	color:black;
	font-size:1.5em;
	text-transform:capitalize;
	text-align:center;

}
#box2 h4
{
	font-size:1.4em;
	text-transform:capitalize;

}

#box2 .input
{
/* styles de caractères */
font:Verdana, Geneva, sans-serif;
font-size: 14px; 
color: #4b4b4b; 
/* marge et taille */
width: 300px; 
height: 35px; 
padding: 5px 10px 0px 10px; 
margin: 0 0 20px 0;
/* couleur de fond */
background: #f1f2f4;
/* bordures */
border:1px solid #b6b7b9;
border-radius: 5px;

}
#box2 .label
{
/* positionnement marge et taille */
float: left; 
clear: left;
margin: 5px 10px 0 0;
width: 300px;
/* styles de caractères */
font:Verdana, Geneva, sans-serif;
font-size: 14px;
color: #445668;
text-align: right; 

}
#box2 textarea {
/* styles de caractères */
font-size: 14px;
color: #4b4b4b;
font-family:Verdana, Geneva, Sans-serif;
/* marge taille et ombre portée */
width: 400px;
height: 130px;
padding: 10px 10px 5px 10px;
margin: 0 0 20px 0;
/* couleur de fond */
background: #f1f2f4;
/* bordures */
border:1px solid #b6b7b9;
border-radius: 5px;
overflow: auto;
}
#box2 input:focus
{
background: #d9dadc;
 }
#box2 textarea:focus 
{
background: #d9dadc;
 }
#box2 .bouton
{
	font-size:1.5em;
	margin-left: 22%;
	border: none;
	box-shadow: #aaa 1px 1px 4px 3px;
	width:130px;
	height:30px;
	border-radius: 5px;
	background: linear-gradient(to right, rgb(216,245,005), rgb(228,224,133));

}