/* -----------------------------------
Site:---------- Page de compte
CSS author:----  
Updated:-------	  
Updated by:----
----------------------------------- */

/* -----------------------------------
simple reset
----------------------------------- */
/*
@font-face {
	font-family: "DejaVu Sans";
	src: url('../fonts/DejaVuSansMono.ttf');
}
@font-face {
	font-family: "DejaVu Sans";
	font-style: oblique;
	src: url('../fonts/DejaVuSansMono-Oblique.ttf');
}
@font-face {
	font-family: "DejaVu Sans";
	font-weight: bold;
	src: url('../fonts/DejaVuSansMono-Bold.ttf');
}
*/


html, body, ul, ol, li, form, fieldset, legend
{
	margin: 0;
	padding: 0;
}

fieldset, img { border: 0; }
legend { color: #000; }

input, textarea, select, button
{
	font-size: 100%;
	line-height: 1.2;
	font-family: helvetica, arial, sans-serif;
}



/* -----------------------------------
elements
----------------------------------- */

body
{
	font: 100% "DejaVu Sans", "URW Gothic L", "Helvetica Neue", Helvetica, Arial, "Microsoft Sans Serif", sans-serif;
}

/* -----------------------------------
container
----------------------------------- */

.container {
    order: 2;
	width: 680px;
	margin: 1em auto;
    padding-bottom: 1px;
    
}

/* -----------------------------------
h1
----------------------------------- */

.container h1 {
	margin: 0;
	padding: 10px 20px 15px;
	-webkit-border-radius: 6px 6px 0 0;
	-moz-border-radius: 6px 6px 0 0;
	border-radius: 6px 6px 0 0;
	color: #fff;
	background-color: #054C81;
	background-image: -webkit-gradient(linear, center bottom, center top, from(#054C81), to(#0595B3));
	background-image: -moz-linear-gradient(90deg, #054C81, #0595B3);
	font-size: 160%;
	font-weight: normal;
}

/* -----------------------------------
form container
----------------------------------- */

.form-container {

}

.form-container p {
	margin: 0;
	padding: 30px 0 30px 25px;
	font-size: 90%;
}

/* -----------------------------------
div
----------------------------------- */
.info {
   padding: 15px 0 0 0;
   
    font-size: 120%;
    line-height: 35px;       
}
.info-bio {
    padding: 15px 0 0 0;
    height: 200px;
    
    font-size: 120%;
    line-height: 35px;       
}

/* -----------------------------------
label
----------------------------------- */

.info label,.info .label-select,.info-bio label{
    display: inline-block;
    width: 200px;
    text-align: right    
}

/* -----------------------------------
special classes
----------------------------------- */
.mandatory {
    font-size: 120%;
    
    color: red;
}
.info .hidden{
    
    display: none;
}
.cb{
    clear: both;
}

/* -----------------------------------
icone
----------------------------------- */
#name {background: #fff url(img/sprite.png) no-repeat 0px -1px;}
#email {background: #fff url(img/sprite.png) no-repeat 0px -33px;}
#phone {background: #fff url(img/sprite.png) no-repeat 0px -65px;}
#bio {background: #fff url(img/sprite.png) no-repeat 0px -161px;}
#address1, #address2, #state {background: #fff url(img/sprite.png) no-repeat 0px -129px;}
#password, #Confirm-password {background: #fff url(img/sprite.png) no-repeat 0px -96px;}




/* -----------------------------------
legend span
----------------------------------- */

.account legend span {
    display: block;
    padding: 30px 0 15px 230px;
    
    
    font-size: 140%;
    font-weight: 700;
    letter-spacing: -1px;
    
}

/* -----------------------------------
input
----------------------------------- */

.input-wide {
    width: 290px;
    height: 30px;
    float: right;    
    margin-right: 130px;
    padding-left: 30px ;

	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;


}
.input-wide.bio {
    height: 200px;
}

.input-wide.accept{
    width: 50px;
    height: 20px;
    margin-right: 410px;
}

.input-wide.file{
    width: 340px;
    margin-right: 110px;
}

.input-wide.birth{
    width: 320px;
    padding-left: 0 ;
}



/* -----------------------------------
submit
----------------------------------- */
.valider{
    display: block;
    margin: 50px auto;
    height: 50px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	color: #fff;
	background-color: #CD4646;
	background-image: -webkit-gradient(linear, center bottom, center top, from(#6D0646), to(#CD4646));
	background-image: -moz-linear-gradient(90deg, #054C81, #0595B3);
	font-size: 140%;
	font-weight: normal;
    padding: 0 60px;
    transition: 0.5s;
    
}
.valider:hover{
    padding: 0 80px;
}

/* -----------------------------------
select
----------------------------------- */

#birthdate, #birthmonth, #birthyear, #sujet { border: 1px solid #b4b4b4; }
#sujet { width: 320px; }

#file{
    
}

/* -----------------------------------
warning messages
----------------------------------- */

.warning-message {
	color: red;
	background: #edd3d4;
	margin: 15px 0 0;
	padding: 10px;
}

.warning-message a:link, .warning-message a:visited {
	color: red;
	font-weight: bold;
}


.account .warning:hover { background: #edd3d4 url(img/sprite.png) no-repeat -640px 50%; }
.warning .input-wide { border: 1px solid red; }
.warning .name { background: #fff url(img/sprite.png) no-repeat -321px -1px; }
.warning .email { background: #fff url(img/sprite.png) no-repeat -321px -33px; }
.warning .phone { background: #fff url(img/sprite.png) no-repeat -321px -65px; }
.warning .password { background: #fff url(img/sprite.png) no-repeat -321px -97px; }
.warning .address { background: #fff url(img/sprite.png) no-repeat -321px -129px; }
.warning .bio { background: #fff url(img/sprite.png) no-repeat -321px -161px; }