/*****************************************************************************\
  FONTS
\*****************************************************************************/

  @import url( "fonts.css" );

/*****************************************************************************\
  CSS RESET
\*****************************************************************************/

  html, body, div, span, object, iframe,
  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  abbr, address, cite, code,
  del, dfn, em, img, ins, kbd, q, samp,
  small, strong, sub, sup, var,
  b, i, dl, dt, dd, ol, ul, li,
  fieldset, form, label, legend,
  table, caption, tbody, tfoot, thead, tr, th, td,
  article, aside, canvas, details, figcaption, figure,
  footer, header, hgroup, menu, nav, section, summary,
  time, mark, audio, video
  {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background-color: transparent;
  }

  body { line-height: 1; }

  article, aside, details, figcaption, figure, footer,
  header, hgroup, menu, nav, section { display: block; }

  nav ul { list-style: none; }

  blockquote, q { quotes: none; }

  blockquote:before, blockquote:after, q:before, q:after
  {
    content: '';
    content: none;
  }

  table
  {
    border-collapse: collapse;
    border-spacing: 0;
  }

  input, select { vertical-align: middle; }

  html, body { min-height: 100%; }

  a { outline: 0; }


/*****************************************************************************\
  GENERAL/UTILITY STYLES
\*****************************************************************************/

  .clear
  {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
    line-height: 0;
    font-size: 0;
  }

  .clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
  .clearfix:after { clear: both; }
  .clearfix { zoom: 1; }

  a.img
  {
    text-align: left;
    text-indent: -9999px;
    overflow: hidden;
  }

  h2.title
  {
    font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
    font-weight: normal;
    text-transform: uppercase;
    margin: 0;
    padding: 0;
    font-size: 24px;
  }

  a.more
  {
    display: block;
    font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
    text-transform: uppercase;
    font-size: 18px;
  }


/*****************************************************************************\
  MAIN LAYOUT
\*****************************************************************************/

  body
  {
    height: 100%;
    position: relative;
    font-family: Verdana;
    font-size: 11px;
  }

  #page_bottom
  {
    width: 100%;
    min-height: 282px;
    clear: both;
  }

  #logo
  {
    display: block;
    margin: 0 auto 0 auto;
    width: 300px;
    height: 180px;
  }

  .centered_container_980
  {
      width: 980px;
      margin-left: auto;
      margin-right: auto;
      position: relative;
  }

  h3.title
  {
    font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
    font-weight: normal;
    text-transform: uppercase;
    margin: 0;
    padding: 0;
    font-size: 18px;
  }

  a.more
  {
    display: block;
    font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
    text-transform: uppercase;
    font-size: 18px;
  }

  #officebat_messages
  {
    position: absolute;
    top: 50px;
    left: 150px;
    height: 150px;
    width: 200px;
  border: solid 1px blue;
  }

  #officebat_messages .rotatorpane
  {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    height: 150px;
    width: 200px;
    overflow: hidden;
    background: #aaaaaa;
  }

  #main_menu .gci_logo {
  	background: url( ../images/main_menu/logo_sm.png ) center 4px no-repeat;
    width:166px;
    height:88px;
  }

/*****************************************************************************\
  ADMIN MENU
\*****************************************************************************/

  #admin {
    padding: 8px;
    background: #333;
  }

  #admin_links {
    width: 980px;
    margin: auto;
    color: #ffffff;
  }

  #admin_links .pages {
    float: right;
  }

  #admin_links .views {
    float: left;
  }

  #admin_callout {
    color: #ffffff;
    background: #cc0000;
    text-align: center;
    text-transform: uppercase;
    font-size: 24px;
    padding: 5px;
  }


/*****************************************************************************\
  HOMEPAGE CONTENT
\*****************************************************************************/

  #homepage_content
  {
    min-height: 1350px;
  }

  .homepage_container
  {
    display: block;
    position: absolute;
  }

  #download_container
  {
    top: 35px;
    left: 8px;
    height: 355px;
    width: 212px;
    padding: 0 5px;
  }

  #news_container
  {
    top: 442px;
    left: 8px;
    height: 480px;
    width: 212px;
    padding: 0 5px;
  }
  
  #match_container
  {
    top: 936px;
    left: 8px;
    height: 376px;
    width: 198px;
    padding-left: 9px;
    padding-right: 9px;
  }

  #video_container
  {
    position: relative;
    top: 0;
    left: 112px;
    height: 465px;
    width: 725px;
  }

  .video_player
  {
    margin: 24px 0 0 24px;
  }

  .video_player .player
  {
    display: none;
  }

  .video_player .player.active
  {
    display: block;
  }

  #moviedetails .details
  {
    display: none;
  }

  #moviedetails .details.active
  {
    display: block;
  }

  #noflash
  {
    display: none;
  }
  
  #carousel_container
  {
    top: 38px;
    left: 277px;
    height: 544px;
    width: 670px;
  }

  #gallery_container
  {
    display: none;
    top: 514px;
    left: 263px;
    height: 208px;
    width: 695px;
  }

  #social_container
  {
    top: 620px;
    left: 328px;
    height: 533px;
    width: 557px;
  }

  a.video_link
  {
    display: block;
    width: 677px;
    height: 352px;
    margin: 24px 0 0 24px;
    position: relative;
  }

  a.video_link span
  {
    display: block;
    width: 677px;
    height: 352px;
    position: absolute;
  }

  a.video_link img
  {
    display: block;
    position: absolute;
  }

  #news_container a.more
  {
    width: 55px;
    height: 22px;
    font-size: 18px;
    line-height: 20px;
    text-indent: 4px;
  }

  #news_container a.next
  {
    float: right;
  }

  #news_container a.prev
  {
    float: left;
  }

  #gallery_container h2.title, #social_container h2.title
  {
    font-size: 30px;
    line-height: 30px;
  }

  #video_container h2.title
  {
    font-size: 48px;
    line-height: 48px;
    padding: 5px 0 0 23px;
  }

  #video_container div.text
  {
    padding: 0 0 0 23px;
    float: left;
    width: 550px;
  }

  #video_container a.more
  {
    display: block;
    width: 100px;
    height: 23px;
    float: right;
    font-size: 18px;
    padding: 4px 0 0 8px;
    margin: -4px 18px 0 0;
  }

  #gallery_container h2.title { padding: 14px 0 0 30px; }
  #social_container h2.title { padding: 12px 0 0 25px; }

  #captionTemplate { display: none; }

  .rss_link
  {
    background: url( ../images/rss.png ) top left no-repeat;
    width: 16px;
    height: 16px;
    display: block;
  }

  #news_container .rss_link, #match_container .rss_link
  {
    position: absolute;
    right: 10px;
    top: 5px;
  }

  .article_content .rss_link
  {
    position: absolute;
    right: 23px;
    top: 28px;
  }


/*****************************************************************************\
  HOMEPAGE NEWS
\*****************************************************************************/

  ul#news_viewer, ul#news_viewer_articlepage
  {
    display: block;
    height: 405px;
    width: 205px;
    overflow: hidden;
    margin-bottom: 5px;
  }

  ul#news_viewer_articlepage {
    height: 680px;
  }
  
  ul#news_viewer li, ul#news_viewer_articlepage li
  {
    margin-bottom: 5px;
    display: block;
    height: 131px;
    width: 9999px;
    height: 135px;
    position: relative;
  }

  ul#news_viewer li a.news_item, ul#news_viewer_articlepage li a.news_item
  {
    display: block;
    height: 131px;
    width: 205px;
    float: left;
    margin-right: 1px;
    font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
    position: relative;
  }

  a.news_item span.title
  {
    font-size: 18px;
    display: block;
    padding: 3px 5px 5px 8px;
  }

  a.news_item:hover img
  {
    opacity: 1;
  }

  a.news_item span.date
  {
    font-size: 14px;
    display: block;
    padding: 4px 0 0 8px;
    width: 197px;
    height: 18px;
    position: absolute;
    bottom: 0;
  }
    
/*****************************************************************************\
  SOCIAL PANEL
\*****************************************************************************/

  div#social_container a
  {
    font-size: 30px;
    font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
    text-decoration: none;
    text-transform: uppercase;
  }

  div#social_container div#facebook
  {
    position: absolute;
    overflow: hidden;
    left: 22px;
    top: 67px;
    height: 221px;
    width: 279px;
  }

  div#social_container div#facebook iframe
  {
    width: 300px;
    height: 250px;
    margin: -5px 0 0 -5px;
    border: none;
    overflow: hidden;
  }

  div#social_container a.twitter
  {
    position: absolute;
    left: 325px;
    top: 64px;
    height: 85px;
    padding: 5px 0 0 0;
    width: 220px;
    text-align: center;
  }

  div#social_container a.youtube
  {
    position: absolute;
    left: 327px;
    top: 162px;
    height: 140px;
    padding: 10px 0 0 0;
    width: 208px;
    text-align: center;
  }

  div#social_container a.community_forums
  {
    position: absolute;
    left: 321px;
    height: 150px;
    width: 224px;
    top: 336px;
    text-align: center;
    font-size: 92px;
    font-family: 'AlternateGothicFSNo1', Impact, Charcoal, sans-serif;
    line-height: 63px;
  }

  div#social_container a.community_forums span
  {
    font-size: 68px;
  }


/*****************************************************************************\
  POLAROID GALLERY
\*****************************************************************************/

  #polaroids
  {
    list-style: none;
    margin: -3px 0 0 22px;
    padding: 0;
    height: 149px;
  }

  #polaroids li
  {
    float: left;
    margin-right: -5px;
  }

  #polaroids li a
  {
    display: block;
    float: left;
    width: 134px;
    height: 149px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
  }

  #polaroids li a img
  {
    display: block;
    position: absolute;
    top: 12px;
    left: 12px;
    border: 0;
  }

  #polaroids li a span
  {
    background-repeat: no-repeat;
    background-position: 0px 0px;
    display: block;
    width: 134px;
    height: 149px;
    position: absolute;
  }


/*****************************************************************************\
  NEWS PAGE
\*****************************************************************************/

  #news_content
  {
    min-height: 950px;
    padding-top: 20px;
  }

  #news_archive
  {
    left: -24px;
    top: -25px;
    width: 270px;
    height: 778px;
    position: absolute;
  }

  #news_content #news_container
  {
    display: block;
    position: absolute;
    top: 35px;
    left: 32px;
    height: 735px;
    width: 206px;
    padding-left: 5px;
    padding-right: 5px;
  }

  #article_container
  {
    margin-left: 238px;
    margin-top: 26px;
    width: 746px;
  }

  .article_content
  {
    padding: 10px;
  }

  .article_content .title
  {
    display: block;
    border-bottom: solid 1px black;
  }

  .article_content .date
  {
    display: block;
    margin: 5px 0 0 0;
  }

  .article_content .body
  {
    display: block;
    margin-top: 20px;
    font-size: 14px;
    line-height: 1.3em;
  }
  .article_content a, .flex_background .article_content ul a{
    color: #8A0206;
    font-weight: bold;
    text-decoration: underline;
  }
  .article_content a:hover, .flex_background .article_content ul a:hover{
    color: #E1050C;
  }
  .article_content h3, .article_content h4, .article_content h5, .article_content h6 {
    line-height: 1.1;
    margin: 0 0 1em;
  }
  .article_content h3 {
    font-size: 1.3em;
  }
  .article_content h4 {
    font-size: 1.2em;
  }
  .article_content h5 {
    font-size: 1.1em;
  }
  .article_content h6 {
    font-size: 1em;
  }

  .article_content p
  {
    margin-bottom: 20px;
  }

  .article_content ul, .article_content ol {
    padding-left: 30px;
    margin-bottom: 20px;
  }

  #full_page_content #article_container
  {
    margin-top: 26px;
    width: 985px;
    margin-left: 0px;
  }



/*****************************************************************************\
  TOOLTIPS
\*****************************************************************************/

  .infoTip { position: relative; }

  .infoTip .tooltip
  {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 30;
    display: none;
    background: #333;
    color: #ffffff;
    padding: 16px;
    width: 252px;
    font: 11px/14px Verdana, sans-serif;
    text-indent: 0px;
    border-top: 1px solid #555;
    border-bottom: 1px solid #000;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-box-shadow: -1px 1px 6px #000, inset 0px 0px 30px #111;
    -webkit-box-shadow: -1px 1px 6px #000, inset 0px 0px 30px #111;
    box-shadow: -1px 1px 6px #000, inset 0px 0px 30px #111;
    text-transform: none;
    text-decoration: none;
    width: 165px;
  }

/*****************************************************************************\
  INTERSTITIAL POPUP
\*****************************************************************************/

  #interstitial_content
  {
    position: absolute;
    display: none;
    z-index: 1200;
  }

  #interstitial_overlay
  {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1100;
    display: none;
    background-color: #777;
  }


/*****************************************************************************\
  PRIVATE MESSAGING
\*****************************************************************************/

  #messaging_outer_container
  {

  }

  .messaging_inner_container
  {
    padding: 20px;
  }

  #pm_content_box
  {
    background: none repeat scroll 0 0 #FFFFFF;
  }

  #loading
  {
    display: none;
    text-align: center;
    width: 100%;
  }

  .pmreturnto, #folderActionBar
  {
    background: none repeat scroll 0 0 #EDEDED;
  }

  .pmreturntolink
  {
    margin-left: 10px;
    padding-top: 8px;
  }

  .pmreadbar { margin: 0 10px; }

  .pmreadbar table, .pmtable { width: 100%; }

  .pmreadbar table td.move, td.pmtableright { text-align: right; }

  .pmreadbar table td, .pmreadbar table th { white-space: nowrap; vertical-align: middle; }

  #createFolder
  {
    margin-bottom: 10px;
    margin-top: 10px;
  }

  #folderForm
  {
    margin-top: 10px;
    padding-bottom: 15px;
    text-align: center;
    width: 100%;
  }

  #folderActionBar
  {
    padding-left: 5px;
    padding-right: 5px;
  }

  #folderSelector
  {
    margin-bottom: 5px;
    margin-top: 5px;
    padding-top: 15px;
    text-align: right;
    width: 99%;
  }

  #moveFolder
  {
    float: right;
    padding-top: 5px;
  }

  #folderActions { padding-top: 5px; }

  #folderContents
  {
    margin-left: 4px;
    margin-right: 4px;
    padding-bottom: 15px;
  }

  #folderContents table
  {
    border-collapse: collapse;
    width: 100%;
  }

  #folderContents table td, #folderContents table th { border-bottom: 1px solid #D3D3D3; }

  #folderContents table tbody tr:hover { background: none repeat scroll 0 0 #EDEDED; }

  #folderContents table tbody tr.marked { background: none repeat scroll 0 0 #FEF2F2; }

  th.folderMessageCheckbox, td.folderMessageCheckbox { text-align: right; }

  #originalMessageDetails
  {
    padding: 15px;
  }

  #originalMessageDetails .avatar
  {
    float: left;
    margin-right: 10px;
  }

  #originalMessageDetails .userAndSubject { padding-top: 7px; }

  #originalMessageDetails .messageDateTime
  {
    float: right;
    margin-right: 6px;
  }

  #originalMessageText
  {
    border-top: 1px solid #D3D3D3;
    clear: both;
    margin-bottom: 20px;
  }

  #originalMessageText blockquote
  {
    padding: 15px;
  }

  .messageType
  {
    border-bottom: 1px solid #D3D3D3;
    margin-left: 4px;
    margin-right: 4px;
    margin-top: 10px;
  }

  .messageTypeText
  {
    margin-bottom: 5px;
    margin-left: 10px;
  }

  #composeMessage
  {
    margin-left: 70px;
    margin-right: 70px;
    margin-top: 10px;
  }

  .richEditor { margin-top: 10px; }

  .submitMessage
  {
    margin-bottom: 15px;
    margin-top: 5px;
    padding-bottom: 15px;
    text-align: right;
  }

  .pagination
  {
    margin-bottom: 10px;
    padding-bottom: 15px;
  }

  dl.pagination {
  	width: 100%;
  }

  .pagination table
  {
    margin-left: auto;
    margin-right: 4px;
  }

  .noMessages
  {
    font-weight: bold;
    text-align: center;
  }

  .responsedialog { display: none; }

  #infomsg { text-align: center; margin-top: 20px; }

/*****************************************************************************\
  CHARACTER GALLERY
\*****************************************************************************/

  #character_grid_outer_container
  {
    width: 960px;
    margin: 0 auto;
  }

  #character_grid_inner_container
  {

  }

  .character_grid
  {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .character_grid li
  {
    float: left;
  }

  .character_grid li a
  {

  }

  .character_grid li a img
  {
    border: 0;
  }

/*****************************************************************************\
  MEDIA GALLERY
\*****************************************************************************/

  #media_grid_outer_container
  {
    width: 960px;
    margin: 0 auto;
  }

  #media_grid_inner_container
  {

  }

  .media_grid
  {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .media_grid li
  {
    float: left;
  }

  .media_grid li a
  {

  }

  .media_grid li a img
  {
    border: 0;
  }


/*****************************************************************************\
  DEVMODE OUTPUT
\*****************************************************************************/

  .devmode_error
  {
    width: 980px;
    margin: auto;
    background: #fbfbfa;
    padding: 10px;
    border: solid 2px #a1022b;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-box-shadow: -1px 1px 6px #000;
    -webkit-box-shadow: -1px 1px 6px #000;
    box-shadow: -1px 1px 6px #000;
  }

  .devmode_error .heading
  {
    font-size: 16px;
    display: block;
    font-weight: bold;
    margin-bottom: 10px;
  }

  .devmode_error .error_message, .devmode_error .exception
  {
    display: block;
    margin-left: 10px;
    margin-top: 10px;
  }

  .devmode_error .label
  {
    font-weight: bold;
  }

  .exception table
  {
    margin-left: 10px;
  }

  .exception th, .exception td
  {
    padding: 5px 0;
  }

  .exception tr
  {
    border-bottom: solid 1px #d5d5d4;
  }

  .exception th
  {
    font-weight: bold;
    text-align: left;
    width: 75px;
  }

  .exception td
  {
    white-space: pre-wrap;
  }

/*****************************************************************************\
  GAME PLAY
\*****************************************************************************/
  .gameplay h1,
  .gameplay h2,
  .gameplay h3,
  .gameplay ul,
  .gameplay th,
  .match_viewer th,
  .gameplay .board_pagination {
  	font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
    font-weight: normal;
    text-transform: uppercase;
  }

  .gameplay ul{
    list-style:none;
  }

  .board_selection {
  	width:290px;
  	float:left;
    font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
    font-weight: normal;
    margin-top:-60px;
  }

  .board {
  	width:636px;
  	float:left;
  }

  .board_selection input {
  	display:block;
  }

  #board_preface, #single_column_preface {
  font-family: 'AlternateGothicFSNo3', Impact, Charcoal, sans-serif;
  }


  #board_preface h1, #single_column_preface h1 {
  	position:relative;
  	float:left;
    top:15px;
    left:-20px;
  }

  #board_preface span.board_title_text, #single_column_preface span.board_title_text {
  	float:left;
  }

  .board_selection .platform_choice li {
    float:left;
  }

  .board {
  	margin:-62px 20px 0 20px;
  }

  .board_header {
  	position:relative;
  }

  .board_header h2 {
    padding:43px 0 0 40px;
    margin-right:30px;
  }

  .board_header span.board_help {
  	float:right;
    width:25px;
    height:25px;
  }

  /*TODO: next set could be positioned better*/
 .board_header ul {
    position: relative;
    top:34px;
    left:32px;
    font-size:20px;
  }

 .board_header li {
    float:left;
    padding: 0 12px;
  }

 .board_header li:first-child {
    padding-left: 0;
    border-left: none;
  }

  .gameplay .board_roster,
  .gameplay .board_pagination {
    padding:20px 24px 0 24px;
  }

/* table styles */

  .board_roster table {
    width:100%;
    border-collapse:separate;
    font-family: Verdana, sans-serif;
  }

  .board_roster td,
  .board_roster th {
    border:1px solid #1e1e1e;
    padding:6px;
  }

/* ad */

  .advert {
  	width:251px;
    margin:18px;
    font-family: 'AlternateGothicFSNo1', Impact, Charcoal, sans-serif;
  }

  .advert_content,
  .advert_content span {
  	display:block;
    text-align:center;
  }

/* pagination */



/*****************************************************************************\
  CALLING CARDS
\*****************************************************************************/

/* general */

#calling_card_container {
  position: relative;
}

#compare_card_container {
  position: relative;
}

.calling_card {
  position: absolute;
  width: 217px;
  height: 329px;
  left: 0;
  top: 0;
}

/* stat display */

ul.calling_card_stats {
  color: #e7e1cf;
  font-size: 24px;
  margin: 0;
  text-transform: uppercase;
  list-style-type: none;
}

.calling_card_stats li {
  background-color: #000;
  margin-bottom: 6px;
  display: table; /* for vertically aligning contents middle */
}

.calling_card_stats li .label, .calling_card_stats li .value {
  display: table-cell; vertical-align: middle; /* for vertically aligning contents middle */
  padding: 8px;
}

.calling_card_stats li .label {
  background-color: #171a1b;
  border: 1px solid #2e3234;
}

.calling_card_stats .level .value {
  font-size: 68px;
  color: #fff;
  padding: 0 6px 4px 6px;
}

.calling_card_stats .level .value:after {
  content:" ]";
  color: #394043;
}

.calling_card_stats .level .value:before {
  content:"[ ";
  color: #394043;
}

.calling_card_stats .nemesis .label {
  line-height: 24px;
  padding-bottom: 12px;
}

.calling_card_stats .nemesis .label span  {
  color: #fc5f21;
  font-size: 38px;
  display: block;
}

.calling_card_stats .nemesis .value {
  color: #67d9ff;
}

.calling_card_stats .emblem .value div,
.calling_card_stats .prestige .value div {
  color: #fff;
  font-size: 30px;
}

.calling_card_stats .emblem .value,
.calling_card_stats .prestige .value {
  font-size: 18px;
}

.calling_card_stats .emblem .label,
.calling_card_stats .prestige .label {
  width: 44px;
  height: 64px;
  background-repeat: no-repeat;
  background-position: center;
  padding-top: 0;
  padding-bottom: 0;
}

/* compare cards */

.compared_card {
  left: auto;
  right: 0;
}

.calling_card_vs {
  width: 118px;
  height: 220px;
  margin: 0 auto;
  text-align: left;
  text-indent: -9999px;
  overflow: hidden;
}

.calling_card .prestige,
.calling_card .emblem,
.calling_card .emblem-card {
  background-repeat: no-repeat;
  width: 96px;
  height: 96px;
}

.calling_card .emblem,
.calling_card .emblem-card {
  position: absolute;
  top: 0;
  left: 0;
}

.calling_card .prestige {
  position: absolute;
  bottom: 25px;
  left: 0;
}

.calling_card .prestige_level {
  display: block;
  position: absolute;
}

.calling_card .prestige_level span {
  display: none;
}


/*****************************************************************************\
  MATCH VIEWER
\*****************************************************************************/

.match_viewer {
	padding-left:54px;
  padding-right:54px;
  margin-top:-36px;
}

.match_viewer table {
  margin-top:12px;
}
  
.board_match_header {
	float:left;
}
  
.callout {
  float:right;
  width:227px;
  height:95px;
  margin-bottom:6px
}



/*****************************************************************************\
  MATCH MAP
\*****************************************************************************/

#match-map {
  height: 600px;
  overflow: hidden;
  position: relative;
  clear: both;
  margin-bottom:14px;
}

  
#match-map-tooltip {
  position: absolute;
  left: 5px;
  top: 5px;
  z-index: 100;
  display: block;
  white-space: nowrap;
  background: url( ../images/match/tt-bg.png );
  color: white;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  padding: 6px;
  width: 275px;
}

#match-map-tooltip table {
  margin: 0;
  table-layout: auto;
}

#match-map-tooltip table th {
  width: 50px;
}

#match-map-tooltip table td {
  width: 150px;
}

#match-map-unavailable {
  display: none;
  width: 880px;
  height: 600px;
  position: absolute;
}

#match-map-unavailable span {
  background: url( ../images/match/tt-bg.png );
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  padding: 6px;
  width: 275px;
}

.match-map-invalid #match-map-unavailable {
  display: block;
  z-index: 10;
}

.match-map-invalid #match-map-tooltip {
  display: none;
}

#match-map-canvas {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
}

#match-map-image-container {
  position: absolute;
  left: 0;
  top: 0;
}

#match-map-image-container.map-small {
  width: 880px;
  height: 880px;
}

#match-map-image-container.map-large {
  width: 2048px;
  height: 2048px;
}

.map-image {
  display: block;
}

.map-icon {
  position: absolute;
  display: block;
  width: 20px;
  height: 20px;
}

.map-icon.team-1.type-kill {
  background: url( ../images/match/icon_sprite_nemeses.png ) -1px -1px no-repeat;
}

.map-icon.team-1.type-death {
  background: url( ../images/match/icon_sprite_nemeses.png ) -22px -1px no-repeat;
}

.map-icon.team-0.type-kill {
  background: url( ../images/match/icon_sprite_nemeses.png ) -43px -1px no-repeat;
}

.map-icon.team-0.type-death {
  background: url( ../images/match/icon_sprite_nemeses.png ) -64px -1px no-repeat;
}

.map-icon.team-1.type-kill.on {
  background: url( ../images/match/icon_sprite_nemeses.png ) -1px -22px no-repeat;
}

.map-icon.team-1.type-death.on {
  background: url( ../images/match/icon_sprite_nemeses.png ) -22px -22px no-repeat;
}

.map-icon.team-0.type-kill.on {
  background: url( ../images/match/icon_sprite_nemeses.png ) -43px -22px no-repeat;
}

.map-icon.team-0.type-death.on {
  background: url( ../images/match/icon_sprite_nemeses.png ) -64px -22px no-repeat;
}

#match-map-image-container .tooltip {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  display: block;
  white-space: nowrap;
  background: url( ../images/match/tt-bg.png );
  color: white;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  padding: 3px;
}

#match-map-controls {
  clear: both;
}

#match-map-controls-filters {
  float: left;
}

#match-map-controls form * {
  vertical-align: middle;
}

#match-map-controls select {
  width: 200px;
  margin: 0 0 0 8px;
  text-transform: uppercase;
  height: 22px;
}

#match-map-controls input[type=checkbox] {
  margin: 0 4px 0 10px;
}

#match-map-replay-play {
  display: block;
}

#match-map-replay-stop {
  display: block;
  display: none;
}

#match-map-timer {
  float:left;
  text-align:right;
}