html, body { background-color: #f00; color: #fff; margin: 0; padding: 0; font-family: MetaMediumRegular; height:100%;} * {box-sizing: border-box;}
a { text-decoration: none; color: #fff; }
#nav {margin: 0 auto 0; padding: 0; background-color: #000; width: 100%; }
#nsp {margin: 0; padding: 0; height: 12px; background-color: #f00;}
#ntop a:hover li { background-color: #999;} #nbot a:hover li { background-color: #5c5c5c;}
#ntop { background-color: #000; padding: .25em 7.5%; margin: 0 auto; max-width:1500px;}
#nav ul { list-style-type:none; }
#nli li, #buyb li { text-align: center; }
#nli, #nti { margin: 0; padding: 0; border-bottom:1px solid #000;}
#nbot-wrap {margin: 0 auto; max-width: 1500px; padding: 0 7.5%;}
#nti {float:left; font-family: MetaBoldRegular; font-size: 24pt; display: inline-block; line-height:30pt;} #nti a {text-decoration: none; color: #fff;}
#nli li { display: inline-block; width: 7em; font-size: 16pt; padding: 0;}
#nli ul {margin: 0 0 1px; padding: 0;}
#nli {display: inline-block; float: right; line-height:30pt;}
#nbot { font-size: 10pt; color: #000; background-color: #333; margin: 0 auto; padding: 0; font-family: MetaMediumRegular; width:100%;} 
#nbot a { color: #fff; font-family: MetaMediumRegular; }
#nbot ul { display: inline-block; padding-left: 0; vertical-align:top; margin: 0; width:14.285714285714285714285714285714%;}
#nbot li { height: 2.5em; display: block; padding: .25em .5em;}
#nbot a li { margin-bottom:.25em;}
#wrap{min-height:100%;}
		
#foot {margin: -61px auto 0; padding: 0; background-color: #484848; width: 100%; position: relative; height: 61px;	clear:both; }		

.b-wrap {margin: 0 auto; max-width: 1500px; padding: .25em 7.5%;}

#content { padding: .5em 7.5% 70px; margin: 0 auto; max-width:1500px; overflow:auto;}
h1 { font-size: 28pt;  padding:0; margin: .25em 0 0; }
#column { width:40%; padding-left: 1em; margin-top: 1em; float:right;}
#column-23 { width:66%; padding-left: 1em; margin-top: 1em; float:right;}
#excerpt {background-color: #000; padding: 1em; line-height:1.3em; color: #ddd;}
#excerpt em, #excerpt strong { color:#fff;}
#featuredvid {width: 60%; margin-top: 1em; float:left;}
.photo {width: 100%; height: 115.84%; margin:0; padding:0; display:inline-block;}
.photo img {max-width: 100%;}

#column-18 {width: 50%; padding: 0; margin-top: 1em; float:left;}

#column-13 {width: 33%; padding: 0; margin-top: 1em; float:left;}
.nobullet {list-style-type: none;}
.videoWrapper {	position: relative;	padding-bottom: 56.25%; /* 16:9 */	padding-top: 25px;	height: 0;}
.videoWrapper iframe {	position: absolute;	top: 0;	left: 0;	width: 100%;	height: 100%;}

#buyb ul { list-style-type: none; box-sizing: border-box; margin: 0; padding: 0;  display:table-row; }
#b2 a li { display: table-cell;  background-color: #fff; color: #000; font-family: MetaBoldRegular; font-size: 16pt; vertical-align: middle; padding: .5em; width: 31.5%; margin: 0 .75%; height: 3em;}
.credits, .credits em { color: #777 !important;}
#links a {line-height:1.3em; font-size: 16pt; color:#ff0; float: left;
  clear: both;}
#links {clear:both;}

#fc{margin: 0 auto; max-width: 1500px; width: 100%; padding: 0 7.5%;}
#ft {width: 100%; background-color: #333;}
#ft div{margin: 0 auto; max-width: 1500px; width: 100%; padding: 0 7.5%;}

.tbl{ display: table; width:100%; margin: 1em 0;  border-collapse:collapse; table-layout: fixed; border-spacing:1em;}
.tblr{ display: table-row;}
.listitem .tbl {border: 1em solid #000;}
.tblc{ display: table-cell; background-color: #fff; color: #000; font-family: MetaBoldRegular; padding: .5em; font-size: 14pt; width: 32%; text-align:center; vertical-align: middle; }
.tblc { border-left:1em solid #f00;} 
.noborder { border:0; }
.tblc:hover {background-color: #ddd; }
.listitem .tblc { padding-right:9px; border-color: #000;} 

#titledesc {margin-bottom:.5em; color: #ccc;}

#moreinfo {background-color: #eee; color: #333; display: none; padding: .25em 1.75em .25em 1em; line-height: 1.3em; margin-top: 2em; position:relative;}
.intro {font-size: 16pt; line-height: 1.3em;}
#excerpt a {border-bottom: 1px solid #ff0;} 
#moreinfo .intro {color:#000;} #moreinfo em, #moreinfo strong, #moreinfo h2, #moreinfo h3 {  color:#000}
#moreinfo .close {position:absolute; top: 0; right: 0; width: 1em; height: 1em; line-height: .75em; padding: 0; margin: 0; background-color: #333; text-align: center; font-size: 24pt;} #moreinfo .close a { position: relative; top: 3px; color: #fff; border: 0; text-decoration: none; font-family: "Lucida Sans Unicode", "Arial Unicode MS", "DejaVu";}

#C1 { background-color: #F93;} #C2 { background-color: #39F;} #C3 { background-color: #F9C;} #C4 { background-color: #6CC;} 
#C5 { background-color: #96F;} #C6 { background-color: #6C3;} #C7 { background-color: #f1516f;} #C8 { background-color: #C60;} 
a li.cat { color: #000;} a:hover li.cat  { background-color:#999 !important;}
 
#n-ord { background-color: #484848; } #n-abo { background-color: #5c5c5c; } #n-pro {background-color: #333; display: none !important;}
.fbl {border-bottom: 1px solid #3b5998} .twl {border-bottom: 1px solid #55acee} .ytl {border-bottom: 1px solid #e52d27} .iml {border-bottom: 1px solid #ffffb8}
.left-float { float: left;}	.right-float{ float: right;} .clearfix{ clear: both;}

.listitem {clear:both; background-color:#000; color: #ddd; overflow:hidden; padding: 1em; margin: 1em 0;}

.listitem h2 {font-size:16pt; padding:0; margin: 0; line-height:1.3em; color:#fff; }
.listitem strong, .listitem em {color: #ddd;}
.listitem .videoWrapper {margin: .5em 0;}
.listvid {width: 50%; float:left;}

.tinyvid {width: 20%; float:left;}
.tinyexc {width:78%; float:right;}
.listexc {width:45%; float:right;}
.listexc p { margin: 1em 0; line-height:1.3em;}

.excerpt .intro, .tinyexc .intro {color: #fff;}
.tinyexc p a, #excerpt a, .listexc p a, #hvcap a, #welcome a { color: #ff0; }
#excerpt a:hover, .tinyexc p a:hover, .listexc p a:hover, #hvcap a:hover, #welcome a:hover, #links a:hover { color: #ff9; }

#moreinfo a {color:#f00; border-bottom: 1px solid #f00;}
.listexc h2 {font-size: 14pt;}

/******************/
.longtitle {}

.ffl { float:left; margin-right: 3em; font-size: 10pt; color:#ccc;}
h2 a {color: #ff0;}
h2#welcome {margin: .5em 0;}
.littlegrid {width: 100; clear:both; margin: 0 auto 1em;}
#homegrid {width:66%; float:left; font-size: 0; overflow: hidden; clear:both;}
.homevid {width: 33%; float:left; margin-top: 5px; padding-left: 1em;}
.hvcap, #gridcap { width:100%; background-color: #000; color: #ccc; padding: .5em; font-size: 12pt;}
.hvcap { margin-top: 1em; }
#gridcap { margin-top: .5em; }
.hvlink { text-align: right; margin-top:1em;}
.captitle { color: #fff;}
#gridwrap { margin-left: 2px;}
#bestof {width:100%; } #bestof a {font-size: 16pt !important; line-height: 2em; color: #ff0; font-family: MetaBoldRegular;}
/**
#homegrid a {
  display: inline-block;
  margin-bottom: 3px;
  margin-right: 3px;
  text-decoration: none;
}
#homegrid img {
  border: 5px solid #f00;
  display: block;
}
#homegrid img {max-width: 20%; max-height: 135px;}
#homegrid a:hover img {
  border: 5px solid #ff0;
}**/
.b { width: 16.6%;
   padding-bottom: 16.6%;
   position: relative;
   float: left; }
.bi {  position: absolute;
      left: 5px;
      right: 5px;
      top: 5px;
      bottom: 5px;}
.bi img {
   width: 100%;
}
#homegrid a:hover img {
  border: 5px solid #ff0;
}

blockquote {margin-left: 0; font-size: 16pt; }
blockquote div {margin-left: 1em; font-size: 12pt;}
.mobileonly {display:none;}
@media only screen and (max-width : 1024px) {
#nsp {height: 8px; }

   .b {
      width: 25%;
      padding-bottom: 25%;
   }
	.longtitle{display:none;}
	#nbot {font-size: 10px;}
	#nti {font-size: 24px; line-height:36px;} #nli li{font-size: 16px; line-height:30px;}
	
	.tblc {font-family: MetaMediumRegular; font-size: 12px;}
	.excerpt, #moreinfo, body, .hvcap {font-size: 14px;}
	h1 {font-size: 28px;}
	#moreinfo .intro {font-size: 16px;}
	
	
}

@media only screen and (max-device-width: 801px) {
.nomobile {display:none;} .mobileonly {display:block;}
#ntop {padding: 0;}
#nti {width:100%; text-align:center; margin: 0 auto; height: 1.8em; line-height: 1.8em; font-size: 5.9vw; display:block; float:none;	}
#nli {float:none; display:block; width: 100%;}
#n-pro {display: inline-block !important;}
ul#n2 {width: 100%; margin: 0; padding: 0;}
ul#n2 li {width: 33.3333333333%; font-size: 4.5vw; line-height: 2em; height: 2em;}
#nli {line-height: 0px; border-bottom: none;}
#nav {margin-top: 0;}
#nbot-wrap {padding: 0;}
#nbot ul {display: block; width: 100%; margin-bottom: 1em;}
#nbot li {height: 2.5em;} #nbot .cat {height: 1.5em;}
#nbot {    -moz-column-count: 2;
    -moz-column-gap: .5em;
    -webkit-column-count: 2;
    -webkit-column-gap: .5em;
    column-count: 2;
    column-gap: .5em;
	padding: .5em;
	font-size: 4vw;
	display:none;
}	
#foot {height: auto;}
h2#welcome { font-size: 5vw;}
#featuredvid, #column, #column-13, #column-23, .listvid, .listexc, .homevid, .tinyvid, .tinyexc, #homegrid {display:block; float: none; width:100%; padding: 0;}	
#content a[name=more] {display:none;}
#content {padding-left: 1em; padding-right: 1em;}
blockquote {margin-right: 0; line-height: 1.3em; font-size: 12pt;} blockquote div {margin-left: 1em; font-size: 8pt; line-height: 1em;}
.intro {font-size: 12pt;}
#nsp, #bestof, #gridcap{display:none;}
#foot div {padding-bottom: .3em;}
.b:nth-of-type(n+9) {display:none;}
}