html, body {
  width: 100%;
  height: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0;
  padding: 0;
  background-color: #FFFFFF;
  font-family: "Playfair Display", serif; }

*, *:before, *:after {
  -webkit-tap-highlight-color: transparent;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  outline: none; }

a, a:visited, a:link, a:hover {
  color: inherit;
  text-decoration: none; }

main, .bg, .overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 100%;
  height: 100%; }

.bg {
  background: url("../img/bg.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center bottom;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-transform-origin: center center;
  -ms-transform-origin: center center;
  transform-origin: center center;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-animation-name: zoombg;
  animation-name: zoombg;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-duration: 60s;
  animation-duration: 60s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out; }

@-webkit-keyframes zoombg {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1); }
  100% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2); } }

@keyframes zoombg {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1); }
  100% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2); } }

.overlay {
  background: rgba(9, 19, 13, 0);
  background: -moz-linear-gradient(top, rgba(9, 19, 13, 0) 0%, #09130d 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(9, 19, 13, 0)), color-stop(100%, #09130d));
  background: -webkit-linear-gradient(top, rgba(9, 19, 13, 0) 0%, #09130d 100%);
  background: -o-linear-gradient(top, rgba(9, 19, 13, 0) 0%, #09130d 100%);
  background: -ms-linear-gradient(top, rgba(9, 19, 13, 0) 0%, #09130d 100%);
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(9, 19, 13, 0)), to(#09130d));
  background: linear-gradient(to bottom, rgba(9, 19, 13, 0) 0%, #09130d 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#09130d', endColorstr='#09130d', GradientType=0 );
  opacity: 0.25;
  z-index: 1; }

.circle-logo-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 100%;
  height: calc(100% - 260px);
  z-index: 2;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.circle-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: calc(-105px + -2vw + -6vh);
  margin-top: calc(-105px + -2vw + -6vh);
  display: block;
  height: calc(210px + 4vw + 12vh);
  width: calc(210px + 4vw + 12vh);
  display: table;
  border-radius: 600px;
  background: rgba(255, 255, 255, 0.9);
  z-index: 2; }

.circle-logo-inner {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  height: calc(190px + 3vw + 10vh);
  width: calc(190px + 3vw + 10vh);
  width: 100%;
  height: 100%;
  text-align: center;
  border-radius: 600px;
  padding: calc(12px + 1vw + 3vh);
  -webkit-box-shadow: 0px 1px 40px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 1px 40px rgba(0, 0, 0, 0.12); }

.circle-logo-inner img {
  width: 100%;
  max-width: calc(130px + 1.5vw + 4vh); }

footer {
  position: fixed;
  bottom: 12px;
  left: 12px;
  width: calc(100% - 24px);
  height: 260px;
  background-color: #1d2721;
  -webkit-box-shadow: 0px 1px 60px 2px rgba(0, 0, 0, 0.08);
  box-shadow: 0px 1px 60px 2px rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  display: table;
  text-align: center;
  z-index: 4; }

.footer-inner {
  width: 100%;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
  padding: 12px 6px; }

.footer-inner a {
  will-change: color;
  -webkit-transition: color 240ms ease-out;
  -o-transition: color 240ms ease-out;
  transition: color 240ms ease-out; }

.footer-inner a:hover {
  color: #e6e444; }

.footer-inner img {
  display: block;
  margin: 0 auto 24px auto;
  width: 100%;
  max-width: 260px; }

.footer-inner h1 {
  font-family: "Playfair Display", serif;
  text-align: center;
  display: block;
  margin: 0 auto;
  font-size: 1.34em;
  color: #FFFFFF;
  line-height: 1.4;
  font-weight: 400;
  -webkit-transition: font-size 780ms cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: font-size 780ms cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: font-size 780ms cubic-bezier(0.075, 0.82, 0.165, 1); }

@media all and (max-width: 440px) {
  .footer-inner h1 {
    font-size: 1.06em; } }
