/*******************************************************************************
 *
 *  QuakeNet IRC Network website structure CSS2/3 file
 *
 ******************************************************************************/

/* layout
 ******************************************************************************/

html {
    overflow-y: scroll;
}

body {
    width: 100%;
    text-align: center;
    background: #f0f0e7;
    color: #333;
}

header, #content, footer {
    width: 100%;
    overflow: auto;
    text-align: center;
}

.container {
    width: 990px;
    margin: auto;
    text-align: left;
    overflow: auto;
}


/* This fixes the lists for both directions. */
ul, ol { margin-left: 1.8em; margin-right: 1.8em; }


/* fonts
 ******************************************************************************/

@font-face {
    font-family: 'league-gothic';
    src: url('/static/fonts/league-gothic.eot');
    src: url('/static/fonts/league-gothic.eot?#iefix') format('embedded-opentype'),
         url('/static/fonts/league-gothic.woff') format('woff'),
         url('/static/fonts/league-gothic.ttf') format('truetype'),
         url('/static/fonts/league-gothic.svg#league-gothic') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* user bar
 ******************************************************************************/

#userbar {
    background: url('/static/images/template/shade.png') center 10px no-repeat;
}

#userbar .container {
    text-align: right;
}

#userbar ul {
    display: block;
    clear: right;
    margin-right: 0;
}

#userbar ul li {
    list-style-type: none;
    float: right;
    display: block;
}

#langflags li {
    cursor: pointer;
    padding: 5px;
}

#langflags .hover {
    padding: 2px 4px;
    margin: 2px 0px;
}

#langflags li img {
    clear: both;
    vertical-align: middle;
}

#langflags li span {
    vertical-align: middle;
}

#userlinks a, #userlinks a:link, #userlinks a:visited {
    color: #333;
    text-decoration: none;
    display: block;
    padding: 0 10px 10px 10px;
    float: right;
}

#userlinks a.last {
    padding: 0 0 10px 10px;
}

#userlinks a:hover {
    text-decoration: underline;
}

#userlinks li.slash:before {
    content: "/";
}

/* header
 ******************************************************************************/

.grain {
    background: #221e1a url('/static/images/template/grain.png');
}

#bannertop {
    height: 8px;
    background: #eee url('/static/images/template/bar-back-top.png') repeat-x;
}

#bannerbottom {
    height: 8px;
    background: #eee url('/static/images/template/bar-back-bottom.png') repeat-x;
}

#banner .container {
    background: url('/static/images/template/bloom.png') center no-repeat;
    padding: 3px 0 3px 0;
}

#banner h2 {
    overflow: auto;
    width: 210px;
}

#banner h2 a {
    height: 75px;
    display: block;
    overflow: hidden;
    text-indent: -9999px;
    float: left;
}

#banner h2 a.logoimage {
    width: 75px;
    background: url('/static/images/template/logo-large.png');
}

#banner h2 a.logotext {
    width: 135px;
    background: url('/static/images/template/logotext-large.png');
}

/* nav
 ******************************************************************************/

#nav {
    float: right;
    margin-right: 0;
}

#nav li {
    list-style-type: none;
    color: #999;
    font-size: 1.25em;
    float: right;
    padding: 51px 0 0 0;
}

#nav a, #nav a:link, #nav a:visited {
    color: #fff;
    text-decoration: none;
    display: block;
    padding: 0 20px 0 20px;
    float: right;
}

#nav a.last {
    padding: 0 0 0 20px;
}

#nav a:hover {
    text-decoration: underline;
}

#nav li.slash:after {
    content: "/";
}

/* secondary nav
 ******************************************************************************/

#leftnav {
    margin: 30px 0 0 0;
}

#leftnav li {
    list-style-type: none;
    overflow: auto;
}

#leftnav li a, #leftnav li a:link, #leftnav li:visited {
    display: block;
    padding: 10px;
    text-decoration: none;
    color: #222;
}

#leftnav li a:hover {
    color: #000;
    background-color: rgba(128,128,128,0.5);
    text-decoration: underline;
}

#leftnav li div {
    float: left;
    width: 50%;
}

/* footer
 ******************************************************************************/

footer {
    color: #fff;
}

#footerbar {
    height: 15px;
    background: url('/static/images/template/footer-top.png') repeat-x;
}

footer .container {
    padding: 30px 0 20px 8px;
    background: url('/static/images/template/bloom.png') center -650px no-repeat;
}

footer h5 {
    font-size: 1em;
    font-weight: bold;
    display: block;
    padding: 11px 0 11px 15px;
}

footer ul {
    margin: 0;
}

footer ul.footercol {
    display: block;
    float: left;
    width: 223px;
    margin: 0 30px 0 0;
}

footer ul.topbar {
    border: 1px #76766c dotted;
    border-width: 1px 0 0 0;
}

footer ul.last {
    margin: 0;
}

footer li {
    list-style-type: none;
    border: 1px #76766c dotted;
    border-width: 0 0 1px 0;
    overflow: auto;
}

footer li a, footer li a:link, footer li a:visited {
    display: block;
    padding: 11px 0 11px 15px;
    color: #fff;
    text-decoration: none;
    overflow: hidden;
}

footer li a:hover {
    background-color: rgba(128,128,128,0.5);
    text-decoration: underline;
}

footer ul.sponsors div {
    float: left;
    width: 50%;
    overflow: hidden;
}

footer li a.icon {
    padding: 11px 0 11px 45px;
}

footer li a.users {
    background: url('/static/images/icons/users.png') 15px center no-repeat;
}
footer li a.users:hover {
    background: url('/static/images/icons/users.png') 15px center no-repeat;
    background-color: rgba(128,128,128,0.5);
}

footer li a.channels {
    background: url('/static/images/icons/channels.png') 15px center no-repeat;
}
footer li a.channels:hover {
    background: url('/static/images/icons/channels.png') 15px center no-repeat;
    background-color: rgba(128,128,128,0.5);
}

footer li a.up {
    background: url('/static/images/icons/status-up.png') 15px center no-repeat;
}
footer li a.up:hover {
    background: url('/static/images/icons/status-up.png') 15px center no-repeat;
    background-color: rgba(128,128,128,0.5);
}

footer li a.down {
    background: url('/static/images/icons/status-down.png') 15px center no-repeat;
}
footer li a.down:hover {
    background: url('/static/images/icons/status-down.png') 15px center no-repeat;
    background-color: rgba(128,128,128,0.5);
}

#epilogue {
    padding: 20px 0 0 8px;
    clear: left;
    font-size: 0.8em;
}

#epilogue a, #epilogue a:link, #epilogue:visited {
    color: #fff;
    text-decoration: underline;
}

#epilogue a:hover {
    color: #ccc;
}

#epilogue h6 a {
    display: block;
    text-indent: -9999px;
    overflow: hidden;
    height: 45px;
    float: right;
}

#epilogue h6.logoimg a {
    background: url('/static/images/template/logo-small.png') no-repeat;
    width: 45px;
}

#epilogue h6.logotext a {
    background: url('/static/images/template/logotext-small.png') no-repeat;
    width: 85px;
}

#epilogue p.first {
    padding: 20px 0 0 0;
}

/*******************************************************************************
 *
 *  eof
 *
 ******************************************************************************/