body{
  margin:0;
  padding: 0;
  font-family: futura-pt, sans-serif;
  font-weight: 500;
  font-style: normal;
  transition: 1s ease-out;
  background:white;
  background-position: center;
}
img{
  display: block;
  width:100%;
  height: auto;
}
.monofont{
  font-family: ocr-b-std, monospace;
  font-weight: 400;
  font-style: normal;
}
.darkbg{
  background:#231f20;
}
a{
  color:#231f20;
  text-decoration: none;
  transition: .3s ease-out;
}
h2{
  text-transform: uppercase;
  font-size: 1.25em;
}
.darkbg a{
  color:white;
}
#socials{
  margin:2vh 10vw 2vh 0;
  padding: 0;
  list-style: none;
  float:right;
  font-size: 1.25em;
  position: absolute;
  top:0;
  right:0;
}
#socials li{
  display: inline-block;
  padding:0 1vw;
}

#socials a:hover{
  opacity:0.5;
}
header{
  position: absolute;
  display: grid;
  grid-template-columns: 10fr 1fr;
  grid-gap: 2vw;
  width:80vw;
  margin-left: 10vw;
  top:4vh;
  z-index: 100;
}
header a span{
  writing-mode: vertical-rl;
  text-orientation: mixed;
  text-transform: uppercase;
}
header a:hover span{
  text-transform: lowercase;
}
#menu_open{
  background:#231f20;
  color:white;
  margin-top:3vw;
  padding:10px;
  display:block;
  width:100%;
  max-width: 4vw;
  height: 100%;
  height:calc(100% - 6vw);
}
#main{
  margin-top:24vw;
  overflow-x: hidden;
}
#menu_opened{
  display:none;
}
#nav{
  text-align: right;
  position: absolute;
  top:3vw;
  right:1vw;
  border-right:6vw #231f20 solid;
}
#nav a{
  background:#231f20;
  color:white;
  display: inline-block;
  padding:5px 10px;
  margin-bottom: 20px;
  margin-right: -40px;
  text-transform: uppercase;
}
#nav a:hover{
  text-transform: lowercase;
}
.opened{
  display: block !important;
}
.hidden{
  display: none !important;
}
#subheading{
  background:#231f20;
  color:white;
  text-align: center;
  margin:0;
  padding:2vh 0;
  text-transform: uppercase;
}
#home_carousel{
  xposition: relative;
}
#home_carousel_holder .slick-slide{
  display:grid;
  grid-gap: 30px;
  grid-template-columns: 1fr 2fr;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}
@keyframes slideIn {
  0% {
    margin-left:0vw;
  }

  100% {
    margin-left:10vw;
  }
}
#home_carousel_holder img{
  opacity:0;
}
#home_carousel_holder .slick-active img {
  animation-name: fadeIn;
  animation-duration: 1s;
  opacity: 1;
  width: 100%;
  padding: 10px 20px 30px 0;
}
.home_carousel_text{
  margin-left:0vw;
  margin-top:15vh;
}
#home_carousel_holder .slick-active .home_carousel_text {
  animation-name: slideIn;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 1;
  width: 100%;
  padding: 10px 20px 30px 0;
}
.home_carousel_text h2{
  text-transform: uppercase;
  font-family: futura-pt, sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 2.5em;
  margin:0;
  padding:0;
  position: absolute;
  max-width:50vw;
  z-index: 200;
}
.home_carousel_text span{
  background:white;
  padding-right: 15px;
}
.home_carousel_btns{
  display: flex;
  font-size: 0.4em;
  background:none !important;
  padding-right:0 !important;
  margin-top:10px;
}
.home_carousel_btns a{
  display: flex;
  align-items: center;
  justify-content: center;
  height:50px;
  width:90px;
  text-align: center;
  position: relative;
  border:1px solid #231f20;
  background:white;
}
.home_carousel_btns a span{
  position: absolute;
  transition: .3s ease-out;
  padding-right:0 !important;
}
.home_carousel_btns a span:first-child{
  bottom:5px;
  left:5px;
}
.home_carousel_btns a span:nth-child(2){
  top:5px;
  left:5px;
}
.home_carousel_btns a span:nth-child(3){
  top:5px;
  right:5px;
}
.home_carousel_btns a span:nth-child(4){
  bottom:5px;
  right:5px;
}
.home_carousel_btns a:hover span{
  position: static;
}
#home_carousel_holder .slick-next {
    right: 0px;
    font-size: 2em;
    padding: 10px 0 15px 10px;
    height:40px;
    width:30px;
}
#home_carousel_holder .slick-prev {
    left: 0px;

    padding: 10px 10px 15px 0;
    z-index:300;
    height:40px;
    width:30px;
}
.slick-next:hover, .slick-prev:hover{
    background:#231f20;
}
.emphasis{
  font-family: futura-pt, sans-serif;
  font-weight: 500;
  font-style: italic;
}
.prev, .next{
  position: absolute;
  top:20vw;
  height:50vh;
  background:white;
  background: rgba(255,255,255,0.3);
  color:#231f20;
  padding:5px 10px;
  display:flex;
  align-items: center;
  justify-content: center;
  font-size: 2em;
  opacity:0;
}
.next{
  right:0;
}
.prev:hover, .next:hover{
  opacity:1;
}
#home_artists{
  column-count: 3;
  column-gap: 2vw;
  text-transform: uppercase;
  width:80vw;
  margin:5vh auto;
  padding:5vh 0;
  transform: rotate(1deg);
  line-height: 1.5em;
  text-align: right;
}
#home_artists a{
  max-width: 250px;
  display: inline-block;
}
#home_artists a:hover{
  text-transform: lowercase;
}
#home_carousel_releases{
  width:80vw;
  margin:5vh 0 5vh 10vw;
  text-transform: uppercase;
  xposition:static !important;
}
#home_carousel_releases .slick-list{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 2vw;
  margin-right:-2vw;
}
#home_carousel_releases .slick-slide{
  margin-right: 2vw;
  padding:20px;
}
#home_carousel_releases .slick-slide:hover{
  background: #231f20;
  transform: rotate(1deg);
}
#home_carousel_releases .slick-slide a:hover{
  color:white !important;
}
#home_carousel_releases .slick-slide:nth-child(4n+4){
  xmargin-right: 3vw;
}
#home_carousel_releases h4, #home_carousel_releases h5{
  margin:0;
  padding:0;
}
#home_carousel_releases h5{
  font-style: italic;
  font-weight: 500;
}
#home_carousel_releases .slick-next {
    right: -10vw;
    font-size: 2em;
    padding: 10px 2.5vw;
    height:25vw;
    width:30px;
    background:#231f20;
    top:12.5vw;
}
#home_carousel_releases .slick-prev {
    left: -10vw;;
    background:#231f20;
    padding: 10px 2.5vw;
    z-index:300;
    height:25vw;
    width:30px;
    top:12.5vw;
}
#footer{
  text-align:center;
  color:white;
  font-style: italic;
  padding:7.5vh 0;
  text-transform: uppercase;
  line-height: 1.5em;
  transition: 1s ease-out;
}
#footer a:hover{
  text-transform: lowercase;
}
#trigger{
  margin-top:20vh;
}
.dark{
  background:#f9fc53;
  color:#13420e;
}
.dark #footer{
  background:transparent;
  color:#13420e;
}
.dark{
  background:#f9fc53 url(/wp/wp-content/themes/jagjaguwar/images/darkbg.jpg);
  background-size: 500px;
  background-position: center;
  background-attachment: fixed;
}
.dark a, .dark h4, .dark h5, .dark #footer a{
  display:inline-block;
  -moz-transform: scale(-1, -1);
        -webkit-transform: scale(-1, -1);
        -o-transform: scale(-1, -1);
        -ms-transform: scale(-1, -1);
        transform: scale(-1, -1);
        color:#13420e;
}
#artists_current ul{
  list-style: none;
  margin:0;
  padding:0;
}
#artists_current ul li{
  display:flex;
  align-items: center;
  height:10vh;
  transition: .3s ease-out;
  position: relative;
}
#artists_current ul li:hover{
  align-items: start;
  height:33vh;
}
#artists_current h2{
  display: inline-block;
  background:white;
  padding:1vw 1vw 1vw 10vw;
}
#artists_current .home_carousel_btns{
  font-size: 1em;
  display: none;
}
#artists_current ul li:hover .home_carousel_btns{
  display:block;
}
.artists_current_btns{
  display: block;
  width:80vw;
  position: absolute;
  top:10vw;
  left:10vw;
}
#artists_current .home_carousel_btns a{
  float:left;
  margin-right: 10px;
  border:none;
}
#artists_other{
  text-transform: uppercase;
  width:80vw;
  margin:5vh auto;
}
#artists_other h2{
  width:80vw;
}
#artists_other ul{
  list-style: none;
  padding:0;
  line-height: 1.5em;
  column-count: 3;
  column-gap: 2vw;
}
#artists_other a{
  text-transform: uppercase;
}
#artists_other a:hover{
  text-transform: lowercase;
}
#artist_header{
  height:60vh;
}
#artist_header h2, #artist_header h3, #artist_socials{
  margin:0;
  padding:1vw 1vw 1vw 10vw !important;
  background:white;
  padding:5px;
  list-style: none;
  display: inline-block;
}
#artist_header h2{
  font-size: 2em;
  margin-top:40vh;
}
#artist_header h3 a{
  text-transform: uppercase;
}
#artist_header h3 a:hover{
  text-transform: lowercase;
}
#artist_socials li{
  display:inline-block;
  padding:0 1vw;
}
#artist_socials li:first-child{
  padding-left: 0;
}
#artist_socials li a:hover{
  opacity:0.5;
}
#artist_content{
  width:80vw;
  margin: 5vh 10vw;
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-gap:2vw;
}
#artist_content > div{
  text-align: justify;
}
#artist_releases{
  margin:0;
  padding: 0;
  list-style:none;
}
#artist_releases li{
  position: relative;
  margin-bottom: 5vh;
}
#artist_releases li h3{
    position: absolute;
    top:1vw;
    left:0vw;
    max-width:80%;
    display:inline-block;
    background:white;
    padding:0.5vw 0.5vw 0.5vw 2vw;
}
#artist_releases li .home_carousel_btns{
  font-size: 1em;
  text-transform: uppercase;
}
.twol1r{
  width:80vw;
  margin:0vh 10vw 5vh;
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-gap:2vw;
}
#release_top h2{
  margin:10vh 0 0 0;
  padding:0;
  font-size: 2em;
}
#release_top h3{
  margin:0;
  padding:0;
  font-size: 2em;
  font-family: futura-pt, sans-serif;
  font-weight: 300;
  font-style: italic;
  text-transform: uppercase;
}
.release_buy{
  display: block;
  border:1px solid #231f20;
  text-transform: uppercase;
  padding:10px;
  text-align: center;
  margin:5vh 0;
}
.release_buy:hover{
  text-transform: lowercase;
}
.twol1r ol{
  padding:0 0 0 1.5em;
  margin:2vh 0 5vh;
}
#release_bottom p{
  text-align: justify;
}
#releasesgrid{
  width:80vw;
  margin:2vw auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap:2vw;
  list-style: none;
  padding:0;
}
#releasesgrid .home_carousel_btns{
  font-size: 1em;
}
#releasesgrid li{
  position: relative;
}
#releasesgrid h3{
  position: absolute;
    top: 1vw;
    left: 0vw;
    max-width: 80%;
    display: inline-block;
    background: white;
    padding: 0.5vw 0.5vw 0.5vw 2vw;
}
#releasesgrid h3 em{
  font-weight: 300;
}
.basicpage{
  width:80vw;
  margin:2vw auto;
}
#info_emails{
  margin-bottom:5vh;
}
#info_emails a, input[type=submit]{
  display: block;
  text-align: center;
  border:1px solid #231f20;
  padding:5px 0;
  text-transform: uppercase;
  background:white;
  border-radius: 0;
  -webkit-appearance:none;
  width:100%;
  font-family: futura-pt, sans-serif;
  font-weight: 500;
  font-style: normal;
  cursor: pointer;
  margin-bottom: 1vh;
}
#info_emails a:hover, input[type=submit]:hover{
  text-transform: lowercase;
}
#info_btm{
  margin-top:5vh;
}
.tourpage{
  width:80vw;
  margin:2vw auto;
}
.tourpage h2{
  text-align: center;
  margin-bottom: 2vw;
}
.tourpage ul{
  display:grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 2vw;
  list-style: none;
  margin:0;
  padding:0;
  text-transform: uppercase;
  margin-bottom: 5vw;
}
.tourpage ul li{
  margin-bottom: 15px;
}
.tix{
  border:1px solid #231f20;
  padding:2.5px 5px;
  margin-left:20px;
}
.tix:hover{
  text-transform:lowercase;
}
.post{
  width:84vw;
  margin:0 8vw;
  background:url(/wp/wp-content/themes/jagjaguwar/images/post_bg.jpg);
  background-size: 100% auto;
  background-repeat: repeat-y;
  text-align: center;
  color:white;
}
#post_topper{
  height:3vh;
  background:url(/wp/wp-content/themes/jagjaguwar/images/post_bg_top.jpg);
  background-size: 100% auto;
  background-repeat:no-repeat;
}
#post_footer{
  height:3vh;
  background:url(/wp/wp-content/themes/jagjaguwar/images/post_bg_btm.jpg);
  background-size: 100% auto;
  background-repeat:no-repeat;
}
#post_content, .post h1{
  padding:0 3vw 3vh;
}
.post h1{
  text-transform: uppercase;
  margin-top:1vh;
  margin-bottom: 0;
}
.post img{
  width:82.5vw;
  margin:auto;
}
#longform{
  list-style: none;
  margin:0;
  padding:0;
  text-transform: uppercase;
  text-align: center;
}
#longform li{
  margin-bottom: 15px;
}
#longform a:hover{
  text-transform: lowercase;
}
@media (orientation : portrait) {
  #release_top h2{
    margin:2vh 0 0 0;
  }
  #menu_open{
    height:calc(100% - 7vh);
  }
  #main{
    margin-top:17vh;
  }
  #socials{
    font-size: 1.25em;
  }
  #home_artists, #artists_other ul{
    column-count: 2;
  }
  #home_carousel_releases, #artist_content, .twol1r, #releasesgrid{
    grid-template-columns: 1fr;
  }
  #home_carousel_holder .slick-slide{
    display:block;
  }
  .home_carousel_text{
    margin-left:0vw;
    margin-top:13vh;
    position: absolute;
  }
  .home_carousel_text h2 {
    position:static;
    max-width:80vw;
    font-size: 1.5em;
  }
  .home_carousel_text h2 > span, .home_carousel_text > span{
    padding-left:10vw;
  }
  .home_carousel_btns{
    font-size: 0.5em;
  }
  @keyframes slideIn {
    0% {
      margin-left:-10vw;
    }

    100% {
      margin-left:0vw;
    }
  }
  .artists_current_btns{
    top:20vw;
  }
  .carousel_counter{
    font-size:0.7em;
  }
  .tourpage ul{
    grid-template-columns: 1fr;
  }
}