html {
  margin: 0;
  padding: 0;
  background-color: white; }

body {
  background-color: white;
  margin: 0;
  padding: 0;
  width: 100vw;
  font-family: 'Barlow Semi Condensed', sans-serif; }

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

p {
  margin: 0;
  padding: 0; }

.wrapper {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 100vh auto auto;
  grid-template-rows: 100vh auto auto;
  grid-template-areas: "splash" "introduction" "poses" "information" "footer"; }
  .wrapper .splash {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    grid-area: splash; }
  .wrapper .introduction {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    grid-area: introduction; }
  .wrapper .poses {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    grid-area: poses;
    display: -ms-grid;
    display: grid;
    grid-template-areas: "pose-dom" "pose-slut" "pose-sub"; }
    @media screen and (min-width: 640px) {
      .wrapper .poses {
        -ms-grid-columns: (1fr)[3];
        grid-template-columns: repeat(3, 1fr);
        grid-template-areas: "pose-dom pose-slut pose-sub"; } }
    .wrapper .poses .pose_dom {
      -ms-grid-row: 1;
      -ms-grid-column: 1;
      grid-area: pose-dom; }
    .wrapper .poses .pose_slut {
      -ms-grid-row: 2;
      -ms-grid-column: 1;
      grid-area: pose-slut; }
    .wrapper .poses .pose_sub {
      -ms-grid-row: 3;
      -ms-grid-column: 1;
      grid-area: pose-sub; }
    @media screen and (min-width: 640px) {
      .wrapper .poses .pose_dom {
    -ms-grid-row: 1;
    -ms-grid-column: 1; }
      .wrapper .poses .pose_slut {
    -ms-grid-row: 1;
    -ms-grid-column: 2; }
      .wrapper .poses .pose_sub {
    -ms-grid-row: 1;
    -ms-grid-column: 3; } }
  .wrapper .information {
    -ms-grid-row: 4;
    -ms-grid-column: 1;
    grid-area: information;
    display: -ms-grid;
    display: grid;
    grid-template-areas: "information-play" "information-contact"; }
    @media screen and (min-width: 640px) {
      .wrapper .information {
        -ms-grid-columns: (1fr)[2];
        grid-template-columns: repeat(2, 1fr);
        grid-template-areas: "information-play information-contact"; } }
    .wrapper .information .information-play {
      -ms-grid-row: 1;
      -ms-grid-column: 1;
      grid-area: information-play; }
    .wrapper .information .information-contact {
      -ms-grid-row: 2;
      -ms-grid-column: 1;
      grid-area: information-contact; }
    @media screen and (min-width: 640px) {
      .wrapper .information .information-play {
    -ms-grid-row: 1;
    -ms-grid-column: 1; }
      .wrapper .information .information-contact {
    -ms-grid-row: 1;
    -ms-grid-column: 2; } }
  .wrapper .footer {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
    grid-area: footer; }

.splash {
  position: relative;
  overflow: hidden;
  background: -webkit-gradient(linear, left top, right bottom, from(#6d3393), to(#310057));
  background: -webkit-linear-gradient(top left, #6d3393, #310057);
  background: -o-linear-gradient(top left, #6d3393, #310057);
  background: linear-gradient(to bottom right, #6d3393, #310057); }
  .splash img.rays {
    display: block;
    position: absolute;
    overflow: hidden;
    -o-object-fit: cover;
    object-fit: cover;
    top: 0;
    left: 0;
    bottom: 5%;
    right: 0;
    margin: auto;
    padding: 0;
    max-width: 90vw;
    max-height: 90vh;
    opacity: 1.0;
    -webkit-animation-name: rays;
    animation-name: rays;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-duration: 10s;
    animation-duration: 10s;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-transform: translateZ(0); }
  .splash img.purples {
    display: block;
    position: absolute;
    overflow: hidden;
    -o-object-fit: cover;
    object-fit: cover;
    top: 0;
    left: 0;
    bottom: 5%;
    right: 0;
    margin: auto;
    padding: 0;
    max-width: 90vw;
    max-height: 90vh;
    opacity: 1.0;
    -webkit-animation-name: purples;
    animation-name: purples;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-direction: normal;
    animation-direction: normal;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1; }
  .splash p {
    display: block;
    position: absolute;
    left: 0;
    bottom: 20%;
    right: 0;
    margin: auto;
    padding: 0;
    font-family: 'Barlow Semi Condensed', sans-serif;
    font-size: 3rem;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.1rem;
    color: white;
    text-align: center;
    -webkit-animation-name: switchybitch;
    animation-name: switchybitch;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite; }

@-webkit-keyframes rays {
  0% {
    -webkit-transform: rotateZ(0deg) scale(1);
    transform: rotateZ(0deg) scale(1); }
  100% {
    -webkit-transform: rotateZ(360deg) scale(4);
    transform: rotateZ(360deg) scale(4); } }

@keyframes rays {
  0% {
    -webkit-transform: rotateZ(0deg) scale(1);
    transform: rotateZ(0deg) scale(1); }
  100% {
    -webkit-transform: rotateZ(360deg) scale(4);
    transform: rotateZ(360deg) scale(4); } }

@-webkit-keyframes purples {
  0% {
    -webkit-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0.5; }
  80% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 1.0; }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1.0; } }

@keyframes purples {
  0% {
    -webkit-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0.5; }
  80% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 1.0; }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1.0; } }

@-webkit-keyframes switchybitch {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 0.7; }
  100% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    opacity: 0.9; } }

@keyframes switchybitch {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 0.7; }
  100% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    opacity: 0.9; } }

.introduction {
  background-color: rgba(109, 51, 147, 0.2);
  text-align: center; }
  .introduction p {
    margin: 20px;
    font-size: 1.1rem;
    line-height: 2.0rem;
    color: #202020; }
    .introduction p:first-child {
      font-size: 1.8rem; }
    .introduction p strong {
      font-weight: 600;
      color: #591f7f; }

.pose-dom, .pose-slut, .pose-sub {
  background-color: rgba(109, 51, 147, 0.2); }
  .pose-dom .pose, .pose-slut .pose, .pose-sub .pose {
    background: -webkit-gradient(linear, left top, right bottom, from(#6d3393), to(#310057));
    background: -webkit-linear-gradient(top left, #6d3393, #310057);
    background: -o-linear-gradient(top left, #6d3393, #310057);
    background: linear-gradient(to bottom right, #6d3393, #310057); }
    .pose-dom .pose img, .pose-slut .pose img, .pose-sub .pose img {
      display: block;
      width: 50%;
      margin: 0 auto 0 auto; }
    .pose-dom .pose h2, .pose-slut .pose h2, .pose-sub .pose h2 {
      font-family: 'Barlow Semi Condensed', sans-serif;
      font-size: 2.5rem;
      font-weight: normal;
      font-style: normal;
      letter-spacing: 0.1rem;
      color: white;
      text-align: center; }
  .pose-dom p, .pose-slut p, .pose-sub p {
    margin: 20px;
    font-size: 1.1rem;
    line-height: 2.0rem;
    color: #202020; }

.pose-dom .pose h2 {
  font-weight: 700; }

.pose-slut .pose h2 {
  font-weight: 400; }

.pose-sub .pose h2 {
  font-weight: 100; }

.information-play, .information-contact {
  background-color: #404040;
  color: white; }
  .information-play .banner, .information-contact .banner {
    background: -webkit-gradient(linear, left top, right bottom, from(#313131), to(#1d1d1d));
    background: -webkit-linear-gradient(top left, #313131, #1d1d1d);
    background: -o-linear-gradient(top left, #313131, #1d1d1d);
    background: linear-gradient(to bottom right, #313131, #1d1d1d); }
  .information-play .banner h2, .information-contact .banner h2 {
    padding: 8px 0 8px 0;
    font-family: 'Barlow Semi Condensed', sans-serif;
    font-size: 1.5rem;
    font-weight: 300;
    letter-spacing: 0.1rem;
    color: white;
    text-align: center; }
  .information-play p, .information-contact p {
    margin: 20px; }
  .information-play ul, .information-contact ul {
    list-style: none inside none; }
    .information-play ul li, .information-contact ul li {
      font-size: 1.4rem;
      color: white; }
      .information-play ul li a, .information-contact ul li a {
        color: white; }
      .information-play ul li span, .information-contact ul li span {
        color: white;
        margin-right: 0.5rem; }

footer {
  background-color: black;
  color: white;
  padding: 10px; }