/**********************************\
  IMPORTS
\**********************************/
@import "/sites/playerportal/modules/asmselect/css/jquery.asmselect.css";


/**********************************\
  GENERAL HTML ELEMENT STYLES
\**********************************/

body, img, p, h1, h2, h3, h4, h5, h6, ul, ol, table, tr, th, td {
  margin:               0;
  padding:              0;
  list-style:           none;
  border:               none;
}

body {
  margin:               0 auto 10px auto;
  font-family:          Verdana, Helvetica, sans-serif;
  color:                #ffffff;
  background:           #000000 url( ../images/layout/page-bg.jpg ) top repeat-x;
}

a {
  text-decoration:      none;
}

a:hover {
  text-decoration:      underline;
}


/**********************************\
  PAGE LAYOUT STYLES
\**********************************/

#page {
  position:             relative;
  width:                960px;
  margin:               0 auto;
}

#page_top {
  height:               235px;
}

#user-links {
  padding:              5px 20px;
  height:               15px;
  text-align:           right;
  font-size:            0.7em;
}

.flag {
  vertical-align:       middle;
  margin:               0 2px;
}

#logo {
  z-index:              11;
  position:             absolute;
  left:                 -4;
  top:                  5px;
}

#header {
  position:             relative;
  height:               112px;
  margin-top:           74px;
  background-image:     url( ../images/layout/menu-bg.png );
  background-position:  bottom center;
  background-repeat:    no-repeat;
  background-color:     none;
}

#search {
  position:             absolute;
  right:                21px;
  top:                  12px;
  height:               32px;
  width:                335px;
}

#search_button {
  float:                right;
  margin-top:           1px;
}

#search_text {
  font-size:            0.7em;
  width:                140px;
  height:               13px;
}

#advanced_search_choice {
  position:             absolute;
  font-size:            0.6em;
  top:                  27px;
  left:                 0;
  z-index:              20;
}

#search_type {
  font-size:            0.7em;
  width:                130px;
  margin:               7px 0 0 4px;
}

#main-menu {
  position:             relative;
  width:                860px;
  height:               25px;
  top:                  59px;
  margin:               0 0 0 23px;
  float:                left;
}

#favorites-menu {
  position:             relative;
  top:                  59px;
  margin:               0 10px 0 0;
  float:                right;
  cursor:               pointer;
}

#favorites-menu .tab_center {
  height:               24px;
  padding:              1px 2px 0 2px;
}

#user-links .navbar-menu {
  display:              inline;
  float:                none;
  background:           none;
  cursor:               pointer;
}

#user-links a {
  color:                #ffffff;
  display:              inline;
}

#user-links .navbar-menu a {
  padding-right:        1.5em;
}

#user-links .navbar-menu .sf-sub-indicator {
  right:                0.2em;
}

#user-links .navbar-menu img {
  vertical-align:       top;
  margin-top:           5px;
}

#user-links .navbar-menu ul {
  margin-top:           -10px;
}

#user-links .navbar-menu li {
  display:              inline;
  float:                none;
  text-align:           left;
}

#user-links .navbar-menu li li {
  display:              block;
}

#colors_control {
  position:             relative;
  top:                  59px;
  margin:               0 5px 0 0;
  float:                right;
  cursor:               pointer;
}

#colors_control .tab_center {
  height:               24px;
  padding:              1px 2px 0 2px;
}

#breadcrumbs {
  height:               24px;
  margin:               0 4px;
}

#breadcrumbs_end_left {
  float:                left;
}

#breadcrumbs_end_right {
  float:                right;
}

#breadcrumbs_content {
  height:               21px;
  margin:               0 3px;
  background-image:     url( ../images/layout/breadcrumb-bar-bg.png );
  font-size:            0.7em;
  padding:              5px 0 0 5px;
}

#content_bg_left {
  margin:               0 4px;
  background-image:     url( ../images/layout/content-border-left.png );
  background-position:  left;
  background-repeat:    repeat-y;
}

#content_bg_right {
  background-image:     url( ../images/layout/content-border-right.png );
  background-position:  right;
  background-repeat:    repeat-y;
}

#content {
  position:             relative;
  margin:               0 3px;
  background-image:     url( ../images/layout/content-bg.png );
}

#noscript_error {
  font-size:            13px;
}

#content_footer {
  margin:               0 4px;
  height:               50px;
  background-image:     url( ../images/layout/content-bottom.png );
  background-position:  top center;
  background-repeat:    none;
}

#content_padding {
  padding:              0 10px;
}

#color-picker-dialog {
  display:              none;
}

#legal {
  font-size:            0.6em;
  color:                #666666;
}

#legal-links {
  text-align:           center;
  margin:               10px 0 20px 0;
}

#legal-links a {
  color:                #666666;
}

#legal img {
  display:              block;
  margin:               auto;
}

#legal-copy {
  text-align:           justify;
  margin:               20px 0;
}

.colorpicker {
  z-index:              1100;
}

#color-buttons {
  text-align:           right;
  padding:              5px;
}

.color_selector {
  position:             relative;
  height:               36px;
  width:                36px;
  background-image:     url( ../../colorpicker/images/select2.png );
}

.color_selector div {
  position:             absolute;
  top:                  3px;
  left:                 3px;
  width:                30px;
  height:               30px;
  background-image:     url( ../../colorpicker/images/select2.png );
  background-position:  center;
}

.color_swatch {
  position:             relative;
  height:               22px;
  width:                32px;
  background:           url( ../images/misc/color-swatch.png ) 50% 50%;
}

.color_swatch div {
  position:             absolute;
  left:                 5px;
  top:                  5px;
  height:               12px;
  width:                22px;
  background-image:     url( ../images/misc/color-swatch.png );
  background-position:  50% 50%;
}

.error-msg {
  padding:              20px 40px;
  font-size:            1.2em;
}

.error-msg .ui-state-error, .error-msg .ui-state-highlight {
  padding:              10px;
}

.error-msg p.details {
  margin-top:           10px;
}

#debug-console {
  margin:               10px 20px;
}

#debug {
  padding:              10px;
}

ul.tabs li {
  float:                left;
}

#widget-body ul {
  padding-left:         1em;
  text-indent:          -1em;
}


/**********************************\
  WIDGET STYLES
\**********************************/

.widget {
  width:                100%;
}

.widget-wrapper {
  padding-top:          10px;
}

.widget-head {
  font-weight:          bold;
  text-align:           center;
  padding:              3px;
  height:               18px;
}

.widget-head .icon-wrapper {
  float:                right;
  cursor:               pointer;
  margin-left:          3px;
}

.widget-body, .widget-control {
  position:             relative;
  padding:              5px;
}

.widget-control {
  display:              none;
}

.ui-widget-content {
  border-top:           none;
}


/**********************************\
  PAGINATION STYLES
\**********************************/

.pagination {
  font-size:            0.8em;
  font-weight:          bold;
  height:               16px;
}

.pagination table {
  float:                right;
}

.pagination td {
  padding:              0 2px;
}

/**********************************\
  GRADIENT TABLE STYLES
\**********************************/

.gradient_table {
  width:                100%;
  border-collapse:      collapse;
  font-size:            0.85em;
}

.gradient_table, .gradient_table td, .gradient_table th {
  border-width:         1px;
  border-style:         solid;
  border-collapse:      collapse;
  padding:              4px 5px;
  text-align:           center;
}

.gradient_table td, .gradient_table th {
  background-image:     url( ../images/misc/td_bg.png );
  background-position:  bottom;
  background-repeat:    repeat-x;
}

.gradient_table th img {
  vertical-align:       top;
  margin-top:           5px;
}



/**********************************\
  SORTABLE TABLE STYLES
\**********************************/

.filters {
  font-weight:          bold;
  margin:               10px 0;
}

.filter_body {
  font-weight:          normal;
  padding-left:         20px;
}


/**********************************\
  TOOLTIP STYLES
\**********************************/

.basic-tooltip {
  display:              none;
  border-style:         solid;
  border-width:         1px;
}


/**********************************\
  STAT LIST TABLES
\**********************************/

table.statlist {
  width:                100%;
}

table.statlist th {
  text-align:           left;
  font-size:            0.6em;
}

table.statlist td {
  text-align:           right;
  font-size:            0.6em;
}



/**********************************\
  SUPERFISH MENU STYLES
\**********************************/

/*** ESSENTIAL STYLES ***/
.navbar-menu, .navbar-menu * {
  margin:     0;
  padding:    0;
  list-style:   none;
}
.navbar-menu {
  line-height:  1.0;
}
.navbar-menu ul {
  position:   absolute;
  top:      -999em;
  width:      10em; /* left offset of submenus need to match (see below) */
}
.navbar-menu ul li {
  width:      100%;
}
.navbar-menu li:hover {
  visibility:   inherit; /* fixes IE7 'sticky bug' */
}
.navbar-menu li {
  float:      left;
  position:   relative;
}
.navbar-menu a {
  display:    block;
  position:   relative;
}
.navbar-menu.left-cascade li:hover ul,
.navbar-menu.left-cascade li.sfHover ul {
  left:     0;
  top:      2.5em; /* match top ul list item height */
  z-index:    99;
}
.navbar-menu.right-cascade li:hover ul,
.navbar-menu.right-cascade li.sfHover ul {
  right:      5px;
  top:        25px; /* match top ul list item height */
  z-index:    99;
}

ul.navbar-menu li:hover li ul,
ul.navbar-menu li.sfHover li ul {
  top:      -999em;
}
ul.navbar-menu li li:hover ul,
ul.navbar-menu li li.sfHover ul {
  left:     10em; /* match ul width */
  top:      0;
}
ul.navbar-menu li li:hover li ul,
ul.navbar-menu li li.sfHover li ul {
  top:      -999em;
}
ul.navbar-menu li li li:hover ul,
ul.navbar-menu li li li.sfHover ul {
  left:     10em; /* match ul width */
  top:      0;
}


/*** SUPERFISH MENU DEMO SKIN ***/
.sf-navbar {
}

.navbar-menu {
  float:                left;
  font-size:            11px;
}

.navbar-menu li {
}

.tab_right {
  background-image:     url( ../images/layout/tab-off-right.png );
  background-position:  right;
  background-repeat:    no-repeat;
}

.tab_left {
  background-image:     url( ../images/layout/tab-off-left.png );
  background-position:  left;
  background-repeat:    no-repeat;
}

.tab_center {
  background-image:     url( ../images/layout/tab-off-center.png );
  height:               17px;
  margin:               0 4px;
  padding:              8px 5px 0 5px;
}

.on .tab_right, li:hover.on .tab_right {
  background-image:     url( ../images/layout/tab-on-right.png );
  background-position:  right;
  background-repeat:    no-repeat;
}

.on .tab_left, li:hover.on .tab_left {
  background-image:     url( ../images/layout/tab-on-left.png );
  background-position:  left;
  background-repeat:    no-repeat;
}

.on .tab_center, li:hover.on .tab_center {
  background-image:     url( ../images/layout/tab-on-center.png );
  height:               17px;
  margin:               0 4px;
  padding:              8px 5px 0 5px;
}

li:hover .tab_right {
  background-image:     url( ../images/layout/tab-over-right.png );
  background-position:  right;
  background-repeat:    no-repeat;
}

li:hover .tab_left {
  background-image:     url( ../images/layout/tab-over-left.png );
  background-position:  left;
  background-repeat:    no-repeat;
}

li:hover .tab_center {
  background-image:     url( ../images/layout/tab-over-center.png );
  height:               17px;
  margin:               0 4px;
  padding:              8px 5px 0 5px;
}

.navbar-menu a {
  text-decoration:      none;
}

.navbar-menu li {
  cursor:               pointer;
}

.navbar-menu li li {
  background:   none;
  padding: 5px 5px 0 5px;
}

.navbar-menu li li li, #favorites-menu li li, #charSelect li li {
  padding: 5px 5px;
  background-image: url( ../images/layout/submenu-bg.png );
  background-position: top;
  background-repeat: repeat-x;
  border-width: 0 1px 1px 1px;
  border-style: solid;
}

.navbar-menu li:hover, .navbar-menu li.sfHover,
.navbar-menu a:focus, .navbar-menu a:hover, .navbar-menu a:active {
  outline:    0;
}

.navbar-menu li li:hover {
  background: url( ../images/layout/menu-hover-bg.png ) top left no-repeat;
}

.navbar-menu li li li:hover {
  background-image: url( ../images/layout/submenu-bg.png );
}

/*** arrows **/
.navbar-menu a.sf-with-ul {
  padding-right:  2.25em;
  min-width:    1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
  position:   absolute;
  display:    block;
  right:      .75em;
  top:        1.05em; /* IE6 only */
  width:      10px;
  height:     10px;
  text-indent:  -999em;
  overflow:   hidden;
  background:   url('../../superfish/images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}

a > .sf-sub-indicator {  /* give all except IE6 the correct values */
  top:      1px;
  background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
  background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.navbar-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.navbar-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.navbar-menu ul a:focus > .sf-sub-indicator,
.navbar-menu ul a:hover > .sf-sub-indicator,
.navbar-menu ul a:active > .sf-sub-indicator,
.navbar-menu ul li:hover > a > .sf-sub-indicator,
.navbar-menu ul li.sfHover > a > .sf-sub-indicator {
  background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
  background: url('../../superfish/images/shadow.png') no-repeat bottom right;
  padding: 0 8px 9px 0;
}
.sf-shadow ul.sf-shadow-off {
  background: transparent;
}

.navbar-menu .firstlevel {
  width: 200px;
}

/*** jhodge: override width ***/
.navbar-menu ul {
  width:      175px; /* left offset of submenus need to match (see below) */
}
ul.navbar-menu li li:hover ul,
ul.navbar-menu li li.sfHover ul {
  left:     175px; /* match ul width */
}
ul.navbar-menu li li li:hover ul,
ul.navbar-menu li li li.sfHover ul {
  left:     175px !important; /* match ul width */
  top:      0 !important;
}







/*** adding the class sf-navbar in addition to navbar-menu creates an all-horizontal nav-bar menu ***/
.sf-navbar {
  position:   relative;
}
.sf-navbar li {
  position:   static;
}
.sf-navbar a {
  border-top:   none;
}
.sf-navbar li ul {
  width:      914px; /*IE6 needs this*/
}
.sf-navbar li li {
  position:   relative;
}
.sf-navbar li li ul {
  width:      175px;
}
.sf-navbar li li li {
  width:      100%;
}
.sf-navbar ul li {
  width:      auto;
  float:      left;
}

.sf-navbar a, .sf-navbar a:visited {
  border:     none;
}
.sf-navbar li.current {
}
.sf-navbar li:hover,
.sf-navbar li.sfHover,
.sf-navbar li li.current,
.sf-navbar a:focus, .sf-navbar a:hover, .sf-navbar a:active {
}
.sf-navbar ul li:hover,
.sf-navbar ul li.sfHover,
ul.sf-navbar ul li:hover li,
ul.sf-navbar ul li.sfHover li,
.sf-navbar ul a:focus, .sf-navbar ul a:hover, .sf-navbar ul a:active {
}
ul.sf-navbar li li li:hover,
ul.sf-navbar li li li.sfHover,
.sf-navbar li li.current li.current,
.sf-navbar ul li li a:focus, .sf-navbar ul li li a:hover, .sf-navbar ul li li a:active {
}
ul.sf-navbar .current ul,
ul.sf-navbar ul li:hover ul,
ul.sf-navbar ul li.sfHover ul {
  left:     0;
  top:      25px; /* match top ul list item height */
}
ul.sf-navbar .current ul ul {
  top:      -999em;
}

.sf-navbar li li.current > a {
  font-weight:  bold;
}

/*** point all arrows down ***/
/* point right for anchors in subs */
.sf-navbar ul .sf-sub-indicator { background-position: -10px -100px; }
.sf-navbar ul a > .sf-sub-indicator { background-position: 0 -100px; }
/* apply hovers to modern browsers */
.sf-navbar ul a:focus > .sf-sub-indicator,
.sf-navbar ul a:hover > .sf-sub-indicator,
.sf-navbar ul a:active > .sf-sub-indicator,
.sf-navbar ul li:hover > a > .sf-sub-indicator,
.sf-navbar ul li.sfHover > a > .sf-sub-indicator {
  background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/*** remove shadow on first submenu ***/
.sf-navbar > li > ul {
  background: transparent;
  padding: 0;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-topright: 0;
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
}


/**********************************\
  GOOGLE SEARCH STYLES
\**********************************/
.gsc-adBlock, .gsc-adBlockVertical {
  display: none !important;
}

a.gs-title, .gs-result .gs-title, .gs-result .gs-title * {
  color: #FFCC00 !important;
  text-decoration: none !important;
}

a.gs-title:hover {
  text-decoration: underline !important;
}

.gs-result a.gs-visibleUrl, .gs-result .gs-visibleUrl {
  color: #FFF !important;
  font-weight: bold;
}

.gsc-thinWrapper {
  float: none !important;
  overflow: inherit !important;
  width: 100% !important;
}

.gsc-results .gsc-cursor-box .gsc-cursor-current-page {
  color: #FC0 !important;
}

.gsc-results .gsc-cursor-box .gsc-cursor-page {
  color: #FC0 !important;
  text-decoration: none !important;
}


/**********************************\
  FORUM STYLES
\**********************************/

.postbit .posthead, .postbitlegacy .posthead, .eventbit .eventhead, .forumhead, .wgo_block h2, .threadlisthead, .thread_info h4, 
.headline, .category_headline {
  background-image:     url( ../images/layout/header-bg.png );
  background-position:  center bottom;
  background-repeat:    repeat-x;
}

/*
 * , .postrow
 * -Removed from this list for now, so maybe I can use it in quotes instead of the posts
 */ 
.forumhead + .childforum .L2:first-child .forumrow, .forumhead + .L2 .forumrow, .forumbit_nopost .forumbit_nopost .forumrow, 
.forumbit_post .forumrow, .wgo_block .wgo_subblock, .wgo_subblock, .thread_info_block, .info_subblock,
.postbit .userinfo, .postbit .userinfo_noavatar, .threadbit .sticky, .threadbit .nonsticky, .threadbit .deleted,
.postbit .postfoot, .postbitlegacy .postfoot, .eventbit .eventfoot, .forum_info_block, .forum_info_form_block, .post {
  background-image:     url( ../images/layout/content-bg.png );
  background-position:  center bottom;
  /*background-repeat:    repeat-x;*/
}

.bbcode_container div.bbcode_quote {
  background-image:     url( ../images/layout/content-bg.png );
}

#announcement_box {
  padding-top: 10px;
  padding-bottom: 10px;
}

/* Top gradient for content areas */
/* , #above_threadlist, #above_postlist  */
.postbody .postrow {
  background:  url( ../images/layout/content-bg-gradtop.png ) top left repeat-x;
}

/**********************************\
  ADMIN NAME DISPLAY STYLES
\**********************************/

DIV.bluename {
  position:      relative;
}

DIV.bluename .icon {
  width:        25px;
  height:       24px;
  background:   url( ../images/misc/bluename/left.png ) no-repeat 0 0;
  /*
  border:       1px solid red;
  position:     relative;
  top:          0px;
  left:         0px;
  */
}

DIV.bluename .content {
  height:       24px;
  background:   url( ../images/misc/bluename/middle.png ) repeat-x 0 0;
 
 
  position:     absolute;
  top:          0px;
  left:         24px;
  
  /*border:       1px solid blue;*/
}

DIV.bluename .content DIV.admin_name {
  height:        24px;
  background:     url( ../images/misc/bluename/right.png ) no-repeat top right;
  padding-top:    6px;
  padding-left:   2px;
  padding-right:  10px;

}

DIV.bluename .right {
  width:        6px;
  height:       24px;
  background:   url( ../images/misc/bluename/right.png ) no-repeat 0 0;
  /*
  border:       1px solid green;
  position:     relative;
  top:          0px;
  left:        0px;
  */
}

/**********************************\
  PASSWORD STRENGTH STYLES
\**********************************/

#strength_meter
{
  display: block;
  float: left;
  width: 38px;
  height: 33px;
  background-image: url( ../images/misc/strength_meter.png );
}

.weak_password
{
  background-position: 0 -66px;
  color: #c82a2a;
}

.medium_password
{
  background-position: 0 -33px;
  color: #e39204;
}

.strong_password
{
  background-position: 0px 0px;
  color: #55ab0f;
}

div.strength_meter
{
  display: block;
  width: 215px;
}

div.strength_meter div
{
  float: left;
  margin-left: 5px;
  width: 170px;
  font: 11px 'Courier New', sans-serif;
  color: #6e6e6e;
}