@charset "utf-8";
/* CSS Document */

/* ---------------------- MAIN [ -------------------------------------- */
	@font-face {
	 font-family: Jupiter;
	 src: url("imgs/jupiter.ttf") /* TTF file for CSS3 browsers */
	}
	/* ------------------------------------------------------------ */
	#ccont{
		position:absolute;left:0px;top:0px;
	}
	#ccont canvas{
		
	}
	#ctree{
		width:300px;
		height:600px;
		overflow:auto;
		background-color:#EEE;
	}
	/*#aboutpano,#pistpano,#nickpano,#skorpano{
		background-color:#EEEEEE;
		border:solid 5px #666;
		border-radius:10px;
		opacity:0.8;
		position:absolute;
		left:100px;display:none;
		box-shadow: 5px 5px 5px #000000;
	}*/
	#pistpano{	position:absolute;top:100px;display:none;}
	#optpano{	top:100px;position:absolute;display:none;}
	
	
	#aboutpano{
		position:absolute;
		display:none;
		width:592px;
		background-image:url(imgs/INTERFACE_about.png);
		background-repeat:no-repeat;
		font-size:36px;
		color:#CCC;
		cursor:default;
		line-height:90%;
	}
	#aboutpano tr td{
		height:110px;
		padding-right:0px;
		padding-top:10px;
	}
	#aboutpano tr td+td{
		padding-left:10px;
	}
	#aboutpano tr td+td a{
		color:#FFF;
	}
	#aboutpano tr td+td a:hover{
		color:#FFF;
		text-decoration:underline;
	}
	#aboutpano tr+tr td{
		height:350px;
	}
	#aboutpano tr+tr+tr td{
		height:auto;
	}
	
	
	/*#nickpano{	top:300px;}*/
	#pistpano a:hover td{
		background-image:url(textures/damier4.PNG)
	}
	/*#skorpano table{
		border:solid 1px #666;width:100%;
	}
	#skorpano table table{
		border:0px;
	}
	#skorpano table tr td{
		color:#FFF;
		background-color:#044;
	}
	#skorpano table tr+tr td{
		color:#000;
		background-color:#DDD;
	}
	#skorpano table table tr td{
		color:#000;
		background-color:#FFF;
		padding:0px 10px 0px 10px;
	}
	#skorpano a:hover table,#skorpano a:hover table td{
		color:#FFF;
		background-color:#088;
	}*/
	.keyfield{
		width:40px;
	}
	a .aboutbut{
		position:absolute;
		right:20px;
		top:20px;
		width:32px;
		height:32px;
		background-image:url(imgs/sr_about_out.png);
	}
	a:hover .aboutbut{
		background-image:url(imgs/sr_about_over.png);
	}
	
	#interface_2d_home{
		position:absolute;left:0px;top:0px;
		width:100%;
		height:10px;
		overflow:hidden;
	}
	/* ------------------------------------------------------------ */
	/* basé sur une image de 930 x 463 */
	@keyframes movestarz{
		0%		{background-position:0px 0px;}
		100%	{background-position:-930px 0px;}
	}
	@-moz-keyframes  movestarz{
		0%		{background-position:0px 0px;}
		100%	{background-position:-930px 0px;}
	}
	@-webkit-keyframes  movestarz{
		0%		{background-position:0px 0px;}
		100%	{background-position:-930px 0px;}
	}
	
	#mask,#mask_over{
		position:absolute;left:0px;top:0px;
		width:100%;
	}
	#mask{
		background-image:url(textures/starz2_greyblak.png);
		background-color:#000;	
		animation: movestarz 35s linear infinite;
		-moz-animation: movestarz 35s linear infinite;
		-webkit-animation: movestarz 35s linear infinite;
	}
	#mask_over{
		display:none;
	}
/* ---------------------- ] MAIN -------------------------------------- */

/* ---------------------- HOME [ -------------------------------------- */
	.sr_home_content{
		position:absolute;
		bottom:0px;
		width:100%;
		margin: auto;
	}
	
	.main_but_chang_log a{
		width:467px;
		height:83px;
		background-position:0px -10px;
		background-image:url(imgs/bton_changelog.png);
		display:inline-block;
	}
	.main_but_chang_log a:hover{
		background-image:url(imgs/bton_changelog_hover.png);
	}
	
	.main_but_play a{
		width:467px;
		height:83px;
		background-position:0px -10px;
		background-image:url(imgs/bton_play_long.png);
		display:inline-block;
	}
	.main_but_play a:hover{
		background-image:url(imgs/bton_play_long_hover.png);
	}
	
	.main_but_option a{
		width:467px;
		height:83px;
		background-position:0px -10px;
		background-image:url(imgs/bton_option.png);
		display:inline-block;
	}
	.main_but_option a:hover{
		background-image:url(imgs/bton_option_hover.png);
	}
	
	#homebutpano{
		position:absolute;
	}
/* ---------------------- ] HOME -------------------------------------- */

/* ---------------------- CIRCUIT [ -------------------------------------- */
	.circuit_name{
		font-size:66px;
		color:#FFF;
		font-family:Jupiter;
		text-shadow:0px 0px 3px #FFF;
		cursor:default;
	}
	
	.circuit_difficulty{
		font-size:38px;
		color:#FFF;
		font-family:Jupiter;
		text-shadow:0px 0px 3px #FFF;
		cursor:default;
	}
	
	.sr_title_circuit{
		background-image:url(imgs/INTERFACE_circuits.png);
		width:1000px; height:600px;
	}
	.sr_title_circuit input[type=text]{
		width:276px;
		height:40px;
		padding-left:20px;
		background-color:transparent;
		border:none;
	/*	background-position:0px -5px;*/
	}
	/* ------------------------------------------------------------ */
	
	
	.opt_but_ok a{
		width:132px;
		height:66px;
		background-image:url(imgs/bton_ok.png);
		display:inline-block;
	}
	.opt_but_ok a:hover{
		background-image:url(imgs/bton_ok_over.png);
	}
	
	
	
	.opt_but_prev a{
		width:124px;
		height:254px;
		background-image:url(imgs/bton_flecheG.png);
		display:inline-block;
	}
	
	.opt_but_prev a:hover{
		background-image:url(imgs/bton_flecheG_hover.png);
	}
	
	.opt_but_next a{
		width:124px;
		height:254px;
		background-image:url(imgs/bton_flecheD.png);
		display:inline-block;
	}
	
	.opt_but_next a:hover{
		background-image:url(imgs/bton_flecheD_hover.png);
	}
	
	.opt_but_back a{
		width:132px;
		height:66px;
		background-image:url(imgs/bton_back.png);
		display:inline-block;
	}
	.opt_but_back a:hover{
		background-image:url(imgs/bton_back_over.png);
	}
	#pist_image{
		margin:70px 0px 0px 20px;
	}
/* ---------------------- ] CIRCUIT -------------------------------------- */

/* ---------------------- OPTIONS [ -------------------------------------- */
	.sr_title_controls,.sr_title_controls input[type=text]{
		font-size:36px;
		color:#FFF;
		font-family:Jupiter;
		text-shadow:0px 0px 3px #FFF;
		cursor:default;
	}
	.sr_title_controls{
		background-image:url(imgs/INTERFACE.png);
		width:1000px; height:600px;
	}
	
	.control_table{
		padding:0px;
		margin:0px;
	}
	#k_videomode,#sound_volume,.sr_title_controls input[type=text]{
		background-color:transparent;
		background-image:url(imgs/champ_01.png);
		border:none;
	}
	#sound_volume{
		width:240px;
		height:46px;
		cursor:pointer;
	}
	#sound_volume div{
		width:100%;
		height:46px;
		background-image:url(imgs/champ_01_volume.png);
	}
	.sr_title_controls input[type=text]{
		width:276px;
		height:40px;
		padding-left:20px;
		cursor:pointer;
	/*	background-position:0px -5px;*/
	}
	/* ------------------------------------------------------------ */
	#k_videomode{
		width:240px;
		height:46px;
		cursor:pointer;
		font-family:Jupiter;
		font-size:30px;
		color:#FFF;
		background-color:transparent;
		padding:15px 0px 0px 10px;
		-webkit-appearance: none;
	}
	#k_videomode option{
		background-color:#000;
	}
	/* ------------------------------------------------------------ */
	.opt_but_ok a{
		width:132px;
		height:66px;
		background-image:url(imgs/bton_ok.png);
		display:inline-block;
	}
	.opt_but_ok a:hover{
		background-image:url(imgs/bton_ok_over.png);
	}
	.opt_but_back a{
		width:132px;
		height:66px;
		background-image:url(imgs/bton_back.png);
		display:inline-block;
	}
	.opt_but_back a:hover{
		background-image:url(imgs/bton_back_over.png);
	}
	/* ------------------------------------------------------------ */
	@keyframes optrayanim{
		0%   {background-position:0px 0px;}
		100%   {background-position:0px -32px;}
	}
	@-moz-keyframes optrayanim{
		0%   {background-position:0px 0px;}
		100%   {background-position:0px -32px;}
	}
	
	@-webkit-keyframes optrayanim{
		0%   {background-position:0px 0px;}
		100%   {background-position:0px -32px;}
	}
	.opt_ray_mov{
		background-image:url(imgs/d_rays_down.png);
		animation: optrayanim 2s linear infinite;
		-moz-animation: optrayanim 2s linear infinite;
		-webkit-animation: optrayanim 2s linear infinite;
	}
	/* ------------------------------------------------------------ */
	
/* ---------------------- ] OPTIONS -------------------------------------- */

/* ---------------------- NAME [ -------------------------------------- */
	/* ------------------------------------------------------------ */
	.sr_title_nick,.sr_title_nick input[type=text]{
		font-size:50px;
		color:#FFF;
		font-family:Jupiter;
		/*background-image:url(imgs/champ_01.png);*/
		letter-spacing:2px
		text-shadow:0px 0px 3px #FFF;
		cursor:default;
	}
	.sr_title_nick{
		background-image:url(imgs/INTERFACE_Name.png);
		width:600px; height:600px;
	}
	.sr_title_nick input[type=text]{
		width:100%;
		height:46px;
		margin:0px;
		background-color:transparent;
		border:none;
	/*	background-position:0px -5px;*/
	}
	/* ------------------------------------------------------------ */
	.opt_but_ok a{
		width:132px;
		height:66px;
		background-image:url(imgs/bton_ok.png);
		display:inline-block;
	}
	.opt_but_ok a:hover{
		background-image:url(imgs/bton_ok_over.png);
	}
	
	
	/* ------------------------------------------------------------ */
	@keyframes optrayanim{
		0%   {background-position:0px 0px;}
		100%   {background-position:0px -32px;}
	}
	@-moz-keyframes optrayanim{
		0%   {background-position:0px 0px;}
		100%   {background-position:0px -32px;}
	}
	
	@-webkit-keyframes optrayanim{
		0%   {background-position:0px 0px;}
		100%   {background-position:0px -32px;}
	}
	.opt_ray_mov{
		background-image:url(imgs/d_rays_down.png);
		animation: optrayanim 2s linear infinite;
		-moz-animation: optrayanim 2s linear infinite;
		-webkit-animation: optrayanim 2s linear infinite;
	}
	/* ------------------------------------------------------------ */
	#nickpano{	
		position:absolute;
		left:100px;display:none;
	/*	top:0px;
		width:600px;*/
		background-position:-220px 0px;
	}
	#playernick{
		width:450px;
	}
/* ---------------------- ] NAME -------------------------------------- */