/* fonts */

@font-face {
  font-family: 'Birdman';
  src: url('../fonts/birdman.eot'); /* IE9 Compat Modes */
  src: url('../fonts/birdman.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/birdman.woff') format('woff'), /* Modern Browsers */
       url('../fonts/birdman.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/birdman.svg#6125d26e6d4d0d9b1a29b298700d8fe1') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  100;
}

@font-face {
  font-family: 'Knockout HTF30-JuniorWelterwt';
  src: url('../fonts/Knockout-HTF30-JuniorWelterwt.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Knockout-HTF30-JuniorWelterwt.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/Knockout-HTF30-JuniorWelterwt.woff') format('woff'), /* Modern Browsers */
       url('../fonts/Knockout-HTF30-JuniorWelterwt.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/Knockout-HTF30-JuniorWelterwt.svg#0322de02b876ce344670909a80025596') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  100;
}


/* elements */

body,html
{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #030303;
    font-family: 'Birdman';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}

/*html.ios.landscape > body
{
    position: fixed;
    bottom: 0;
    width:100%;
    height: 672px !important;
}*/

canvas
{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
}

canvas.text-anim
{
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

video.full {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 105%; /* a little extra height for safari */
    width: auto;
    height: auto;
    /*z-index: 0;*/

    -webkit-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

video.full-ios7 {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 125%;
    min-height: 105%; /* a little extra height for safari */
    width: auto;
    height: auto;

    -webkit-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

video.menu {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: 100%;

    -webkit-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

a:link, a:visited, a:active
{
    text-decoration: none;
}

/* id's */

#container
{
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#splash-container
{
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #000;
    background-image: url(../img/splash/tile.png);
    background-repeat: repeat;
    clip: rect(0px, 0px, 0px, 0px);
    pointer-events: none;
}

/* classes */

.section
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #030303;
    clip: rect(0px, 0px, 0px, 0px);
}

.menu-button
{
    position: absolute;
    top: 16.66%;
    /*top: 180px;*/
    width: 45px;
    height: 45px;
    background-image: url(../img/ui/menu.png);
    /*background-size: cover;*/
    background-size: 45px 45px;
    background-position: center right;
    background-repeat: no-repeat;
    background-color: #000;
    z-index: 1;
    cursor: pointer;
    /*display: none;*/
}

.video-thumb
{
    position: absolute;
    top: calc(16.66% + 45px);
    /*top: 225px;*/
    /*left: -180px;*/
    width: 180px;
    height: 90px;
    z-index: 1;
    overflow: hidden;
    background-color: #000;
}

.typer
{
    position: relative;
    max-width: 62.5%;
    padding: 0;
    margin: 0;
    pointer-events: none;
    /*-moz-box-sizing: border-box;
    box-sizing: border-box;*/
}

.typer .chunk-left
{
    width: 100%;
    text-align: left;
    margin-bottom: 20px;
}

.typer .chunk-right
{
    width: 100%;
    text-align: right;
    margin-bottom: 20px;
}

.typer .word-left
{
    display:inline-block;
    margin-right: 36px;
}

.typer .word-right
{
    display:inline-block;
    margin-left: 36px;
}

.typer .letter
{
    display:inline;
    opacity: 0;
    line-height: 65px;
}

.centered
{
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.video-menu
{
    position: absolute;
    /*display: inline-block;*/
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    z-index: 2;
    clip: rect(0px, 0px, 0px, 0px);
    pointer-events: none;
    white-space: nowrap;
    background-color: #000;
}

.video-menu .logo
{
    position: absolute;
    width: 100%;
    z-index: 4;
    top: 50%;
    margin-top: 45px;
    pointer-events: none;
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.video-menu .logo .copy-birdman
{
    margin: 0 auto 0 auto;
    font-size: 40px;
    letter-spacing: 3.572em;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    margin-right: -3.572em;
    padding-top: 30px;
}

.video-menu .logo .copy-sub
{
    margin: 0 auto 0 auto;
    font-size: 12px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    padding-top: 10px;
    margin-top: -10px;
}

.video-menu .logo .divider
{
    margin: 62px auto 34px auto;
    width: 130px;
    height: 5px;
    background-color: #fff;
}

.item3x3
{
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: pointer;
    margin-bottom: -4px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

    /*-webkit-touch-callout: none;*/
}

.item3x3 .video-player
{
    height: 101%;
}

.item4x3
{
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: pointer;
    margin-bottom: -4px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

    /*-webkit-touch-callout: none;*/
}

.item4x3 .video-player
{
    height: 101%;
}

.item-overlay
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    /*background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;*/
}

.video-player
{
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    z-index: 4;
    clip: rect(0px, 0px, 0px, 0px);
    background-color: #000;

    /*-webkit-touch-callout: none;
    -webkit-user-select: none;*/
}

.clip
{
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    clip: rect(0px, 0px, 0px, 0px);
}

.close
{
    position: absolute;
    right: 0;
    /*top: 180px;*/
    top: 16.66%;
    width: 45px;
    height: 45px;
    background-image: url(../img/ui/close.png);
    background-size: 45px 45px;
    background-position: center left;
    background-repeat: no-repeat;
    /*background-size: cover;*/
    background-color: #a00000;
    z-index: 1;
    cursor: pointer;
}

.bottom-copy
{
    position: absolute;
    width: 100%;
    height: auto;
    /*bottom: calc(130px * (100% / 1080));*/
    bottom: 130px;
    z-index: 1;
    /*display: none;*/
}

.divider
{
    margin: 0 auto 36px auto;
    width: 130px;
    height: 5px;
    background-color: #A7A5A4;
}

.divider-long
{
    margin: 0 auto 36px auto;
    width: 520px;
    height: 5px;
    background-color: #A7A5A4;
}

.copy-birdman
{
    margin: 0 auto 0 auto;
    font-size: 40px;
    letter-spacing: 3.572em;
    text-transform: uppercase;
    text-align: center;
    color: #000;
    margin-right: -3.572em;
    padding-top: 30px;
}

.copy-sub
{
    margin: -10px auto 0 auto;
    font-size: 12px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    text-align: center;
    color: #A7A5A4;
    padding-top: 10px;

    /*-webkit-touch-callout: none;
    -webkit-user-select: none;*/
}

.copy-share
{
    position: absolute;
    left: 50%;
    bottom: 90px;
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    max-width: 390px;
    width: auto;
    font-size: 15px;
    letter-spacing: 0.03em;
    line-height: 22.5px;
    text-transform: uppercase;
    color: #fff;
    opacity: 0;
}

.social
{
    position: absolute;
    /*margin: 0 auto 0 auto;*/
    left: 50%;
    width: 124px;
    height: 25px;
    margin-top: -20px;
    margin-left: 3px; /* half of social-icon margin-right for centering */
    opacity: 0;

    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

.social-icon
{
    /*position: relative;*/
    width: 25px;
    height: 25px;
    margin-right: 6px;
    display: inline-block;
    cursor: pointer;
}

.social-mobile
{
    position: absolute;
    /*margin: 0 auto 0 auto;*/
    left: 50%;
    width: 220px;
    height: 25px;
    margin-top: -20px;
    margin-left: 10px; /* half of social-icon margin-right for centering */
    opacity: 0;

    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);

    /*-webkit-touch-callout: none;
    -webkit-user-select: none;*/
}

.social-icon-mobile
{
    /*position: relative;*/
    width: 35px;
    height: 35px;
    margin-right: 20px;
    display: inline-block;
    cursor: pointer;

    /*-webkit-touch-callout: none;
    -webkit-user-select: none;*/
}

.social-icon img, .social-icon-mobile img
{
    width: 100%;
    height: 100%;
    /*-webkit-touch-callout: none;
    -webkit-user-select: none;*/
}
.bluray {
	  /* opacity: 0; */
  display: none;
   position: relative;
  padding-right: 10px;
  width: 300px;
 /* height: 30px;*/
  top: -50px;
  left: -15px;
  z-index:2;
}
.bluray div {
   width: 100px;
  margin: auto;
  pointer-events: auto;
}
.block_dvd {
/*  background-image: url("http://static.tumblr.com/iknyorp/bH3nfzvp9/block-dvd.png");*/
letter-spacing:0em;
  font-family: 'Birdman';
  font-size: 12px;
    opacity: 0.4;
  transform: matrix(1, 0, 0, 1, 0, 0);
  color: rgb(0, 0, 0);
  border:#333333 1px solid;
  
  display: block;
  height: 20px;
  margin-bottom: 10px;
  margin-left: 15px;
  width: 95px;
  display: block;
  padding-top: 7px;
}
.digital{
	  display: inline-block;
  float: left;
  position: relative;
  top: 27px;
}
.block_digital {
  /*background-image: url("http://static.tumblr.com/iknyorp/tT9nfzvph/block-digi.png");*/
  letter-spacing:0em;
  font-family: 'Birdman';
  font-size: 12px;
    opacity: 0.4;
  transform: matrix(1, 0, 0, 1, 0, 0);
  color: rgb(0, 0, 0);
  border:#333333 1px solid;
  
  display: block;
  height: 20px;
 /* margin-bottom: 10px;*/
  margin-left: 15px;
  width: 95px;
  display: block;
  padding-top: 7px;
}

.footer
{
    position: absolute;
    width: 160px;
    right: 65px;
    bottom: 65px;
    font-family: 'Knockout HTF30-JuniorWelterwt';
    font-size: 11px;
    color: rgba(0, 0, 0, 0.8);
    /*opacity: 0.4;*/
    text-align: right;
    text-transform: uppercase;
    z-index: 1;
}

.footer a:link, .footer a:visited, .footer a:active
{
    font-family: 'Knockout HTF30-JuniorWelterwt';
    font-size: 13.95px;
    color: #000;
    text-decoration: none;
    opacity: 0.4;
}

.footer a:hover
{
    color: #555;
}

.footer .divider
{
    width: 100%;
    height: 1px;
    margin: 5px 0 -5px 0;
    padding: 0;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0.4;
}

.footer p
{
    margin-top: 0px;
    opacity: 0.4;
}

.footer p a:link, .footer a:visited, .footer a:active {
    font-size: 11px;
    color: rgba(0, 0, 0, 0.8);
}
.footer p a:hover
{
    color: rgba(0, 0, 0, 1);
}

.footer-light
{
    position: absolute;
    width: 130px;
    right: 65px;
    bottom: 65px;
    font-family: 'Knockout HTF30-JuniorWelterwt';
    font-size: 11px;
    color: rgba(1, 1, 1, 0.8);
    opacity: 0.4;
    text-align: right;
    text-transform: uppercase;
    z-index: 2;
}

.footer-light a:link, .footer-light a:visited, .footer-light a:active
{
    font-family: 'Knockout HTF30-JuniorWelterwt';
    font-size: 13.95px;
    color: #fff;
    text-decoration: none;
}

.footer-light a:hover
{
    color: #ccc;
}

.footer-light .divider
{
    width: 100%;
    height: 1px;
    margin: 5px 0 -5px 0;
    padding: 0;
    background-color: rgba(125,122,120,0.5);
}

.footer-light p
{
    color: #fff;
    margin-top: 0px;
}

.unselectable
{
    -webkit-user-select: none; /* Chrome/Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
    -o-user-select: none;
    user-select: none;
}

.preloader
{
    position: absolute;
    top: 50%;
    /*margin-top: 45px;*/
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    /*width: 100%;
    height: 100%;*/
}

.preloader .bar
{
    position: absolute;
    background-color: #A7A5A4;
    /*margin: 0 0 36px 0;*/
    width: 0px;
    height: 5px;
}

.reactivate
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.85);
    z-index: 99999;
}

.reactivate .copy
{
    margin: 0 auto 0 auto;
    /*font-family: 'Knockout HTF30-JuniorWelterwt';*/
    font-size: 14px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
}

.splash-left
{
    position: absolute;
    left:0;
    width: 43%;
    height: 100%;
    opacity: 0;
    display: inline-block;
    background-image: url(../img/splash/og.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    float: left;
}

.splash-right
{
    width: 57%;
    height: 100%;
    display: inline-block;
    float: left;
}

.splash-right .c1
{
    position: absolute;
    left: 47%;
    bottom: 20%;
}

.splash-right .c2
{
    position: absolute;
    /*width: 36%;*/
    max-width: 390px;
    left: 47%;
    bottom: 35%;
    /*bottom: 33%;*/
    text-align: left;
}

.splash-right .c2 .title
{
    position: relative;
    right: 0%;
}

.splash-right .c2 .divider
{
    position: relative;
    right: 0%;
    width: 325px;
    height: 5px;
    margin: 25px 0 32px 0;
    /*margin: 4.5% 0 3% 0;*/
    background-color: #000;
}

.splash-right .c2 .enter
{
    position: relative;
    right: 0%;
    height: auto;
    cursor: pointer;
    letter-spacing: 0.25em;
    font-family: 'Birdman';
    font-size: 12px;
    color: #000;
    z-index: 1;
    padding-top: 10px;
    margin-top: -10px;
}

.splash-right .c2 .divider-thin
{
    width: 130px;
    height: 1px;
    margin: 31px 0 30px 0;
    padding: 0;
    background-color: rgba(0, 0, 0, 0.16);
}

.splash-right .c2 .tickets
{
    position: relative;
    right: 0%;
    height: auto;
    cursor: pointer;
    letter-spacing: 0.25em;
    font-family: 'Birdman';
    font-size: 12px;
    /*color: rgba(0, 0, 0, 0.4);*/
    color: #000;
    opacity: 0.4;
    z-index: 1;
    padding-top: 10px;
    margin-top: -10px;
}

.splash-right .c3
{
    position: absolute;
    right: 4%;
    bottom: 6%;
    text-align: left;
}

.splash-right .c3 .footer
{
    position: relative;
    width: 230px;
    right: 0%;
    bottom: 0%;
    font-family: 'Knockout HTF30-JuniorWelterwt';
    font-size: 11px;
    color: rgba(0, 0, 0, 0.8);
    opacity: 0.4;
    text-align: right;
    text-transform: uppercase;
}

.splash-right .c3 .footer a:link, .footer a:visited, .footer a:active
{
    opacity: 1;
}

.splash-right .c3 .footer p
{
    opacity: 1;
    margin-bottom: 0px;
}

.splash-right .c3 .footer .divider-thin
{
    width: 130px;
    height: 1px;
    margin: 5px 0 -5px 100px;
    padding: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

.splash-right .c4
{
    position: absolute;
    left: 47%;
    bottom: 6%;
}

.splash-right .c4 .quote
{
    /*margin-top: 46px;*/
    font-family: 'Knockout HTF30-JuniorWelterwt';
    font-size: 14px;
    line-height: 15px;
    color: rgba(0, 0, 0, 0.4);
    max-width: 320px;
    text-transform: uppercase;
}

.splash-right .c4 .divider
{
    margin: 10px 0 10px 0;
    width: 130px;
    height: 1px;
    background-color: rgba(147,147,147,0.4);
}

.splash-right .c4 .author
{
    font-family: 'Knockout HTF30-JuniorWelterwt';
    font-size: 11px;
    color: rgba(0, 0, 0, 0.4);
    max-width: 320px;
    text-transform: uppercase;
}

.splash-btn-overlay
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0);
    cursor: pointer;
}

.animate
{
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}

.hitArea
{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 250px;
    background-color: rgba(0, 0, 0, 0);
    z-index: 4;
}

/*.enter a:link, .enter a:visited, .enter a:active
{
    font-family: 'Birdman';
    font-size: 12px;
    color: #000;
    text-decoration: none;
}

.enter a:hover
{
    color: #666;
}