/* Global Reset & Standards ---------------------- */
*, *:before, *:after {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-moz-tap-highlight-color: rgba(0, 0, 0, 0);}

/* Misc ---------------------- */
.text-center {text-align: center;}

.hide {display: none;}
.hide-override {display: none !important;}

/* Reset for strange margins by default on <figure> elements */
figure {margin: 0;}

/* Base Type Styles Using Modular Scale ---------------------- */
body, div, ul, li, h1, h2, h3, h4, h5, h6, form, p, th {margin: 0; padding: 0; font-size: 14px; direction: ltr;}

p {font-family: inherit; font-weight: normal;}

em, i {font-style: italic; line-height: inherit;}
strong, b {font-weight: bold; line-height: inherit;}
small {font-size: 60%; line-height: inherit;}

/* Lists ---------------------- */
ul {font-size: 14px; line-height: 1.6; margin-bottom: 17px; list-style-position: outside;}
ul li ul {margin-left: 20px; margin-bottom: 0;}

/* Print styles.  Inlined to avoid required HTTP connection */
.print-only {display: none !important;}

@media print {
  * {background: transparent !important; color: black !important; box-shadow: none !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important;}
  a, a:visited {text-decoration: underline;}
  a[href]:after {content: "";}
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {content: "";}
  img {max-width: 100% !important; page-break-inside: avoid;}
  @page {margin: 0.5cm;}
  p, h2, h3 {orphans: 3; widows: 3;}
  h2, h3 {page-break-after: avoid;}
  .hide-on-print {display: none !important;}
  .print-only {display: block !important;}
  .hide-for-print {display: none !important;}
  .show-for-print {display: inherit !important;}}

/* The Grid ---------------------- */
.row {width: 940px; max-width: 100%; min-width: 768px; margin: 0 auto;}
.row .row {width: auto; max-width: none; min-width: 0; margin: 0 -15px;}
.row.collapse .column, .row.collapse .columns {padding: 0;}
.row .row {width: auto; max-width: none; min-width: 0; margin: 0 -15px;}
.row .row.collapse {margin: 0;}

.column, .columns {float: left; min-height: 1px; padding: 0 15px; position: relative;}
.column.centered, .columns.centered {float: none; margin: 0 auto;}

[class*="column"] + [class*="column"]:last-child {float: right;}
[class*="column"] + [class*="column"].end {float: left;}

.one, .row .one {width: 8.33333%;}
.one-half, .row .one-half {width: 12.5%;}
.two, .row .two {width: 16.66667%;}
.two-four, .row .two-four {width: 20%;}
.two-half, .row .two-half {width: 20.83333%;}
.three, .row .three {width: 25%;}
.three-quarter, .row .three-quarter {width: 31.25%;}
.four, .row .four {width: 33.33333%;}
.four-half, .row .four-half {width: 37.5%;}
.five, .row .five {width: 41.66667%;}
.five-half, .row .five-half {width: 45.8333%;}
.six, .row .six {width: 50%;}
.seven, .row .seven {width: 58.33333%;}
.eight, .row .eight {width: 66.66667%;}
.nine, .row .nine {width: 75%;}
.ten, .row .ten {width: 83.33333%;}
.ten-half, .row .ten-half {width: 87.5%;}
.eleven, .row .eleven {width: 91.66667%;}
.twelve, .row .twelve {width: 100%;}

.row .offset-by-half {margin-left: 4.16667%;}
.row .offset-by-two {margin-left: 16.66667%;}

.push-half {left: 4.16667%;}
.pull-half {right: 4.16667%;}
.push-3qtr {left: 6.25%;}
.pull-3qtr {right: 6.25%;}
.push-one {left: 8.33333%;}
.pull-one {right: 8.33333%;}
.push-onehalf {left: 12.5%;}
.pull-onehalf {right: 12.5%;}
.push-two {left: 16.66667%;}
.pull-two {right: 16.66667%;}
.push-twohalf {left: 20.83333%;}
.pull-twohalf {right: 20.83333%;}
.push-three {left: 25%;}
.pull-three {right: 25%;}
.push-four {left: 33.33333%;}
.pull-four {right: 33.33333%;}

img {height: auto; border: 0;}
img, object, embed {max-width: 100%;}
img {-ms-interpolation-mode: bicubic;}

/* Micro clearfix */
.row {*zoom: 1;}
.row:before, .row:after {content: " "; display: table;}
.row:after {clear: both;}

/* Block Grids ---------------------- */
/* These are 2-up, 3-up, 4-up and 5-up ULs, suited
for repeating blocks of content. Add 'mobile' to
them to switch them just like the layout grid
(one item per line) on phones
-------------------------------------------------- */
.block-grid {display: block; overflow: visible; padding: 0;}
.block-grid > li {display: inline-block; height: auto; padding: 7px;}

/* Image Thumbnails ---------------------- */
.th img {
  display: inline-block;
  padding: 0;
  margin: 0;
  border: 4px solid #fff;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
  transition: box-shadow 200ms ease-out;
  border-radius: 3px;}

/* Mixtape Album Cover border*/
.th-cover img {border: 6px solid #fff;}

.th:hover img, .th:focus img {box-shadow: 0 0 50px 1px #fff;}

/* Visibility Classes ---------------------- */
.show-for-xsmall, .show-for-small, .show-for-print {display: none !important;}
.hide-for-xsmall, .hide-for-small, .hide-for-print {display: inherit !important;}

@media only screen and (max-width: 767px) {
 .show-for-small {display: inherit !important;}
 .hide-for-small {display: none !important;}}

@media only screen and (max-width: 320px) {
 .show-for-xsmall {display: inherit !important;}
 .hide-for-xsmall {display: none !important;}}

/* Small Devices ------------ */
@media only screen and (max-width: 767px) {
  body {
      -webkit-text-size-adjust: none;
      -ms-text-size-adjust: none;
      width: 100%;
      min-width: 0;
      margin-left: 0;
      margin-right: 0;
      padding-left: 0;
      padding-right: 0;}
/* The Grid --- */
  .row {width: auto; min-width: 0; margin-left: 0; margin-right: 0;}
  .column, .columns {width: auto !important; float: none;}
  .column:last-child, .columns:last-child { float: none;}
  [class*="column"] + [class*="column"]:last-child { float: none;}
  .column:before, .columns:before, .column:after, .columns:after {content: ""; display: table;}
  .column:after, .columns:after {clear: both;}
  .offset-by-half, .offset-by-two {margin-left: 0 !important;}
  .push-half, .push-3qtr, .push-one, .push-onehalf, .push-two, .push-twohalf, .push-three, .push-four {left: auto;}
  .pull-half, .pull-3qtr, .pull-one, .pull-onehalf, .pull-two, .pull-twohalf, .pull-three, .pull-four {right: auto;}
/* Mobile 4-column Grid */
  .row .mobile-one {width: 25% !important; float: left; padding: 0 15px;}
  .row .mobile-one:last-child {float: right;}
  .row .mobile-one.end {float: left;}
  .row.collapse .mobile-one {padding: 0;}
  .row .mobile-third {width: 33.3333% !important; float: left; padding: 0 15px;}
  .row .mobile-third:last-child {float: right;}
  .row .mobile-third.end {float: left;}
  .row.collapse .mobile-third {padding: 0;}
  .row .mobile-two {width: 50% !important; float: left; padding: 0 15px;}
  .row .mobile-two:last-child {float: right;}
  .row .mobile-two.end {float: left;}
  .row.collapse .mobile-two {padding: 0;}
  .row .mobile-three {width: 75% !important; float: left; padding: 0 15px;}
  .row .mobile-three:last-child {float: right;}
  .row .mobile-three.end {float: left; }
  .row.collapse .mobile-three {padding: 0;}
  .push-one-mobile {left: 25%;}
  .pull-one-mobile {right: 25%;}
/* Block Grids --- */
  .block-grid.mobile > li {float: none; width: 100%; margin-left: 0;}
  .block-grid > li {clear: none;}}
  
@media only screen and (max-width: 650px) {
  .block-grid.mobile-3-2-1 > li {width: 32.6%;}
  .block-grid.mobile-3-2-1 > li:nth-child(2n+1) {clear: both;}}
  
@media only screen and (max-width: 460px) {
  .block-grid.mobile-3-2-1 > li {width: 49.3%;}
  .block-grid.mobile-3-2-1 > li:nth-child(2n+1) {clear: both;}}
  
@media only screen and (max-width: 290px) {
  .block-grid.mobile-3-2-1 > li {width: 100%;}}