/* * * * * * * * * * * * * * * * * * *\
*  Master Server Web Interface        *
*  A website by Darkelarious          *
*  See COPYING for additional details *
*  on re-use.                         *
\* * * * * * * * * * * * * * * * * * */

/* Theme classic written by Darkelarious */

/*** Global ***/
* {
    margin: 0;
    padding: 0;
    border: 0;
    outline:0;
    }
    
body { 
    text-align: center;
    height: 100%;
    color: #ccc;
    font-family: 'Verdana';
    font-size: 10pt;
    background: #222 url(/style/default/body.gif) repeat center top fixed;
    }

p {
    margin-bottom:12pt;
    }
    
a, a:visited {
    text-decoration: none;
    color: #0af;
    }
    
a:hover {
    color: #ff0;
    text-decoration: none;
    }

#body {
    text-align: left; 
    width: 900px; 
    margin: 0 auto; 
    min-height: 100%; 
    padding-top:80px;
    background: url(/style/default/333networks.png) no-repeat center 15px fixed;
    }
    
#footer {
    padding: 90px 0 40px 0;
    text-align:center;
    font-size : x-small;
    clear:both
    }

#footer a {
    text-decoration: underline;
    }


/* mainboxes */
div.mainbox {
    border: 1px solid #0af;
    margin: 21px 0 -10px 0;
    padding: 5px;
    background: #333;
    }

div.mainbox h1, 
div.mainbox h2,
div.mainbox h3 {
    margin: -5px 0 10px 0; 
    text-decoration: none;
    font-family: Tahoma;
    font-weight: normal;
    font-size: 16pt;
    color: #0af;
    }

div.mainbox h2 {
    margin: 5px 0 5px 5px; 
    font-size: 12pt;
    }
div.mainbox h3 {
margin: 5px 0 5px 10px; 
font-size: 11pt;
}

div.mainbox p,
div.mainbox ul,
div.mainbox ol {
    margin: 5px 16px 0 8px;
    padding: 0 5px 5px 25px;
    text-align:left;
    font-size: 9pt;
    }
div.mainbox ul,
div.mainbox ol {
    margin-left:20px;
    }


div.mainbox div.header {
    margin: -5px 2px 10px -5px; 
    padding:10px 0 0 10px; 
    display:block;
    width:100%;
    color: #0af;
    border-bottom:1px solid #0af; 
    background: #111;
    }

/* navigation / search box "fieldset.search" */

form input {
    border: 1px solid #0af;
    background: #222;
    color: #ccc;
}

form fieldset.search,
form fieldset#advancedsearch {
    display: block; 
    margin:12px 0 12px 0;
    width: 100%; 
    text-align:center;
    height:22px;
    }

form fieldset.search input.text,
form fieldset#advancedsearch input.text {
    width: 300px;
    margin-left:20px;
    padding:1px 1px 1px 5px;
    font-style: italic;
    }
    
form fieldset.search input.submit {
    display:none;
    }

form fieldset.search a {
    padding: 1px 5px;
    border:  1px solid #0af;
    margin: 0 6px;
    }
form fieldset.search a.sel,
form fieldset.search a:hover {
    border: 1px solid #ff0;
    color: #ff0;
    }

form div.dropdown a {
    display:block;
    width:100%;
    text-align:center;
    font-size: x-small;
}

form fieldset#advancedsearch {
    display:none;
}
form fieldset#advancedsearch input.submit {
    padding: 1px;
    margin: auto 5px;
}
    
/* TODO: advanced search function styling */

    

/* browse table tabs */
ul.maintabs {
    display: inline; 
    margin: 0;
    }
    
ul.maintabs.notfirst {
    display: block; 
    height: 20px
    }
    
ul.maintabs li {
    display: inline; 
    list-style-type: none
    }
    
ul.maintabs li a, 
ul.maintabs li b {
    float: right;
    display: block;
    height: 14px;
    padding: 1px 7px 5px 7px;
    margin: 0 0 0 10px;
    }
    
ul.maintabs li a {
    margin-left: 5px; 
    border: 1px solid #0af;
    border-bottom: none;
    background: #333;
    }
    
ul.maintabs.notfirst li a,
ul.maintabs.notfirst li b {
    margin-top: 20px
    }
    
ul.maintabs.bottom li a,
ul.maintabs.bottom li b {
    margin-top: 10px;
    padding: 1px 7px 5px 7px
    }
    
ul.maintabs.bottom li a {
    border-bottom: 1px solid #0af;
    border-top: none
    }
    
ul.maintabs li.left a,
ul.maintabs li.left b {
    float: left; 
    margin-left: 0; 
    margin-right: 10px
    }
    
ul.maintabs li b {
    margin-left: -2px; 
    margin-right: -7px
    }
    
ul.maintabs li.left b {
    margin-left: -7px; 
    margin-right: -2px
    }
    
ul.maintabs li.tabselected a,
ul.maintabs li a:hover {
    padding-bottom: 6px
    }
    
ul.maintabs.bottom li.tabselected a,
ul.maintabs.bottom li a:hover {
    padding-top: 2px;
    padding-bottom: 5px;
    margin-top: 9px
    }
    
ul.maintabs.browsetabs li a {
    margin-left: 5px; 
    background: #333;
    }
    
ul.maintabs.browsetabs li.left a {
    margin-left: 0; 
    margin-right: 5px
    }


/* game/server browse tables */
div.mainbox.browse {
    padding: 0;
    }

div.mainbox.browse table {
    width: 100%;
    table-layout:fixed;
    border-collapse:collapse
    }

div.mainbox.browse table thead td {
    font-weight: bold;
    }
   
div.mainbox.browse table thead tr td {
    white-space:nowrap;
    overflow:hidden;
    text-align:center;
    border-top:0;
    border-bottom:1px solid #0af; 
    color: #0af; 
    padding:3px 10px 3px 5px; 
    background: #111;
    font-weight:bold
    }
    
div.mainbox.browse table tfoot tr td {
    white-space:nowrap;
    overflow:hidden;
    text-align:center;
    border-top:1px solid #0af; 
    color: #ccc; 
    padding:3px 10px 3px 5px; 
    }

div.mainbox.browse table tr td {
    white-space:nowrap;
    overflow:hidden;
    text-align:center;
    padding:1px 10px 1px 5px;
    font-size:10pt;
    }
    
div.mainbox.browse table tr.s td a {
    color: #ccc;
    }
    
div.mainbox.browse table tr.s td a:hover {
    color: #ff0;
    }

div.mainbox.browse table tr.odd {
    background: #222;
    }

/* specific game list table columns */
div.mainbox.browse.gamelist table tr td.tc1 {
    text-align:left;
    padding-left:20px
    }
    
div.mainbox.browse.gamelist table tr td.tc2 {
    width:100px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 16px;
    }
    
div.mainbox.browse.gamelist table tr td.tc3 {
    width:200px;
    }
    
/* specific serverlist table columns */
div.mainbox.browse.serverlist table tr td.tc1 {
    width:10px; 
    background-size: 20px 15px; 
    background-position: 50%; 
    background-repeat: no-repeat;
    }

div.mainbox.browse.serverlist table tr td.tc2 {
    text-align:left;
    }

div.mainbox.browse.serverlist table tr td.tc3 {
    width:46px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 16px;
    }
div.mainbox.browse.serverlist table tr td.tc3.icon a {
    display:block;
    margin:0 auto;
    height:16px;
    width:16px;
}
    
div.mainbox.browse.serverlist table tr td.tc4 {
    width:90px;text-align:left
    }
    
div.mainbox.browse.serverlist table tr td.tc5 {
    width:70px;
    text-align:center
    }
    
div.mainbox.browse.serverlist table tr td.tc6 {
    width:140px;
    text-align:left
    }


/* serverlist details */
div.mainbox.detail {
  padding:0 0 12px 0;
  }
div.mainbox.detail div.header {
  margin:0 0 12pt 0; 
  padding:3px 0 0 0; 
  display:block;
  width:100%;
  }
  
div.mainbox.detail div.header h1 {
  font-weight:normal;
  padding: 15px 5px 0 15px;
  white-space: nowrap;
  overflow:hidden;
  display:block;
  width:830px;
  }
div.mainbox.detail div.header p {
  color: #ccc;
  padding: 0 0 5px 30px;
  }  
  
div.mainbox.detail table {
  margin-bottom: 20px; 
  table-layout:fixed;
  border-collapse:collapse;
  text-align:left;
  }
div.mainbox.detail table tr th {
  font-weight:bold; 
  padding: 2px 8px; 
  margin-bottom:12pt; 
  border-bottom: 1px solid #996
  }
div.mainbox.detail table tr th.wc1 {
  width:170px
  }
div.mainbox.detail table tr td {
  vertical-align:top; 
  padding:6px 5px 4px 15px;
  }
div.mainbox.detail table tr td img.flag {
  margin:-4px 2px -4px 0; 
  height:20px; 
  width:30px;
  }
div.mainbox.detail table tr td input,
div.mainbox.detail table tr td textarea {
  background: #222;
  color: #ccc;
  width:99%;
  padding: 3px 1px 2px 5px;
  border: 1px solid #0af;
  font-family:"Lucida Console";
  font-size: 8pt;
  }
div.mainbox.detail table.serverinfo,
div.mainbox.detail table.gameinfo {
  width:63%;
  }
div.mainbox.detail table.teaminfo,
div.mainbox.detail table.limits,
div.mainbox.detail table.mutators,
div.mainbox.detail table.players,
div.mainbox.detail table.useropts,
div.mainbox.detail table.shareopts {
  width:96%;
  }
div.mainbox.detail div.container {
  float:right; 
  margin-right:30px;
  }
div.mainbox.detail div.container div.thumbnail {
  border:1px solid #666; 
  background: #222;
  display:block;
  margin-bottom:8px
  }
div.mainbox.detail div.container div.thumbnail img {
  height:256px; 
  width:256px;
  border:1px solid #996;
  display:block;
  margin:10px 10px 2px 10px
  }
div.mainbox.detail div.container div.thumbnail span {
  text-align: right; 
  font-weight: normal; 
  padding:0 15px 4px 5px;
  display:block; 
  font-size:x-small
  }
div.mainbox.detail div.container table.mapinfo {
  width: 280px;
  margin-bottom:0;
  }
div.mainbox.detail div.container table.mapinfo tr td.wc1{
  width: 80px;
  }
div.mainbox.detail table.players tr.odd {
  background: #222;
  }
div.mainbox.detail table.players tr td {
  padding:1px 5px 0px 15px; 
  overflow:hidden; 
  white-space: nowrap;
  }
div.mainbox.detail table.players tr th.frags {width:50px}
div.mainbox.detail table.players tr th.mesh  {width:140px}
div.mainbox.detail table.players tr th.skin  {width:140px}
div.mainbox.detail table.players tr th.ping  {width:50px}

div.mainbox.detail table.players tr td.frags,
div.mainbox.detail table.players tr th.frags,
div.mainbox.detail table.players tr td.ping,
div.mainbox.detail table.players tr th.ping {text-align:right;}

/* warning box */
div.mainbox.warning {
    color:#ccc; 
    background-color: #411; 
    border: 1px solid #c00; 
}
div.mainbox.warning div.header {
    border-bottom:1px solid #c00; 
    background: #200;
    color: #ccc;
}

div.mainbox.warning div.header h1{
    color: #ccc;
}

div.mainbox div.description {
    display: block;
    width: 500px;
    margin: 10px auto
    }

div.code.warning {
  display:block; 
  margin:12pt auto; 
  width:90%; 
  font-family:"Lucida Console";
  font-size: 8pt;
  text-align:left;
  padding:5px;
  border: 1px solid #c00;
  overflow:hidden; 
  background: #222;
  box-shadow: 10px 10px 5px #222;
  }

span.hilit {
    background: #111;
    font-style: italic;
    padding: 1px;
}

div.mainbox.apidoc table {
    table-layout:fixed;
    border-collapse:collapse;
    margin:0 auto 12pt auto;
    width:90%;
    box-shadow: 3px 3px 2px #222;
    background: #2a2a2a;
    border:1px solid #666;
    }
div.mainbox.apidoc table tr td {
    white-space:nowrap;
    overflow:hidden;
    text-align:center;
    padding:1px 10px 1px 5px;
    font-size:10pt;
    }
div.mainbox.apidoc table tr th {
font-weight:bold;
color: #ccc;
}
div.mainbox.apidoc table tr th,
div.mainbox.apidoc table tr td {
vertical-align:top;
text-align:left;
  padding:3px 6px; 
  border:1px solid #666;
  border-left:0;
  border-right:0;
  font-size:9pt
}

div.mainbox.apidoc table .tc1 {width:90px;text-align:left}
div.mainbox.apidoc table .tc2 {width:70px;text-align:center;}

div.mainbox.apidoc p,
div.mainbox.apidoc ul,
div.mainbox.apidoc ol {
    margin-bottom:6pt;
}

pre.code,
div.code {
  display:block; 
  margin:2px auto 12px auto; 
  width:90%; 
  font-family:"Lucida Console";
  font-size: 8pt;
  text-align:left;
  padding:10px 20px;
  border: 1px solid #0af;
  overflow:auto; 
  background: #2a2a2a;
  box-shadow: 3px 3px 3px #222;
  }
span.code {
  font-family:"Lucida Console";
  font-size: 8pt;
  text-align:left;
  padding:2px;
  background: #2a2a2a;
}

span.ext {
    color: #bbb; 
    font-style: italic;
    }