article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { /* for compatibility */
    display: block;
}

@font-face {
    font-family: "Impact";
    src: url("/images/impact.ttf") format("truetype"), local('Impact');
}

.impact {
    font-family: "Impact", "Haettenschewiler", "Arial Narrow", Arial, sans-serif;
    font-weight: lighter;
    text-shadow: 3px 3px 3px #000;
    letter-spacing: 0.7px;
    color: #396;
}

@font-face {
    font-family: "3Dventure";
    src: url("/images/3dventur.ttf") format("truetype"), local('3Dventure');
}

.tdventure {
    font-family: "3Dventure", "Impact", "Haettenschewiler", "Arial Narrow", Arial, sans-serif;
    font-weight: lighter;
    text-shadow: 3px 3px 3px #000;
    letter-spacing: 0.7px;
    color: #396;
    font-size: 300%;
    margin: -.05em 0;
}

html {
    background-color:#141414;
    font-family:"Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
    font-size:12px;
    color:#fff;
}

h1 {
    font-weight:bold;
    font-size:18px;
    text-align:center;
}

a:link {
    color:#396;
}

a:visited, a:hover {
    color:#fff;
}

a:active {
    color:#444;
}

a.jslink {
    color:#396;
    text-decoration: underline;
    cursor: pointer;
}

textarea, input, select, option {
    font-family:"Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
    font-size:12px;
}
                
textarea.msp, input.msp, select.msp, option.msp {
    font-family:"Consolas", "Lucida Console", "Courier New", Courier, monospace;
    font-size:12px;
}

section#lbgprivacy {
    position: fixed;
    width: 100%;
    bottom: 0; 
    left: 0;

    background-color: #396;
    color: #000;
    text-align: center;
    font-size: 110%;
    
    border-top: 2px solid #000;
}

section#lbgprivacy a {
    color: #226;
}

section#lbgprivacy a:active {
    color: #fff;
}

#top {
    width:970px;
    background-color:#1e1e1e;
    margin:5px auto;
    padding:10px 5px;
    border:2px #000 solid;
    color:#fff;
    font-size:14px;
    border-radius: 5px;
    box-shadow: 5px 5px 3px #050505;
}
        
#logo {
    margin:0px 0px 0px 10px;
    float:left;
}

#social {
    float:right;
    margin-right:10px;
}

#social ul li {
    display:inline;
    padding:1px;
    margin-right:5px;
}

#social ul li img {
    border-radius: 5px;
    box-shadow: 2px 2px 1px #111;
}

#siteDownNotice {
    border: #F00 2px;
    background-color: #633;
    text-align: center;
    margin: 10px 0px;
}

#wrapper {
    width:970px;
    margin:5px auto;
    background:#000;
    padding:0px 10px 0px 10px;
}

#leftbar {
    width:140px;
    float:left;
    margin-left:10px;
    margin-right:13px;
}

.lbsegment, #electricleftovers {
    background:#1e1e1e;
    width:140px;
    border:2px #000 solid;
    font-size:14px;
    text-align:center;
    margin: 5px;
    margin-top: 0px;
    padding-bottom:5px;
    border-radius: 5px;
    box-shadow: 3px 3px 3px #050505;
}

.lbgnewmsg {
    font-weight: bold;
    color: #FF0;
    animation-name: lbgnewmsgGlow;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}

@keyframes lbgnewmsgGlow {
    from { color: #FF0; } to { color: #396; }
}

#navigation  ul {
    padding:0px 3px;
    width:auto;
    float:left;
    margin:0px 2px;
    list-style:none;
}

#navigation a {
    text-decoration:none;
}

#navigation a:link, #navigation a:visited {
    color:#396;
}

#navigation a:active {
    color:#80d890;
}

#navigation a:hover {
    background-color:#1e1e1e;
}

#navmenu {
    font-size: 125%;
    line-height: 29px;
}

#slideshow {
    width:140px;
    background:#1e1e1e;
    padding:10px;
    border:2px #000 solid;
    clear:both;
}
                
#content, #gamesection {
    background:#1e1e1e;
    border:2px #000 solid;
    width:570px;
    float:left;
    padding: 3px 5px 3px 5px;
    border-radius: 5px;
    box-shadow: 3px 3px 3px #050505;
}

#gameinfo {
    text-align: center;
}

.lbgnavigator {
    color: #777;
    text-shadow: 1px 1px 2px #000;
}

.lbgnavigator a {
    text-decoration: none;
}

.lbgnavigator a:visited {
    color: #396;
}

.lbgnavigator b {
    color: #FFF;
    text-shadow: 2px 2px 3px #000;
}

#recentdigest {
    width:85%;
    text-align:center;
    margin:auto;    
}

#recentdigest .recentdate {
     font-size:150%;
     font-weight:bold;
}

#recentdigest .recentthumb {
     width:10%;
}

#rightbar {
    width:190px;
    float:left;
    margin-right:10px;
}

.rbsegment {
    background:#1e1e1e;
    margin: 5px;
    margin-top: 0px;
    padding:10px 10px 5px 5px;
    border:2px #000 solid;
    border-radius: 5px;
    box-shadow: 3px 3px 3px #050505;
}

#recentposts, #pollopts {
    border: 1px solid #000;
    border-radius: 3px;
}

#recentposts tr td, #pollopts tr td {
    color: #fff;
    border: 1px solid #000;
    border-radius: 2px;
    padding: 2px;
}

#recentposts tr:nth-child(odd), #pollopts tr:nth-child(odd) {
    background: #141414;
}

#recentposts tr:nth-child(even), #pollopts tr:nth-child(even) {
    background: #101010;
}

#footer {
    width:970px;
    margin-left:auto;
    margin-right:auto;
    padding:10px;
    text-align:center;
    font-style:italic;
    clear:both;
}

.auto-style1 {
    text-align:center;
}

#myGallery {
    width: 580px !important;
    height: 120px !important;
}

.gamethumbs {
    width: 100%;
    font-size: 80%;
    text-align: center;
}

.gamethumbs td {
    vertical-align: top;
    padding-bottom: 5px;
    width: 20%;
}

a.playlistlink {
    text-decoration: none;
    font-size: 170%;
    color: #000;
    text-shadow: 0 0 0.2em #ccc;
    letter-spacing: -0.02em;
    margin: 0.3em;
}

a.playlistlink:active {
    text-shadow: #264;
    color: #fff;
}

tr.topshelfshow {
    display: none;
}


/* ----------------- Topnav menu ----------------- */

#topnav {
    font-size: 125%;
    clear:both;
    width:100%;
    margin:0px;
    padding:0px;
}

#topnavbar {
    width:100%;
    margin:0px;
    background: linear-gradient(
        to right,
        rgba(20,20,20,0) 1%,
        rgba(20,20,20,1) 3.5%,
        rgba(20,20,20,1) 96.5%,
        rgba(20,20,20,0) 99%
        );
    border-top: 2px solid;
    border-bottom: 2px solid;
    border-image: linear-gradient(
        to right,
        rgba(102,102,102,0) 0%,
        rgba(102,102,102,1) 3.5%,
        rgba(102,102,102,1) 96.5%,
        rgba(102,102,102,0) 100%
        ) 2;
    padding: 0px;
    
    position: relative;
    left: -50px;
    padding-left: 50px;
    padding-right: 50px;
}

#topnavbar>li {
    display:inline-block;
    margin: 1px 0px;    
    padding:4px 15px;
}

#topnavbar>li:hover {
    background-color:#1e1e1e;
}

#topnavbar>li:hover .dropdown, #topnavbar>li:active .dropdown {
    display: block;
}

#topnavbar>li:hover .dropdown .dropsubmenu, #topnavbar>li:active .dropdown .dropsubmenu {
    display: none;
}

#topnav a {
    color:#396;
    text-decoration:none;
}

#topnav a:active {
    color:#80d890;
}

#topnavbar>li .dropdown {
    position: absolute;
    display: none;
    top: 100%;
    background-color: #141414;
    border: #666 1px solid;
    border-radius: 3px;
    padding: 0px;
    margin: -1px;
    margin-left: -5px;
    z-index: 99;
    box-shadow: 3px 3px 3px #000;
}

#topnavbar>li .dropsubmenu {
    margin-top: -2em;
    left: 100%;
    width: 100%;
}

#topnavbar>li .dropsubmenuitem:hover .dropsubmenu, #topnavbar>li .dropsubmenuitem:active .dropsubmenu {
    display: block;
}

.dropdown>li {
    display: block;
    padding: 4px 15px;
}

.dropdown>li:hover {
    background-color: #1e1e1e;
}

li#lbgsocial {
    float: right;
}

li#lbgsocial:hover {
    background-color: inherit;
}

li#lbgsocial address {
    display: inline;
    float: right;
    margin: 0;
    padding: 0;
    vertical-align: middle;
}

li#lbgsocial address img {
    margin-left: 5px;
    max-height: 1.3em;
    width: auto;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    border-radius: 5px;
}

li#lbgsocial address img:hover {
    filter: none;
    -webkit-filter: none;
}

/* ----------------- Game List ----------------- */

.gltoggle {
    position: absolute;
    top: 10px;
}

.gltoggle img {
    border-radius: 10px;
    box-shadow: 1px 1px 3px #050505;
}

#filterbox {
    display: none;
    position: absolute;
    left: 10px;
    top: 50px;
    background-color: #333;
    border: 1px solid #000;
    border-radius: 5px;
    box-shadow: 2px 2px 3px #000;
}

/* ----------------- Comments ----------------- */

#comments {
    width: 75%;
    margin: auto;
}

#comments .smilie, #recentnews .smilie, .commentmaint .smilie {
    max-height: 1.5em;
    width: auto;
}

#commentarea:empty {
    text-align: center;
    padding-bottom: 10px;
}

#commentarea:empty::before {
    content: 'There are currently no comments for this video.';
}

.commentcontent {
    width: 100%;
    padding-bottom: 20px;
}

.commentheader {
    padding-bottom: 5px;
}

.commentheader a {
    text-decoration: none;
}

.commenttime {
    font-size: 80%;
    color: #777;
}

.commentmod {
    font-size: 85%;
    padding-top: .5em;
}

.commentmod a {
    color: #396;
    text-decoration: none;
}

.commentspam {
    text-align: center;
    color: #777;
}

/* ----------------- LowBiasMonthly ----------------- */

.monthlylist {
    text-align: center;
    padding: 0px;
    margin: auto;
}

.monthlylist>li {
    display: inline;
    font-size: 150%;
    padding: 0.5em;
}

.monthlylist>li:hover {
    background-color: #333;
}

.monthlylist a {
    text-decoration: none;
    color: #396;
}

.monthlylist a:active, .monthlyselected a {
    color: #80d890;
}

.monthlylist .monthlynodata {
    color: #777;
}

#monthlythumbs {
    text-align: center;
    width: 100%;
}

#monthlythumbs>td {
    width: 20%;
    font-size: 80%;
}

/**********************************************************\
*                   TOPSHELF STYLE SHEET                   *
\**********************************************************/

/* ----------------- Game list ----------------- */

div#tsgamelistnav {
    text-align: center;
}

table#tsgamelist {
    width: 100%;
}

table#tsgamelist thead {
    text-align: center;
    font-weight: bold;
    font-size: 100%;
}

tr.tslistsysline td {
    position: sticky;
    padding-top: 10px;
    font-size: 120%;
}

tr.tslistsysline div {
    width: 95%;
    border: 2px outset #777;
    border-radius: 4px;
    background-color: #333;
    margin: auto;
    padding: .1em 4px;
    color: #FFF;
}

tr.tslistsysline div span {
    display: inline;
    width: 5em;
    color: #396;
}

tr.tslistgameentry:nth-child(even) {
    background-color: #282828;
}

tr.tslistgameentry:nth-child(odd) {
    background-color: #181818;
}

tr.tslistgameentry td {
    text-align: center;
}

tr.tslistgameentry td:first-child {
    text-align: left;
}

tr.tslistgameentry td:last-child {
    text-align: right;
}

tr.tslistgameentry td a {
    font-weight: bold;
}

tr.tslistgameentry td:empty::after {
    color: #444;
    content: "???";
}

/* ----------------- User library ----------------- */
/* The background-image styles are experimental. They don't look great, but they're kinda okay-ish. */

table#tslibrarytabs {
    width: 100%;
}

table#tslibrarytabs td {
    width: 33.3%;
    text-align: center;
}

table#tslibrarytabs td a {
    text-decoration: none;
}

table#tslibrarytabs td a div {
    width: 95%;
    color: #FFF;
    border: 2px outset #777;
    border-radius: 4px;
    background-color: #333;
    /*background-image: radial-gradient(ellipse farthest-corner at 95% 95%, #2A2A2A 0%, #333 75%, #3A3A3A 100%);*/
    margin: auto;
    padding: .1em 4px;
}

table#tslibrarytabs td a div h2.impact {
    margin: 0;
    font-size: 200%;
}

table#tslibrarytabs td a + span {
    border-image: linear-gradient(to top, #888, #333) 100% 1;
    box-shadow: 2px 1px 0px #000;
    border-radius: 2px;
    background-image: linear-gradient(to top, #666, #333);
    padding: 0px 3px;
    padding-top: 8px;
}

table#tslibrarytabs td a + span img {
    filter: grayscale(100%) brightness(75%);
    -webkit-filter: grayscale(100%) brightness(75%);
}

table#tslibrarytabs td a + span img.tsoptionselect, table#tslibrarytabs td a + span img:hover {
    filter: none;
    -webkit-filter: none;
}

table#tslibrarytabs td a[href]:active div {
    background-color: #444;
    /*background-image: radial-gradient(ellipse farthest-corner at 95% 95%, #3A3A3A 0%, #444 75%, #4A4A4A 100%);*/
}

table#tslibrarytabs td a[href]:active + span {
    border-image: linear-gradient(to top, #999, #444) 100% 1;
    background-image: linear-gradient(to top, #777, #444);
}

table#tslibrarytabs td a[href].tstabselected div {
    border: 2px outset #396;
    background-color: #1A4D33;
    /*background-image: radial-gradient(ellipse farthest-corner at 95% 95%, #132 0%, #1A4D33 50%, #264 100%);*/
}

table#tslibrarytabs td a[href].tstabselected + span {
    border-image: linear-gradient(to top, #4C8, #1A4D33) 100% 1;
    background-image: linear-gradient(to top, #396, #1A4D33);
}

table#tslibrarytabs td a[href].tstabselected:active div {
    background-color: #264;
}

table#tslibrarytabs td a[href].tstabselected:active + span {
    border-image: linear-gradient(to top, #5FA, #264) 100% 1;
    background-image: linear-gradient(to top, #4C8, #264);
}

table#tslibrarytabs td a:not([href]) div {
    border: 2px outset #444;
    color: #777;
    background-color: #282828;
    /*background-image: unset;*/
}

table#tslibrarytabs td a:not([href]) + span {
    border-image: linear-gradient(to top, #666, #282828) 100% 1;
    background-image: linear-gradient(to top, #444, #282828);
}

table#tslibrarytabs td a.tstabselected:not([href]) div {
    border: 2px outset #1A4D33;
    background-color: #132;
}

table#tslibrarytabs td a.tstabselected:not([href]) + span {
    border-image: linear-gradient(to top, #4C8, #132) 100% 1;
    background-image: linear-gradient(to top, #396, #132);
}

table#tslibrarytabs td a:not([href]) h2.impact {
    color: #555;
}

/* ----------------- Game entry ----------------- */
table#tsgametable {
    width: 100%;
}

table#tsgametable td {
    vertical-align: middle;
}

table#tsgametable img#tsboxart {
    margin: 5px;
    max-height: 180px;
    max-width: 180px;
    box-shadow: 2px 2px 3px #000;
}

table#tsgamestats {
    width: 100%;
    font-size: 150%;
    color: #FFF;
    padding: 5px;
    margin: auto;
}

table#tsgamestats td#tsrating span {
    font-size: 70%;
}

table#tsgamestats td#tschallenge {
    padding: .5em;
    text-align: center;
}

table#tsgamestats td#tsyourrating {
    color: #777;
}

table#tsgamestats td#tsyourrating a {
    color: inherit;
    text-decoration: none;
}

table#tsgamestats td#tsyourrating a:hover {
    color: inherit;
}

table#tsgamestats td#tsyourrating a.tslitstar {
    color: #ff0;
}

table#tsgamestats td#tsyourrating a#tsunrate {
    color: #f33;
}

td.tsstatvalue {
    color: #396;
}

td.tsstatvalue[title] {
    text-decoration: underline dotted;
}

td.tsstatvalue:empty::after {
    color: #555;
    font-style: italic;
    content: "Not defined";
}

div#tsgamedesc {
    text-align: center;
}

div#tsgamedesc:empty::after {
    color: #555;
    font-style: italic;
    content: "No description provided";
}

ul#tsuserlist {
    display: block;
    padding: 0;
    width: 100%;
}

ul#tsuserlist:empty {
    text-align: center;
}

ul#tsuserlist:empty::after {
    content: "Looks like there's nobody in this list right now. Will you be the first?";
}

ul#tsuserlist li {
    display: inline-block;
    font-size: 75%;
    text-align: center;
    width: 11.85%;
    vertical-align: top;
}

ul#tsuserlist li a {
    text-decoration: none;
}

ul#tsuserlist li img {
    max-width: 64px;
    max-height: 64px;
}

/* ----------------- New/Edit Game ----------------- */
.tsrequired {
    color: #f33;
    font-weight: bold;
}