p, h1, h2, h3, h4, h5 {
  margin: 0; }

.absolute {
  position: absolute; }

.relative {
  position: relative; }

.fixed {
  position: fixed; }

.block {
  display: block; }

.inline {
  display: inline; }

.inline-block {
  display: inline-block; }

.table {
  display: table; }

.inline-table {
  display: inline-table; }

.table-row {
  display: table-row; }

.table-cell {
  display: table-cell; }

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.inline-flex {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex; }

.none {
  display: none; }

.float-left {
  float: left; }

.float-right {
  float: right; }

.clear-both {
  clear: both; }

.row {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap; }

.column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column wrap;
          flex-flow: column wrap; }

.justify-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }

.justify-around {
  -ms-flex-pack: distribute;
      justify-content: space-around; }

.justify-between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }

.align-center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }

.width100 {
  width: 100%; }

.height100 {
  height: 100%; }

.v-top {
  vertical-align: top; }

.v-middle {
  vertical-align: middle; }

.v-bottom {
  vertical-align: bottom; }

.light {
  font-weight: 200; }

.bold {
  font-weight: bold; }

.italic {
  font-style: italic; }

.uppercase {
  text-transform: uppercase; }

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

.text-left {
  text-align: left; }

.text-right {
  text-align: right; }

.pointer {
  cursor: pointer; }

.no-select {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

html {
  background-color: white; }

html, body {
  margin: 0;
  font-family: 'Milwaukee', helvetica; }

.background {
  background-image: url(assets/tree.png), url("assets/background.jpg");
  background-repeat: no-repeat;
  background-size: 50%, 100% 100%;
  position: fixed;
  background-position: top right, top center;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0; }

.vcr {
  font-family: 'VCR OSD Mono'; }

main {
  max-width: 1500px;
  padding-bottom: 3em;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

.artwork {
  text-decoration: none;
  color: black;
  width: 20vw;
  min-width: 240px;
  max-width: 290px;
  top: 3em;
  left: 5vw; }
  .artwork .img-cont {
    -webkit-transition: mix-blend-mode 0.2s ease;
    transition: mix-blend-mode 0.2s ease;
    -webkit-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.66);
            box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.66); }
  .artwork p {
    font-size: 28px;
    margin-top: 0.5em; }
  .artwork:hover {
    text-decoration: underline; }
    .artwork:hover img {
      mix-blend-mode: difference; }

footer {
  padding: 1em 0 2em;
  color: #dfdfdf; }
  footer img {
    max-width: 50px;
    padding-bottom: 1em; }
  footer a {
    color: #dfdfdf;
    text-decoration: none; }
  footer .fv {
    font-size: 1.66em; }
    footer .fv:before, footer .fv:after {
      content: '';
      display: inline-block;
      vertical-align: top;
      width: 1em;
      height: 1em;
      background-size: 100%;
      background-repeat: no-repeat;
      background-image: url("assets/fantastic-voyage-vcr.png"); }
    footer .fv:before {
      margin-right: 0.66em; }
    footer .fv:after {
      margin-left: 0.66em; }

.video-cont {
  margin: 1em auto 3em;
  max-width: 90vw;
  max-height: 50.625vw;
  width: 800px;
  height: 450px; }
  .video-cont iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.socials .link {
  margin-right: 0.5em; }
  .socials .link:last-of-type {
    margin-right: 0; }
  .socials .link img {
    width: 10vw;
    height: auto;
    max-width: 30px; }

body.will-not-blend header .overlay {
  display: none; }

#tour_dates {
  font-family: 'MacType';
  font-size: 1.5em;
  margin: 0 auto; }
  #tour_dates .dates {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: block;
    position: relative;
    margin-bottom: 1em; }
    #tour_dates .dates li {
      margin-bottom: 0.66em;
      position: relative;
      display: block;
      padding: 0 1em;
      -webkit-box-sizing: border-box;
              box-sizing: border-box; }
      #tour_dates .dates li:last-of-type {
        margin-bottom: 0; }
      #tour_dates .dates li a {
        position: relative;
        text-decoration: none;
        display: inline-block;
        padding: 0.33em 0.33em 0 0.5em;
        text-shadow: -1px 1px #006260;
        color: #feedbf; }
        #tour_dates .dates li a:before {
          content: '';
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background-color: #e2d5b0;
          mix-blend-mode: difference; }
        #tour_dates .dates li a span {
          display: inline;
          position: relative;
          isolation: isolate; }
        #tour_dates .dates li a .date:after {
          content: '-';
          margin: 0 1.5em; }
        #tour_dates .dates li a .city {
          color: white; }
          #tour_dates .dates li a .city:after {
            color: #feedbf;
            content: '//';
            margin: 0 1em; }
        #tour_dates .dates li a .venue.mod:after {
          content: '';
          display: inline-block;
          width: 0.9em;
          height: 0.9em;
          margin-left: 0.25em;
          vertical-align: middle;
          -webkit-transform: translateY(-0.1em);
                  transform: translateY(-0.1em);
          background-size: 100%;
          background-repeat: no-repeat;
          background-image: url("assets/fantastic-voyage-vcr-tan.png"); }
  #tour_dates .foot {
    color: #dfdfdf;
    font-size: 0.9em; }
    #tour_dates .foot:before, #tour_dates .foot:after {
      content: '-';
      display: inline-block; }
    #tour_dates .foot:before {
      margin-right: 1em; }
    #tour_dates .foot:after {
      margin-left: 1em; }

@media screen and (max-width: 768px) {
  #tour_dates .dates {
    font-size: 0.8em; }
    #tour_dates .dates li a .date:after {
      margin: 0 0.66em; }
    #tour_dates .dates li a .city:after {
      margin: 0 0.66em; } }

@media screen and (max-width: 600px) {
  #tour_dates .foot {
    font-size: 4.5vw; } }

header {
  padding: 8em 1em 10em;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 6px;
  position: relative; }
  header .overlay {
    top: 0;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    width: 94vw;
    max-width: 550px;
    top: 4em;
    mix-blend-mode: screen;
    z-index: 10; }
  header .artist {
    font-size: 18em;
    letter-spacing: 0.05em;
    text-shadow: 0.02em 0.02em #ffff68, 0.04em 0.04em #fb44cb, 0.06em 0.06em #81d7b3; }
  header .title {
    font-size: 5em;
    letter-spacing: 0.05em; }
  header .subtitle {
    font-size: 7em;
    letter-spacing: 0.05em; }
  header .glitch {
    position: relative; }
    header .glitch:before, header .glitch:after {
      content: attr(data-text);
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 0; }
    header .glitch:before {
      -webkit-transform: translateX(-2px);
              transform: translateX(-2px);
      color: #ffff68; }
    header .glitch:after {
      -webkit-transform: translateX(2px);
              transform: translateX(2px);
      color: #fb44cb; }
    header .glitch .base {
      position: relative;
      z-index: 1;
      isolation: isolate; }
    header .glitch:nth-of-type(1):before, header .glitch:nth-of-type(1):after, header .glitch:nth-of-type(1) .base {
      -webkit-animation-delay: 0s;
              animation-delay: 0s; }
    header .glitch:nth-of-type(2):before, header .glitch:nth-of-type(2):after, header .glitch:nth-of-type(2) .base {
      -webkit-animation-delay: 3s;
              animation-delay: 3s; }
    header .glitch:nth-of-type(3):before, header .glitch:nth-of-type(3):after, header .glitch:nth-of-type(3) .base {
      -webkit-animation-delay: 6s;
              animation-delay: 6s; }

@-webkit-keyframes glitch-base {
  0% {
    -webkit-clip-path: polygon(0% -3%, 100% -3%, 100% 0%, 0% 0%, 0% 3%, 100% 3%, 100% 100%, 0% 100%);
            clip-path: polygon(0% -3%, 100% -3%, 100% 0%, 0% 0%, 0% 3%, 100% 3%, 100% 100%, 0% 100%); }
  33% {
    -webkit-clip-path: polygon(0% -3%, 100% -3%, 100% 100%, 0% 100%, 0% 103%, 100% 103%, 100% 106%, 0% 106%);
            clip-path: polygon(0% -3%, 100% -3%, 100% 100%, 0% 100%, 0% 103%, 100% 103%, 100% 106%, 0% 106%); }
  100% {
    -webkit-clip-path: polygon(0% -3%, 100% -3%, 100% 100%, 0% 100%, 0% 103%, 100% 103%, 100% 106%, 0% 106%);
            clip-path: polygon(0% -3%, 100% -3%, 100% 100%, 0% 100%, 0% 103%, 100% 103%, 100% 106%, 0% 106%); } }

@keyframes glitch-base {
  0% {
    -webkit-clip-path: polygon(0% -3%, 100% -3%, 100% 0%, 0% 0%, 0% 3%, 100% 3%, 100% 100%, 0% 100%);
            clip-path: polygon(0% -3%, 100% -3%, 100% 0%, 0% 0%, 0% 3%, 100% 3%, 100% 100%, 0% 100%); }
  33% {
    -webkit-clip-path: polygon(0% -3%, 100% -3%, 100% 100%, 0% 100%, 0% 103%, 100% 103%, 100% 106%, 0% 106%);
            clip-path: polygon(0% -3%, 100% -3%, 100% 100%, 0% 100%, 0% 103%, 100% 103%, 100% 106%, 0% 106%); }
  100% {
    -webkit-clip-path: polygon(0% -3%, 100% -3%, 100% 100%, 0% 100%, 0% 103%, 100% 103%, 100% 106%, 0% 106%);
            clip-path: polygon(0% -3%, 100% -3%, 100% 100%, 0% 100%, 0% 103%, 100% 103%, 100% 106%, 0% 106%); } }

@-webkit-keyframes glitch-offset {
  0% {
    -webkit-clip-path: polygon(0% -3%, 100% -3%, 100% 0%, 0% 0%);
            clip-path: polygon(0% -3%, 100% -3%, 100% 0%, 0% 0%); }
  33% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 103%, 0 103%);
            clip-path: polygon(0 100%, 100% 100%, 100% 103%, 0 103%); } }

@keyframes glitch-offset {
  0% {
    -webkit-clip-path: polygon(0% -3%, 100% -3%, 100% 0%, 0% 0%);
            clip-path: polygon(0% -3%, 100% -3%, 100% 0%, 0% 0%); }
  33% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 103%, 0 103%);
            clip-path: polygon(0 100%, 100% 100%, 100% 103%, 0 103%); } }

@media screen and (max-width: 600px) {
  header {
    font-size: 0.98vw; } }

@media screen and (max-width: 1050px) {
  header {
    padding: 0em 1em 10em; } }

@media screen and (max-width: 1050px) {
  .artwork {
    position: relative !important;
    left: 0;
    top: 0;
    width: 90%;
    display: block;
    padding-bottom: 2em;
    margin: 0 auto;
    max-width: 500px;
    min-width: auto; } }

@media screen and (max-width: 768px) {
  .background {
    background-size: 80%, 100% 100%; } }

@media screen and (max-width: 600px) {
  footer .fv {
    font-size: 5vw; } }
