/* resets and clearfix */

   html, div { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
   *, *:before, *:after { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; }
   .cf:before, .cf:after { content: " "; display: table; }
   .cf:after { clear: both; }
   
   /* montserrat: headers */

   @font-face 
   {
      font-family: 'Montserrat';
      src: url('fonts/montserrat/montserrat-extrabold-webfont.eot');
      src: url('fonts/montserrat/montserrat-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
           url('fonts/montserrat/montserrat-extrabold-webfont.woff2') format('woff2'),
           url('fonts/montserrat/montserrat-extrabold-webfont.woff') format('woff'),
           url('fonts/montserrat/montserrat-extrabold-webfont.ttf') format('truetype'),
           url('fonts/montserrat/montserrat-extrabold-webfont.svg#montserratextra_bold') format('svg');
      font-weight: bold;
      font-style: normal;
   }

   @font-face 
   {
      font-family: 'Montserrat';
      src: url('fonts/montserrat/montserrat-light-webfont.eot');
      src: url('fonts/montserrat/montserrat-light-webfont.eot?#iefix') format('embedded-opentype'),
           url('fonts/montserrat/montserrat-light-webfont.woff2') format('woff2'),
           url('fonts/montserrat/montserrat-light-webfont.woff') format('woff'),
           url('fonts/montserrat/montserrat-light-webfont.ttf') format('truetype'),
           url('fonts/montserrat/montserrat-light-webfont.svg#montserratlight') format('svg');
      font-weight: normal;
      font-style: normal;
   }

   /* clear sans: copy and navigation */

   @font-face 
   {
      font-family: 'Clear Sans';
      src: url('fonts/clear-sans/ClearSans-Light.eot?#iefix') format('embedded-opentype'),  
           url('fonts/clear-sans/ClearSans-Light.woff') format('woff'), 
           url('fonts/clear-sans/ClearSans-Light.ttf')  format('truetype'), 
           url('fonts/clear-sans/ClearSans-Light.svg#clear-sans') format('svg');
      font-weight: 100;
      font-style: normal;
   }
   
   @font-face 
   {
      font-family: 'Clear Sans';
      src: url('fonts/clear-sans/ClearSans-Regular.eot?#iefix') format('embedded-opentype'),  
           url('fonts/clear-sans/ClearSans-Regular.woff') format('woff'), 
           url('fonts/clear-sans/ClearSans-Regular.ttf')  format('truetype'), 
           url('fonts/clear-sans/ClearSans-Regular.svg#clear-sans') format('svg');
      font-weight: 400;
      font-style: normal;
   }

   @font-face 
   {
      font-family: 'Clear Sans';
      src: url('fonts/clear-sans/ClearSans-Italic.eot?#iefix') format('embedded-opentype'),  
           url('fonts/clear-sans/ClearSans-Italic.woff') format('woff'), 
           url('fonts/clear-sans/ClearSans-Italic.ttf')  format('truetype'), 
           url('fonts/clear-sans/ClearSans-Italic.svg#clear-sans') format('svg');
      font-weight: 400;
      font-style: italic;
   }

   @font-face 
   {
      font-family: 'Clear Sans';
      src: url('fonts/clear-sans/ClearSans-Bold.eot?#iefix') format('embedded-opentype'),  
           url('fonts/clear-sans/ClearSans-Bold.woff') format('woff'), 
           url('fonts/clear-sans/ClearSans-Bold.ttf')  format('truetype'), 
           url('fonts/clear-sans/ClearSans-Bold.svg#clear-sans') format('svg');
      font-weight: 700;
      font-style: normal;
   }

   @font-face 
   {
      font-family: 'Clear Sans';
      src: url('fonts/clear-sans/ClearSans-Italic.eot?#iefix') format('embedded-opentype'),  
           url('fonts/clear-sans/ClearSans-BoldItalic.woff') format('woff'), 
           url('fonts/clear-sans/ClearSans-BoldItalic.ttf')  format('truetype'), 
           url('fonts/clear-sans/ClearSans-BoldItalic.svg#clear-sans') format('svg');
      font-weight: 700;
      font-style: italic;
   }

   /* structure */

   html { overflow-y: scroll; height: 100%; min-height: 100%; }
   body { margin: 0px; padding: 0px; color: #FFFFFF; background-color: #000000; }
   body, div, input, select, textarea, table, td, th { font: 100 18px/24px 'Clear Sans', sans-serif; }
   th { font-weight: 700; border-bottom: 1px solid #000000; text-align: left; }
 
   /* header */
   
   #hd { background-color: #000000; position: relative; height: 120px; }
   a#metro 
   { 
      position: absolute; display: block; top: 0px; left: 0px; width: 120px; height: 120px; 
      background: url('images/metropolis.png') center center no-repeat; 
      background-size: cover;
   }
   
   /* type */
   
   h1 { color: #FFFFFF; font: normal 36px/32px 'Montserrat', sans-serif; text-transform: uppercase; }
   h2 { font: bold 34px/30px 'Montserrat', sans-serif; text-transform: uppercase; }
   h2 .light { font-weight: normal; }
   h3 { font: normal 24px/26px 'Montserrat', sans-serif; text-transform: uppercase; margin: 15px 0px 30px 0px; color: #000000; }
   h4 { font: 400 20px/26px 'Clear Sans', sans-serif; margin: 15px 0px 10px 0px;  }
   .secondary h3, .secondary h4, .reversed h3, .reversed h4 { color: #FFFFFF; }
   .secondary .news h3, .secondary .browse h3 { color: #000000; }
   #hd h1 { margin: 0px 0px 0px 150px; padding: 25px 0px 10px 0px; }   
   p { padding: 0px; margin: 30px 0px; }
   .date { font: 400 14px/14px 'Clear Sans', sans-serif; text-transform: uppercase; color: #000000; display: block; margin: 5px 0px; }
   p.date { font-weight: 700; font-size: 16px; line-height: 16px; margin-bottom: 20px; }
   .reversed .date { color: #FFFFFF; }
   .hot, .date.hot, .alert { color: #880000; }
   .alert { border: 1px solid #880000; padding: 15px; margin: 0px 0px 30px 0px; display: block; }
   .notice { border: 1px solid #000000; padding: 15px; margin: 0px 0px 30px 0px; display: block; font-weight: bold; }
   
   .product .info .date { margin: 0px 0px 10px 0px; font-weight: 700; }
   .secondary ul, .secondary li { list-style-type: none; margin: 15px 0px; padding: 0px; }
   .secondary ul { margin-top: 0px; }
   ul.playlist { list-style-type: none; margin: 10px 0px; padding: 0px; border-top: 1px solid #999999; }
   ul.playlist li { list-style-type: none; margin: 0px; padding: 5px 0px; border-bottom: 1px solid #999999; }
   ul.playlist li a { display: block; }
   ul.playlist li a.active { color: #000000; }
   .reversed ul.playlist li a.active { color: #FFFFFF; }
   label { cursor: pointer; }
   
   /* columns */
   
   ul.columnar 
   { 
      -webkit-column-count: 3; -moz-column-count: 3; column-count: 3;
      -webkit-column-gap: 38px; column-gap: 38px; -moz-column-gap: 38px;
      -webkit-column-break-inside: avoid;
   }
   
   /* links */

   a, a:link, a:visited { text-decoration: none; color: #999999; }
   a:hover { color: #000000; }
   .secondary a, .secondary a:link, .secondary a:visited { color: #666666; }
   .reversed a, .reversed a:link, .reversed a:visited { color: #888888; }
   .secondary a:hover, .reversed a:hover { color: #FFFFFF; }
   .social a { width: 35px; height: 35px; display: inline-block; background-position: center center; background-size: contain; margin: 0px 5px; }
   a.link { display: block; padding-left: 32px; background: transparent url('images/icon-link.png') left center no-repeat; background-size: contain; }
   a.mail { background-image: url('images/icon-mail.png'); }
   a.facebook { background-image: url('images/icon-facebook.png'); }
   a.twitter { background-image: url('images/icon-twitter.png'); }
   a.official { background-image: url('images/icon-official.png'); }
   a.myspace { background-image: url('images/icon-myspace.png'); }
   a.youtube { background-image: url('images/icon-youtube.png'); }
   a.bandcamp { background-image: url('images/icon-bandcamp.png'); }
   #footer a:hover { color: #CCCCCC; }
   #announce a { color: #FFFFFF; border-bottom: 1px dotted #FFFFFF; }
   #announce a:hover { color: #CCCCCC; border-bottom: 1px dotted #CCCCCC; }
   a.buy, a.btn, .btn, a.bigbtn
   { 
      font: 400 18px/18px 'Clear Sans', sans-serif; text-transform: uppercase; background-color: #AAAAAA; color: #FFFFFF; 
      padding: 3px 7px 4px 7px; white-space: nowrap; border: 0px; cursor: pointer;
   }
   a.bigbtn { display: inline-block; text-transform: none; font-size: 20px; line-height: 1.2; margin: 0 4px 6px 0; padding: 3px 8px 5px 8px; }
   a.buy:hover, a.btn:hover, .btn:hover, a.bigbtn:hover { background-color: #000000; color: #FFFFFF; }
   a.buy { font-size: 14px; line-height: 14px; padding: 0px 4px 1px 4px; }
   .reversed a.buy { background-color: #AAAAAA; color: #000000 !important; }
   .reversed a.buy:hover { background-color: #FFFFFF; color: #000000; }
   a.action i.material-icons { position: relative; top: 5px; }
   #toolbar a .legend { font-size: 16px; line-height: 16px; position: relative; top: -10px; }
	
	i.icon, span.icon, a.icon 
	{ 
		display: inline-block; width: 22px; height: 22px; line-height: 1; background-position: center center; background-repeat: no-repeat; background-size: auto 80%; 
		vertical-align: top;
	}
	.icon-current { border: 1px solid #999999; width: 20px; height: 20px; }
	a.icon { background-color: #999999; }
	a.icon:hover { background-color: #000000; }
	.icon-pin { background-image: url('/images/icon-pin.svg'); }
	.icon-bury { background-image: url('/images/icon-shovel.svg'); }
	.icon-sort { background-image: url('/images/icon-sort.svg'); }
	.icon-trash { background-image: rl('/images/icon-trash.svg'); background-size: auto 60%; }
	a.icon-pin { background-image: url('/images/icon-pin-w.svg'); }
	a.icon-bury { background-image: url('/images/icon-shovel-w.svg'); }
	a.icon-sort { background-image: url('/images/icon-sort-w.svg'); }
	a.icon-trash { background-image: url('/images/icon-trash-w.svg'); background-color: #CC0000; }
	ul.list-items { list-style-type: none; margin: 1rem 0; padding: 0; }
	ul.list-items li { margin: 5px 0; padding: 0; }
	ul.list-items li .icon { margin-right: 5px; }
	
	.buybtn 
	{ 
		display: inline-block; font-size: 18px; line-height: 1; white-space: nowrap; color: #666666; border: 1px solid #666666; 
		margin: 0 5px 5px 0; padding: 5px 7px;
	}
	.buybtn.primarybtn { color: #FFFFFF; background-color: #666666; }
	.buybtn:hover, .buybtn.primarybtn:hover { color: #FFFFFF; background-color: #000000; border-color: #000000; }
	.controls .buybtn { display: block; margin: 0 0 5px 0; }
	.mobileonly .buybtn { font-size: 16px; }
	.controls { padding-top: 20px; border-top: 1px solid #666666; }
	.controls h3 { margin: 0 0 15px 0; }
	
   /* main menu */

   #menu { font: 100 20px/26px 'Clear Sans', sans-serif; color: #999999; margin-left: 150px; text-transform: lowercase; }
   #menu ul { display: inline-block; list-style-type: none; margin: 0px 0px 0px -9px; padding: 0px; }
   #menu ul li { display: inline; padding: 0px; margin: 0px; float: left; position: relative; }
   #menu a 
   {
      display: block; white-space: nowrap;
      color: #AAAAAA; padding: 0px 11px 0px 9px; font-weight: 400; 
      background: transparent url('images/divider.png') 100% 65% no-repeat; 
   }
   #menu ul > li > ul > li { float: none; display: block; margin: 0px; background-color: #999999; }
   #menu ul > li > ul > li > a { padding: 4px 10px 6px 10px; display: block; font-size: 16px; line-height: 19px; }
   #menu ul > li > ul  
   {
      background: transparent url('images/submenu.png') left top no-repeat;
      padding: 30px 0px 10px 0px; position: absolute; display: none; box-shadow: 5px 5px 10px rgba(0,0,0,0.1);
   }
   #menu ul li:hover ul { display: inline-block; left: 0px; margin-left: 0px; }
   #menu ul > ul, #menu ul li, #menu ul li ul, #menu ul li ul li { z-index: 500; }
   #menu > ul > li:last-child a { background-image: none; }
   #menu a:hover, #menu ul li ul a { color: #FFFFFF; }
   div#menu ul li ul li a:hover { background-color: #555555 !important; }
   body.admin #menu > ul > li:last-child > a { color: #FFCC00; }
   body.admin #menu > ul > li:last-child > ul > li > a { color: #FFFFFF; }
   body.admin #menu > ul > li:last-child > ul > li > a:hover { background-color: #999999; }
   
   /* toolbar icons */
   
   #toolbar { position: absolute; top: 11px; right: 30px; margin-right: -5px; text-align: right; }
   #toolbar i.material-icons { font-size: 32px; line-height: 32px; }
   #toolbar a { color: #FFFFFF; padding: 13px 5px 7px 5px; position: relative; display: inline-block; }
   #toolbar a:hover { color: #AAAAAA; }
   .cartcount 
   { 
      position: absolute; top: 5px; right: 1px; font-size: 11px; line-height: 17px; display: block; text-align: center;
      color: #FFFFFF; background-color: #CC0000; width: 18px; height: 18px; border-radius: 9px;
   }
   #toolbar .social { display: inline-block; position: relative; top: -2px; }
   #toolbar .social a { width: 28px; height: 28px; }
   #toolbar .social a:hover { opacity: 0.8; }
      
   /* mobile navigation */
   
   #toolbar a#mobilenav { display: none; }
   #mobilemenu 
   { 
      display: none; background-color: #DEDEDE; margin: 0px; padding: 15px 0px; font: 100 26px/26px 'Clear Sans', sans-serif; 
      z-index: 10; -webkit-box-shadow: 0px 5px 5px rgba(0,0,0,0.4); box-shadow: 0px 5px 5px rgba(0,0,0,0.4);
      text-transform: lowercase; 
   }
   #mobilemenu ul, #mobilemenu li { list-style-type: none; padding: 0px; margin: 0px; }
   #mobilemenu ul li ul { margin-left: 60px; list-style-type: disc; color: #000000; }
   #mobilemenu ul li ul li { margin-left: 30px; list-style-type: disc; }
   #mobilemenu a { color: #000000; display: block; padding: 10px 30px 10px 30px; }
   #mobilemenu ul li ul li a { padding:  10px 15px 10px 15px; }
   #mobilemenu a:hover { color: #666666; }
   
   /* hero 3:1 */
   
   div.hero { width: 100%; padding-top: 40%; background-position: center center; background-size: cover; position: relative; }
   div.hero h2 { position: absolute; bottom: 0px; left: 0px; margin: 0px 30px 30px 60px; color: #FFFFFF; background-color: #000000; padding: 15px; }
   
   /* content elements */
   
   .pad { padding: 40px 60px; }
   .pad > p:first-child, .pad > h3:first-child, .pad > a:first-child h3 { margin-top: 0px; }
   .secondary .pad { padding: 40px; }
   .content, .secondary
   {
     display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; 
     -webkit-flex-flow: row wrap; flex-flow: row wrap;
   }
   .primary, .secondary, .sidebar { flex: 1 0 50%; }
   .primary, .newreleases { color: #000000; background-color: #FFFFFF; }
   .secondary { color: #000000; background-color: #D2D2D2; }
   .featured { color: #FFFFFF; background-color: #000000; }
	.product-detail .featured { background-color: #161616; }
   img { display: table; border: 0px; }
   .primary img { max-width: 100%; height: auto; }
   .primary img.right { max-width: 33%; height: auto; float: right; margin: 0px 0px 35px 35px; }
	img.mobileonly.right { float: none; max-width: 75%; margin: 0 0 20px 0; }
	.controls { float: right; margin: 0 0 20px 30px; width: 280px; }
	.right { float: right; margin: 0 0 20px 30px; }
	.right img, .controls img { width: 100%; height: auto; }
   .secondary img, div.image img { width: 100%; height: auto; }
   .tour { background-color: rgba(255,255,255,0.3); }
   .video { background-color: #000000; color: #FFFFFF; }
   .themepanel { background-color: #CCCCCC; color: #FFFFFF; }
   #announce { color: #FFFFFF; background-color: #000000; font-size: 20px; line-height: 26px; }
   #bandcamp { color: #FFFFFF; background-color: #1DA0C3; font-size: 20px; line-height: 26px; display: block; }
   #bandcamp img { display: inline-block; margin: 0 25px 0 0; height: 25px; width: auto; vertical-align: middle; position: relative; top: -2px; }
   #announce.pad, #bandcamp.pad { padding-top: 20px; padding-bottom: 20px; }
   #bandcamp:hover { color: #FFFFFF; background-color: #555555; }
   body.home .shopbox { background-color: #D2D2D2; }
   .shopbox h3 { color: #000000; }
   div.slug 
   { 
      padding-top: 100%; opacity: 0.3; 
      background: #000000 url('images/metropolis.png') center center no-repeat; 
      background-size: 90% 90%;
   }
   div.divided { margin: 40px 0px 0px 0px; padding: 20px 0px 0px 0px; border-top: 1px solid #000000; }
   
   /* cart */
   
   .cart td, .cart th { padding: 8px 15px 8px 0px; }
   .cart td:last-child, .cart th:last-child { padding-right: 0px; }
   .cart th { font-weight: bold; border-bottom: 1px solid #000000; }
   .cart td img { width: 80px; height: auto; }
   .cart .totals td { border-top: 1px solid #000000; }
   
   /* artists */
   
   a.artist 
   { 
      margin: 0px 0px 35px 0px; width: 100%; height: 0; padding-top: 33%; position: relative; 
      background-color: #000000; background-position: center center; background-repeat: no-repeat;
      background-size: cover; display: block;
   }
   a.artist h3 
   { 
      position: absolute; bottom: 10px; left: 0px; color: #FFFFFF; background-color: #000000;
      font-size: 20px; line-height: 22px; font-weight: bold; margin: 0px; padding: 3px 5px;
   }
   a.artist:hover h3 { color: #000000; background-color: #FFFFFF; }
   
   /* products */
   
   div.product { display: flex; flex-wrap: wrap; align-items: center; }
   div.product div { flex-basis: 100%; }
   div.shop div.product { margin-bottom: 15px; }
   div.shop div.product div.image { flex-basis: 20%; }
   div.shop div.product div.info { flex-basis: 80%; padding-left: 30px; }
   div.shop div.product div.info h4 { margin-top: 0px; }
   
   /* footer */
   
   #footer { font-size: 90%; background-color: #000000; }
   #footer .social { float: right; text-align: right; margin: 0px -5px 20px 30px; }

   /* search control modal */

   #simplemodal-overlay { background-color: #000000; }
   #basic-modal-content { display: none; padding: 0px; text-align: center; }
   #basic-modal-content form { margin: 0px 30px; white-space: nowrap; }
   #basic-modal-content input
   {
      font-size: 48px; line-height: 48px; background-color: transparent; border: none;
      -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0px;
   }
   #basic-modal-content input:focus { outline: none; }
   #basic-modal-content input#s { max-width: 60%; border-bottom: 1px solid #999999; color: #FFFFFF; }
   #basic-modal-content input#dosearch, #basic-modal-content input#closemodal { cursor: pointer; padding: 0px; color: #999999; }
   #basic-modal-content input#dosearch:hover, #basic-modal-content input#closemodal:hover { color: #FFFFFF; }
   
   /* audio controls */
   
   div.playcontrol.material-icons { cursor: pointer; color: #000000; font-size: 32px !important; line-height: 36px; }
   table.tracks { width: 100%; }
   table.tracks td { padding: 5px; }
   table.tracks td:first-child { padding-left: 0px; }
   table.tracks td:last-child { padding-right: 0px; text-align: right; }
   
   /* embedded videos */

   .video-container { position: relative; padding-bottom: 54%; padding-top: 30px; height: 0; overflow: hidden; background-color: #000000; }
   .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

   /* expanding section controls */
   
   .expanding { position: relative; }
   a.moar { position: absolute; bottom: 0px; left: 0px; right: 0px; padding: 150px 60px 0px 60px; z-index: 3; }
   a.moar, a.less { cursor: pointer; display: block; color: #000000; }
   a.less { display: block; padding: 30px 0px 0px 0px; }
   div.showhide { border: 1px solid #000000; text-transform: uppercase; text-align: center; padding: 6px; }
   a div.showhide { color: #000000; }
   a.moar:hover .showhide, a.less:hover .showhide, a.moarless:hover .showhide { color: #FFFFFF; background-color: #000000; }
   .reversed div.showhide { color: #FFFFFF; border-color: #FFFFFF; }
   .reversed a:hover div.showhide { color: #000000; background-color: #FFFFFF; }
   a.moar
   {
      background: -moz-linear-gradient(top, rgba(0,0,0,0) 0px, rgba(255,255,255,1) 130px);
      background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0px, rgba(255,255,255,1) 130px);
      background: linear-gradient(to bottom, rgba(0,0,0,0) 0px, rgba(255,255,255,1) 130px);
   }
   .reversed a.moar
   {
      background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 130px);
      background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 130px);
      background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 130px);
   }
   
   /* slider */
   
   div.slider { width: 100%; }
   a.slide 
   { 
      display: block;
      width: 100%; padding-top: 33.333%; background-position: center center; background-size: cover; position: relative; cursor: pointer; 
   }
   .slide .caption { position: absolute; bottom: 0px; left: 0px; right: 120px; }
   .slide h2 { color: #FFFFFF; background-color: #000000; padding: 15px 15px 11px 15px; display: inline-block; margin: 0px; line-height: 36px; }
   .slide h4 
   { 
      color: #000000; background-color: rgba(255,255,255,0.8); padding: 1px 15px 1px 15px; display: inline-block; margin: 0px 0px 20px 0px; 
      text-transform: uppercase; font-weight: 700; letter-spacing: 2px; font-size: 16px;
   }
   .slide .pad { padding-bottom: 30px; }
   .flickity-page-dots { bottom: 15px; right: 15px; text-align: right; }
   .flickity-page-dots .dot { background-color: #DEDEDE; width: 15px; height: 15px; margin: 0px 0px 0px 12px; }
   .flickity-prev-next-button { display: none; }
   
   /* administration */
   
   body.admin .primary { border-top: 3px solid #FFCC00; border-bottom: 3px solid #FFCC00; }
   body.admin .primary > .pad { border-top: 3px solid #000000; border-bottom: 3px solid #000000; }
   body.admin .browser { height: 300px; border: 1px solid #999999; overflow: auto; }
   body.admin .receipt { background-color: #DEDEDE; padding: 30px; margin-top: 30px; display: none; }
   body.admin input.readonly { color: #999999; background-color: #EFEFEF; }
   table.shade tr:nth-child(even) { background-color: #EFEFEF; }
   table.compact td, table.compact th { font-size: 15px; line-height: 18px; padding-right: 6px; }
   table.padright td, table.padright th { padding-right: 20px; }
   
   /* one sidebar only */
   
   body.onesidebar .primary { flex: 2 0 67%; }
   body.onesidebar .secondary { flex: 1 0 33%; display: block; }
   
   /* no sidebar */
   
   body.nosidebar .primary { display: block; }
   body.nosidebar .secondary { display: none; }
   
   /* large desktops */
   
   @media screen and (min-width: 1860px)
   {
      div.product div.image { flex-basis: 33%; }
      div.product div.info { flex-basis: 67%; padding-left: 30px; }
      body.onesidebar .primary { flex: 2 0 75%; }
      body.onesidebar .secondary { flex: 1 0 25%; display: block; }
   }
   
   /* medium desktops: 2 columns */

   @media screen and (min-width: 1041px) { .mobileonly { display: none; } } 
   @media screen and (max-width: 1040px)
   {
		.nomobile { display: none; }
      h2 { font-size: 28px; line-height: 26px; }
      div.hero h2 { margin: 0px 20px 20px 60px; padding: 12px 10px 8px 10px; }
      .primary { flex: 2 0 67%; }
      .secondary { flex: 1 0 33%; display: block; }
      .sidebar { display: block; }
      #toolbar .legend { display: none; }
      #bandcamp img { display: none; }
   }
   
   /* small desktops and tablets: mobile nav */
	
   @media screen and (max-width: 900px)
   {
      #hd { height: 60px; }
      a#metro { height: 60px; width: 60px; }
      #hd h1 { margin-left: 80px; padding-top: 13px; font-size: 28px; }
      #menu { display: none; }
      #toolbar a#mobilenav { display: inline; }
      #toolbar { top: 0px; }
      div.hero h2 { margin-left: 30px; }
      .pad, .secondary .pad { padding: 30px 30px; }
      a.moar { padding-left: 30px; padding-right: 30px; }
      #footer .social { float: none; text-align: left; margin-left: -5px; }
   }
   
   /* phones: 1 column */
	

   @media screen and (max-width: 800px)
   {
      body { padding-top: 60px; }
      #hd 
      { 
         position: fixed; z-index: 20; top: 0px; left: 0px; right: 0px; 
         -webkit-box-shadow: 0px 5px 10px rgba(0,0,0,0.4); box-shadow: 0px 5px 10px rgba(0,0,0,0.4);
      }
      #hd h1 { padding-top: 14px; font-size: 24px; }
      #mobilemenu { position: fixed; top: 60px; left: 0px; right: 0px; }
      div.hero { margin-bottom: 46px; }
      div.hero h2 { margin: 0px; bottom: -46px; left: 0px; right: 0px; padding-left: 30px; }
      .slide h2 { background-color: rgba(0,0,0,0.7); padding-left: 30px; padding-right: 30px; }
      .slide h4 { display: none; }
      div.caption.pad { padding-left: 0px; }
      .content, .primary, body.onesidebar .primary { display: block; }
      .featured { display: none; }
      div.product div.image { flex-basis: 20%; }
      div.product div.info { flex-basis: 80%; padding-left: 30px; padding-bottom: 10px; }
      ul.columnar { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; }
      body.onesidebar { background-color: #FFFFFF; }
      body.onesidebar .primary { display: block; width: 100%; }
      body.onesidebar .secondary { display: block; width: 100%; }
         #toolbar .social { display: none; }
   }
   
   /* stupidly small */
   
   @media screen and (max-width: 550px)
   {
      #hd h1 { display: none; }
   }
   
   /* phone-only */
   
   @media screen and (min-width: 801px)
   {
      .phoneonly { display: none !important; }
   }
 
   /* print */
   
   .printonly { display: none; }
   @media print 
   {
      
   }