@font-face{ font-family: flags; src: url("img/BabelStoneFlags.woff2") format("woff2");}
.flags {font-family:flags;}

body {background-color: black; color:#d0d0d0; font-family:Verdana, Arial, Helvetica, sans-serif;}
h1,h2,h3,h4,h5,h6,p {margin: 0px; padding: 4px;}

input[type=button],input[type=submit] {cursor:pointer;}
input[type=button].bigbutton, input[type=submit].bigbutton {font-size: 20pt; padding: 12px 24px;}

hr:before {content: ''; position: absolute; left: 0; top: 50%; width: 100%; height: 1px; background: linear-gradient(to right, transparent, #fff, transparent); }
#popup_contents hr:before {background: linear-gradient(to right, transparent, black, transparent); }
hr { position: relative; border: 0; height: 1.5em; clear: both;}
textarea {resize:none;}
 
.error {background-color:#400000; color:#d0d0d0;}
.error ul {list-style-type: none;}

.bannerc {width:780px; margin:5px auto; text-align:center;}
.bannerc a img {border:0;}
.bannerc a {color: white; text-decoration:none;}

.main_menu, .main_menu_wide {margin:0 auto; width: 780px; border: 1px solid #404000; border-radius:8px;}
.main_menu a, .main_menu_wide a {color: #e0e0e0; display:block; text-decoration:none; width:calc(50% - 32px); float:left; margin:12px;}
.main_menu a:hover, .main_menu_wide a:hover {color: #e0e000;}
.main_menu .main_link_box, .main_menu_wide .main_link_box {width: 100%; background-color: #004000; padding: 8px; text-align:center; border-radius: 6px; position:relative;}
.main_menu a:hover .main_link_box, .main_menu_wide a:hover .main_link_box {background-color: #005800;}
.main_menu br, .main_menu_wide br {clear:both;}
.main_menu_wide a {width:calc(100% - 40px);}

.brief {width: 756px; margin: 20px auto;border: 1px solid #202020; border-radius:8px; background-color:#404040; padding: 12px;}
.foot {width: 780px; margin: 20px auto; text-align:center;}
.foot a {color: #d0d0d0;}
.foot a:hover {color: #f0f000;}

.brief table {width: 90%; margin: 0px auto;}
.brief td {vertical-align:top;}
.brief td input[type=text],.brief td input[type=password], .brief td textarea {width:98%; font-size: 14pt;}
.brief td input[type=submit] {font-size: 14pt;}
.brief a {color: #e0e000; text-decoration:none;}
.brief a:hover {color: #ffff00;}

.menuitem {background-color: #004000; color: #d0d0d0; width: calc(100% - 48px);margin: 12px; border: 1px solid #005800; border-radius: 8px; padding:12px; cursor:pointer;}
.menuitem:hover {background-color:#005800; color:#ffffff; border-color:#007000;}
.menuitemhalf {width: calc(49% - 48px); float:left;}
a .menuitem {color:#d0d0d0; text-decoration:none;}
a.buttondisabled .menuitem {background-color: #303030; border-color: #606060; color: #c0c0c0;}
.notier, .notier:hover {background-color: #303030; border-color: #606060; color:#d0d0d0; text-decoration:none; cursor:default;}

.datatable {border:1px solid #d8d8d8; border-collapse: collapse; border-spacing: 0;}
.datatable thead {background-color:black; color: #d8d8d8; }
.datatable thead th {text-align:left; padding: 6px;}
.datatable tbody td {text-align:left; padding: 4px;}

#popup_shadow {display:none; visibility:hidden; position:fixed; left:0px; right:0px; top:0px; bottom:0px; z-index: 500; background-color:black; opacity:0.4;}
#popup_container {display:none; visibility:hidden; border: 1px solid black; border-radius: 20px; position:fixed; z-index: 1000; background-color: white; color:black;}
#popup_container #popup_titlebar {background-color: black; color: white; border-top-left-radius: 20px; border-top-right-radius: 20px; padding-left: 16px;}
#popup_container #popup_contents {margin: 16px; min-width: 600px; min-height: 200px;}
#popup_contents {max-height: 800px; overflow-y:auto; overflow-x: hidden;}

.restriction table {width: 100%;}
.restriction table td { width:33%;}
.uploadbar_container {border:1px solid black; background-color:#303030; position:relative; width:100%;height:22px;}
.uploadbar_bar {background-color:#004000; position:absolute; left:0px; top:0px; height: 100%; z-index:1010;}
.uploadbar_percent {margin:0px auto; color:#c0c0c0;z-index:1050; position:absolute; left:5px; font-size:10pt;}
.pseudobutton {background-color: #004000; color: #d0d0d0; width: calc(100% - 48px);margin: 12px; border: 1px solid #005800; border-radius: 8px; padding:12px; cursor:pointer; text-align:center;}
.pseudobutton:hover {background-color: #006000; border-color:#007800;}

.filetoupload {margin:2px; padding: 3px; border: 1px solid #808080; border-radius:4px; min-height:122px; position:relative;}
.filetoupload ul {list-style-type: none;margin:0px; padding:0px;}
.filetoupload li {padding:3px;}
.filetoupload .uploadbar_container {position:absolute; width:unset; bottom:3px; left:3px; right:3px;}
.upload_status_uploading {background-color:#e19e17; color:black;}
.upload_status_processing {background-color: #e3e31b; color:black;}
.upload_status_success {background-color: #005000; color:white;}
.upload_status_success a {color:#ffff00;}
.upload_status_success .overwritten {float:right;}
.upload_status_error {background-color: #500000; color: white;}

.loadspinner {display: inline-block; position: relative; width: 80px; height: 80px; }
.loadspinner:after { content: " "; display: block; border-radius: 50%; width: 0; height: 0; margin: 8px; box-sizing: border-box; border: 32px solid #000; border-color: #000 transparent #000 transparent; animation: loadspinner 1.2s infinite; }
@keyframes loadspinner { 
    0% { transform: rotate(0); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
    50% { transform: rotate(900deg); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
    100% { transform: rotate(1800deg); }
}
.filetoupload .loadspinner {float:right; z-index:1200;margin-top:-10px;}

#uploadslist {max-height:600px; overflow:auto;}
.uploadlist {border-collapse:separate; border-spacing:2px; background-color:black; color:white; width:100%;}
.uploadlist th {text-align:left;}
.uploadlist th, .uploadlist td {padding: 3px; vertical-align: middle;}
.uploadlist td a {color:#004000;}
.uploadlist td a:hover {color:#008000;}
.uploadlist tr.row0 td {background-color:white; color:black;}
.uploadlist tr.row1 td {background-color:#A0C0A0; color:black;}
.uploadlist tr td.clickable {cursor:pointer;}
.uploadlist tr:hover td.clickable {background-color:#80F080; color:black;}
.uploadlist .deleter {cursor:pointer; vertical-align:middle; text-align:center; min-width: 20px;}
.uploadlist .deleter:hover {background-color:#400000; color:white;}
.uploadlist td.upload_published,.uploadlist td.upload_published a {background-color:#005000 !important; color:white !important;}
.uploadlist td.upload_unpublished,.uploadlist td.upload_unpublished a {background-color:#400000 !important; color:white !important;}
.uploadlist td.error,.uploadlist td.error a {background-color:black !important; color:white !important;}
.uploadlist .deleter a {color:#400000; font-weight:bold;}
.uploadlist .deleter:hover a, .uploadlist .deleter:hover a:hover,.uploadlist .deleter a:hover {color:white;}


.creator { width: 165px; height: 192px; float:left; border:1px solid #909090; position: relative; border-radius:4px;margin:5px;}
.creator h4 {position:absolute; left:0px; right:0px; bottom:0px; text-align:center; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; background-color:black;}
.creator img {width:165px; height: 165px;border-top-right-radius: 4px; border-top-left-radius: 4px; }
a .creator {color:#c0c0c0;}
a:hover .creator { border-color: white; color: white;}
a:hover .creator h4 { background-color: #001000;}

.downloadlist {list-style-type:none; margin:0px;}
.downloadlist li {text-indent: 0px; padding:3px;margin:0px;}
.downloadinfo th {text-align:right;}

.bigselect {font-size:18pt; margin:0 auto;}
.bigselect, .bigselect option {cursor:pointer;}

.conditionslist {max-height:600px; overflow:auto;}
.conditiontable {border-collapse:separate; border-spacing:2px; background-color:black; color:white; width:100%;}
.conditiontable th {text-align:left;}
.conditiontable th, .uploadlist td {padding: 3px; vertical-align: middle;}
.conditiontable td a {color:#004000;}
.conditiontable td a:hover {color:#008000;}
.conditiontable tr.row0 td {background-color:white; color:black;}
.conditiontable tr.row1 td {background-color:#A0C0A0; color:black;}
.conditiontable tr td.clickable {cursor:pointer;}
.conditiontable tr:hover td.clickable {background-color:#80F080; color:black;}
.conditiontable .deleter {cursor:pointer; vertical-align:middle; text-align:center; min-width: 20px;}
.conditiontable .deleter:hover {background-color:#400000; color:white;}
.conditiontable .deleter a {color:#400000; font-weight:bold;}
.conditiontable .deleter:hover a, .uploadlist .deleter:hover a:hover,.uploadlist .deleter a:hover {color:white;}


.accondition {width:95%; text-align:left;margin:2px; position:relative;border: 1px solid black; padding:2px; border-radius:6px;}
.accondition label {display:inline-block; min-width:220px; text-align:right;}
.accondition .acdeleter {background-color: #400000; color:white; position:absolute; height:100%; right: 0px; top:0px; bottom:0px; width:45px; font-size:16pt; padding:0px; text-align:center; border-top-right-radius: 6px; border-bottom-right-radius: 6px;}
.accondition .acdeleter span {vertical-align:middle; display: inline-block;}
.accondition .acdeleter:hover {cursor:pointer; background-color: #500000;}
.acconditionerror {border-color: #FF0000;}

.resdeleter {cursor:pointer; vertical-align:middle; float:right; margin-top:3px; text-align:center; min-width: 20px;}
.resdeleter {background-color:#400000; color:#c0c0c0;}
.resdeleter:hover {background-color:#800000; color:white;}

.verttab {padding:8px; text-align:center; border:1px solid black;margin:0px 0px 4px 0px; cursor: pointer;}
.verttabsel {background-color:#004000; color:white;}

.linkstable {border-collapse:separate; border-spacing:2px; background-color:black; color:white; width:100%;}
.linkstable td {background-color:white; color:black;}
.linkstable .deleter {cursor:pointer; vertical-align:middle; text-align:center; min-width: 20px;}
.linkstable .deleter:hover {background-color:#400000; color:white;}
.linkstable .expired, .linkstable .expired td {background-color:#c0c0c0; color:#404040;}
