@charset "utf-8";
@import url("base.css");

/* >>>>>>>>>>>>>>>>>>>>>>>> */
/* >   BEGIN GLOBAL CSS   > */
/* >>>>>>>>>>>>>>>>>>>>>>>> */

/* ============= */
/* Shared Styles */
/* ============= */

/* Bottom margin. */
h1,
h2,
h3,
ol,
ul,
dl,
p,
.table,
.list-table,
fieldset,
ul.pagination,
ul.buttons,
.error-box,
.success-box,
.attention-box,
.info-box,
.box-body,
.screenshots {
    margin-bottom:20px;
}

/* ============== */
/* Basic Elements */
/* ============== */

html {

}

body {
    background-color:#15121d;
    background-image:url('../images/background.jpg');
    background-repeat:no-repeat;
    background-position:center 288px;
    color:#222;
    font-family:'Arial', 'Helvetica', sans-serif;
    margin:0;
    padding:0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color:#C20000;
    font-weight:bold;
    letter-spacing:-0.07em;
    margin-bottom:10px;
}

h2 {
    font-size:2.3em;
}

h3 {
    color:#000;
    font-size:1.8em;
}

ul {
    list-style:square;
}

hr {
    height:1px;
    background-color:#CCC;
    border-color:#CCC;
    color:#CCC;
    margin-bottom:20px;
}

/* ===== */
/* Links */
/* ===== */

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

a:active,
a:hover {
    color:#C86060;
    text-decoration:underline;
}

/* ====== */
/* Tables */
/* ====== */

.table {
    clear:both;
    border:1px solid #DDD;
    border-bottom:0;
}

.table caption {
    background-color:#888;
    color:#FFF;
    font-weight:bold;
    padding:8px;
    margin:-1px 1px;
}

.table td {
    background-color:#FFF;
}

.table th,
.table td {
    padding:8px;
    text-align:center;
}

.table thead th {
    border-top:1px solid #333;
    border-bottom:6px solid #C20000;
    background-image:linear-gradient(to bottom, #444 0px, #222 1px, #000 101%);
    color:#FFF;
    font-weight:bold;
}

.table tbody th {
    background-color:#EAEAEA;
    border-bottom:1px solid #DDD;
    border-right:1px solid #DDD;
    color:#333;
    font-weight:bold;
}

.table tbody tr:nth-child(even) th {
    background-color:#E5E5E5;
}

.table tbody td {
    border-bottom:1px solid #DDD;
}

.table tbody tr:nth-child(even) td {
    background-color:#F5F5F5;
}

.table tfoot td {
    background-color:#C20000;
    border-bottom:1px solid #DDD;
    color:#FFF;
    font-weight:bold;
}

.table tr th:first-child,
.table tr td:first-child {
    text-align:left;
}

/* List Tables. */
.list-table th {
    color:#C20000;
    font-weight:bold;
}

.list-table th,
.list-table td {
    padding:0 0 6px 0;
}

.list-table tr:last-child th,
.list-table tr:last-child td {
    padding-bottom:0;
}
/* ---------- */

/* ===== */
/* Forms */
/* ===== */

form {
    clear:both;
}

input,
textarea,
select {
    border:1px solid #BBB;
    color:#000;
    font-family:'Arial', 'Helvetica', sans-serif;
    padding:5px;
    -webkit-border-radius:3px;
       -moz-border-radius:3px;
            border-radius:3px;
    -webkit-box-shadow:inset 2px 2px 2px 0px #EEE;
       -moz-box-shadow:inset 2px 2px 2px 0px #EEE;
            box-shadow:inset 2px 2px 2px 0px #EEE;
}

input:focus,
textarea:focus,
select:focus {
    border:1px solid #C20000;
}

input.med-short,
textarea.med-short,
select.med-short {
    width:200px;
}

fieldset {
    border-bottom:1px solid #CCC;
}

fieldset:last-child {
    border:0;
}

legend {
    color:#666;
    font-weight:bold;
    font-size:1.5em;
}

.form-item {
    clear:both;
    padding-bottom:15px;
}

label {
    cursor:pointer;
    display:block;
    font-weight:bold;
    margin-bottom:2px;
    text-align:left;
}

label.required::before {
    color:red;
    content:"* ";
    font-size:1.2em;
}

label small,
legend small {
    display:block;
    font-size:0.8em;
    font-weight:normal;
}

select[multiple="multiple"] {
    height:120px;
}

 /* Nested fieldsets for radio buttons & checkboxes. */
.form-item ul {
    list-style:none;
}

.form-item ul,
.form-item ul li {
    margin:0;
    padding:0;
    width:auto;
}

.form-item ul li label {
    font-weight:normal;
    margin:0;
    text-align:left;
    width:auto;
}

.form-item ul li input {
    border:0;
    width:auto;
}
/* ---------- */

/* Form item columns. */
.left-half,
.right-half {
    width:50%;
}

.left-half {
    clear:right;
    float:left;
    padding-right:15px;
}

.right-half {
    clear:none;
    float:right;
    padding-left:15px;
}

/* Multi-column lists. */
fieldset ul.dual-col li,
fieldset ul.tri-col li,
fieldset ul.quad-col li {
    box-sizing:border-box;
    clear:none;
    float:left;
}

fieldset ul.dual-col li {
    width:50%;
}

fieldset ul.tri-col li {
    width:33%;
}

fieldset ul.quad-col li {
    width:25%;
}

/* Responsive multi-column. */
@media only screen and (max-width: 640px) {
    .left-half,
    .right-half {
        clear:both;
        float:none;
        padding-left:0;
        padding-right:0;
        width:100%;
    }

    fieldset ul.dual-col li,
    fieldset ul.tri-col li,
    fieldset ul.quad-col li {
        clear:both;
        float:none;
        width:100%;
    }
}
/* ---------- */

/* Toolbar (search/view/filter). */
form.form-inline fieldset {
    border:0;
    background:#E6E6E6 none;
    margin-bottom:0;
    padding:8px 8px 0 8px;
}

form.form-inline .form-item {
    display:inline-block;
    margin:0 8px 8px 0;
    padding:0;
}

form.form-inline input {
    width:auto;
}

/* ---------- */

#plupload ul {
    list-style:square;
    margin-bottom:10px;
    margin-left:20px;
}

#plupload ul li {
    padding:0;
}

.bars-complete {
    color:#090;
    font-weight:bold;
}

.bars-incomplete {
    color:#BBB;
    font-weight:bold;
}

/* ======= */
/* TinyMCE */
/* ======= */

.mce-content-body {
    background:#EEE none;
    padding:10px;
    min-height:100%;
}

.mce-container button:hover {
    background:none;
}

/* ========== */
/* Pagination */
/* ========== */

ul.pagination {
    float:left;
    font-size:0.9em;
    list-style:none;
    margin-left:0;
    padding:0;
}

ul.pagination li {
    float:left;
    margin:0 3px 0 0;
}

ul.pagination li.ellipsis {
    border:none;
    font-weight:bold;
    padding-top:3px;
}

ul.pagination li.disabled,
ul.pagination li.current,
ul.pagination li a {
    background-color:#FFF;
    border:1px solid #DDD;
    padding:2px 5px 2px 5px;
    text-decoration:none;
}

ul.pagination li a {
    color:#000;
    display:block;
}

ul.pagination li.current {
    font-weight:bold;
}

ul.pagination li.current,
ul.pagination li a:active,
ul.pagination li a:hover {
    border:1px solid #2A2A2A;
    background:#2A2A2A none;
    color:#FFF;
}

ul.pagination li.disabled {
    background:#EEE none;
    border:1px solid #CCC;
    color:#CCC;
}

/* ==== */
/* Tabs */
/* ==== */

ul.tabs {
    font-size:0.9em;
    list-style:none;
    margin:0 0 10px 0;
    padding:0;
    border-bottom:6px solid #C20000;
}

ul.tabs li {
    display:inline-block;
}

ul.tabs li a {
    background-color:#000;
    background-image:linear-gradient(to bottom, #555 0px, #333 1px, #000 101%);
    color:#FFF;
    display:inline-block;
    font-weight:bold;
    text-decoration:none;
    padding:9px 13px 9px 13px;
    -webkit-border-radius:6px 6px 0 0;
            border-radius:6px 6px 0 0;
}

ul.tab li a:link,
ul.tab li a:visited {
    text-decoration:none;
}

ul.tabs li a:hover,
ul.tabs li.current a {
    background-color:#C20000;
    background-image:linear-gradient(to bottom, #8b7bb8 0px, #6b50b8 1px, #C20000 101%);
    color:#FFF;
}

ul.tabs li.current a {
    cursor:default;
}

/* ======= */
/* Buttons */
/* ======= */

ul.buttons {
    list-style:none;
    margin-left:0;
    padding:0;
}

ul.buttons li {
    display:inline-block;
}

button,
input[type="submit"],
input[type="reset"],
input[type="button"],
a.btn,
ul.buttons li a {
    background-color:#222;
    background-image:linear-gradient(to bottom, #AAA 0px, #555 1px, #222 101%);
    border:1px solid #222;
    color:#FFF;
    cursor:pointer;
    display:inline-block;
    font-family:inherit;
    font-size:0.9em;
    font-weight:bold;
    padding:5px 12px;
    text-decoration:none;
    width:auto;
    -webkit-border-radius:5px;
            border-radius:5px;
}

button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
a.btn:hover,
a.btn.current,
ul.buttons li a:hover,
ul.buttons li.current a {
    background-color:#000;
    background-image:linear-gradient(to bottom, #888 0px, #333 1px, #000 101%);
    border-color:#000;
    color:#DDD;
}

a.btn.current,
ul.buttons li.current a {
    cursor:default;
}

button.btn-aux,
input.btn-aux,
a.btn-aux,
ul.buttons li a.btn-aux {
    background-color:#EEE;
    background-image:linear-gradient(to bottom, #FFF 0px, #FFF 1px, #EEE 101%);
    border-color:#DDD;
    color:#000;
}

button.btn-aux:hover,
input.btn-aux:hover,
a.btn-aux:hover,
a.btn-aux.current,
ul.buttons li a.btn-aux:hover,
ul.buttons li.current a.btn-aux {
    background-color:#DDD;
    background-image:linear-gradient(to bottom, #EEE 0px, #EEE 1px, #DDD 101%);
}

button:focus,
button:active,
a.btn:focus,
a.btn:active,
ul.buttons li a:focus,
ul.buttons li a:active {
    outline:thin dotted;
    outline:5px auto -webkit-focus-ring-color;
    outline-offset:-2px;
}

ul.btn-lg li a,
a.btn-lg,
button.btn-lg,
fieldset.submit button {
    font-size:1.2em;
    font-weight:normal;
    padding:7px 18px;
}

ul.btn-sm li a,
a.btn-sm,
button.btn-sm {
    font-size:0.85em;
    padding:4px 10px;
}

/* ===== */
/* Boxes */
/* ===== */

.error-box,
.success-box,
.attention-box,
.info-box {
    background-position:10px 10px;
    background-repeat:no-repeat;
    padding:10px 10px 10px 36px;
    border-radius:4px;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
}

.error-box {
    background-color:#ffbdbd;
    background-image:url('../images/ui/notify_error.png');
    border:1px solid #d47575;
    color:#382b23;
}

.success-box {
    background-color:#c7ffbd;
    background-image:url('../images/ui/notify_success.png');
    border:1px solid #9ADF8F;
    color:#273823;
}

.attention-box {
    background-color:#ffffbb;
    background-image:url('../images/ui/notify_attention.png');
    border:1px solid #d7c92e;
    color:#383523;
}

.info-box {
    background-color:#d1cdff;
    background-image:url('../images/ui/notify_info.png');
    border:1px solid #968beb;
    color:#2d2c38;
}

.error-box ul,
.success-box ul,
.attention-box ul,
.info-box ul {
    margin-bottom:0;
    margin-left:16px;
}

.box-head {
    background-color:#3D3D3D;
    background-image:linear-gradient(to bottom, #444 0px, #222 1px, #000 101%);
    border-bottom:8px solid #C20000;
    color:#FFF;
    line-height:100%;
    margin:0;
    padding:12px 16px;
}

.box-body {
    background-color:#FFF;
    border:1px solid #CCC;
    padding:20px;
    margin-bottom:20px;
}

.screenshots {
    background-color:#FFF;
    border:1px solid #CCC;
    padding:10px;
}

/* [------------- Generic Classes ------------] */

.bmargin {
    margin-bottom:20px !important;
}

.lmargin {
    margin-left:20px !important;
}

.rmargin {
    margin-right:20px !important;
}

.tmargin {
    margin-top:20px !important;
}

/* >>>>>>>>>>>>>>>>>>>>>>>>>>> */
/* >   BEGIN MAIN SITE CSS   > */
/* >>>>>>>>>>>>>>>>>>>>>>>>>>> */
/* Classes and styles specific to this site. */

/* [------------ Layout Divisions ------------] */

#header {

}

    #top_bar {
        background-color:#000;
        background-image:linear-gradient(to top, #232323 0%, #000 101%);
        border-bottom:1px solid #333;
        height:39px;
        font-size:0.85em;
    }

        #top_bar_inner {
            color:#CCC;
            line-height:37px;
            margin:0 auto;
            position:relative;
            text-align:right;
            width:960px;
        }

            #top_bar_inner form {
                position:absolute;
                top:0;
                right:0;
            }

            #top_bar_inner form label {
                font-weight:bold;
                display:inline;
            }

            #top_bar_inner form input {
                background-color:#000;
                background-image:linear-gradient(to top, #232323 0%, #000 101%);
                border:1px solid #C20000;
                color:#CCC;
                line-height:normal;
                margin-right:4px;
                padding:3px;
                width:auto;

                -webkit-border-radius:3px;
                -moz-border-radius:3px;
                border-radius:3px;
                -webkit-box-shadow:none;
                -moz-box-shadow:none;
                box-shadow:none;
            }

            #top_bar_inner form button {
                line-height:normal;
            }

            #login_signup_mob {
                display:none;
            }

    #banner {
        background-color:#000;
        background-image:url('../images/banner_background.jpg');
        background-repeat:no-repeat;
        background-position:center top;
    }

        #banner_inner {
            height:159px;
            margin:0 auto;
            position:relative;
            width:960px;
        }

            #banner_logo {
                bottom:6px;
                left:0;
                position:absolute;
                width:397px;
                height:107px;
            }

            #top_right_box {
                background-color:rgba(0,0,0,0.6);
                background-repeat:repeat;
                border:1px solid #333;
                border-top:0;
                color:#FFF;
                position:absolute;
                top:0;
                right:0;
                font-weight:bold;
                padding:10px 10px 6px 10px;
                -webkit-border-bottom-left-radius:10px;
                -webkit-border-bottom-right-radius:10px;
                   -moz-border-radius-bottomleft:10px;
                   -moz-border-radius-bottomright:10px;
                        border-bottom-left-radius:10px;
                        border-bottom-right-radius:10px;
            }

            #game_icons {
                position:absolute;
                bottom:0;
                right:0;
                padding-bottom:3px;
            }

    #navigation_bar {
        background-color:#222;
        background-image:linear-gradient(to top, #C20000 0px, #C20000 10px, #000 10px, #222 101%);
        background-repeat:repeat-x;
        border-top:1px solid #333;
        border-bottom:1px solid #35393b;
        margin-bottom:20px;
        z-index:2;
    }

        #navigation {
            list-style:none;
            margin:0 auto;
            padding:0;
            width:960px;
            display:flex;
            flex-direction:row;
        }

            .navigation-toggler {
                display:none;
            }

            #navigation > li {
                background:url('../images/navigation_separator.png') 100% 1px no-repeat;
                background-position:bottom right;
                flex-grow:1;
                position:relative;
            }

            #navigation > li:last-child {
                background:none;
            }

                #navigation li a {
                    display:block;
                    font-weight:bold;
                    letter-spacing:-0.03em;
                    text-decoration:none;
                    text-shadow:0 1px 1px #333;
                }

                #navigation > li > a {
                    color:#AAA;
                    font-size:1.5em;
                    padding-top:6px;
                    padding-bottom:14px;
                    padding:6px 15px 14px 15px;
                    text-align:center;
                }

                #navigation > li.current > a,
                #navigation > li > a:hover,
                #navigation > li:hover > a {
                    background-image:linear-gradient(to top, rgba(255,255,255,1) 0px, rgba(255,255,255,1) 10px, rgba(45,45,45,0.3) 10px, rgba(45,45,45,0) 101%);
                    color:#FFF;
                }

                #navigation > li > a > span {
                    display:block;
                    margin:0 auto;
                    font-size:1.4em;
                }

                #navigation li span.icon::before {
                    margin-right:0;
                }

                #navigation li.current a span,
                #navigation li a:hover span,
                #navigation li:hover a span {
                    color:#FFF;
                    text-shadow:0 0 5px #888;
                }

                #navigation li ul { list-style:none; margin:0px; margin-left:-1px; display:none; z-index:999; position:absolute; width:192px; border:1px solid #333; border-bottom:0; }
                #navigation li ul.flush_right { right:0px; }
                #navigation li ul li a { color:#FFF; background-color:#C20000; border-bottom: 1px solid #333; padding:6px; word-wrap:break-word; }
                #navigation li:hover ul { background:none; display:block; }
                #navigation li ul li a:hover,
                #navigation li ul li a.current { background-color:#867bc9; }

        .nav_fixed {
            position:fixed;
            top:0;
            left:0;
            width:100%;
        }

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

    #left {
        float:left;
        width:660px;
    }

    #right {
        float:right;
        width:280px;
    }

        #mumble_box {
            background-color:#EEE;
            background-image:linear-gradient(to bottom, #DDD 0px, #EEE 30px);
            font-size:0.85em;
        }

        #tsstatus {
            font-size:0.85em;
            padding:5px;
        }

        .tsstatus_details {
            background-color:#EEE;
            background-image:linear-gradient(to bottom, #DDD 0px, #EEE 30px);
            border-top:1px solid #CCC;
            padding:20px 20px 0 20px;
        }

        #donate_button {
            border:0;
            width:auto;
            -webkit-box-shadow:none;
            -moz-box-shadow:none;
            box-shadow:none;
        }

#footer {
    background-color:#000;
    background-image:linear-gradient(to top, #000 10px, #222 101%);
    border-top:1px solid #333;
    clear:both;
    color:#CCC;
    text-align:center;
    padding:20px;
}

/* Responsive elements. */
@media only screen and (max-width:1984px) and (min-resolution:2dppx),
only screen and (max-width: 992px) {

    body {
        background-position:center 238px;
    }

    #top_bar_inner,
    #banner_inner,
    #navigation,
    #main {
        width:100%;
        min-width:360px;
    }

    #main {
        padding:0 20px;
    }

    #left,
    #right {
        width:100%;
        float:none;
        min-width:320px;
    }

    #twitter_feed {
        display:none;
    }

    #navigation > li > a {
        font-size:1em;
        line-height:2em;
    }
}

@media only screen and (max-width:1359px) and (min-resolution:2dppx),
only screen and (max-width: 800px) {

    .table {
        font-size:0.85em;
    }

    .table td {
        padding:8px 1px;
    }

    .table td:first-child {
        padding-left:3px;
    }

    .table td:last-child {
        padding-right:3px;
    }

    input, input.medium, input.med-short, input.long,
    textarea, textarea.medium, textarea.med-short, textarea.long,
    select.medium, select.med-short, select.long {
        width:100%;
    }
}

@media only screen and (max-width:1535px) and (min-resolution:2dppx),
only screen and (max-width: 679px) {

    #top_right_box,
    #game_icons {
        display:none;
    }
}

@media only screen and (max-width:1535px) and (min-resolution:2dppx),
only screen and (max-width:767px) {

    body {
        background-position:center 100px;
    }

    #top_bar_inner form {
        display:none;
    }

    #login_signup_mob {
        display:block;
    }

    #login_signup_mob a {
        display:block;
        float:right;
        background-color:#222;
        font-weight:bold;
        height:37px;
        padding:0 10px;
        text-decoration:none;
        border-left:1px solid #333;
    }

    #banner_inner {
        height:110px;
    }

    #banner_logo {
        bottom:6px;
        left:0;
        position:absolute;
        width:297px;
        height:80px;
        margin-left:10px;
    }

    div#navigation_bar {
        background-image:linear-gradient(to top, #000 0px, #222 101%);
        border-bottom:0;
    }

    #navigation {
        display:block;
    }

    #navigation[data-nav-expanded="0"] > li {
        display:none;
    }

    #navigation > li.navigation-toggler {
        display:block;
    }

    #navigation[data-nav-expanded="1"] > li.navigation-toggler a {
        background:#C20000;
        color:#FFF;
    }

    #navigation > li {
        background:none;
    }

    #navigation > li:last-child {
        border-bottom:0;
    }

    #navigation > li > a {
        border-bottom:1px solid #333;
        font-size:1.1em;
        font-weight:normal;
        padding:5px;
    }

    #navigation > li > a > span {
        display:inline;
        font-size:inherit;
        margin-right:3px;
    }

    #navigation > li.current > a,
    #navigation > li > a:hover,
    #navigation > li:hover > a {
        background-image:none;
    }

    #navigation li ul {
        display:none;
        margin:0px;
        position:static;
        width:100%;
    }

    #navigation li:hover ul {
        display:none;
    }
}

/* [------------ Site-Wide Classes -----------] */

.content-header {
    background-color:#000;
    background-image:linear-gradient(to bottom, #222 0px, #000 101%);
    border-top:1px solid #333;
    border-bottom:8px solid #C20000;
    color:#FFF;
    font-size:2.5em;
    font-weight:bold;
    letter-spacing:-0.07em;
    line-height:1.2;
    margin:0;
    padding:8px 11px;
    border-top-left-radius:4px;
    border-top-right-radius:4px;
    -moz-border-radius-topright:4px;
    -moz-border-radius-topleft:4px;
    -webkit-border-top-left-radius:4px;
    -webkit-border-top-right-radius:4px;
}

    .content-header a {
        text-decoration:none;
        color:#BBB;
    }

    .content-header a:hover {
        text-decoration:none;
        color:#FFF;
    }

    .content-header span {
        display:block;
        font-size:0.6em;
        letter-spacing:-0.02em;
        font-style:italic;
    }

.content-panel {
    background-color:#EEE;
    background-image:linear-gradient(to bottom, #DDD 0px, #EEE 30px);
    margin-bottom:20px;
    padding:20px 20px 0 20px;
    border-bottom-left-radius:4px;
    border-bottom-right-radius:4px;
    -moz-border-radius-bottomleft:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-bottom-left-radius:4px;
    -webkit-border-bottom-right-radius:4px;
}

.avatar {
    border:5px solid #AAA;
    max-width:256px;
    max-height:256px;
}

.flag {
    border:1px double #AAA;
    vertical-align:bottom;
}

.highlighted {
    color:#C20000;
}

.highlighted2 {
    color:#6D37FB;
}

.forum_post {
    margin-bottom:10px;
    padding-bottom:10px;
    border-bottom:1px dotted #BBB;
}

    .forum_post:last-child {
        border:0;
    }

.positive_button {
    background-color:#6B2;
    background-image:linear-gradient(to bottom, #aaf16b 0px, #8be43c 1px, #6B2 101%) !important;
    border:1px solid #6B2 !important;
}

.positive_button:hover {
    background-color:#84c14e;
    background-image:linear-gradient(to bottom, #c1ed9a 0px, #a2e962 1px, #84c14e 101%) !important;
    border:1px solid #84c14e !important;
}

.negative_button {
    background-color:#B25;
    background-image:linear-gradient(to bottom, #f16b6e 0px, #e43c40 1px, #B25 101%) !important;
    border:1px solid #B25 !important;
}

.negative_button:hover {
    background-color:#c14e50;
    background-image:linear-gradient(to bottom, #f4888b 0px, #e96266 1px, #c14e50 101%) !important;
    border:1px solid #c14e50 !important;
}

/* Servers list. */

ul.servers {
    list-style:none;
    margin:0 0 20px 0;
}

    ul.servers li {
        padding-bottom:6px;
        margin-bottom:6px;
        border-bottom:1px dotted #BBB;
    }

    ul.servers li:last-child {
        margin:0;
        padding:0;
        border:0;
    }

/* Dialog. */

.loading-overlay {
    background:rgba(0,0,0,0.5) url('../images/loading.gif') no-repeat center center;
    background-size:64px 64px;
    position:fixed;
    width:100%;
    height:100%;
    z-index:1001;
}

.dialog-overlay {
    background:rgba(0,0,0,0.5);
    position:fixed;
    width:100%;
    height:100%;
    z-index:999;
}

.dialog-overlay[data-active="0"] {
    display:none;
}

.dialog-outer {
    z-index:1000;
}

.dialog-inner {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin:5px;
}

.dialog-header {
    background-color:#5425b3;
    background-image:linear-gradient(to bottom, #a07aec 0px, #a07aec 1px, #7538d9 1px, #5425b3 101%);
    color:#FFF;
    font-size:1.3em;
    padding:8px;
    border-radius:5px 5px 0 0;
    border-bottom:1px solid #777;
}

.dialog-close {
    float:right;
    cursor:pointer;
}

.dialog-body {
    background:white;
    padding:8px;
    overflow:auto;
}

.dialog-footer {
    padding:9px;
    background:#F2F2F2;
    border-top:1px solid #CCC;
    border-radius:0 0 5px 5px;
}

@media (max-width:1023px) {
    .dialog-inner {
        box-shadow:none;
        margin:0;
    }

    .dialog-header,
    .dialog-footer {
        border-radius:0;
    }
}

/* [---------- Page Specific Classes ---------] */

/* Home. */

.news_entry {
    border-bottom:1px solid #CCC;
    margin-bottom:20px;
}

    .news_entry h2 {
        margin-bottom:0px;
    }

        .news_entry h2 a {
            color:#C20000;
            text-decoration:none;
        }

    .news_image {
        width:100%;
        height:auto;
    }

/* Control Panel. */

ul.admin-menu {
    list-style:none;
    margin:0 0 20px 0;
    padding:0;
}

    ul.admin-menu li {
        float:left;
        text-align:center;
        padding:10px;
        margin:9px;
        width:98px;
        height:104px;
    }

        ul.admin-menu li a {
            text-decoration:none;
        }

/* Edit Profile. */

.game_box {
    clear:both;
    margin-bottom:10px;
    padding:6px 6px 0 10px;
    border:1px solid #CCC;
    background-color:#F5F5F5;
    border-left-width:20px;
    min-height:34px;
    -webkit-border-radius:4px;
       -moz-border-radius:4px;
            border-radius:4px;
}

.game_box_active {
    background-color:#FFF;
    border-color:#C20000;
    border-width:2px;
    border-left-width:20px;
}

    .game_box label.game_selector {
        float:left;
        position:relative;
        color:#C20000;
        font-weight:bold;
        font-size:1.3em;
        line-height:20px;
        padding:4px 0 6px 0px;
        display:block;
        cursor:pointer;
        letter-spacing:-0.04em;
    }

    .game_name {
        display:block;
        margin-left:42px;
    }

    .game_icon {
        display:block;
        position:absolute;
        left:18px;
        top:4px;
    }

    .game_checkbox {
        position:absolute;
    }

    input.game_checkbox {
        left:1x;
        top:7px;
        cursor:pointer;
    }

    img.game_checkbox {
        left:0px;
        top:4px;
        cursor:help;
    }

    .game_ign,
    .game_links {
        margin-bottom:6px;
        float:right;
        clear:right;
    }

    .game_links {
        margin-right:10px;
    }

    .game_ign input {
        width:180px;
    }

    .game_tags {
        margin-bottom:10px;
        clear:left;
    }

    .game_tags label,
    .game_tags input {
        cursor:pointer;
    }

    .game_tags label {
        font-weight:normal;
    }

    .game_tags select {
        display:block;
    }

.option_avail2 {
    color:#59BB3F;
    font-weight:bold;
}

.option_avail1 {
    color:#F07F1A;
    font-weight:bold;
}

.option_avail0 {
    color:#D91318;
    font-weight:bold;
}

/* Roster. */

.role_label {
    font-size:0.85em;
    font-style:italic;
    color:#999;
}

/* Tags */

.tag-bar {
    cursor:pointer;
}

/* View Profile */

.awards_box {
    background:url('../images/medals_background.jpg');
    padding:4px;
    border:2px solid #5522BB;
}

    .awards_box img {
        margin:4px;
    }


/* Media. */

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

    .media_channels_list li {
        margin:0 20px 20px 0;
        float:left;
        width:300px;
        height:86px;
        padding:10px;
        border:1px solid #AAA;
        background-color:#F5F5F5;
    }

    .media_channels_list li img {
        float:left;
    }

    .media_channels_list li div {
        float:left;
        margin-left:10px;
    }

        .media_channels_list li h2 {
            font-size:1.5em;
            margin-bottom:4px;
        }

        .media_channels_list li h2 a {
            text-decoration:none;
            color:#C20000;
        }

.media_video {
    clear:both;
}

    .media_video h2 {
        font-size:1.9em;
        margin-bottom:10px;
    }

    .media_video div {
        float:right;
        margin-top:8px;
    }

/* Media Images. */

.gallery_thumb {
    margin-right:1px;
    display:block;
    float:left;
    margin-bottom:1px;
}

/* Image Management. */

.image_upload_thumb {
    border:1px solid #CCC;
    position:absolute;
    right:20px;
    top:20px;
}

.image_management_item {
    background-color:#EEE;
    padding:0px;
    float:left;
    margin-right:1px;
    margin-bottom:10px;
    text-align:center;
    width:206px;
}

/* Raid Management. */

.raid_management table td {
    vertical-align:middle;
}

.raid_management table td input {
    text-align:center;
    width:40px;
}

small.ign {
    font-size:0.9em;
    color:#777;
    font-style:italic;
}

/* All Rosters. */

.roster_box {
    border-left:20px solid #C20000;
    clear:both;
    margin-bottom:10px;
    -webkit-border-radius:4px 0 0 4px;
            border-radius:4px 0 0 4px;
}

.roster_box:last-child {
    margin-bottom:20px;
}

.roster_box_inner {
    padding:10px 10px 0 10px;
    border:1px solid #CCC;
    background-color:#FFF;
    border-left:0;
    -webkit-border-radius:0 4px 4px 0;
            border-radius:0 4px 4px 0;
}

.roster_box_inner_primary {
    border:2px solid #C20000;
    margin-left:2px;
}

.roster_box_main {
    margin-bottom:10px;
}

.roster_box_signed {
    border-left-color:#C20000;
}

.roster_box_details {
    padding-top:10px;
    border-top:1px solid #CCC;
}

.roster_box h2 {
    font-size:1.4em;
    letter-spacing:-0.04em;
    margin-bottom:0;
}

.roster_box_buttons {
    float:right;
}

.roster_box_buttons img {
    display:block;
    float:right;
    margin-left:5px;
}

.roster_box_icons {
    float:left;
    margin-right:5px;
}

.roster_box_icons img {
    margin-left:0;
    margin-right:5px;
    float:left;
}

.roster_box_title {
    color:#C20000;
    font-weight:bold;
    letter-spacing:-0.05em;
    font-size:1.4em;
    line-height:1;
}

/* Calendar. */

.calendar {
    border-collapse:collapse;
     table-layout: fixed;
}

.calendar_controls {
    margin-right:1px;
    padding:5px;
    background-color:#C20000;
    background-image:linear-gradient(to bottom, #d77f7f 0px, #ef3f3f 1px, #C20000 101%);
    text-align:center;
    -webkit-border-radius:4px 4px 0 0;
            border-radius:4px 4px 0 0;
}

.calendar thead th,
.calendar thead th:first-child {
    border-left:1px solid #333;
    border-right:1px solid #333;
    text-align:center;
}

.calendar td {
    border:1px solid #DDD;
    text-align:left;
    padding:0px;
    cursor:pointer;
}

.calendar tbody tr:nth-child(even) td {
    background-color:#FBFBFD;
}

.calendar .calendar_diff_month,
.calendar tbody tr:nth-child(even) td.calendar_diff_month {
    background:#EEE;
    color:#BBB;
}

.calendar tbody tr:nth-child(even) td.calendar_today,
.calendar .calendar_today {
    background:#F99;
}

.calendar .calendar_past {

}

.calendar_day_head {
    font-size:0.9em;
    font-weight:bold;
    padding:3px;
}

.calendar_day_body {
    font-size:0.85em;
    min-height:100px;
    padding:0 3px 0 3px;
}

.calendar_fixture,
.calendar_fixture:link,
.calendar_fixture:visited {
    background:#C20000;
    color:#FFF;
    cursor:pointer;
    display:block;
    margin-bottom:3px;
    padding:3px;
    text-decoration:none;

    -webkit-border-radius:4px;
            border-radius:4px;
}

.calendar_fixture:hover,
.calendar_fixture:active {
    background:#7755DD;
    color:#FFF;
    text-decoration:none;
}

.calendar_fixture img {
    float:right;
    margin-left:2px;
    margin-bottom:2px;
    display:block;
    height:16px;
}

.calendar_fixture_past,
.calendar_fixture_past:link,
.calendar_fixture_past:visited {
    background-color:#666;
    opacity:0.4;
}

.calendar_fixture_past:hover,
.calendar_fixture_past:active {
    background-color:#999;
}

.calendar_fixture_signed,
.calendar_fixture_signed:link,
.calendar_fixture_signed:visited {
    background-color:#5A5;
    border:1px solid #070;
}

.calendar_fixture_signed:hover,
.calendar_fixture_signed:active {
    background-color:#0A0;
}

.calendar_fixture_cancelled,
.calendar_fixture_cancelled:link,
.calendar_fixture_cancelled:visited {
    background-color:#C99;
    border:1px dashed #D00;
    opacity:0.4;
    cursor:not-allowed;
    text-decoration:line-through;
}

.calendar_fixture_cancelled:hover,
.calendar_fixture_cancelled:active {
    background-color:#C99;
}

/* View Fixture. */

.fixture_box {
    background:#FFF;
    border:2px solid #C20000;
    border-top-width:20px;
    padding:10px;
    position:relative;
    margin-bottom:20px;

    -webkit-border-radius:4px;
            border-radius:4px;
}

.fixture_header {
    position:relative;
    padding-bottom:10px;
    border-bottom:1px dotted #C20000;
    margin-bottom:10px;
}

.fixture_header_inner {
    float:left;
    margin-left:10px;
}

.fixture_header h2 {
    font-size:1.4em;
    margin-bottom:0px;
}

.fixture_header img {
    float:left;
}

.fixture_details {
    clear:both;
    font-size:1.1em;
}

    .fixture_details table {
        margin:0;
    }

    .fixture_details table h3 {
        font-size:1em;
        color:#C20000;
        border-bottom:1px dotted #C20000;
        margin-top:10px;
        padding-bottom:6px;
        margin-bottom:6px;
    }

.fixture_signups {
    background:url('../images/ui/loading.gif') no-repeat center;
    min-height:52px;
}

.reserve_player td,
.reserve_player td a {
    background:#EEE !important;
    color:#AAA;
    font-style:italic;
}

.tentative_player td,
.tentative_player td a {
    background:#FFE !important;
    color:#d7a359;
}

.comment {
    clear:both;
    border-bottom:1px solid #CCC;
    margin-bottom:16px;
    padding-bottom:16px;
}

    .comment_left {
        float:left;
        width:25%;
    }

    .comment_left span {
        font-size:1.1em;
    }

    .comment_right {
        float:right;
        width:74%;
    }

        .comment_response {
            border-left:1px solid #CCC;
            color:#888;
            font-style:italic;
            padding-left:16px;
            margin-top:16px;
        }

.signup_main,
.signup_roles {
    margin-bottom:20px;
}

.signup_box,
.signup_role_box,
.signup_status_box {
    background:#FFF url('../images/ui/cross.png') no-repeat 10px center;
    border:1px solid #CCC;
    border-left-width:20px;
    clear:both;
    color:#900;
    cursor:pointer;
    font-size:1.3em;
    font-weight:bold;
    line-height:28px;
    margin-bottom:10px;
    padding:6px 6px 6px 34px;

    -webkit-border-radius:4px;
            border-radius:4px;
}

.signup_role_box,
.signup_status_box {
    padding:4px 6px 4px 34px;
    font-size:1.1em;
    line-height:24px;
    margin-bottom:10px;
}

.signup_box:last-child,
.signup_role_box:last-child,
.signup_status_box:last-child {
    margin-bottom:0;
}

.signup_box_signed,
.signup_role_box_signed,
.signup_status_box_definite {
    background:#e5ede5 url('../images/ui/tick.png') no-repeat 10px center;
    border-color:#090;
    border-width:2px;
    border-left-width:20px;
    color:#090;
}

.signup_status_box_tentative {
    background:#e5ede5 url('../images/ui/question.png') no-repeat 10px center;
    border-color:#d7a359;
    border-width:2px;
    border-left-width:20px;
    color:#d7a359;
}

/* Colours. */

.win,
.avail_high {
    color:#59BB3F;
}

.loss,
.avail_low {
    color:#D91318;
}

.draw {
    color:#3880c4;
}

.avail_med {
    color:#F07F1A;
}

.avail_low,
.avail_med,
.avail_high {
    font-size:1.2em;
    font-weight:bold;
    text-decoration:none;
}

a.grey {
    color:#999 !important;
}
