@font-face {
  font-family:'Fira Sans';
  src:url(http://amsarkadium-a.akamaihd.net/assets/independent_2/arena/heap/Fira-Sans-Regular.woff) format("woff")
}

*,::after,::before,:after,:before {
  box-sizing:border-box;
  margin:0;
  padding:0
}

a {
  text-decoration:none
}

a:active,a:hover {
  outline:0
}

body {
  width:100%;
  margin:0;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  color:#000;
  font-family:"Fira Sans",Helvetica,Arial;
  background:#FFF;
  padding-top:48px
}

#masthead {
  position:fixed;
  z-index:100;
  top:0;
  left:0;
  height:48px;
  width:100%;
  box-shadow:0 1px 20px rgba(0,0,0,.12)
}

#masthead .logo {
  float:left;
  display:block;
  height:48px;
  width:58px;
  -webkit-transition:background-image .4s ease-out;
  -moz-transition:background-image .4s ease-out;
  -ms-transition:background-image .4s ease-out;
  transition:background-image .4s ease-out;
  background-image:url(http://amsarkadium-a.akamaihd.net/assets/independent_2/arena/heap/header_logotype_independent_1.png);
  background-size:contain;
  background-position:20px 0;
  background-repeat:no-repeat
}

#dynamic-header,#masthead .logo:before,#masthead nav {
  height:48px;
  background:#fff
}

#masthead .logo:before {
  content:' ';
  float:left;
  width:20px
}

#masthead nav {
  margin-left:250px;
  overflow:hidden
}

#masthead nav ol {
  list-style:none;
  margin-left:20px;
  margin-right:150px
}

@media only screen and (max-width: 619px) {
  #masthead nav ol {
    display:none
  }
}

#masthead nav li {
  float:left
}

#masthead nav a {
  display:block;
  font-size:14px;
  line-height:28px;
  padding:10px;
  color:#000;
  -webkit-transition:border .1s;
  -moz-transition:border .1s;
  transition:border .1s
}

#masthead nav a:hover {
  color:#EC1A2E;
}

#dynamic-header {
  position:absolute;
  top:0;
  left:58px;
  width:200px;
  overflow:hidden;
  list-style:none
}

#dynamic-header>li {
  position:absolute;
  width:100%;
  height:100%;
  -webkit-transition:all .4s ease-out;
  -moz-transition:all .4s ease-out;
  -ms-transition:all .4s ease-out;
  transition:all .4s ease-out;
  left:-200px;
  opacity:0
}

#dynamic-header .logotype {
  left:0!important;
  opacity:1
}

#dynamic-header .logotype .logo-full {
  display:block;
  height:100%;
  background-image:url(http://amsarkadium-a.akamaihd.net/assets/independent_2/arena/heap/header_logotype_independent_2.gif);
  background-size:contain;
  background-repeat:no-repeat
}

@media only screen and (min-width: 930px) {
  body {
    padding-top:80px
  }

  #masthead {
    height:80px
  }

  #masthead .logo {
    width:83px;
    height:80px
  }

  #masthead .logo:before {
    height:80px
  }

  #masthead #dynamic-header {
    left:83px;
    height:80px;
    width:330px
  }

  #masthead #dynamic-header li {
    left:-330px
  }

  #masthead nav {
    margin-left:405px;
    height:80px
  }

  #masthead nav a {
    font-size:16px;
    line-height:60px
  }
}