/* Responsive: base design is for mobile, larger rez at bottom of stylesheet */

/* Basics */
body{background-color: #fff; margin: 1px 1px 10px 1px; padding: 0; color:#000;
     font-family: Arial, Helvetica, sans-serif;min-width:320px;}
a:link{color: #00f; text-decoration: underline;}
a:visited{color: #505abc;}
a:hover{color: #1d60ff; text-decoration: none;}
a:active{color: #12eb87;}
img{border:none;vertical-align:middle;max-width:100%;}
#header{margin: 0;padding: 0; border-bottom:solid 1px #000;background:linear-gradient(0deg, #ddd, #fff); }
#main{margin-bottom: 30px;}
footer{clear:both;color:#c0c0c0;padding:10px 0;text-align:center;margin:0;font-size:.9em;}
#leaderboardad { display: none; }
#mobilebanner { display: inline-block; }
.subTitle { margin-top: 2px; }
#logo { height: 64px; }
#liveIcon {height:16px;width:16px; margin-right:1px; vertical-align:text-top;}
#LiveTag {font-weight:normal; animation: blinker 2s linear infinite;}
@keyframes blinker {
    50% {
        opacity: 0;
    }
}

/* Menu */
#menuicon { width: 32px; height: 32px; cursor: pointer; padding: 16px; border-right: solid 1px #000; }
ul#menu {display:none;margin:0;padding:0;list-style:none;width:100%;height:100%;position:absolute;top:0;left:0;z-index:9999; background-color:#000; }
ul#menu li a { text-decoration: none; padding: 11px; display: block; color:#fff; font-weight:bold;background-color:#000; }
ul#menu li a:visited {color: #fff;}
ul#menu li a:hover, .menu_simple ul li .current {color: white; background-color: #800;}
#menucloseicon { width: 64px; height: 64px; cursor: pointer; float: right; }

/* Identity */
#logon { display: inline; float:right; }
#logon ul { display: none; }
ul#logonmenu, ul#usermenu {display:none;margin:0;padding:0;list-style:none;width:100%;height:100%;position:absolute;top:0;right:0;z-index:9999; background-color:#000; }
ul#logonmenu li a , ul#usermenu li a { text-align:right; text-decoration: none; padding: 11px; display: block; color:#fff; font-weight:bold;background-color:#000; }
ul#logonmenu li a:visited , ul#usermenu li a:visited {color: white;}
ul#logonmenu li a:hover , ul#usermenu li a:hover {color: white; background-color: #800;}

/* Search */
#searchicon { float: right;width:32px;height:32px; cursor:pointer; padding:16px;border-left:solid 1px #000; }
#searchbar{margin:4px 0px 4px 0px;display:none; float:right;}
#searchtext { display: inline; width:200px; }
#searchsubmit { display: inline; }

/* FORM LAYOUT ELEMENTS */
fieldset{margin: 1em 0;border: solid 1px #CCC;}
label { display: block; }
legend {font-size: 1.4em;font-weight:bold;}
input[type="submit"]:hover {cursor:pointer;}
input[type="text"] {width: 200px;}
input[type="password"] {width: 200px;}
textarea#Body{width:100%;height:400px;}
textarea#Summary{width:100%;height:60px;}
textarea.description{width:100%;height:60px;}
#postBodyTextArea{width:100%;height:80px;}

/* TABLE */
table {border: solid 1px #c0c0c0; border-collapse: collapse;}
table td {padding: 5px;border: solid 1px #c0c0c0;}
table th {padding: 6px 5px;text-align: left;background-color: #e8eef4; border: solid 1px #c0c0c0;}
.noBorderTable{border:none; border-collapse: collapse;}
.noBorderTable td {border:none; padding: 5px;}

/* Badges */
.BadgeName{margin:0px 0px 0px 0px; padding:2px; background-color:#fc0; text-align:center;}
.BadgeName a {color:#000; text-decoration:none;}
.BadgeSecLevel{background-color:#fc0; width:100%; margin:0px; text-align:center; font-weight:bold;}
.BadgeBox{height:175px; width:29%; margin-right:2px; float:left;}
.BadgeBorder{padding:0px; margin:0px; border: 1px solid #000; background-color:#fff;}

/* Story Summary */
.storyImageBox {margin: 0px 5px 2px 0px;width:100px; height:100px; text-align:center; border:solid 1px #999; float:left;}
.vhelper { display: inline-block; height: 100%; width:0px;  vertical-align: middle;}
.storyImageBox img { max-height: 100px; max-width: 100px;}
.storySummaryStats{margin:0;}
.storySummaryType { border-bottom:solid 1px #000; margin-bottom:5px; font-weight:bold; color:#800; text-transform:uppercase; }
.storySummaryItem{ margin:5px 0px 40px 0px; padding:0px 0px 5px 0px; clear:both; width:100%; min-height:100px;}
.storySummaryHeader a { text-decoration:none; }
.storySummaryHeader a:hover { text-decoration:underline; }
.storySummary{margin:0;}
.storyByLine{margin:0;}
.storySummayTitle{margin:0;}


/* Catalog -------------------------------*/
.catalogSummary{margin: 5px 0px 5px 0px;}
.catalogByLine{margin: 0px 0px 5px 0px;}
.catalogDivider{float:left;padding:4px;width:100%;}
.catalogTitle{margin-bottom:5px;}
.editorsChoiceBanner{background-color:#FC0; width:100%; border:solid 1px #FC0; margin-left:-4px; margin-bottom:5px;}
.catTd{vertical-align:bottom;width:33%}

/* TagList (HotTab) ----------------------*/
.tagList{margin:0;padding-left:0px;}
.tagListItem{display:block;list-style-type:none;border-bottom:1px solid #000;border-right:1px solid #000;
	border-top:1px solid #ccc;border-left:1px solid #ccc;background-color:#f33;text-align:center;
	margin-bottom:2px;padding:4px; margin-right:2px;}
.tagListItem:hover{background-color:#fff;cursor:pointer;}
.tagListItem a{text-decoration:none;color:#000;font-weight:bold;display:block;height:100%;}

/* Ad Boxes ------------------------------*/
.colBox{border:2px solid #800; margin:0px 1px 4px 0px; padding:0;}
.colBoxH{background-color:#fc0; font-weight:bold; padding:1px; text-align:center;}

/* Featured Stories */
.featuredStories{border:1px solid #000;padding:0px;margin:0px; position:relative;}
.featuredStories h2{background-color:#fc0;margin:0;padding: 2px 0px 2px 0px;text-align:center;}
.featuredStories p{margin:5px;}
.featuredStories h3{margin:5px;}

/* Comments */
.threadPostItem{border: outset 1px #c0c0c0;padding:5px;margin-bottom: 10px;color:#000;}
.threadPostHeader{color:#666;text-align:right;}

/* MISC ----------------------------------*/
.clear{clear:both;}
.zero{margin:0;padding:0;}
.inline {display: inline;}
.right{float:right;}
.left{float:left;}
.error{color:Red;}
.center{text-align:center;}
.field-validation-error{color:Red;}
.input-validation-error{border: 1px solid #f00;background-color: #fee;}
.validation-summary-errors{font-weight: bold;color: #f00;}
.storyTitle{border-bottom:solid 1px #f00; margin:0;}
a.tooltip {text-decoration:none;}
a.tooltip span {display:none; padding:2px 3px; margin-left:8px;}
a.tooltip:hover span{display:inline; position:absolute; background:#ffff99; border:1px solid #00f; color:#000;}
a.button{background-color:#CCC; color:#000; border-style:outset; border-width:1px; padding:4px; font-weight:bold; text-decoration:none; line-height:3em;}
a.paginationLink{border:solid 1px #00f; padding:4px 10px; text-decoration:none; line-height:2em;}
.currentPage{border:solid 1px #00f;padding:4px 10px;text-decoration:none;color:#fff;background-color:#00f;}
a.currentPage {color:#fff;}
ul.userPostsList{margin-left:-30px;}
ul.userPostsList li{list-style:none;border-bottom:dotted 1px #c0c0c0;}
.featuredItem{display:inline-block; text-align:center; padding:0px 0px 0px 0px; background-color:#fff;border:1px solid #000; min-width:300px; margin-bottom:15px;}
.featuredItem p {margin:0px;}
.featuredItem #catalogLinks {background-color:#000; color:#fff; font-weight:bold;}
.featuredItem #catalogLinks a {color:#fff;}
.featuredTitle{font-weight:bold; margin:0px 0px 0px 0px; background-color:#fc0; padding:0px 4px 0px 4px;border-bottom:1px solid #000;}
.featuredTitle a {color:#000; text-decoration:none;}
.featuredTitle a:hover {color:#000; text-decoration:underline;}
.ratingBox{border:1px solid #fc0; background-color:#fc0; padding:4px; margin:4px; float:left; text-align:center;}
.UserListBox{border:solid 1px #000;float:left;padding:0px 0px 0px 0px;margin:2px;width:235px;}
.sortLinkOn{color:#000 !important;text-decoration:none;font-weight:bold;}
#webring{width:100%; padding:0px; margin:0px; text-align:center;}
    #webring p { margin: 0px; padding: 5px; }
.listbody { display: none; }
.awardBox{background-color:#fc0;float:left;font-weight:bold;font-size:1.1em;text-align:center;padding:5px 5px 5px 5px;margin: 5px 5px 5px 5px;border:solid 1px #000;}
.awardBox a {text-decoration:none;color:#000;}
#AmznIframeFooter { display: none; }
#comingsoonlist { width: 100%; }
#twitchFlashPlayer { display: none; }
    #twitchFlashPlayer table { width: 100%; }
.twitchChat { width: 350px; }

/* sponsor footer */
#Sponsors { margin:0; padding:0; text-align:center; }
    #Sponsors div { display:inline-block; width:225px; margin:10px 5px 10px 5px; }

/* Responsive additions ------------------------------*/
/* Large Tablet */
@media screen and (min-width:768px) {
    #AmznIframeFooter { display: block;width:732px;height:94px;margin:auto;text-align:center; }
    #searchbar { display: block;width:300px; }
    #searchicon { display: none; }
}

/* Full */
@media screen and (min-width:970px) {
    
    #leaderboardad { text-align:center; display:inline-block; margin:0 0 2px 0;width:728px;height:90px; }
    #mobilebanner { display: none; }
    #rightCol { display:table-cell; width: 304px;}
    #leftCol { display:table-cell; padding-right:2px; }
    .listbody { display: block; margin-left:108px; }
    #menuicon, #menucloseicon { display: none; }
    ul#menu { display: inline; float:none; position:relative;background:none; }
    ul#menu li{display:inline;}
    ul#menu li a{padding:4px 5px;text-decoration: none;line-height: 2.0em;color:#800; display:inline-block;background:none;}
    ul#menu li a:visited {color: #800;background:none;}
    ul#menu li a:hover{color:#800;text-decoration:underline;background:none;}
    #twitchFlashPlayer { display: block; }
    #main { width: 90%; margin: auto; display:table; }
    footer { display: table-row; column-span:all; }
}