@import url(color.css);
@import url(typography.css);

/* Normalization */
body,div,dl,dt,dd,form,fieldset,input,blockquote,h1,h2,h3,h4,h5,h6,p,ul,ol,li
{margin:0; padding: 0;}

h1,h2,h3,h4,h5,h6
{font-size: 100%;}

ol, ul
{list-style: none;}

fieldset,img
{border:0;}

/* Layout */
html{
text-align: center;
height: 100%;
}

body{
position: relative;
width: 100%;
margin: 0 auto;
text-align: left;
height: 100%;
}

div#wrapper{
width: 900px;
margin: 0 auto;
}

h1#branding{
position: relative;
width: 100%;
height: 160px;
text-indent: -9999px;
}

div#content{
position: relative;
margin: 0 auto;
min-height: 100%;
top: 10px;
}

* html div#content{
height: 100%;
}

div#content_main{
width: 620px;
position: relative;
padding: 0;
min-height: 800px;
left: -1000px;
}

div#content_sub{
width: 280px;
position: absolute;
top: 0;
right: 0;
margin: 0;
}

/* User Profile Box */

div#user_info{
position: absolute;
top: 12px;
right: 4px;
width: 246px;
height: 60px;
background: #fef9a8;
border: 2px solid #feda12;
padding: 5px;
color: #06086d;
}

div#user_info h4#username{
font-size: 220%;
line-height: .7;
}

div#user_info p#userrank{
position: absolute;
top: 26px;
}

div#user_info ul{
position: absolute;
top: 48px;
left: 2px;
}

div#user_info li{
float: left;
font-size: 80%;
}

div#user_info a {
color: #45c;
padding: 2px;
}

div#user_info li a:hover {
color: #ffe;
background: #06086d;
}

div#user_info li#login{
display: none;
}

div#user_info .avatar{
width: 60px;
}

ul#main_nav{
position: absolute;
top: -53px;
left: 0px;
margin: 0 auto;
height: 25px;
width: 100%;
}

ul#main_nav li{
float: left;
width: 150px;
text-align: center;
position: relative;
}

ul#main_nav li a{
display: block;
height: 20px;
width: 100%;
text-decoration: none;
}

ul#main_nav li ul.subnav{
width: 500px;
position: absolute;
height: 20px;
font-size: 70%;
top: 23px;
display: none;
}

ul#main_nav li ul.subnav li{
float: left;
display: block;
height: 18px;
border-top: 1px solid #feda12;
}

div#site_info{
position: relative;
clear: both;
height: 51px;
width: 100%;
padding: 27px 0;
margin: 100px auto 0;
}

/* A CSS hack that only applies to IE -- specifies a different offset for the site_info */

* html div#site_info
{
margin-top: 1.1em;
}

div#site_info img{
position: absolute;
top: -70px;
}

div#site_info p{
margin-left: 130px;
}

.avatar{
width: 50px;
position: absolute;
top: 5px;
margin: 0 5px;
right: 0;
}

div#news_box, div.side_box{
position: relative;
margin: 140px 0 -70px 15px;
background: #026;
width: 260px;
}

div#news_box ul, div.side_box ul{
list-style: circle;
margin: 10px 35px;
}

div#news_box h3, div.side_box h3{
margin: 5px;
border-bottom: 1px solid;
}

div#news_box a, div.side_box a{
color: #eff;
}

div#news_box a:hover, div.side_box a:hover{
border-bottom: 1px solid;
color: #eff;
}

div#ad_sub1{
background: #333;
width: 250px;
margin: 85px 15px;
border: 5px solid #026;
}

img.mask_icon{
width: 16px;
height: 16px;
border: none;
position: relative;
top:3px;
left: -2px;
}