/**     RESET STYLE     **/

*{padding: 0; margin: 0;}
img{border: 0px}
html{height:100%}
a{color:#69033C;outline: none}
/**     STRUCT STYLE    **/

body{
	background:url(../images/layout/bg.jpg) repeat  top left;
	/*background-color: #6E468C;*/
	font-family:arial;
	font-size:12px;
}


h1{
	font-family:arial;
	color: #A3055B;
	font-size:  20px;
	
}

h2 {
	font-family:arial;
	font-size:  18px;
	color:#69033C;
	padding: 20px 0px 8px 0px;
}
	
h3{
	font-size: 16px;	
    margin: 14px 0 4px 0;	
}

p{
	line-height: 18px;
}

.left{float:left}
.right{float:right}
.clear{clear:both}

.container{
	width:890px;
	margin:10px auto 80px;
	/*padding:20px;	*/
 
}
.header{

}

.logo{
	background:url(../images/logo.png) no-repeat  top left;
	display:block;
	height:50px;
	width:280px;
	float:left;
}
.logo span{display:none}


.quicklinks{
	margin-top: 20px;
	text-align: center;
	float: left;
	line-height: 29px;
	padding: 0px 20px;	
}

.footer{
	padding: 20px 20px;	
	margin:auto;
	float:right; 
}


.footer .copyright{
	float: left;
	font-size: 11px;
	color:#666;
	height: 29px;
	display: block;
	text-align: right
}
.footer .logo-ouat{
	float: left;
	margin-left: 10px;
}
.footer .logo-ouat a{
	display: block;
	background: url(../images/layout/logo-ouat.png);
	width:109px;
	height:29px;
	margin: auto;
}
.footer .logo-ouat a span{
	display: none
}
	
.legal {
    padding: 20px 100px 0px 100px;
}

.page {
	margin-top:20px;
    padding: 25px ;
	background:#ffffff;	
	
	background: rgb(255,255,255); 
	background:	rgba(255,255,255,0.4);	
		
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0.6)), to(rgba(255,255,255,0.4)));
	background: -moz-linear-gradient(top, rgba(255,255,255,0.6), rgba(255,255,255,0.4));
	
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;		
	-moz-box-shadow: 0px 2px 10px #888;
	-webkit-box-shadow: 0px 2px 10px #888;
	box-shadow: 0px 2px 10px #888;
}

.page h4 {
    margin: 7px 0 7px 20px;
}

.page ul {
    margin: 7px 0 15px 20px;
}

.page ul li {
	list-style-type: square;
	margin: 3px 0 7px 20px;
}


.menubar{
	
	margin-bottom:0px;
	position: relative;
	z-index: 100
}

.menubar .logo-ts-small{
	 display:block;    
	background-image: url(../images/layout/logo-ts-xsmall.png);	
    background-repeat: no-repeat;
    width: 94px;
    height:52px;
	text-indent: -9999px;
	position: absolute;
	left:47px;
	top:-8px;
}


.menubar .logo-fa-small{
	 display:block;    
	background-image: url(../images/layout/logo-fa-xsmall.png);	
    background-repeat: no-repeat;
    width: 145px;
    height:79px;
	text-indent: -9999px;
	position: absolute;
	top:25px;
	left:25px;
}

.menubar .menu{
	float:right;
	width:680px;
	margin-left: 20px;
	
	/*background-image: url(../images/layout/header-bg.png);*/		
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;	
		
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D6077B', endColorstr='#A3055B') ;
	background: -webkit-gradient(linear, left top, left bottom, from(#D6077B), to(#A3055B));
	background: -moz-linear-gradient(top, #D6077B, #A3055B);
		
	-moz-box-shadow: 0px 1px 2px #888;
	-webkit-box-shadow: 0px 1px 2px #888;
	box-shadow: 0px 1px 2px #888;
	
	height: 50px;	
	margin-top:40px;
}
.menu ul{
	list-style:none;
	padding-left: 6px; 
}

.menu  li {
    float:left;
    display:inline;
	text-align: center;
	padding: 5px 0;
	margin-right: 6px; 
}

.menu  a {
    display:block;
    text-decoration:none;    
    outline:none;
	padding: 0px 38px;	
	line-height: 40px;
	
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;	
}
.menu .item a {
	color:#fff;
	font-size: 16px;	
}

.menu  a:hover, 
.menu  a:active,
.menu .active a,
.menu .active a:hover,
.menu .active a:active{
	background-color: rgba(105,3,60,0.7);
}


ul.submenu{

	margin:20px 0 0 0;
	padding: 0;
	list-style: none;	
}
ul.submenu li {
	font-size:  18px;
	list-style: none;
	margin:0;
	padding: 0;
}

ul.submenu li li{
	font-size:  13px;
	line-height: 20px
} 


.body-home .logo-spies{
	
	display:block;    
	background-image: url(../images/home/TSFB_ALEX_BLONDE_SHADOW.png);	
    background-repeat: no-repeat;
    width: 121px;
    height:200px;
	position: absolute;
	right:20px;
	bottom:70px;
}

.body-home .logo-ts{
	
}

.body-home  a.splashscreen{
	margin-top: 10px;
    display:block;    
	background-image: url(../images/home/HOMEPAGE_GARDEN.png);	
    background-repeat: no-repeat;
    width: 890px;
    height:462px;
    text-indent: -9999px;
    position: relative;
}

.body-home a.splashscreen .logo-ts{
	display: block;
	background: url(../images/layout/logo-ts.png);
	width:245px;
	height:134px;
	margin: auto;
	position: absolute;
	left:30px;
	top:10px;
	display:none;
}
	
.body-home a.splashscreen .logo-fa{
	display: block;
	background: url(../images/layout/logo-fa.png);
	width:260px;
	height:140px;
	margin: auto;
	position: absolute;
	left:10px;
	/*top:100px;*/
	top: 5px;
	
	display:none;
}

.body-home a.splashscreen .btn_play{
    display:block;
    text-decoration:none;
    background: url(../images/layout/fr_btn_play.png) no-repeat top left;
    width: 201px;
    height:80px;
    position: absolute;
    bottom:00px;
    right:00px;    
    outline:none;
}
.body-home a.splashscreen:hover  .btn_play{
    background-position: 0 -80px; 
}


.body-home.lang-en .btn_play{
    display:block;
    text-decoration:none;
    background: url(../images/layout/en_btn_play.png) no-repeat top left;
    width: 201px;
    height:80px;
    position: absolute;
    bottom:20px;
    right:50px;    
    outline:none;
}


.body-home .col-two{
	padding:36px 0 
}
.body-home .video{
    float:left;
    display:block;
    width:50%;
    height:325px;
    text-align: left;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}
.body-home .sidebar{
	float:right;	
	width:430px; 
	text-align: center;
}
.body-home .sidebar .like{
	display: inline-block;
	width: 80px;	
}
.body-home .sidebar .fb-like-box{
	margin-top: 30px;
}


.body-home  .likeforum{
	float:right;
	display:block;
	width:491px;
}

div#gallery{
    text-align:center;
    width:100%;
    overflow:auto;
    padding-top: 10px;
    padding-bottom: 10px;
}

div#gallery-inner {
    white-space:nowrap;
    height:350px;
    width:100%;
}

div#gallery img{
	display:inline;
	height:350px;

}

.dix {
    margin-right:10px;
}

.monster {
    background:url(../images/footer_monster_author.png) no-repeat  top left;
    display:block;
    height:80px;
    width:190px;
    margin-left:-70px;
    /*margin-top:-30px;*/
    position:absolute;
    z-index:1
}

.monster span {
    display:none;
}

.col{float:left;}
.col-inner{padding:0 30px}
.col-50{width:50%}


/**     PAGE    **/


/**     FORM    **/

form {
	margin: 20px 20px 20px 150px;
	
}

form .form_row {
	clear: both;
	margin: 20px 0 20px 0;
}

form .form_row .form_label {
	display: block;	
	font-size:15px;	
	float: left;
	color:#111;
	font-weight: bold;
	
}

form .form_row .form_field {	
	float:left;
	
}
form .form_row span.input{

	display: inline-block;
}

form .form_row .tips {
	
	vertical-align: top;
	display: inline-block;
	font-size:14px;	
	line-height: 20px;
	margin-left:20px
}

form .form_row .error {
	color: red;
	margin: 7px;
	vertical-align: top;	
	line-height: 40px;
	display: inline-block;
	font-size:15px;
}

form .form_row input,
form .form_row select,
form .form_row textarea {
	border: 1px solid #999;
	margin: 5px 20px 5px 0px;
	padding: 8px;
	font-size: 14px;
	font-family: arial;
}

form .form_row input,
form .form_row select {
	width: 250px;
}

form .form_row .help {	
	font-size:0.9em;
}

form .form_row textarea {
	padding: 5px;
	height: 100px;
	width: 350px;
}

form .form_row input[type=checkbox] {
	border: 0;
	margin: 5px 0 5px 0;
	width: 20px;
}

form .form_row.confirm {
	margin: 10px 0 0 20px;
	text-align: left;
}

form .form_row input[type=submit] {
	margin: 10px 0 15px 0;
	width: 250px;
	
	font-weight: bold;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;

	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f4f4', endColorstr='#dddddd');
	background: -webkit-gradient(linear, left top, left bottom, from(#F4F4F4), to(#DDD));
	background: -moz-linear-gradient(top, #F4F4F4, #CCC);
	
	-moz-box-shadow: 0px 1px 2px #ccc;
	-webkit-box-shadow: 0px 1px 2px #ccc;
	box-shadow: 0px 1px 2px #ccc;
}
form .form_row input[type=submit]:active {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: 0px 1px 2px #ccc;
}

form .form_row input[type=submit]:hover {
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F8F8F8', endColorstr='#E0E0E0');
	background: -webkit-gradient(linear, left top, left bottom, from(#F8F8F8), to(#E0E0E0));
	background: -moz-linear-gradient(top, #F8F8F8, #E0E0E0);
}
form .form_row textarea,
form .form_row input[type=text] {
	background-color: #fcfcfc;
	border-color:#ccc;
	border-width: 2px
}


form .form_row.form_email input{
	width: 350px;
}
form .form_row.form_flash .form_label{
	font-weight: normal
}
form .form_row.form_flash .input{
	font-size:15px;
}

form .form_row.form_cgu {
	font-size:14px;
	line-height: 18px;
	margin-top: 40px
}
form .form_row.form_cgu input{
	float: left;
}
form .form_row.form_cgu .form_label{
	width: auto;
	font-size:14px;
	margin-top: 2px
}
form .form_row.form_cgu .error{
	clear:both;
	display: block;
	font-size:14px;
}

.form_required {
	color: #333;
	margin-left: 20px;
	float:  right;
	font-size:15px;
}


.body-game .page{
	padding-top:30px;
	padding-bottom:60px;
}
