@charset "utf-8";
/*reset*/
html,body,div,span,h1,h2,h3,h4,h5,h6,ul,ol,li,p,blockquote,a,small,strike,strong,em,sub,sup,font,img,ins,dl,dt,dd,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {border:0;padding:0;margin:0;outline:0;vertical-align:baseline;}
body {line-height:1;}
li {list-style:none;}
/*reset*/


body {background:#000e21 url(../img/bg.jpg) center top repeat-x; color:#fff; font:14px/18px "Trebuchet MS", Arial, sans-serif;}

#wrapper {
	margin:0 auto;
	padding:0 8px 0 8px;
	position:relative;
	width:982px;
	z-index:10;
}
	
a {color:#2e80bf; text-decoration:underline;}
a:hover {color:#2e80bf;}

p {margin-bottom:18px;}

h1, h2, h3 {margin-bottom:18px}
h1 {color:#f8f8f8; font:24px/18px "Trebuchet MS", Arial, sans-serif; font-weight: bold;}
h1 span {padding-left:30px; margin-left:18px;}
h1 .Protoss {background:url(../img/protoss-ico.png) no-repeat center left;}
h1 .Zerg {background:url(../img/zerg-ico.png) no-repeat center left;}
h1 .Terran {background:url(../img/terran-ico.png) no-repeat center left;}
h1 .Random {background:url(../img/random-ico.png) no-repeat center left;}

h2 {color:#f8f8f8;font:18px/18px "Trebuchet MS", Arial, Helvetica, sans-serif;font-weight: bold;margin-left:-68px;margin-bottom:9px;}


/*-----------------HEADER-----------------*/
#header {height:198px;	position:relative;	width:982px; z-index:1000;}
#logo {left:-12px;	position:relative;	top:25px;}


#auth {
	background: url(../img/auth-bg.png) no-repeat;
	position:absolute;
	right:0;
	top:21px;
	width:315px;
}
#auth-bttm {
	background:url(../img/auth-bttm-bg.png) bottom left no-repeat;
	bottom:-17px;
	padding:0 12px 2px 12px;
	position:relative;
}
#auth p {margin-bottom:14px;}
#auth label {display:block; float:left; width:65px;}
#LoginForm_username, #LoginForm_password {width:218px;}
#auth #auth-btn-cont {float:right; margin:-36px 1px 0 0;}
#rem {width: 135px; margin-left:61px;}
#rem label {width:110px; float:right;}
#rem input {}

.in #auth-bttm #hello {font-size:14px;}
.in #auth-bttm p {font-size:12px;margin-bottom:0;}
.in #auth-bttm form {margin:14px 0 14px 0;}

#follow-us {left:0;	position:absolute; top:140px;}
	
/*-----------------HEADER-----------------*/




/*-----------------MAIN-----------------*/
#main {min-height:600px;}
#index #main {position:relative;}
/*#inner #main {margin-top:54px;}*/

/*error page*/
#error-main {
	background:url(../img/errorpage.png) no-repeat center top;
	height:880px;
	margin-top:-100px;
	position:relative;
	z-index:0;
}
#errortext {
	color:#00d2ff;
	font:14px/18px Arial, Helvetica, sans-serif;
	left:355px;
	position:absolute;
	text-align:center;
	top:390px;
	width:260px;
}
#ups {font-size:24px; margin-bottom:36px;}
#numer {font-size:48px; margin-bottom:36px;}
/*error page*/


/*index*/
#about {margin:0 0 54px 0; position:relative;}
#screens {margin:54px 0 0 -13px; vertical-align:top; width:1026px;}
#screens a {text-decoration:none; vertical-align:top;}
#screens a span {color:#fff; display:block;	margin-left:22px;}
#about p {width:563px; font:16px/24px Tahoma, Geneva, sans-serif;}
#about a {
	background:url(../img/screen-bg.png) no-repeat;
	display:inline-block;
	height:256px;
	margin-left:-9px;
	position:relative;
	width:342px;
}
#about a:hover {background:url(../img/screen-bg-h.png) no-repeat;}
#about div img{display:block; margin:27px 0 18px 27px;}
#about #go-reg {
	background:url(../img/reg.png) no-repeat;
	color:#eee;
	display:block;
	font:26px/36px Arial, Helvetica, sans-serif;
	height:96px;
	padding:53px 0 0 53px;
	position:absolute;
	right:-36px;
	text-decoration:none;
	top:-36px;
	width:324px;
}
#about #go-reg:hover {color:fff; background:url(../img/reg-h.png) no-repeat; text-shadow:#069 1px 1px 3px;}
#reg-form {
	background:#000e21;
	border:1px #09F solid;
	display:none;
	left:303px;
	padding:18px 18px 6px 18px;
	position:absolute;
	top:350px;
	width:336px;
}
#reg-form p {width:310px; margin-left:10px;}
#reg-form label { display:block; padding-bottom:5px; }
#reg-mail, #reg-pass, #reg-url {width:310px;}
#close {text-decoration:none; top:8px; right:6px; position:absolute; width:16px; height:16px; background:url(../img/close.png) no-repeat;}
#reg-form .example, .inner-reg .example {font-size:10px; width:310px; margin-top:-12px; line-height:12px; color:#bbb;}
.errorMessage {color:#F60; font-size:10px; margin-top:-14px; margin-bottom:10px;}

#news {margin:126px 0 0 -17px; position:relative;}
.news-item {
	display:inline-block;
	width:314px;
	margin-left:16px;
	vertical-align:top;
}
.news-date {color:#4d5764; margin-bottom:7px;}
#hrono {
	bottom:-18px;
	font-family: Arial, sans-serif;
	position:absolute;
	right:0;
	text-decoration:none;
}
#hrono span{font-family:"Trebuchet MS", Arial, sans-serif; text-decoration: underline;}
#inner-news {margin-top:18px;}
#inner-news .news-item {
	display:block;
	width:auto;
	margin:0 0 0 0;
}
#inner-news .news-date {margin-bottom:0;}
/*index*/


/*inner*/
.inner-reg {width:336px; padding:18px 18px 6px 0;}

.profile {margin-top:36px;}
.profile label {
	display:inline-block;
	width:140px;
	margin-right:8px;
	text-align:right;
}
.profile input {width:210px;}
.profile #save {width:150px; margin-left:147px;}
/*inner*/


/*stat*/
#game-types {
	height:90px;
	margin-bottom:36px;
	margin-left:-13px;
}

.game-type {
	display:inline-block;
	font-size:12px;
	height:90px;
	margin-left:13px;
	padding-left:75px;
	position:relative;
	vertical-align:top;
	width:156px;
}
.game-type img{left:9px; position: absolute; top:30px;}

.rate, .games {float:right; margin-right:10px;}
.games {color:#0287c1;}
.wins {color:#03ae53;}

.progress {
	background:url(../img/progress.png) no-repeat;
	width:148px;
	height:18px;
	position:relative;
	overflow:hidden;
}
.progress p {
	background:url(../img/progress-green.png) no-repeat top right;
	position:absolute;
	top:0;
	left:8px;
	width:10px;
	height:18px;
	padding-right:8px;
	text-align: right;
	text-shadow: #050 1px 1px 2px;
}
.progress span{
	background:url(../img/progress-left.png) no-repeat;
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:8px;
	height:17px;
}

.empty {background:url(../img/empty.png) no-repeat 10px 30px;}



#graph {
	background: url(../img/graph-form-bg.png) no-repeat;
	width:955px;
	height:33px;
	padding:11px 12px 0 12px;
	margin-bottom:54px;
}
#graph form {margin-left:-34px;}
#graph label {padding-right:3px;}
#graph p {padding-left:36px; display:inline;}
#g-type select {width:100px;}
#g-map select {width:210px;}
#g-date input {width:120px;}
#g-btn {width:84px;}

#share-buttons {
	background: url(../img/graph-form-bg.png) no-repeat;
	height:36px;
	width:979px;
	padding-top:8px;
	margin-top:54px;
	position:relative;
}
.vk, .fb, .bz, .tw {margin-bottom:9px; position:absolute; top:11px;}
.vk {left:10px; }
.tw {left:160px;}
.fb {left:310px;}
.bz {left:460px;top:9px;}
/*stat*/
/*-----------------MAIN-----------------*/




/*-----------------FOOTER-----------------*/
#footer{
	border-top:1px solid #022048;
	color:#033470;
	height:44px;
	margin-top:36px;
	padding-top:9px;
	position:relative;
}
#footer, #footer a {color:#033470;}
#footer a {
	position:absolute;
	right:0;
	text-decoration:none;
	top:9px;
}
/*-----------------FOOTER-----------------*/



