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

@-webkit-keyframes colors {
  0% {
    background-color: #fbad2f; }

  20% {
    background-color: #f28cb9; }

  40% {
    background-color: #50bb80; }

  60% {
    background-color: #7f60a9; }

  80% {
    background-color: #00bef2; }

  100% {
    background-color: #52ffcd; } }

@keyframes colors {
  0% {
    background-color: #fbad2f; }

  20% {
    background-color: #f28cb9; }

  40% {
    background-color: #50bb80; }

  60% {
    background-color: #7f60a9; }

  80% {
    background-color: #00bef2; }

  100% {
    background-color: #52ffcd; } }

@keyframes mymove {
  0% {
    top: 0px; }

  50% {
    top: 4px; }

  100% {
    top: 0px; } }

@-webkit-keyframes mymove {
  0% {
    top: 0px; }

  50% {
    top: 4px; }

  100% {
    top: 0px; } }

@font-face {
  font-family: 'brown';
  src: url("../css/brown/brown-light-webfont.eot");
  src: url("../css/brown/brown-light-webfont.eot?#iefix") format("embedded-opentype"), url("../css/brown/brown-light-webfont.woff") format("woff"), url("../css/brown/brown-light-webfont.ttf") format("truetype"), url("../css/brown/brown-light-webfont.svg#brownlight") format("svg");
  font-weight: normal;
  font-style: normal; }

body {
  font-family: 'brown';
  color: white; }

p {
  font-size: 22pt; }

#main {
  width: 100%;
  height: 100%;
  position: fixed; }

.intro-container {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden; }
  .intro-container .introbg {
    background-image: url("../img/heroimg.jpg");
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    background-position: 50% 50%; }
  .intro-container .logo {
    position: absolute;
    margin-left: 29.85432%;
    width: 35%;
    margin-top: 15em;
    z-index: 5; }
  .intro-container .arrow {
    position: absolute;
    z-index: 5;
    width: 40px;
    bottom: 5px;
    margin-left: 42.64902%; }

.container {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden; }
  .container .overlay {
    background-color: black;
    opacity: .75;
    width: 100%;
    height: 100%;
    position: Absolute;
    z-index: 100; }
  .container .mainbg {
    background-image: url("../img/main.jpg");
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    background-position: 50% 50%; }
  .container .title {
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 74.41059%;
    margin-left: 12.79471%;
    position: absolute;
    z-index: 100;
    margin-top: 9em;
    letter-spacing: .1em;
    text-align: center; }
    .container .title:last-child {
      margin-right: 0; }

#nav {
  background-color: black;
  position: absolute;
  z-index: 115;
  top: 0;
  padding: 18px 0 18px 25px;
  display: block;
  float: left;
  margin-right: 2.35765%;
  width: 100%;
  -webkit-transition: height 0.5s ease-in-out;
  -moz-transition: height 0.5s ease-in-out;
  transition: height 0.5s ease-in-out; }
  #nav:last-child {
    margin-right: 0; }

h1 {
  display: block;
  float: left;
  margin-right: 2.35765%;
  width: 40.29137%;
  letter-spacing: .1em; }
  h1:last-child {
    margin-right: 0; }

.menu {
  height: 0em;
  max-height: 0em;
  overflow: hidden; }

.open {
  height: 10em;
  max-height: 10em;
  overflow: hidden; }

/* HAMBURGER MENU */
.menu_toggle_container {
  display: block;
  text-align: center;
  z-index: 101;
  position: absolute;
  right: 20px;
  width: 25px;
  height: 25px; }
  .menu_toggle_container.loading .menu_toggle {
    -webkit-animation: loading 1s ease-out infinite 0.75s;
    -moz-animation: loading 1s ease-out infinite 0.75s;
    animation: loading 1s ease-out infinite 0.75s; }
    .menu_toggle_container.loading .menu_toggle:after {
      -webkit-animation: loading 1s infinite ease-out 0.35s;
      -moz-animation: loading 1s infinite ease-out 0.35s;
      animation: loading 1s infinite ease-out 0.35s; }
    .menu_toggle_container.loading .menu_toggle:before {
      -webkit-animation: loading 1s infinite ease-out;
      -moz-animation: loading 1s infinite ease-out;
      animation: loading 1s infinite ease-out; }

.menu_toggle, .menu_toggle:before, .menu_toggle:after {
  width: 20px;
  background: #FFF;
  height: 1.5px;
  display: inline-block; }

.menu_toggle {
  position: relative;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s; }
  .menu_toggle:before, .menu_toggle:after {
    content: "";
    position: absolute;
    left: 0;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s; }
  .menu_toggle:before {
    top: 14px; }
  .menu_toggle:after {
    top: 7px; }

.menu_open .menu_toggle_container .menu_toggle {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 10px; }
  .menu_open .menu_toggle_container .menu_toggle:after {
    opacity: 0; }
  .menu_open .menu_toggle_container .menu_toggle:before {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    top: 0; }