/*-----------------------------------------------------------------------------------------------------

        Projet : Jeux du X
		Par : Sv-diffusion.com

        Sommaire :  Generic
					Header
					Contenu
					Formulaire
					Footer
                    
-------------------------------------------------------------------------------------------------------*/


/* Generic
-----------------------------------------------------------------------------------------------------*/

body {
    background:#1E1E1E ; 
}

.transparent {
	filter : alpha(opacity=2);
    -moz-opacity : 0.2;
    opacity : 0.2;
}

.rounded_border {
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

.light {
	background:url(../picture/light.png) no-repeat top left;
	position:absolute;
	z-index:1;
	width:576px;
	height:360px;
}


/* Header
-----------------------------------------------------------------------------------------------------*/

.header {
	background:url(../picture/header_bg_repeat.gif) #333333 repeat;
	height:120px;
	border-bottom:1px solid #d4d4d4;
}

a.logo {
    background:url(../picture/logo.png) no-repeat top left;
    position:absolute;
    z-index:1;
    width:210px;
    height:92px;
    display: block;
    margin:10px 0 0 20px;
}



/*////// BT theme //////*/

.theme {
	padding:6px 0;
	background:#000;
	-moz-border-radius:8px 8px 0 0;
	-webkit-border-radius-topright: 8px; 
	top:88px;
	z-index:10;
	position:relative;
	float:left;
}

.theme a.man {
	float:left;
	display:block;
	width:20px;
	height:20px;
	background:url(../picture/man.png) no-repeat top left;
	margin-left:5px;
	
}

.theme a.woman {
	float:left;
	display:block;
	width:20px;
	height:20px;
	background:url(../picture/woman.png) no-repeat top left;
	margin-left:5px;
	margin-right:5px;
}

/*////// Bloc login //////*/

.bloc_alert {
    display: block;
    height: 60px;    
}

.alert {
    margin-top: 29px;  
    padding:10px;
    background:#000;
    -moz-border-radius:8px 8px 0 0;
    -webkit-border-radius-topright: 8px 8px 0 0;
    z-index:10;
    position:relative;
    float:right;
    margin-bottom: -10px;
    width:360px; 
        
}

.alert p {
    color: #ccc;
    padding: 0;
    margin: 0;
    line-height: 1.2em;
    text-align: right;
    
}

.alert a {
    color: #999;
    text-decoration: underline;
    font-size: 11px;
    float: right;
}

.alert a:hover {
    color: #333;
    text-decoration: none;
}

.login {
	padding:10px 10px 5px 10px;
	background:#000;
	-moz-border-radius:8px 8px 0 0;
	-webkit-border-radius-topright: 8px 8px 0 0; 
	/*top:76px;*/
	z-index:10;
	position:relative;
	float:right;
}

.login input {
	float:left;
	border:none;
	background:#FFF;
	color:#909090;
	padding:4px;
	margin-left:10px;
}

/* grey */
.login_win a.bt_valid, 
.login a.bt_valid {
	float:left;
	display:block;
	color:#FFFFFF;
	background:#555;
	padding:2px 4px;
	text-decoration:none;
	margin-left:10px;
}

.login_win a:hover.bt_valid,
.login a:hover.bt_valid {
	background:#333;
}

.login a.bt_valid_color {
    float:left;
    display:block;
    color:#FFFFFF;
    padding:2px 4px;
    text-decoration:none;
    margin-left:10px;
}

.login p {
    float: right;
    background: url(../picture/ico_connect.png) no-repeat center left;
    color:#CCC;
    font-style: italic;
    padding:0;
    padding:4px 0 0 26px;
    margin:0 10px;
}

a.mdp_lost {
    color: #444;
    text-decoration: underline;
    font-size: 11px;
    float: right;
    margin:0;
    padding:0;
    padding-top:4px; 
}

a.mdp_lost:hover {
    color: #666;
    text-decoration: none;
}

.login_win {
    padding:10px;
    background:#000;
    -moz-border-radius:8px;
    -webkit-border-radius-topright: 8px;
    margin-bottom: 20px; 
}

.login_win input {
    float:left;
    border:none;
    background:#FFF;
    color:#909090;
    padding:4px;
    margin-left:10px;
    -moz-border-radius:4px;
    -webkit-border-radius-topright:4px;
}






/* Contenu
-----------------------------------------------------------------------------------------------------*/

.content {
    /*height:403px;*/
	height:430px;
}

.home_visu {
	height:507px;
	width:635px;
	position:absolute;
    /*margin-top: 27px;*/
}

.content h2.ti {
    padding:0;
	margin:10px 0;
	color:#FFFFFF;
	font-size:40px;
	line-height:1em;
	letter-spacing:-2px;
	font-weight:bold;
	font-style:italic;
	text-align:right;
	z-index:10;
	position:relative;   
}

.content h2.ti span {
    font-size:60px;
}

/*//////// STEP 1 et STEP 2 ////////*/

.step_0,
.step_1,
.step_2 {
	z-index:200;
	position:relative;
    width: 460px;
    margin:0;
    padding:0;
    margin-left:490px;
}
.step_0 p,
.step_1 p,
.step_2 p {
    margin:0;
    padding:0;
	font-size:18px;
	font-weight:bold;
	color:#1F0013;
	float:left;
	/*width:410px;*/
	padding-left:4px;
    /*line-height: 1em;*/
}

.step_0 p {
    padding-top:22px;
}

.step_0 h3  {
    font-size: 12px;
    margin:0;
    padding:0;
    float: left;

}

.step_0 h4  {
    font-size: 18px;
    margin:0;
    padding:0;
    text-align: right;
    font-style: italic;
}


.step_0 h3 a {
    color: #000;
    text-decoration: none;
    display:block;
    background:#FFF;
    font-weight:bold;
    padding:4px 10px;
    text-align: center;
    margin-left:10px;
    margin-top:22px;
}

.step_0 a:hover {
    background:#1e1e1e;
    color: #FFF;
}

.step_0 h3 a.activ {
    color: #FFF;
    text-decoration: none;
    display:block;
    background:#1e1e1e;
    font-weight:bold;
    padding:4px 10px;
    text-align: center;
    margin-left:10px;
    margin-top:22px;
}



.step_1 p {
	padding-top:8px;
    line-height:1em;	
}

.step_1 a {
	text-decoration:none;
	/*float:right; */
}

.step_1 a:hover {
	text-decoration:underline;
}

.step_2 p {
	padding-top:22px;	
}


.step_0 span,
.step_1 span,
.step_2 span {
	font-size:50px;
	font-weight:bold;
	color:#1F0013;
	float:left;
    padding:0;
    margin:0;
    line-height:1.2em;
}

.step_content {
	margin:0 0 0 46px;
}

.step_content .flag {
	background:url(../picture/puce_phone.png) #FFFFFF no-repeat center left;
	padding:4px 0 4px 30px;
    width: 260px;
}

.step_content .flag a {
	display:block;
	float:left;
	width:19px;
	height:17px;
    margin:0;
    padding:0;
    margin-right:10px;
}

.step_content .flag a img {
	border:none;
}

.step_content input {
	background:url(../picture/puce_fleche.png) #FFF no-repeat top left;
	color:#909090;
	padding:4px 4px 4px 24px;
	width:200px;
	float:left;
}

.step_content a.bt_valid {
	float:left;
	display:block;
	color:#FFFFFF;
	background:#1e1e1e;
	font-size:16px;
	font-weight:bold;
	padding:4px 20px;
	text-decoration:none;
	margin-left:20px;
}

.step_content a:hover.bt_valid {
	background:#333;
}

/*//////// CONTENT TXT ////////*/

.content_txt {
	height:243px;
	background:url(../picture/zone_txt_bg.png) no-repeat top center;
}

/* TXT */

.txt {
	padding:40px;
}

.txt p.ti {
	padding-top:10px;
	color:#FFFFFF;
	font-size:20px;
	line-height:1em;
	letter-spacing:-1px;
	font-weight:bold;
	text-transform:uppercase;
    margin-bottom:20px;
}

.txt p.description {
	color:#FFFFFF;
	font-size:16px;
	font-weight:bold;
	line-height:1.2em;
	text-align:justify;
}

.txt a {
	padding-top:10px;
	color:#FFFFFF;
	font-size:12px;
	text-decoration:underline;
	float:right;	
}

.txt a:hover {
	color:#cccccc;
	text-decoration:underline;
}

/* INSCRIPTION */

.inscription {
	padding:12px;
}

.inscription p.ti {
	padding-top:10px;
	font-size:60px;
	line-height:1em;
	letter-spacing:-2px;
	font-weight:bold;
	text-transform:uppercase;
	margin-bottom:10px;
}

.inscription p.description {
	color:#666;
	font-size:18px;
	font-weight:bold;
	line-height:1em;
	letter-spacing:-1px;
	text-align:justify;
    margin-bottom: 20px;
}

.inscription a.bt_inscription {
	display:block;
	color:#FFFFFF;
	background:#1e1e1e;
	font-size:20px;
	font-weight:bold;
	padding:3px 20px;
	text-decoration:none;
	/*margin-left:20px;*/
	text-transform:uppercase;
	width:200px;
}

.inscription a.bt_inscription:hover {
	background:#333;
    color:#FFF;
}

.inscription a {
    color:#333;
    text-decoration:underline;
}

.inscription a:hover {
    color:#999;
    text-decoration:none;  
}


/*//////// DETAIL ////////*/

.content_up {
	height:123px;
}


/* TITRE PAGE */
.content_up .detail {
	height:123px;
}

.content_up .page_inscription {
	height:123px;
}

.content_up .profil {
	height:123px;
}

.stats_profil {
    height: 86px;
    overflow: auto;
}

.retour {
	z-index:10;
	position:relative;
	float:left;
	margin-top:70px;
}

a.retour {
	color:#FFFFFF;
	font-size:20px;
	letter-spacing:-1px;
	font-style:italic;
	font-weight:bold;
	padding-left:24px;
	color:#FFFFFF;
	text-decoration:none;
	background:url(../picture/puce_flecheg.png) no-repeat center left;
}

a:hover.retour {
	/*color:#333;*/
	text-decoration:underline;
}

.content_up h2.ti {
	color:#FFFFFF;
	font-size:40px;
	letter-spacing:-1px;
	font-style:italic;
	font-weight:bold;
	float:right;
	line-height:1em;
	padding:0;
	margin:0;
	margin:60px 20px 0 0;
}

.content_detail {
	z-index:10;
	position:relative;
	background:#373737;	
}

.content_detail h3 {
    color: #FFF;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom:10px;  
}

.content_detail h3.legal {
    float:left; 
}


.content_detail p {
	padding:0 0;
	text-align:justify;
	color:#ccc;
	line-height:1.1em;
    font-size: 12px;
    margin: 0 0 30px 0;
    
}

.content_detail b {
    line-height:2em;
    font-size:16px;
    color:#FFF;
}

.info_legale p {
    padding:0 0;
    text-align:justify;
    color:#ccc;
    line-height:1em;
    /*font-size: 11px;*/
    margin: 0 0 30px 0;
}



.content_detail a.jeuxdux {
    color: #FFF;
    text-decoration: underline;  
}

.content_detail a.jeuxdux:hover {
    color: #999;
    text-decoration: underline;  
}

/* SOMMAIRE */

.content_detail .sommaire {
    margin-bottom:20px;
    padding-bottom: 20px;
    border-bottom: 1px dotted #666;
}
.content_detail .sommaire p {
    color:#FFF;
    font-size: 16px;
    margin-bottom:10px;
}

.content_detail .sommaire ul {
    padding:0;
    margin: 0; 
}

.content_detail .sommaire ul li {
    padding:0;
    margin: 0; 
    list-style: none;  
}

.content_detail .sommaire ul li a {
    color:#CCC;
    text-decoration: none;    
}

.content_detail .sommaire ul li a:hover {
    color:#FFF;
    text-decoration: none;    
}

a.retour_h {
    background: url(../picture/puce_h.gif) no-repeat bottom left;
    width: 11px;
    height: 9px;
    display: block;
    float: left;
    margin:4px 0 0 10px;   
}

a:hover.retour_h {
    background: url(../picture/puce_h.gif) no-repeat top left; 
}

/* BLACK BLOC */

.black_bloc {
	background:#1e1e1e;
	color:#999;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	padding:20px;
	margin:20px 10px;
}

.black_bloc p.ti_bloc {
	font-size:18px;
	font-style:italic;
	font-weight:bold;
	text-align:right;
	color:#999;
	margin:0;
	padding:2px 0;
	border-bottom:1px dotted #3d3d3d;
	
}

/* ICO BLOC */

.black_bloc p.profil {
	background:url(../picture/ico_perso.png) no-repeat top left;	
}

.black_bloc p.stats {
	background:url(../picture/ico_stats.png) no-repeat top left;	
}

.black_bloc p.lien {
	background:url(../picture/ico_star.png) no-repeat top left;	
}

.black_bloc p.share{
	background:url(../picture/ico_coeur.png) no-repeat top left;	
}

.black_bloc p {
    margin:0;
    padding:0;
}

.black_bloc p.alert_01 {
    margin-top:10px;
    text-align: center;
    background: #cc0000;
    padding: 1px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    color: #FFF;
}

.black_bloc p.disclaimer {
	font-size:12px;
	text-align:justify;
	color:#CCC;
	margin:0;
	padding:10px 0;
}

.black_bloc table {
    padding:0;
    margin:0;
    margin-top:10px;
}

.black_bloc table tr td {
    color:#999;
    background:#2e2e2e;
}

.black_bloc tr.ti td {
    color:#FFF;
}

.black_bloc tr td {
    padding:0;
    margin:0;
    padding:2px 10px;
}

.black_bloc tr.bg td {
    background:none;
    border-bottom: 1px dotted #3F3F3F;
}


.black_bloc input {
	background:#2e2e2e;
	padding:5px;
	border:none;
	float:left;
	color:#999;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.black_bloc textarea {
    background:#2e2e2e;
    padding:5px;
    border:none;
    color:#999;
}

.black_bloc a.bt_valid {
	float:right;
	display:block;
	color:#FFFFFF;
	font-weight:bold;
	font-size:12px;
	font-weight:bold;
	padding:4px 10px;
	text-decoration:none;
}


/*///////////////////////  Fenetre superposée //////////////////////*/


html>body .bloc_superpose {
    background:transparent url(../picture/grey.png) repeat left top;
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%;
    z-index:200000;
}

.bloc_superpose {
    background-color:#2C2B2B;
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%;
    z-index:100000;
}

/* Bloc_resultat */

.bloc_resultat {
    border:4px solid #CCC;
    background: #FFF;
    width: 444px;
    padding: 10px;
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
}

.result p {
    text-align: center;
    color:#555;
    font-size:14px;
    line-height:1em;
    padding:8px;
    margin:0;  
} 

.result .lose {
    background:url(../picture/lose.jpg) #cc0000 no-repeat top left;
    height:98px;
    width:424px;
     margin-bottom:10px
}

.result .win {
    background:url(../picture/win.jpg) #00CC00 no-repeat top left;
    height:98px;
    width:424px;
     margin-bottom:10px
}

.result .bad_code {
    background:url(../picture/bad_code.jpg) #cc0000 no-repeat top left;
    height:98px;
    width:424px;
     margin-bottom:10px
}

.result .come_on {
    background:url(../picture/inscription.jpg) no-repeat top left;
    height:239px;
    width:424px;
    margin:0; 
    padding:0;
    margin:20px 0 10px 0;
    
}

.link_inscription {
    padding-top:165px;
}

.result .link_inscription a {
    display:block;
    color:#FFFFFF;
    background:#1e1e1e;
    font-size:20px;
    font-weight:bold;
    padding:3px 20px;
    text-decoration:none;
    text-transform:uppercase;
    width:200px;
}

.result .link_inscription a:hover {
    background:#333;
}

.result a.close {
    color:#333;
    text-decoration:none;
    margin-top:20px;    
}

.result a:hover.close {
    text-decoration:underline;  
}

/* Formulaire
-----------------------------------------------------------------------------------------------------*/

.separ {
	border-bottom:1px dotted #3d3d3d;
}

.form {
	color:#999;
	font-size:12px;
}

.form p {
	clear:left;
	padding:0;
	margin:14px 0;
    line-height: 1.6em;
}

.form i {
	font-size:11px;
	color:#999;
}

.form u {
	font-size:12px;
	color:#999;
	font-style:italic;
	text-decoration:none;
	padding:0 4px;
}

.form a.modif {
	color:#FFF;
	text-decoration:underline;
}

.form a:hover.modif {
	color:#ccc;
	text-decoration:none;
}

.form label {
	color:#999;
	float:left;
	font-family:Arial,Helvetica,sans-serif;
	margin:0;
	padding:4px;
	text-align:right;
	width:84px;
}

.form label.oblig {
	font-weight:bold;
}

.form input {
	background-color:#FFF;
	border:none;
	color:#303030;
	font-size:11px;
	font-weight:normal;
	margin-left:4px;
	padding:4px;
	/*float:left;*/
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

/*.form input:focus {
    background-color:#FFF;
}*/

.form textarea {
    /*float:left;*/ 
	background-color:#FFF;
	border:none;
	color:#303030;
	font-size:11px;
	font-weight:normal;
	margin-left:4px;
	padding:4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}


/*.form textarea:focus,
.form input:focus {
	border:1px solid #333;
}*/

.form a.bt_valid {
    float:right;
    display:block;
    color:#FFFFFF;
    font-weight:bold;
    font-size:16px;
    font-weight:bold;
    padding:4px 20px;
    text-decoration:none;
    margin:20px 16px 0 0;
}

/* Validation */

.alert_form {
    color:#FFF;
    text-align: center;
}

.form p.valid_true input {
    background-color:#BDEFA4;
    border:none;
    color:#000;
}

.form p.valid_false input {
    background-color:#EF9595;
    border:none;
    color:#000;
}

span.valid_true input {
    background-color:#BDEFA4;
    border:none;
    color:#000;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

span.valid_false input {
    background-color:#EF9595;
    border:none;
    color:#000;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}



/* BLOC Validation */

.valid_OK {
    background:#4F0000;
    padding:10px;
    margin:20px 10px 0 10px;
}

.valid_OK p {
    background: url(../picture/ico_OK.png) no-repeat top left;
    height: 20px;
    margin:0;
    padding:0;
    padding-left:28px;
    line-height: 1.6em;
}






/* Footer
-----------------------------------------------------------------------------------------------------*/

.footer {
	background:#1e1e1e;
	color:#666;
	padding:20px;
	text-align:center;
	font-size:11px;
}

.footer p {
	padding:0 40px 20px 40px;
}

.footer a {
	color:#666;
	text-decoration:underline;	
}

.footer a:hover {
	color:#CCC;
	text-decoration:none;	
}

.rocked {
	margin:20px auto ;
	width:200px;
	height:60px;
}

.rocked img {
	float:left;	
}

.rocked p {
	padding:20px 10px 0 0;
	float:left;
	font-style:italic;	
}