html {
    padding: 0;
    margin: 0;
}

body {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 14px;
    color: #36353a;
    overflow-y: scroll;
    margin: 0 auto;
    text-align: left;
}

/* Adding the background only to the main page, not to any embeded sub-pages. */
body.main {
    background-color: #EEEEEC;
}

strong {
    font-weight: bold;
}

p {
    font-size: 14px;
    margin-bottom: 10px;
}

a {
    color: #406895;
}

a:link {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

label {
    display: inline;
    margin: 0;
    font-size: 14px;
}

label input {
    display: inline-block;
}

select {
    padding: 3px 0;
    background-color: #f8f6f7;
    border: 1px solid #d0d0d0;
}

#wrapper {
	/* Make the width proportional to screen size. */
    width: 90%;
    /* No margin at the top or bottom, while auto margin left and right makes it
     * centered. */
    margin: 0 auto 0 auto;

    /* Putting 7px of padding at the top and bottom. */
    padding-top: 7px;
    padding-bottom: 7px;
}

header {
    text-align: center;
    line-height: 20px;
    margin-top: 20px;
}

/* Used for the div that wraps around the logo text in the header. */
.logo-wrapper {
	text-align: center;
	margin-top: 20px;
}

.logo, .logo:hover {
    font-family: 'Audiowide', Arial, sans-serif;
    font-size: 52px;
    font-weight: bold;
    color: transparent;
    text-shadow: 0 0 1px rgba(92, 87, 89, 0.8), 0 0 0 black;
}

.logo-producer {
    font-family: 'Audiowide', Arial, sans-serif;
    font-size: 18px;
    margin-left: 20px;
    color: rgba(54, 52, 53, 0.8);
}

.logo-producer a {
    color: rgba(54, 52, 53, 0.8);
}

.logo-subtitle {
    margin-top: 4px;
    font-family: 'Audiowide', Arial, sans-serif;
    font-size: 14px;
    color: rgba(54, 52, 53, 0.8);
}

.logo.long-text {
    font-size: 2.5em;
    letter-spacing: -0.1em;
    font-weight: normal;
}

.main-content-headline {
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 15px;
    font-weight: bold;
    color: rgba(54, 52, 53, 0.8);
}

.box-shadowed {
    box-shadow: 0 0 4px #dbdbdb;
}

.box-bordered {
    border: 1px solid #d9dde1;
    padding: 2px;
}

.icon-ftp-search-128 {
    background: url('/images/ftp-search.png') no-repeat;
    width: 128px;
    height: 128px;
    display: inline-block;
}

.middle-aligned {
    vertical-align: middle;
}

.display-inline-block {
    display: inline-block;
}

.display-block {
    display: block;
}

.fcentered {
    text-align: center;
}

.fleft {
    text-align: left;
}

.fright {
    text-align: right;
}

.fbold {
    font-weight: bold;
}

.floatleft {
    float: left;
}

.floatright {
    float: right;
}

.top-spaced-minor {
    margin-top: 7px;
}

.top-spaced-major {
    margin-top: 25px;
}

.centered {
    margin: 0 auto;
}

.clearboth {
    clear: both;
}

.inner-table-link {
    padding: 5px;
}

.separator-subtle {
    border-top: 1px solid #d9dde1;
}

.separator-active {
    border-top: 2px solid #012E61
}

input[type=submit].button-bright, button.button-bright {
    box-sizing: content-box;
}

.button-highlighted {
    background-color: #1b609f;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    height: 26px;
    line-height: 26px;
    display: inline-block;
    padding: 2px 6px;
    cursor: pointer;
}

input[type=submit].button-highlighted, button.button-highlighted {
    box-sizing: content-box;
}

#main-content-container {
    border: 1px solid #cecece;
    border-top: 0;
    background-color: #fff;
    box-shadow: 0px 0px 4px #DBDBDB;
}

#main-content-wrapper {
    min-height: 380px;
    padding: 30px 7px 10px 7px;
}

.image-loader {
    display: inline-block;
    width: 32px;
    height: 32px;
    background: url('/images/ajax-loader.gif') no-repeat;
}

.button-small {
    height: 18px;
    padding: 4px 10px;
    color: white;
    box-sizing: content-box;
    border-radius: 4px;
    border: 0;
    cursor: pointer;
    text-decoration: none;
}

.button-large {
    height: 30px;
    padding: 3px 15px;
    color: white;
    box-sizing: content-box;
    border-radius: 5px;
    border: 0;
    cursor: pointer;
}

.hr {
    border: 1px solid #dedede;
    border-bottom: 0;
}

.logo-large {
    font-size: 46px;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 10px;
    display: block;
}

.icon24 {
    width: 24px;
    height: 24px;
    background: url('/images/sprite-2013-01-15.png');
    background-repeat: no-repeat;
    display: inline-block;
}

.icon24-server-status-unknown {
    background-position: -240px 0;
}

.icon24-server-status-ok, .icon24-accept {
    background-position: -200px 0;
}

.icon24-server-status-failure {
    background-position: -280px 0;
}

.icon16 {
    width: 16px;
    height: 16px;
    background: url('/images/sprite-2013-01-15.png');
    background-repeat: no-repeat;
    display: inline-block;
}

.icon16-directory {
    background-position: -160px 0;
}

.icon16-file {
    background-position: -140px 0;
}

.icon16-community-default {
    background-position: -140px 0;
}

.icon16-community-commodore {
    background-position: 0 0;
}

.icon16-community-apple-2 {
    background-position: -20px 0px;
}

.icon16-community-atari {
    background-position: -40px 0;
}

.icon16-community-microbee {
    background-position: -60px 0;
}

.icon16-community-tandy {
    background-position: -80px 0;
}

.icon16-community-bbc-micro {
    background-position: -100px 0;
}

.icon16-community-oric {
    background-position: -120px 0;
}

.icon16-community-bitsavers {
    background-position: -180px 0;
}

.icon16-community-amiga {
    background: url('/images/amiga.png');
}

.user-area {
    font-family: 'Open Sans', Arial, sans-serif;
	background-color: #777373;
	color: white;
    padding: 0px 6px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-right: 0;
    margin: -10px 0 10px 0;
    box-shadow: 0px 0px 1px #333436 inset;
    font-size: 12px;
}

.user-area a {
    color: white;
}

.form-logout {
    display: inline;
    margin: 0;
}

.button-logout {
    vertical-align: middle;
    color: white;
    background-color: transparent;
    border: 0;
    cursor: pointer;
    padding: 0;
    margin: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    line-height: 19px;
    display: block;
    font-size: 12px;
}

.menu-bar-container {
    display: inline-block;
    font-family: 'Open Sans', Arial, sans-serif;
    height: 27px;
    line-height: 25px;
    border: 1px solid #cecece;

    background: #fcfcfc; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZjZmNmYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjIwJSIgc3RvcC1jb2xvcj0iI2ZjZmNmYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2VmZWZlZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2ZjZmNmYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmY2ZjZmMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #fcfcfc 0%, #fcfcfc 20%, #efefef 50%, #fcfcfc 80%, #fcfcfc 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcfcfc), color-stop(20%, #fcfcfc), color-stop(50%, #efefef), color-stop(80%, #fcfcfc), color-stop(100%, #fcfcfc)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #fcfcfc 0%, #fcfcfc 20%, #efefef 50%, #fcfcfc 80%, #fcfcfc 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #fcfcfc 0%, #fcfcfc 20%, #efefef 50%, #fcfcfc 80%, #fcfcfc 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #fcfcfc 0%, #fcfcfc 20%, #efefef 50%, #fcfcfc 80%, #fcfcfc 100%); /* IE10+ */
    background: linear-gradient(to bottom, #fcfcfc 0%, #fcfcfc 20%, #efefef 50%, #fcfcfc 80%, #fcfcfc 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#fcfcfc', GradientType=0); /* IE6-8 */

    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;

    position: relative;
    top: 4px;
    margin: 0 auto;
}

.menu-bar {
    display: inline-block;
    padding: 0;
    margin: 0;
}

.menu-bar > li {
    display: inline-block;
    border-right: 1px solid #cecece;
    float: left;
    line-height: 25px;
}

.menu-bar > li.selected {
    background-color: #777272;
    color: #FFF;
    box-shadow: 0px 0px 15px #333436 inset;
}

.menu-bar > li:hover {
    background-color: #777272;
    color: #FFF;
    box-shadow: 0px 0px 8px #333436 inset;
}

.menu-bar > li:first-child {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.menu-bar > li:last-child {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-right: 0;
}

.menu-bar .link {
    color: #636363;
    text-decoration: none;
    padding: 0 12px;
    display: inline-block;
    font-weight: bold;
    border-bottom: 1px solid transparent;
}

.menu-bar .selected .link, .menu-bar .link:hover {
    color: white;
}

tr.recent td {
    background-color: #f8ffc7 !important;
}

.form {
    display: table;
    background-color: #e8e8e8;
    border-spacing: 1px;
}

.form > div.form-row {
    display: table-row;
    vertical-align: top;
}

.form > div.form-row > div.caption {
    display: table-cell;
    text-align: left;
    min-width: 105px;
    vertical-align: top;
    font-weight: bold;
    padding-right: 10px;
    font-size: 110%;
    background-color: #f5f5f5;
    padding: 7px;
}

.form > div.form-row > div.content {
    display: table-cell;
    vertical-align: top;
    padding: 7px;
    text-align: left;
    background-color: #fff;
}

input#follow-checkbox {
	margin-top: 0;
}

.button {
    cursor: pointer;
    font-weight: bold;
    font-size: 13px;
    background-image: -webkit-gradient(linear, left top, left bottom, from(whiteSmoke), to(#F1F1F1));
    background-image: -webkit-linear-gradient(top, whiteSmoke, #F1F1F1);
    -webkit-border-radius: 2px;
    -webkit-user-select: none;
    background-color: whiteSmoke;
    background-image: linear-gradient(top, whiteSmoke, #F1F1F1);
    background-image: -o-linear-gradient(top, whiteSmoke, #F1F1F1);
    padding: 2px 10px;
    height: 20px;
    line-height: 20px;

    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -o-box-sizing: content-box;
    box-sizing: content-box;

    border: 1px solid #C6C6C6;
    display: -moz-inline-box;
    display: inline-block;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    text-align: center;

    text-decoration: none;

    color: #555;

    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.button:hover {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f1f1f1));
    background-image: -webkit-linear-gradient(top, #f8f8f8, #f1f1f1);
    background-color: #f8f8f8;
    background-image: linear-gradient(top, #f8f8f8, #f1f1f1);
    background-image: -o-linear-gradient(top, #f8f8f8, #f1f1f1);
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    box-shadow: 1px 1px 3px #e4e4e4;
    border-color: #aeaeae;
    text-decoration: none;
}

.button.large {
    height: 24px;
    line-height: 24px;
    padding: 2px 15px;
    font-size: 110%;
}

.button.compact {
    padding: 1px 4px;
}

.button.search {
    color: #fff;
    height: 29px;
    line-height: 29px;
    border: 1px solid #557766;
    background-color: #4BA822;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.01, #2B8802), color-stop(1.00, #4BA822));
    background-image: -moz-linear-gradient(center bottom, #2B8802 1%, #4BA822 100%);
    text-shadow: #333333 0px 1px 0px;
}

.button.search:hover {
    background-color: #56C325;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.01, #36a305), color-stop(1.00, #56C325));
    background-image: -moz-linear-gradient(center bottom, #36a305 1%, #56C325 100%);
}

ul.section-menu {
    text-align: center;
    padding: 3px;
    margin: 0;
}

ul.section-menu a:hover {
    text-decoration: none;
}

ul.section-menu li {
    display: inline-block;
}

.subtle-button {
    height: 30px;
    line-height: 24px;
    vertical-align: middle;
    padding: 2px 15px 2px 15px;
    display: inline-block;
    border: 1px solid transparent;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #555;
}

.subtle-button:hover {
    background-color: #f3f3f3;
}

.subtle-button.compact {
    height: 26px;
    line-height: 21px;
    padding: 2px 12px 2px 12px;
}

.subtle-button.very-compact {
    height: 26px;
    line-height: 21px;
    padding: 2px 4px 2px 4px;
}

.subtle-button.selected {
    background-color: #f3f3f3;
    border-color: #d6d6d6;
    color: #005580;
}

.subtle-button.letter-filter {
    padding: 2px 8px 2px 8px;
    background-color: white;
    border-color: #d6d6d6;
    color: black;
}

.subtle-button.letter-filter.selected {
    padding: 2px 10px 2px 10px;
    background-color: #f3f3f3;
    border-color: #d6d6d6;
    color: #005580;
}

a.subtle-button {
    text-decoration: none;
}

.block-section-title {
    display: block;
    background-color: whiteSmoke;
    border: 1px solid #DEDEDE;
    padding: 3px 5px 4px 5px;
    font-size: 116%;
    font-weight: bold;
}

.footer {
    padding: 8px;
    color: #666464;
    text-align: left;
    font-size: 90%;

    border: 1px solid #cecece;
    border-top: 0;
    background-color: #f7f7f7;

    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    box-shadow: 0px 0px 4px #DBDBDB;
}

.small-text {
    font-size: 90%;
}

.menu-drop-down-activator {
    position: relative;
}

.menu-drop-down {
    border: 1px solid #e3e3e3;
    border-top: 1px solid #d0d0d0;
    background-color: #f8f6f7;
    color: #7b7c7e;
    position: absolute;
    top: 25px;
    left: -1px;
    display: none;
    font-size: 90%;
    min-width: 130px;
    margin: 0;

    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.menu-drop-down li {
    color: #636363;
    text-decoration: none;
    font-weight: bold;
    border-bottom: 2px solid transparent;
    text-align: left;
    list-style: none;
}

.menu-drop-down li a {
    padding: 4px 8px;
    display: block;
    color: #636363;
}

.menu-drop-down li:hover a {
    color: #1B609F;
}

.browser-search-engine-add {
    background: url('/images/favicon.png') no-repeat left;
    padding-left: 22px;
}

#header {
    background: #fcfcfc; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZjZmNmYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlN2U3ZTciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #fcfcfc 0%, #e7e7e7 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcfcfc), color-stop(100%, #e7e7e7)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #fcfcfc 0%, #e7e7e7 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #fcfcfc 0%, #e7e7e7 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #fcfcfc 0%, #e7e7e7 100%); /* IE10+ */
    background: linear-gradient(to bottom, #fcfcfc 0%, #e7e7e7 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#e7e7e7', GradientType=0); /* IE6-8 */

    border: 1px solid #cecece;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;

    height: 115px;

    box-shadow: 0 0 7px #dbdbdb;
}

.backcolor-highlighted {
    background-color: #1b609f;
}

.backcolor-bright {
    background-color: #569f1b;
}

.color-bright {
    color: #569f1b;
}

.color-highlighted {
    color: #1b609f;
}

.color-success {
    color: #569f1b;
}

.color-error {
    color: #E33904;
}

.color-tooltip {
    color: #666464;
}

.breadcrumbs {
    font-size: 19px;
    font-weight: bold;
    color: #555;
    display: block;
    margin: 5px 0 15px 10px;
}

.breadcrumbs li {
    display: inline-block;
    list-style: none;
}

.breadcrumbs .crumb {
    color: #000;
}

.breadcrumbs a.crumb {
    color: #135cae;
}

.table-file-browser td.icon, .table-file-browser th.icon {
    border-right: 0;
    width: 16px;
}

.table-file-browser td.name, .table-file-browser th.name {
    border-left: 0;
}

ul.validation-errors {
    color: #e33904;
    font-weight: bold;
    margin: 5px 0 0 0;
    list-style: none;
}

.alert-info {
    color: #2C566B;
    background-color: rgba(231, 233, 234, 1);
    border-color: rgba(182, 205, 210, 1);
}

/* Override default alert colors */
.alert-warning {
    background-color: #FCEEA2;
}

.alert-warning, .alert h4 {
    color: #A77217;
}

.btn-major {
    font-weight: bold;
}

.highscore-info {
    font-weight: bold;
}

.trophy-on-score {
    max-width: 15%;
    vertical-align: middle;
    position: absolute;
    left: 1%;
    top: 3%;
}

#highscores-menu-bar {
    /* Pushes the highscore menu bar down a little bit to get it to match up
     * with the bottom of the header.
     * TODO: We should get these menubars positioned better. */
    bottom: -7px;
    position: relative;
}

#highscores-menu-bar .btn {
    border-radius: .5rem;
}

#highscores-menu-bar .simple-menu .btn:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#highscores-menu-bar .simple-menu .btn:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#highscores-menu-bar .btn-group .btn-group:not(:first-child) .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#highscores-menu-bar .btn-group .btn-group:not(:last-child) .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

table.game td {
    padding: 0 6px;
}

.games-list li {
    list-style: none;
    margin: 5px 2px;
    padding-bottom: 15px;
    margin-bottom: 30px;
}

.game-info {
    font-size: 16px;
    padding: 10px 0;
    border: 1px solid #CECECE;
    border-top: 0;
    background: white;
}

.badge-rank {
    font-size: 1.2rem;
    display: block;
    border-radius: 0;
    padding-right: 0;
    padding-left: 0;
    border: 1px solid #CECECE;
    border-bottom: 0;
    padding: 8px 0;
}

.highest-score {
    background: rgba(172, 211, 172, 0.41);
}

.panel {
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    border: 1px solid #E3E3E3;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05) inset;
    border-radius: 3px;
    background-color: #FEFEFE;
    padding: 0px;
}

.panel-default {
}

.panel-heading {
    border-bottom: 1px solid #DEDEDE;
    background-color: #EDEDEF;
}

.panel-heading h4 {
    margin: 0;
    padding: 6px;
}

.panel-body {
    padding: 10px;
}

.websearch-results-count {
    background-color: #FEFEFE;
    border: 1px solid #A2B4FF;
    padding: 3px 5px;
    border-radius: 4px;
    color: #3F3F3F;
    font-style: italic;
    font-size: 13px;
    display: inline-block;
    margin-bottom: 15px;
}

.websearch-results-container {
    margin: 0px;
    padding: 0px;
    margin-left: 30px;
}

.websearch-result-entry {
    padding: 0px;
    margin: 0px 0px 25px;
    font-size: 16px;
    color: #333;
}

.websearch-result-boost {
    color: #808080;
    float: right;
    font-size: 11px;
    font-weight: normal;
    margin-left: 10px;
}

.websearch-result-title {
    font-weight: bold;
    display: block;
    margin-bottom: 5px;
    font-size: 16px;
}

.websearch-result-link, .websearch-result-link:hover {
    color: #B12F11;
    display: block;
    font-weight: normal;
    font-size: 13px;
    margin-bottom: 5px;
}

.websearch-result-content-snippet {
    font-size: 14px;
}

.scoreboard-table {
    width: 800px;
    margin: 0 auto;
    display: table;
    padding: 10px;
    background-color: white;
    border: 1px solid #cecece;
    position: relative;
}

.scoreboard-column:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    border-left: 1px solid #D7D7D7;
    margin-left: -15px;
    width: 1px;
}

.scoreboard-column {
    width: 235px;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
}

.scoreboard-column-first {
    margin: 0;
}

.scoreboard-column-first:before {
    border-left: none;
}

.scoreboard-column ol {
    margin-left: 40px;
    margin-top: 20px;
}

.scoreboard-column ol li:nth-child(even) {
    background-color: #FAFAFA;
}

.competition-results .scoreboard-nav .nav-btn {
    width: 20px;
    font-size: 16px;
    text-align: center;
    background-color: #D7D7D7;
    color: #000;
    padding: 3px;
    border-radius: 3px;
    font-weight: bold;
}

.competitions p {
    margin-bottom: 0;
}

.competitions .date-countdown {
    margin-left: 2em;
    font-size: 0.7em;
    font-weight: bold;
}

.category-platform-game-input-group {
    min-width: 33em;
}

/*
Changes by Mykola Kadutskyi
*/

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

.pagination > li {
    display: inline;
}

.pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}

.pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}

.pagination a {
    text-decoration: none !important;
}

.pagination-lg > li > a, .pagination-lg > li > span {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #337ab7;
    border-color: #337ab7;
}

.pagination-container {
    text-align: center;
    width: 100%;
}

.menu-drop-down {
    z-index: 5;
}

.dz-default.dz-message {
    text-align: right !important;
}

.dropzone {
    border: none !important;
    background-repeat: no-repeat !important;
    text-align: right;
    padding: 0px 54px !important;
    margin: 0 123px;
}

/*Search bar styles*/
.search-results {
    position: relative;
    display: none;
    width: 100%;
    height: 130px;
    border: 1px solid grey;
    border-radius: 10px;
    background: #fcfcfc;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #fcfcfc 0%, #e7e7e7 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcfcfc), color-stop(100%, #e7e7e7));
    background: -webkit-linear-gradient(top, #fcfcfc 0%, #e7e7e7 100%);
    background: -o-linear-gradient(top, #fcfcfc 0%, #e7e7e7 100%);
    background: -ms-linear-gradient(top, #fcfcfc 0%, #e7e7e7 100%);
    background: linear-gradient(to bottom, #fcfcfc 0%, #e7e7e7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#e7e7e7', GradientType=0);
}

.search-results ul li {
    padding-left: 10px;
    padding-right: 35px;
}

.search-results ul {
    overflow-y: scroll;
    overflow-x: hidden;
    width: 1000px;
    height: 130px;
    margin: 0;
}

.search-bar {
    text-align: center;
}

.search-bar i {
    cursor: pointer;
}

.search-results .icon-remove {
    cursor: pointer;
    position: absolute;
    top: 3px;
    right: 5px;
}

.search-panel {
    display: inline-block;
}

.search-panel input {
    margin: 0;
}

.search-results {
    margin-top: 5px;
    overflow: hidden;
}

.button-block {
	margin: 5px;
	display: block;
}

.js-change-webdrive-file-description-box {
	cursor: pointer;
}

.js-webdrive-file-new-description {
	width: 95%;
	margin-top: 10px;
}

div.banner-exchange {
	text-align: center;
	margin: 2.5em;
}

.banner-exchange iframe {
	width: 468px;
	height: 60px;
	border: 0;
}

.banner-exchange a {
    font-size: 0.8rem;
}

iframe.news-bar {
	width: 100%;
	height: 25px;
	border: 0;
}

/* Makes drop-down menus scroll if they are more than about 10 lines */

.dropdown-menu {
    max-height: 20rem;
    overflow-y: auto;
}

.games-list {
    margin-left: 0;
}

#game-image-carousel {
    text-align: center;
}

#game-image-carousel .carousel-indicators {
    background-color: rgba(0,0,0,0.3);
    border-radius: 0.2em;
}

#game-image-carousel .carousel-item {
    height: 240px;
}

#game-image-carousel img {
    max-height: 190px;
    max-width: 190px;
}

/* Make the nav lists not indented */

ul.nav {
    margin-left: 0;
}

/* Bootstrap 2 -> 4 Compat Stuff */

ol, ul {
    padding: 0;
    margin-left: 1.5rem;
}

ul.list-group {
    margin-left: 0;
}

img {
    max-width: 100%;
}

.hide {
    display: none;
}

.card {
    margin-bottom: 20px;
}

.tab-content {
    margin-top: 1.5rem;
}

.medium-form {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

/* Allows for buttons with a similar look to the old Bootstrap 2 ones */

.btn-bs2 {
    background-color: #f5f5f5;
    background-image: linear-gradient(to bottom,#fff,#e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #ccc;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
}

.btn-bs2:hover, .btn-bs2:focus {
    background-position: 0 -15px;
    transition: background-position .1s linear;
}

.btn-bs2:hover {
    background-color: #e6e6e6;
}

.btn-bs2.active, .btn-bs2:active {
    background-image: none;
    outline: 0;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15), 0 1px 2px rgba(0,0,0,0.05);
}

.btn-bs2.disabled {
    background-image: none;
    opacity: .65;
}

.card.card-body {
    background-color: #f5f5f5;
}

/* End Bootstrap Compat Stuff */

#banner-iframe {
    border: none;
    width: 468px;
    height: 60px;
}

/******************
 * For /admin/
 ******************/

/******************
 * For /admin/themes
 ******************/

/* Make the labels on the themes form a little wider so they line up. */
.theme-form-label {
    min-width: 8em;
}

/*****************
 * For Donations
 *****************/

/* The funding level widget */
.funding-level-widget {
    margin-right: auto;
    margin-left: auto;
}

/* The squares for indicating the funding level */
.funding-level-square {
    display: inline;
}

.main-donate-button {
    position: absolute;
    right: 6%;
    top: 20px;
}