/*=====================================================
// Version  : 1.0
// Project  : City of Outlaws
//=====================================================*/



/* -------- html tag reset & clearfix -------- */
body,div,dl,dt,dd,ul,ol,li,h1,
h2,h3,h4,h4,h6,pre,form,fieldset,
input,textarea,p,blockquote,th,td       { margin: 0; padding: 0; }
table                                   { border-collapse: collapse; border-spacing: 0; }
fieldset,img                            { border: 0; vertical-align: bottom; }
a,h1                                    { overflow: hidden; }
address,caption,cite,code,ol,ul         { list-style: none; }
caption,th                              { text-align: left; }
h1,h2,h3,h4,h4,h6                       { font-size: 100%; font-weight: normal; overflow: hidden; }
q:before,q:after                        { content: ''; }
abbr,acronym                            { border: 0;}
.clear:after                            { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clear                                  { display: inline-block; }
html[xmlns] .clear                      { display: block; }
* html .clear                           { height: 1%; }
body                                    { font-family: verdana,tahoma,sans-serif; font-size: 12px; color: #000; text-align: center; background: transparent url(../images/bg.jpg) repeat; }
h1                                      { display: none; }

/* -------- Main Page */
#containerMain                          { width: 900px; height: 1000px; background: transparent url(../images/containerMain-bg.jpg) repeat; margin: 0 auto; position: relative; text-align: left; }
#containerMain #stats                   { color: #e5e5e5; font-size: 10px;  padding: 55px 0 0 385px; }
#stats li                               { float: left; }
#stats span                             { padding: 0 8px; }
#menu                                   { clear: both; padding: 61px 0 0 100px; height: 29px; }
#menu li                                { float: left; }
#menu a                                 { color: #676767; text-decoration: none; font-size: 11px; display: block; width: 87px; height: 22px; text-align: center; padding: 7px 0 0 0; }
#menu a:hover                           { text-decoration: underline; color: #a4a4a4; }
#active                                 { background: transparent url(../images/hover-bg.jpg) no-repeat; width: 87px; height: 29px; font-weight: bold; color: #fff !important; }
#active:hover                           { text-decoration: none !important; }
#contest                                {  clear: both; width: 330px; height: 197px; float: left; padding: 41px 0 0 127px; }
#contest img                            { width: 330px; height: 197px; }
#loginForm                              { width: 330px; height: 197px; float: left; padding: 60px 0 0 40px; }
#loginForm div                          { margin: 0 0 10px 0; }
#username,#password                     { background: transparent url(../images/input-bg.jpg) no-repeat; width: 241px; height: 21px; border: 0; font-size: 11px; color: #787878; font-weight: bold; padding: 5px 0 0 5px; }
#loginForm label                        { display: block; font-size: 10px; color: #868686; padding: 0 0 5px 0; }
#remember                               { width: 15px; height: 15px; float: left; }
#rememberLabel                          { float: left; margin: 0 0 0 5px; }
#forgot                                 { font-size: 10px; color: #868686; position: relative; top: -3px; left: 35px; }
#registerBtn                            { margin: 0 0 0 60px; }
#registerBtn img                        { position: relative; top: -2px; }
#loginBtn                               { margin: 0 0 0 5px; }
#mainText                               { clear: both; width: 430px; text-align: center; font-size: 11px; color: #747474; line-height: 22px; padding: 40px 0 0 220px; }
#screenshots                            { padding: 70px 0 0 115px; }
#screenshots h2                         { color: #717171; font-size: 13px; font-weight: bold; padding: 0 0 10px 0; }
#screenshots img                        { margin: 0 15px 0 0; }
#containerMain #menuBottom              { padding: 42px 0 60px 120px; }
#menuBottom li                          { float: left; color: #646464; }
#menuBottom a                           { color: #646464; font-size: 11px; text-decoration: none; }
#menuBottom a:hover                     { color: #fff; text-decoration: underline; }
#menuBottom span                        { padding: 0 10px; }
#copyright                              { clear: both; color: #757575; font-size: 11px; padding: 0 0 0 88px; }


/* -------- Sub Page */
#containerSub                           { width: 1024px;  background: transparent url(../images/containerSub-bg.jpg) no-repeat; margin: 0 auto; position: relative; text-align: left; padding: 0 0 20px 0; }
#containerSub #stats                    { color: #e5e5e5; font-size: 10px;  padding: 55px 0 0 510px; }
#bars                                   { padding: 25px 0 0 145px; }
#bars li                                { float: left; color: #d9d9d9; font-size: 10px; padding: 0 10px 0 0; }
#bars b                                 { color: #fff; }
#content                                { width: 844px; background: transparent url(../images/contentSub-bg.jpg) repeat-y; margin: 40px 0 0 87px; }
#sidebar                                { float: left; margin: 0 0 0 40px; display: inline; }
#sidebar h2                             { width: 217px; height: 25px; background: transparent url(../images/column-head.jpg) no-repeat; font-weight: bold; color: #d2d1d1; padding: 8px 0 0 10px; }
#profile                                { background: #343434; border: 1px solid #4e4e4e; width: 227px; margin: 0 0 20px 0; }
#profile img                            { float: left; width: 80px; height: 80px; margin: 5px 0 0 10px; }
#profile ul                             { float: left; color: #d9d9d9; font-size: 12px; padding: 5px 0 10px 10px; }
#profile li                             { margin: 0 0 3px 0; }
#profile b                              { color: #fff; }
#profile span                           { color: #fff; }
#navigation                             { background: #343434; border: 1px solid #4e4e4e; width: 225px; }
#navigation li a                        { display: block; width: 200px; height: 22px; background: transparent url(../images/list-normal.jpg) no-repeat; font-size: 13px; color: #d2d1d1; text-decoration: none; padding: 8px 0 0 25px; }
#navigation li a:hover                  { background: transparent url(../images/list-hover.jpg) no-repeat; text-decoration: underline; color: #fff; }
#navActive                              { background: transparent url(../images/list-active.jpg) no-repeat !important; font-weight: bold !important; color: #fff !important; }
#navigation1                             { background: #343434; border: 1px solid #4e4e4e; width: 152px; }
#navigation1 li a                        { display: block; width: 152px; height: 22px; background: transparent url(../images/list-normal1.jpg) no-repeat; font-size: 11px; color: #d2d1d1; text-decoration: none; padding: 8px 0 0 25px; }
#navigation1 li a:hover                  { background: transparent url(../images/list-hover1.jpg) no-repeat; text-decoration: underline; color: #fff; }
#navActive                              { background: transparent url(../images/list-active1.jpg) no-repeat !important; font-weight: bold !important; color: #fff !important; }
#panel                                  { float: left; padding: 0 0 0 28px; }
#panel h2                               { width: 507px; height: 25px; background: transparent url(../images/panel-head.jpg) no-repeat; font-weight: bold; color: #d2d1d1; padding: 8px 0 0 10px; }
#upgrade                                { background: #343434; border: 1px solid #4e4e4e; width: 517px; margin: 0 0 20px 0; }
#upgrade .inner                         { padding: 10px; }
#upgrade .darkbox                       { background: #232323; border: 1px solid #616161; width: 470px; margin: 20px 0 10px 12px; }
#respected                              { text-align: center; display: block; color: #fff; text-decoration: none; width: 250px; font-size: 11px; margin: 0 auto; }
#respected b                            { padding: 0 0 8px 0; display: block; }
#upgrade ul                             { font-size: 12px; color: #d9d9d9; list-style: disc; padding: 10px 0 10px 30px; }
#upgrade li                             { padding: 0 0 10px 0; }
.info                                   { background: #343434; border: 1px solid #4e4e4e; width: 517px; margin: 0 0 20px 0; }
.info .darkbox                          { background: #232323; border: 1px solid #616161; width: 470px; }
.info .inner                            { padding: 15px 0 15px 22px; }
.info ul                                { float: left; font-weight: bold; font-size: 12px; color: #fff; }
.info li span                           { font-weight: normal; color: #d2d1d1; }
.info li a                              { color: #fff; }
.info li                                { padding: 0 0 12px 0; }
.gen1                                   {  padding: 10px 0 0 20px; }
.gen2                                   { margin: 6px 0 0 35px; background: transparent url(../images/line.jpg) repeat-y top left; padding: 0 0 0 25px; }
.gen3                                   { margin: 6px 0 0 35px; background: transparent url(../images/line.jpg) repeat-y top left; padding: 0 0 0 25px; }
.stats2                                 { margin:  6px 15px 0 45px; }
.record                                 { background: #343434; border: 1px solid #4e4e4e; width: 517px; margin: 0 0 20px 0; font-size: 10px; color: #fff; }
.record .darkbox                        { background: #232323; border: 1px solid #616161; width: 470px; }
.record .inner                          { padding: 15px 0 15px 22px; }
.record ul                              { padding: 15px 0 5px 20px; }
.record li                              { padding: 0 0 10px 0; }
#attacking                              { color: #ff4747; }
#defending                              { color: #c8e818; }
#both                                   { color: #16e0e2; }

.notepad                                { background: #343434; border: 1px solid #4e4e4e; width: 517px; margin: 0 0 20px 0; font-size: 12px; color: #fff; }
.notepad .inner                         { padding: 15px 0 15px 15px; }
#notepadText                            { width: 446px; height: 125px; background: transparent url(../images/note-bg.jpg) no-repeat; border: 0; color: #888888; padding: 20px; overflow: hidden; }
#notepadText1                            { background: transparent url(../images/note-bg1.jpg) no-repeat; border: 0; color: #888888; padding: 20px;  }
#noteBtn                                { margin: 0 0 0 355px; }


#footer                                 { width: 844px; height: 57px; background: transparent url(../images/footer.jpg) no-repeat;  margin: 0 0 20px 87px; }
#containerSub #menuBottom               { padding: 30px 0 0 30px; }