html {
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0; }

article, aside, footer, header, nav, section {
  display: block; }

h1 {
  font-size: 2em;
  margin: .67em 0; }

figcaption, figure, main {
  display: block; }

figure {
  margin: 1em 40px; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

pre {
  font-family: monospace,monospace;
  font-size: 1em; }

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted; }

b, strong {
  font-weight: inherit; }

b, strong {
  font-weight: bolder; }

code, kbd, samp {
  font-family: monospace,monospace;
  font-size: 1em; }

dfn {
  font-style: italic; }

mark {
  background-color: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -.25em; }

sup {
  top: -.5em; }

audio, video {
  display: inline-block; }

audio:not([controls]) {
  display: none;
  height: 0; }

img {
  border-style: none; }

svg:not(:root) {
  overflow: hidden; }

button, input, optgroup, select, textarea {
  font-family: sans-serif;
  font-size: 100%;
  line-height: 1.15;
  margin: 0; }

button, input {
  overflow: visible; }

button, select {
  text-transform: none; }

button, html [type=button], [type=reset], [type=submit] {
  -webkit-appearance: button; }

button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText; }

fieldset {
  padding: .35em .75em .625em; }

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal; }

progress {
  display: inline-block;
  vertical-align: baseline; }

textarea {
  overflow: auto; }

[type=checkbox], [type=radio] {
  box-sizing: border-box;
  padding: 0; }

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
  height: auto; }

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }

[type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

details, menu {
  display: block; }

summary {
  display: list-item; }

canvas {
  display: inline-block; }

template {
  display: none; }

[hidden] {
  display: none; }

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: '';
  clear: both;
  height: 0; }

html {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  white-space: nowrap;
  clip-path: inset(100%);
  clip: rect(0 0 0 0);
  overflow: hidden; }

html {
  font-size: 62.5%;
  scroll-behavior: smooth; }

html, body {
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch; }

main {
  height: 100vh; }

@font-face {
  font-family: 'DayRoman';
  src: url("../fonts/DAYROM__.ttf") format("truetype"); }

@font-face {
  font-family: 'RevItalic';
  src: url("../fonts/RevivalistDisplay-Italic.ttf") format("opentype"); }

@font-face {
  font-family: 'RevReg';
  src: url("../fonts/RevivalistDisplay-Regular.ttf") format("opentype"); }

@font-face {
  font-family: 'RevOutline';
  src: url("../fonts/RevivalistDisplay-Outline.ttf") format("opentype"); }

body {
  font-size: 1.6rem;
  font-family: 'DayRoman', sans-serif;
  color: #303847;
  position: relative;
  background-image: url("../assets/ep_naturalwhite.png");
  background-position: center; }

.wrapper {
  width: 98%;
  max-width: 2000px;
  margin: 0 auto; }

img {
  width: 100%;
  height: auto;
  display: block; }

ul {
  margin: 0;
  padding: 0;
  list-style-type: none; }

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

a {
  text-decoration: none; }

span {
  font-weight: 300; }

button {
  background: none;
  text-decoration: underline;
  border: none;
  font-family: 'DayRoman', sans-serif;
  font-size: 20px; }

.hidden {
  display: none !important; }

.flex {
  display: flex; }
  .flex.space-around {
    justify-content: space-around; }
  .flex.justify-center {
    justify-content: center; }
  .flex.space-between {
    justify-content: space-between; }
  .flex.align-center {
    align-items: center; }
  .flex.reverse {
    flex-direction: row-reverse; }
  .flex.col {
    flex-direction: column; }
  .flex.end {
    justify-content: end; }
  .flex .self-end {
    align-self: flex-end; }

.icon {
  background: url("../assets/Star.png");
  background-size: contain;
  height: 15px;
  width: 15px;
  display: inline-block; }
  .icon.spinner {
    animation: eyeroll 2s linear infinite;
    -webkit-animation: eyeroll 2s linear infinite;
    -moz-animation: eyeroll 2s linear infinite;
    -o-animation: eyeroll 2s linear infinite; }

hr {
  border: 0.5px solid #CFCCD6;
  margin: 30px 0 0 0;
  width: 0;
  transition: width 2.5s ease-in-out; }
  hr.animated {
    width: 45%; }

section {
  width: 100%;
  display: flex;
  justify-content: center;
  padding-top: calc(30vh - 20px);
  background-color: transparent; }
  section #enter {
    height: 20%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    cursor: pointer;
    z-index: 7; }
    section #enter h2#enter-text {
      color: #303847;
      font-family: RevOutline, sans-serif;
      margin: 0;
      padding-bottom: 10px;
      white-space: no-wrap;
      letter-spacing: 2px;
      width: 77px;
      animation: type 1.5s steps(5, end);
      -webkit-animation: type 1.5s steps(5, end);
      -moz-animation: type 1.5s steps(5, end);
      -o-animation: type 1.5s steps(5, end);
      overflow: hidden; }
      section #enter h2#enter-text:hover, section #enter h2#enter-text:focus {
        font-family: RevReg, sans-serif; }
    section #enter:hover h2#enter-text, section #enter:focus h2#enter-text {
      font-family: RevReg, sans-serif; }
    section #enter:hover .eye, section #enter:focus .eye {
      border-color: #303847; }
      section #enter:hover .eye .moon, section #enter:focus .eye .moon {
        box-shadow: inset 22px 5px #CFAC3F, inset 20px 0px 1px 7px #CFAC3F;
        -moz-box-shadow: inset 20px 0px #CFAC3F, inset 20px 0px 1px 1px #CFAC3F; }

@keyframes type {
  from {
    width: 0; } }

header nav {
  height: 50px;
  width: 100%;
  display: flex;
  justify-content: space-between; }
  header nav .logo p {
    font-family: RevReg, serif;
    font-size: calc(2vw + 20px);
    display: flex;
    align-items: center; }
  header nav div.place {
    width: 50px; }

.contact {
  width: 50px;
  height: 50px;
  margin: 0;
  z-index: 999;
  cursor: pointer;
  position: relative; }
  .contact:hover .line, .contact:focus .line {
    background-color: #1e232d; }
  .contact .line {
    top: 45%;
    left: 25%;
    width: 50%;
    height: 4px;
    border-radius: 5px;
    position: absolute;
    background-color: #303847;
    transition: rotate 0.8s, background-color 0.5s, transform 0.8s; }
  .contact .line1 {
    top: 25%; }
  .contact .line2 {
    width: 40%; }
  .contact .line3 {
    top: 65%;
    width: 45%; }

.contact.open .line1 {
  transform: rotate(45deg);
  top: 45%;
  left: 25%; }

.contact.open .line3 {
  transform: rotate(-45deg);
  top: 45%;
  left: 25%;
  width: 50%; }

.contact.open .line2 {
  opacity: 0; }

.contact.open:hover .line {
  background-color: #14171e; }

#gallery-nav {
  display: flex;
  justify-content: flex-end; }
  #gallery-nav .line {
    background-color: #CFAC3F; }
  #gallery-nav .line1 {
    transform: rotate(45deg);
    top: 45%;
    left: 25%; }
  #gallery-nav .line2 {
    transform: rotate(-45deg);
    top: 45%;
    left: 25%;
    width: 50%; }
  #gallery-nav .contact:hover .line {
    background-color: #eed58b; }

#modal {
  width: 100vw;
  height: 100%;
  opacity: 0;
  overflow: hidden;
  background-image: url("../assets/ep_naturalwhite.png");
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  transition: opacity 0.5s; }
  #modal .text {
    position: relative;
    max-width: 480px;
    width: 60%;
    padding: 50px 50px 30px 50px;
    border-radius: 5px;
    border: 1px solid #CFAC3F; }
    #modal .text p, #modal .text a {
      color: #303847;
      font-size: 16px;
      transition: all 0.5s; }
    #modal .text h3 {
      font-size: 35px;
      background-image: url("../assets/ep_naturalwhite.png");
      font-family: 'RevReg', sans-serif;
      position: absolute;
      top: -25px;
      left: 70%;
      transition: left 1.5s ease-in-out;
      white-space: nowrap;
      padding: 0 8px; }
      #modal .text h3.open {
        left: 3%; }
    #modal .text div {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 20px; }
    #modal .text h4 {
      font-family: 'RevReg', sans-serif;
      text-align: right;
      font-style: italic;
      cursor: pointer; }
      #modal .text h4:hover, #modal .text h4:focus {
        text-decoration: underline; }
    #modal .text p {
      margin-bottom: 25px; }
      #modal .text p span {
        display: inline-block;
        margin-bottom: 10px; }
    #modal .text a {
      font-weight: 900;
      font-size: 14px;
      padding-bottom: 15px;
      letter-spacing: 1px; }
      #modal .text a:hover, #modal .text a:focus {
        letter-spacing: 1.5px;
        color: #CFAC3F; }

#modal.open {
  opacity: 1;
  z-index: 8; }
  #modal.open ~ header nav .contact {
    z-index: 999; }

.eye {
  border: 20px solid #CFAC3F;
  border-radius: 80px 24px;
  width: 80px;
  height: 80px;
  padding: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: rotate(44deg);
  transition: border-color 1s; }
  .eye .moon {
    background-color: transparent;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    box-shadow: inset 22px 5px #303847, inset 20px 0px 1px 7px #303847;
    -moz-box-shadow: inset 20px 0px #303847, inset 20px 0px 1px 1px #303847;
    transform: rotate(-45deg);
    animation: eyeroll 3s linear infinite;
    -webkit-animation: eyeroll 3s linear infinite;
    -moz-animation: eyeroll 3s linear infinite;
    -o-animation: eyeroll 3s linear infinite;
    transition: box-shadow 1s; }
  .eye.loading {
    border-color: #303847; }
    .eye.loading + h2 {
      font-family: RevReg, serif; }
    .eye.loading .moon {
      box-shadow: inset 22px 5px #CFAC3F, inset 20px 0px 1px 7px #CFAC3F;
      -moz-box-shadow: inset 20px 0px #CFAC3F, inset 20px 0px 1px 1px #CFAC3F; }

@keyframes eyeroll {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

#gallery {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #14171e;
  min-height: 100vh;
  overflow: scroll;
  margin: 0 auto; }
  #gallery .gallery-header {
    color: #CFAC3F; }
    #gallery .gallery-header h1 {
      font-family: RevReg, serif;
      font-size: calc(2.5vw + 45px);
      margin: 0 auto;
      text-align: center; }
    #gallery .gallery-header h2 {
      font-family: RevOutline, serif;
      color: #CFCCD6;
      font-style: italic;
      margin: 0 10px;
      font-size: 20px;
      letter-spacing: 2px; }
    #gallery .gallery-header div:not(#gallery-nav):not(#close-gallery) {
      margin-top: 10px;
      display: flex;
      align-items: center;
      justify-content: center; }
  #gallery .row {
    display: flex;
    flex-wrap: nowrap;
    padding: 100px 0 50px;
    margin: 0 auto; }
    #gallery .row .column {
      width: 50%;
      padding: 0 5px; }
      #gallery .row .column img {
        transition: transform 0.6s;
        margin-bottom: 8px;
        vertical-align: middle;
        border: 0.2px solid #CFCCD6; }
        #gallery .row .column img.animated {
          transform: translateY(-40px); }

#gallery.open {
  z-index: 999;
  display: block; }

@media (max-width: 530px) {
  header nav {
    margin: 5px; }
    header nav div.contact, header nav #eye-target {
      height: 35px;
      width: 35px;
      min-width: 35px; }
    header nav div.logo img {
      width: 50%;
      min-width: 150px;
      margin: 5px auto; }
  section #enter h2#enter-text {
    letter-spacing: 1px;
    width: 78px; }
  #gallery .gallery-header h1 {
    margin-top: 15px;
    font-size: 40px; }
  #gallery .gallery-header h2 {
    font-size: 16px;
    font-family: RevReg, serif; }
  #gallery .row {
    padding: 80px 20px 20px;
    flex-wrap: wrap; }
    #gallery .row .column {
      width: 100%;
      padding: 0; }
      #gallery .row .column img {
        margin-bottom: 12px; }
  #modal .text {
    padding: 25px 40px; }
    #modal .text h3 {
      font-size: 28px;
      left: 50%;
      transition: left 0.8s ease-in-out; } }
