/* Clean */
@import url("https://fonts.googleapis.com/css?family=Shadows+Into+Light");
@import url("https://fonts.googleapis.com/css?family=Montserrat:300,400,600");
@import url("https://fonts.googleapis.com/css?family=Notable|Playfair+Display");
:not(head) {
  display: flex;
  flex-wrap: wrap; }

body {
  margin: 0;
  flex-direction: column;
  flex-grow: 1;
  font-family: 'Montserrat', sans-serif;
  font-weight: 300; }

a {
  color: inherit;
  text-decoration: none; }

ul {
  flex-direction: column; }

img {
  flex-grow: 0; }

/* Shared Styles */
:root {
  --main-padding: 80px; }
  @media (max-width: 600px) {
    :root {
      --main-padding: 20px; } }

main-content, .inner-content {
  padding: 10px var(--main-padding);
  flex-direction: column; }
  @media (max-width: 600px) {
    main-content, .inner-content {
      padding: 8px var(--main-padding); } }

body[data-page='/demo-reel.html'] {
  background: black; }
  body[data-page='/demo-reel.html'] .demo-reel-frame {
    width: 900px;
    height: 675px;
    align-self: center;
    border: none; }
    @media (max-width: 1060px) {
      body[data-page='/demo-reel.html'] .demo-reel-frame {
        width: calc(100vw - (2 * var(--main-padding)));
        height: calc(75vw - (1.5 * var(--main-padding))); } }

/* Allow two column layout on wide devices. */
@media (min-width: 600px) {
  .columns {
    flex-direction: row;
    flex-wrap: nowrap; }
    .columns > * {
      flex-grow: 1;
      flex-basis: 0; } }
.stylized-font {
  font-family: 'Notable', cursive;
  font-size: 2.67em; }

.button {
  background-color: green;
  border-radius: 1px;
  color: white;
  padding: 6px;
  margin: 4px 0;
  width: fit-content; }

/* Nav */
nav {
  flex-direction: row;
  justify-content: space-evenly;
  align-items: stretch;
  justify-self: start;
  flex-wrap: wrap;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 8px 0; }
  @media (max-width: 600px) {
    nav {
      font-size: 1.2em; } }

nav a {
  text-decoration: none;
  justify-content: center;
  align-items: center;
  color: white;
  padding: 2px 4px; }

nav .current {
  font-weight: bold; }

/* Contact */
contact {
  flex-direction: column;
  padding: 20px;
  border: 1px solid darkgrey; }
  contact p {
    margin: 5px 0; }

/* Upcoming Shows */
body[data-page='/shows.html'] main-content {
  margin: 0;
  padding: 0; }

.banner-img {
  width: 20%;
  height: 190px;
  background-size: cover;
  background-position: center; }
  @media (max-width: 600px) {
    .banner-img {
      height: 110px; } }

.past-shows {
  font-weight: bold;
  margin-top: 60px; }

/* Bookings */
.book-now summary {
  justify-content: center;
  cursor: pointer; }

.book-now[open] {
  align-self: center; }

.book-now[open] summary {
  display: none; }

.media {
  display: flex;
  align-self: flex-end;
  margin: 0;
  padding: 10px;
  flex-direction: row; }
  .media li {
    display: flex;
    margin-right: 10px;
    background-color: black;
    border-radius: 15px;
    height: 30px;
    width: 30px;
    align-items: center;
    justify-content: center; }
  .media svg {
    fill: white;
    height: 20px;
    display: flex; }

.profile {
  flex-direction: column;
  width: 30%; }
  .profile img {
    max-width: 350px;
    width: 100%; }
  .profile .media {
    margin-top: -50px; }
  .profile .link-icon {
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='white' height='15px' id='Capa_1' style='enable-background:new 0 0 80 80;' version='1.1' viewBox='0 0 80 80' width='15px' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M29.298,63.471l-4.048,4.02c-3.509,3.478-9.216,3.481-12.723,0c-1.686-1.673-2.612-3.895-2.612-6.257 s0.927-4.585,2.611-6.258l14.9-14.783c3.088-3.062,8.897-7.571,13.131-3.372c1.943,1.93,5.081,1.917,7.01-0.025 c1.93-1.942,1.918-5.081-0.025-7.009c-7.197-7.142-17.834-5.822-27.098,3.37L5.543,47.941C1.968,51.49,0,56.21,0,61.234 s1.968,9.743,5.544,13.292C9.223,78.176,14.054,80,18.887,80c4.834,0,9.667-1.824,13.348-5.476l4.051-4.021 c1.942-1.928,1.953-5.066,0.023-7.009C34.382,61.553,31.241,61.542,29.298,63.471z M74.454,6.044 c-7.73-7.67-18.538-8.086-25.694-0.986l-5.046,5.009c-1.943,1.929-1.955,5.066-0.025,7.009c1.93,1.943,5.068,1.954,7.011,0.025 l5.044-5.006c3.707-3.681,8.561-2.155,11.727,0.986c1.688,1.673,2.615,3.896,2.615,6.258c0,2.363-0.928,4.586-2.613,6.259 l-15.897,15.77c-7.269,7.212-10.679,3.827-12.134,2.383c-1.943-1.929-5.08-1.917-7.01,0.025c-1.93,1.942-1.918,5.081,0.025,7.009 c3.337,3.312,7.146,4.954,11.139,4.954c4.889,0,10.053-2.462,14.963-7.337l15.897-15.77C78.03,29.083,80,24.362,80,19.338 C80,14.316,78.03,9.595,74.454,6.044z'/%3E%3C/g%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3Cg/%3E%3C/svg%3E"); }
  .profile .insta-icon {
    width: 25px;
    height: 25px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'%3E%3Cpath d='M256 109.3c47.8 0 53.4 0.2 72.3 1 17.4 0.8 26.9 3.7 33.2 6.2 8.4 3.2 14.3 7.1 20.6 13.4 6.3 6.3 10.1 12.2 13.4 20.6 2.5 6.3 5.4 15.8 6.2 33.2 0.9 18.9 1 24.5 1 72.3s-0.2 53.4-1 72.3c-0.8 17.4-3.7 26.9-6.2 33.2 -3.2 8.4-7.1 14.3-13.4 20.6 -6.3 6.3-12.2 10.1-20.6 13.4 -6.3 2.5-15.8 5.4-33.2 6.2 -18.9 0.9-24.5 1-72.3 1s-53.4-0.2-72.3-1c-17.4-0.8-26.9-3.7-33.2-6.2 -8.4-3.2-14.3-7.1-20.6-13.4 -6.3-6.3-10.1-12.2-13.4-20.6 -2.5-6.3-5.4-15.8-6.2-33.2 -0.9-18.9-1-24.5-1-72.3s0.2-53.4 1-72.3c0.8-17.4 3.7-26.9 6.2-33.2 3.2-8.4 7.1-14.3 13.4-20.6 6.3-6.3 12.2-10.1 20.6-13.4 6.3-2.5 15.8-5.4 33.2-6.2C202.6 109.5 208.2 109.3 256 109.3M256 77.1c-48.6 0-54.7 0.2-73.8 1.1 -19 0.9-32.1 3.9-43.4 8.3 -11.8 4.6-21.7 10.7-31.7 20.6 -9.9 9.9-16.1 19.9-20.6 31.7 -4.4 11.4-7.4 24.4-8.3 43.4 -0.9 19.1-1.1 25.2-1.1 73.8 0 48.6 0.2 54.7 1.1 73.8 0.9 19 3.9 32.1 8.3 43.4 4.6 11.8 10.7 21.7 20.6 31.7 9.9 9.9 19.9 16.1 31.7 20.6 11.4 4.4 24.4 7.4 43.4 8.3 19.1 0.9 25.2 1.1 73.8 1.1s54.7-0.2 73.8-1.1c19-0.9 32.1-3.9 43.4-8.3 11.8-4.6 21.7-10.7 31.7-20.6 9.9-9.9 16.1-19.9 20.6-31.7 4.4-11.4 7.4-24.4 8.3-43.4 0.9-19.1 1.1-25.2 1.1-73.8s-0.2-54.7-1.1-73.8c-0.9-19-3.9-32.1-8.3-43.4 -4.6-11.8-10.7-21.7-20.6-31.7 -9.9-9.9-19.9-16.1-31.7-20.6 -11.4-4.4-24.4-7.4-43.4-8.3C310.7 77.3 304.6 77.1 256 77.1L256 77.1z'%3E%3C/path%3E%3Cpath d='M256 164.1c-50.7 0-91.9 41.1-91.9 91.9s41.1 91.9 91.9 91.9 91.9-41.1 91.9-91.9S306.7 164.1 256 164.1zM256 315.6c-32.9 0-59.6-26.7-59.6-59.6s26.7-59.6 59.6-59.6 59.6 26.7 59.6 59.6S288.9 315.6 256 315.6z'%3E%3C/path%3E%3Ccircle cx='351.5' cy='160.5' r='21.5'%3E%3C/circle%3E%3C/svg%3E"); }

/* Index Styles */
body[data-page='/'] {
  background-image: url("/assets/images/main.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-color: black;
  /*  background-position-y: {{page.nav_height}}; */
  height: 100vh;
  color: white;
  max-width: 100vw;
  box-sizing: border-box; }
  body[data-page='/'] nav {
    max-width: 100vw; }
  body[data-page='/'] main-content {
    padding: 0;
    flex-grow: 1;
    max-width: 100vw;
    box-sizing: border-box; }
  body[data-page='/'] .title {
    display: flex;
    flex-grow: 1;
    align-items: center;
    align-self: center;
    flex-direction: column;
    justify-content: space-between;
    margin: 50px;
    font-family: 'Notable', cursive; }
    @media (max-width: 560px) {
      body[data-page='/'] .title {
        margin: 0;
        text-align: center; } }
    body[data-page='/'] .title h1 {
      font-size: 2.67em;
      margin-bottom: 6px;
      text-align: center; }
      @media (max-width: 560px) {
        body[data-page='/'] .title h1 {
          font-size: 2.4em; } }
  body[data-page='/'] h3 {
    margin: 8px 0; }
  body[data-page='/'] .upcoming {
    justify-self: flex-end;
    margin: 0 0 0 50%;
    font-size: 1.2em;
    font-family: 'Shadows Into Light', cursive;
    margin-bottom: 20px; }
    @media (max-width: 650px) {
      body[data-page='/'] .upcoming {
        margin: 0 25px 0 0;
        align-self: flex-end;
        font-size: 1.1em;
        text-align: right;
        line-height: 1em; } }

/* Bookings */
.book-now {
  margin: 20px 0 10px;
  justify-self: center;
  align-self: stretch;
  justify-content: space-around; }
  .book-now iframe {
    min-height: auto !important;
    height: 521px !important; }
  .book-now summary::-webkit-details-marker {
    display: none; }
  .book-now summary {
    justify-content: center; }
  .book-now[open] {
    border: 1px solid darkgrey;
    width: fit-content; }
  .book-now[open] summary {
    display: none; }
  .book-now button {
    align-self: center; }

/* Slider */
:root {
  --imageslider-margin: 10px;
  /* render as a column in wide browsers, and full width on mobile. */
  --slider-width: calc(50vw - var(--main-padding) - var(--imageslider-margin) / 2); }
  @media (max-width: 600px) {
    :root {
      --slider-width: calc(100vw - 2 * var(--main-padding)); } }

imageslider {
  width: var(--slider-width);
  overflow: hidden;
  align-self: stretch;
  /* single column on mobile, two column layout on wider devices. */ }
  @media (max-width: 600px) {
    imageslider {
      height: 90vw; } }
  @media (min-width: 600px) {
    imageslider {
      margin-top: 100px;
      margin-left: var(--imageslider-margin); } }

.slides {
  position: relative;
  animation: slide 30s infinite;
  flex-wrap: nowrap; }

.slider {
  width: var(--slider-width);
  height: 100%;
  float: left;
  position: relative;
  z-index: 1;
  overflow: hidden;
  background-size: cover;
  background-position: center; }

.slider img {
  width: 100%;
  height: 100%; }

/* Switch */
.switch {
  width: 120px;
  height: 10px;
  position: absolute;
  bottom: 50px;
  z-index: 99;
  left: 30px; }

.switch > ul {
  list-style: none;
  flex-direction: row; }

.switch > ul > li {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #333;
  float: left;
  margin-right: 5px;
  cursor: pointer; }

.switch ul {
  overflow: hidden; }

.on {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #f39c12;
  position: relative;
  animation: on 30s infinite; }

/* Animation */
@keyframes slide {
  0%,100% {
    margin-left: 0%; }
  21% {
    margin-left: 0%; }
  25% {
    margin-left: -100%; }
  46% {
    margin-left: -100%; }
  50% {
    margin-left: -200%; }
  71% {
    margin-left: -200%; }
  75% {
    margin-left: -300%; }
  96% {
    margin-left: -300%; } }
@keyframes on {
  0%,100% {
    margin-left: 0%; }
  21% {
    margin-left: 0%; }
  25% {
    margin-left: 15px; }
  46% {
    margin-left: 15px; }
  50% {
    margin-left: 30px; }
  71% {
    margin-left: 30px; }
  75% {
    margin-left: 45px; }
  96% {
    margin-left: 45px; } }
/* Available Acts */
act {
  break-inside: avoid;
  flex-direction: column; }
  act p {
    margin-top: 0; }

.act-header-img {
  width: 100%;
  height: 25vh;
  background-size: cover;
  background-position: center; }

.acts-list {
  /*  width: 40vw; */ }

.acts-list {
  display: block;
  column-count: 2;
  max-width: 100%; }

@media (max-width: 600px) {
  .acts-list {
    column-count: 1; } }
@media (min-width: 1200px) {
  .acts-list {
    column-count: 4; } }
form {
  flex-direction: column; }

input {
  max-width: 600px; }

.hacky-cropping-div {
  overflow: hidden;
  height: 445px;
  width: 470px;
  position: relative;
  border: 1px solid lavendar; }
  .hacky-cropping-div iframe {
    transform: scale(0.8);
    top: -220px;
    left: -95px;
    position: absolute; }

.freebirdFormviewerViewItemsItemItem {
  padding: 0; }
