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

/* a few base styles from supercratebox.com to keep a consistent look */

*
{
	margin: 0px;
	padding: 0px;
	border: 0px none #000;
}

@font-face
{
	font-family:'Acknowledge BRK';
	src:url('/acknowtt.ttf');
}

@font-face
{
	font-family:'Volter'; 
	src:url('/volter_emb.ttf') /* for CSS3 compliant */
}
body,html{width:100%;}
html{
	min-height:100%;
	background-color:#838383;
	overflow-y:scroll;
}
body{
	height:100%;
	position:absolute;
}

a
{
	text-decoration: none;
	color: #ACEE8B;
}

#ios
{
	font-family:"Acknowledge BRK",Verdana,sans-serif;
	font-size:36px;
	margin:0px;
	padding:0px;
	position:relative;
	float:left;
	left:44%;
	top:-53px;	
	width:440px;
	text-align:right;
}

#ios a
{
	color:#000;	
}
.outer li{
    margin-left:20px;
    list-style: square;
}
/* superbreadbox stuff C64 mode here we go!

COLOUR PALETTE

#000000 black
#FFFFFF white
#8B4131 red
#7BBDC5 cyan
#6F3D86 purple
#6AAC41 dgreen
#3931A4 dblue
#D5DE73 yellow
#945A20 orange
#5A4100 brown
#BD736A lred
#525252 dgrey
#838383 grey
#ACEE8B lgreen
#7B73DE lblue
#ACACAC lgrey

*/

#hse{
	font-family:"Volter",Verdana,sans-serif;
	font-size:18px;
}
div.outer{
	width:757px;
	margin:0 auto 0 auto;
	padding:140px 0 0 0;
	position:relative;
	top:0;
	z-index:2;
}

div.outer.enter{
	padding:0;	
}

.clouds{	
	position:absolute;
	top:0px;
	z-index:2;
	background-image:url(/images/menu_clouds64.gif);
	background-repeat:repeat-x;
	background-position:0 0;
	background-color:#FFFFFF;
	width:100%;
	height:221px;
	
}

.city{
	position:absolute;
	top:10px;
	z-index:1;
	background-image:url(/images/menu_city64.gif);
	background-repeat:repeat-x;
	background-position:0 0;
	width:100%;
	height:521px;		
}

.foot{
	position:fixed;
	bottom:0;
	z-index:2;
	width:100%;
	height:50px;
	background-image:url(/images/foot.gif);
	background-position:50% 100%;
	background-repeat:no-repeat;
}
.foot p{
	text-align:center;
	color:#FFFFFF;
	background-color:#838383;
}
#wwc{
	font-family:"Acknowledge BRK",Verdana,sans-serif;
	font-size:18px;
	padding-top:5px;
	padding-right:5px;
	float:right;	
}
#hse div.outer div{
	width:757px;
}

h1, h2, h3{
	font-family:"Acknowledge BRK",Verdana,sans-serif;
	text-align:center;
}
h1{
	font-size:56px;
	color:#BD736A;
	text-shadow: #8B4131 0px 4px 0px; /*, #8B4131 0px 2px 8px;*/
	margin:18px 1px;
}
h2{
	font-size:50px;
	color:#ACACAC;
	text-shadow: #000000 0px 4px 0px;
	margin:18px 0;
}
h3{
	font-size:45px;
	color:#838383;
	text-shadow: #000000 0px 4px 0px;
	margin:18px 0;
}

#hse input{
	font-family:"Volter",Verdana,sans-serif;
	font-size:18px;
	padding:5px 5px 5px 5px;
	margin:2px;
}

#hse input[type=text]{
	width:80px;
	text-transform: lowercase;
	color:#FFFFFF;
	background:#525252;
}

#hse input[type=password], #hse input.admin{
	text-transform: lowercase;
	color:#D5DE73;
	background:#8B4131;
}

#hse div.stats{
	width:757px;
}

#hse div.stats div div.results{
	width:350px;
	margin:0 auto 24px auto;
	background:#525252;
	border:#000000 3px solid;
}

#hse div.ctrls{
	width:382px !important;
	height:100px;	
	margin:0 auto 16px auto;
}

#hse div.stats div p{	
	text-align:center;	
}
#hse table.stat{
	width:350px;	
}
#hse table.stat td{
     padding: 2px 10px;   
}
#hse .err{
	color:#D5DE73 !important;
	background-color:#8B4131;	
}
#hse .ok{
	color:#D5DE73 !important;
	background-color:#6AAC41;	
}
/*
#hse .highlight{
	color:#D5DE73 !important;
	text-shadow: 
	#BD736A -1px 0 1px,
	#BD736A -1px -1px 1px,
	#BD736A 0 -1px 1px,
	#BD736A 1px -1px 1px,
	#BD736A 1px 0 1px,
	#BD736A 1px 1px 1px,
	#BD736A 0 1px 1px,
	#BD736A -1px 1px 1px;
}*/

#hse .stat.beaten{
	color:#FFFFFF;
	background-color:#838383;	
}

#hse .stat{
	color:#FFFFFF;
	background-color:#525252;
}

#hse .good input[type=text]{
	color:#ACEE8B;
	background-color:#6AAC41;	
}

#hse input[type=text].good{
	color:#ACEE8B;
	background-color:#6AAC41;	
}

#hse .bad input[type=text]{
	color:#BD736A;
	background-color:#8B4131;
}

#hse input[type=text].bad{
	color:#BD736A;
	background-color:#8B4131;
}

/*
#hse input[type=submit]:hover{
	position:releative;
	margin-top:4px;
	border-bottom:none;
	background:#D5DE73;
	color:#945A20;
	-webkit-appearance: none;
}

#hse input[type=submit]{
	position:absolute;
	border-bottom:#000000 4px solid;
	font-family:"Acknowledge BRK",Verdana,sans-serif;
	font-size:31px;
	background:#ACACAC;
	color:#525252;
	-webkit-appearance: none;
}*/

#hse div.highscores div{
	width:196px;
	padding:32px 0 0 0;
	margin:0;
	float:left;
	border:#000000 2px solid;
}

#hse table.clear{
	background:transparent !important;
	width:670px;
	margin:0 auto;
}

#hse div.highscores table table{
	width:196px;
}
#hse div.highscores table table tr.sep td{
	height:2px;
	padding:0;
	background:#838383;
}
#hse div.highscores table table td{
	padding:2px;
	background:#525252;
}

/*
#hse div.highscores table table tr.odd{
	background:#525252;	
}
#hse div.highscores table table tr.even{
	background:#838383;	
}
*/

#hse div.highscores table p{
	width:196px;
	text-align:center;
	background:#000000;
	color:#FFFFFF;	
}
#hse table.score td{
	font-size:9px;
	color:#FFFFFF;
}
tr.highlight td{
	color:#FFFFFF !important;
	background-color:#838383 !important;
	/*
	color:#D5DE73 !important;
	text-shadow: #8B4131 -2px -2px 0px, #8B4131 0px -2px 0px, #8B4131 2px -2px 0px, #8B4131 2px 0px 0px, #8B4131 2px 2px 0px, #8B4131 0px 2px 0px, #8B4131 -2px 2px 0px, #8B4131 -2px 0px 0px;
	*/	
}

.level1{
	background-image:url(/images/level1score.bmp);
	background-repeat:repeat;
	background-position:0 0;	
}

.level2{
	background-image:url(/images/level2score.bmp);
	background-repeat:repeat;
	background-position:0 0;	
}

.level3{
	background-image:url(/images/level3score.bmp);
	background-repeat:repeat;
	background-position:0 0;	
}

.level4{
	background-image:url(/images/level4score.bmp);
	background-repeat:repeat;
	background-position:0 0;	
}

.level5{
	background-image:url(/images/level5score.bmp);
	background-repeat:repeat;
	background-position:0 0;	
}

.level6{
	background-image:url(/images/level6score.bmp);
	background-repeat:repeat;
	background-position:0 0;	
}

/* sliding doors buttons */
.clear { /* generic container (i.e. div) for floating buttons */
    overflow: hidden;
    width: 100%;
}

a.button {
    background: transparent url(/images/btn_rt.gif) no-repeat scroll top right;
    color: #FFFFFF;
    display: block;
    float: left;
    font-family:"Volter",Verdana,sans-serif;
	font-size:18px;
    height: 44px;
    margin-right: 6px;
    padding-right: 18px; /* sliding doors padding */
    text-decoration: none;
}

a.button span {
    background: transparent url(/images/btn_lt.gif) no-repeat;
    display: block;
    line-height: 34px;
    padding: 5px 0 5px 18px;
}
a.button:hover {
    background: transparent url(/images/btn_rt_.gif) no-repeat scroll top right;
}

a.button:hover span {
    background: transparent url(/images/btn_lt_.gif) no-repeat;
    padding: 9px 0 1px 18px;
    color:#000000;
}

a.btn {
    background: transparent url(/images/btns_rt.gif) no-repeat scroll top right;
    color: #FFFFFF;
    display: inline-block;
    font-family:"Volter",Verdana,sans-serif;
	font-size:18px;
    height: 44px;
    margin: -5px 6px 0 0;
    padding-right: 18px; /* sliding doors padding */
    text-decoration: none;
}

a.btn span {
    background: transparent url(/images/btns_lt.gif) no-repeat;
    display: block;
    line-height: 34px;
    padding: 5px 0 5px 18px;
}

a.btn.h1, a.btn.h1:hover{
	background-position: 100% -44px;
	text-shadow: 0 1px 0 #000000;
}
a.btn.h1 span, a.btn.h1:hover span{
	background-position: 0 -44px;
}

.btn.h2, .btn.h2:hover{
	background-position: 100% -88px;
	text-shadow: 0 1px 0 #000000, 0 2px 0 #000000;
}
.btn.h2 span, .btn.h2:hover span{
	background-position: 0 -88px;
}
.btn.h3, .btn.h3:hover{
	background-position: 100% -132px;
	text-shadow: 0 1px 0 #000000, 0 2px 0 #000000, 0 3px 0 #000000;
}
.btn.h3 span, .btn.h3:hover span{
	background-position: 0 -132px;
}

#sbblogo{
	position:relative;
    background-image:url(/images/sbb.gif);
    background-repeat:no-repeat;
    background-position:20px 0;
    width:260px;
    top:-45px;
    left:0px;
    height:140px;
    z-index:9999;
    text-indent:-9999px;
}
#topbar{
    position:absolute;
    width:100%;
    height:30px;
    top:50px;
    left:0;
    padding:5px 0 5px;
    background:#000000;
    z-index:3;   
}
#topbar ul{
	display:block;
	width:720px;
	height:30px;
	margin: 0 auto;
}
#topbar ul, #topbar li{
    list-style:none;
}
#topbar li{
    font-family:"Acknowledge BRK",Verdana,sans-serif;
    font-size:30px;
    float:left;
    padding-right:27px;
    color:#FFFFFF;
}
#topbar a{
	color:#FFFFFF;	
}
.textbox{
	border-radius:15px;
	color:#FFFFFF; 
	background-color:#525252; 
	padding:40px 40px 40px 40px; 
	margin:40px auto 40px auto;
	width:570px !important;
}
.lighttextbox{
	border-radius:15px;
	color:#FFFFFF;
	background-color:#838383;
	padding:40px 40px 40px 40px;
	margin:40px auto 40px auto;
	width:570px !important;
}
.admintextbox{
	border-radius:15px;
	color:#FFFFFF;
    border:#8B4131 8px solid;
	background-color:#838383;
	padding:40px 40px 40px 40px;
	margin:40px auto 40px auto;
	width:570px !important;
}
/* @end */