#video-background { position: absolute; top: 0; z-index: -999999}

div { z-index 1; }
body {
    margin: 0;
    color: #E1E1E1;
    background-color: #000000;
    font-family: 'Open Sans', Arial, sans-serif;
    font-weight: 300;
}           

h3 { 
    font-family: 'SchadowAntDMedi', Arial, sans-serif; 
    font-size: 30px;
    line-height: 36px;
    font-weight: normal;
    letter-spacing: 2px;
}

h4 { 
    font-family: 'SchadowAntDMedi', Arial, sans-serif; 
    font-size: 24px;
    line-height: 30px;
    margin: 0;
    font-weight: normal;
}
h5 { 
    font-family: 'SchadowAntDMedi', Arial, sans-serif; 
    font-size: 20px;
    line-height: 26px;
    margin: 0;
    font-weight: normal;
}
h6 { 
    font-family: 'SchadowAntDMedi', Arial, sans-serif; 
    font-size: 18px;
    line-height: 24px;
    margin: 0;
    font-weight: normal;
}


            
video {
    position: absolute;
    top: 0;
/*    top: 50%;
    left: 50%;*/
    width: 100%;
    /*min-width: 100%;*/
    /*min-height: 100%;*/
    /*width: auto;*/
    /*height: auto;*/
    z-index: -100;
/*    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);*/
    background: url(images/header-mobile.jpg) no-repeat;
    background-size: cover;
    -webkit-transition: 1s opacity;
    transition: 1s opacity;
}    

.green-light-banner {
    background-position: center;
    background-repeat: no-repeat;
    position: fixed;
    top: 0px;
    left: 50%;
    min-width: 100%;
    width: auto;
    height: 50px;
    z-index: -100;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

@media (max-width: 559px) {
    .content-cards { max-width: 460px !important }
    .content-gradient { background: url('../../../static/content-gradient.png') 0 -50px repeat-x !important; }
    .card-description br { display: none !important}
    .launchcallout h4 { font-size: 26px !important }
    #lablaunch { font-size: 20px !important }
    .content-join { margin-top: 150px !important }
    .launchcallout { width: 375px !important; height: 104px !important }
    .launchcallout h4 { font-size: 13px !important; margin: 10px auto 5px !important }
    .launchcallout p {margin: 20px auto !important; font-size: 12px !important; width: 275px !important;}
    #lablaunch { font-size: 11px !important }
    #main-cta { margin: -39px 0 0 0 !important }
    #primary { max-width: 399px !important; }
    #main-cta { width: 250px !important; height: 81px !important; text-align:center }
    .ui-ftl { width: 73px !important; height: 29px !important }
    .ui-ft { width: 167px !important; height: 29px !important }
    .ui-ftr { width: 71px !important; height: 29px !important }
    .ui-left { width: 73px !important; height: 80px !important }
    .ui-frame { width: 167px !important; height: 80px !important }
    .ui-right { width: 71px !important; height: 80px !important }
    .ui-fbl { width: 73px !important; height: 43px !important }
    .ui-fb { width: 167px !important; height: 43px !important }
    .ui-fbr { width: 71px !important; height: 43px !important }

    .main-cta-mid {
        width: 94px !important;
        height: 50px !important;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
    }

    .main-cta-l, .main-cta-r {
        width: 78px !important;
        height: 50px !important;
    }

    #main-cta a {
	font-size: 14px !important; 
	margin-top: 13px !important;
    }

    .green-light-banner {
        background-image: url('../../uploads/2015/10/SteamGreenlightBanner1.png');
    }
    
    .contents, .navbar-content {
        padding-left:10px;
        padding-right:10px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .content-cards ul li {
        width: 100%;
    }    
    
    #hero-left, #hero-right {display:none;}
    
    .content-callout-center-block {
        padding-top:30px; 
        width: 100%;
        height:100%; 
    }
    
    #labyrinth-logo {
        width: 100%;
    }
    
    .content-banner {
        margin-top: 200px;
    }
    
    .kickstarter-button-frame { 
        width:100%; 
        height:0;
        padding-bottom:13.1175468483816%;
    }
    
    .join-button-frame { 
        width:100%; 
        height:0;
        padding-bottom:15.4%;
    }    
    .join-button-forum-frame { 
        width:100%; 
        height:0;
        padding-bottom:15.4%;
    }      
    
    .join-button { 
        width:100%; 
        height:0;
        padding-bottom:14.07185628%;
    }
    
    .navbar-collapse { display: none; }
    .navbar-mobile { display: block; }
    
    .visible-xs-block { display:block; }
}
@media (min-width: 560px) {
    .content-cards { max-width: 570px !important }
    .content-gradient { background: url('../../../static/content-gradient.png') 0 0 repeat-x !important; }
    .card-description br { display: none !important}
    .content-join { margin-top: 225px !important }
    .launchcallout { width: 600px !important; height: 166px !important }
    .launchcallout h4 { font-size: 21px !important; margin: 23px auto 16px !important }
    .launchcallout p {margin: 40px auto !important; font-size: 18px !important; width: 400px !important;}
    #lablaunch { font-size: 18px !important }
    #main-cta { margin: -63px 0 0 0 !important }
    #primary { max-width: 607px !important; }
    #main-cta { width: 400px !important; height: 196px !important; text-align:center }
    .ui-ftl { width: 117px !important; height: 47px !important }
    .ui-ft { width: 266px !important; height: 47px !important }
    .ui-ftr { width: 114px !important; height: 47px !important }
    .ui-left { width: 117px !important; height: 93px !important }
    .ui-frame { width: 266px !important; height: 93px !important }
    .ui-right { width: 114px !important; height: 93px !important }
    .ui-fbl { width: 117px !important; height: 69px !important }
    .ui-fb { width: 266px !important; height: 69px !important }
    .ui-fbr { width: 114px !important; height: 69px !important }

    .main-cta-mid {
	width: 166px !important;
	height: 75px !important;
    }

    .main-cta-l, .main-cta-r {
	width: 117px !important;
	height: 75px !important;
    }

    #main-cta a {
	font-size: 24px !important;
	margin: 20px auto !important;
    }

    .green-light-banner {
        background-image: url('../../uploads/2015/10/SteamGreenlightBanner1.png');
    }
    
    .contents, .navbar-content {
/*        width: 540px;
        max-width: 540px;*/
        width: 607px;
        max-width: 607px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .content-cards ul li {
        width: 50%;
    }    
    
    #hero-left, #hero-right {display:none;}
    
    .content-callout-center-block {
        padding-top:30px; 
        width: 540px;
        height:100%; 
    }
    
    #labyrinth-logo {
        width: 500px;
    }
    
    .content-banner {
        margin-top: 350px;
    }

    .kickstarter-button-frame { 
        width: 587px;
        height: 77px;
        padding-bottom:0;
    }
    
    .join-button-frame { 
        width: 500px;
        height: 77px;
        padding-bottom:0;
    }    
    .join-button-forum-frame { 
        width: 500px;
        height: 77px;
        padding-bottom:0;
    }     
    .join-button { 
        width: 334px;
        height: 47px;
        padding-bottom:0;
    }
    
    .navbar-collapse { display: none; }
    .navbar-mobile { display: block; }
    
    .visible-xs-block { display:none; }
}

@media (min-width: 1080px) {
    .content-cards { max-width: 1080px !important }
    .content-gradient { background: url('../../../static/content-gradient.png') 0 165px repeat-x !important; }
    .card-description br { display: block !important}
    .content-join { margin-top: 300px !important }
    .launchcallout { width: 900px !important; height: 250px !important; margin-bottom: 250px !important }
    .launchcallout h4 { font-size: 32px !important; margin: 50px auto 25px !important }
    .launchcallout p {margin: 65px auto !important; font-size: 24px !important; width: 600px !important;}
    #lablaunch { font-size: 28px !important }
    #main-cta { margin: -95px 0 0 0 !important }
    #primary { max-width: 1080px !important; }
    #main-cta { width: 600px !important; height: 196px !important; text-align:center }
    .ui-ftl { width: 176px !important; height: 71px !important }
    .ui-ft { width: 400px !important; height: 71px !important }
    .ui-ftr { width: 172px !important; height: 71px !important }
    .ui-left { width: 176px !important; height: 140px !important }
    .ui-frame { width: 400px !important; height: 140px !important }
    .ui-right { width: 172px !important; height: 140px !important }
    .ui-fbl { width: 176px !important; height: 104px !important }
    .ui-fb { width: 400px !important; height: 104px !important }
    .ui-fbr { width: 172px !important; height: 104px !important }
    .main-cta-mid {
        width: 288px !important;
        height: 100px !important;
        text-align: center;
    }

    .main-cta-l, .main-cta-r {
        width: 156px !important;
        height: 100px !important;
    }

    #main-cta a {
        font-size: 32px !important;
	margin: 24px auto !important;
    }

    .green-light-banner {
        background-image: url('../../uploads/2015/10/SteamGreenlightBanner_FullWidth.png');
    }
    
    
    .contents, .navbar-content {
        width: 1080px;
        max-width: 1080px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .content-cards ul li {
        width: 25%;
    }    
    
    #hero-left, #hero-right {display:inline;}
    
    .content-callout-center-block {
        padding-top:60px; 
        width: 40%; 
        height:100%; 
    }
    
    .content-callout-center-block > div {
        padding-bottom: 20px;
    }
    
    #labyrinth-logo {
        width: 565px;
    }
    
    .content-banner {
        margin-top: 350px;
    }
    
    .navbar-collapse { display: initial; }
    .navbar-mobile { display: none; }
}


#hero-left {
    position: absolute; 
    top:2%;
    bottom:0;
    left: 0;
    height: 100%;
}

#hero-right {
    position: absolute; 
    top:10%;
    bottom:0;
    right: 0;
    height: 100%;
}

.navbar {
    position: relative;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 50px;
    /*display: none;*/
    background: rgba(0, 0, 0, 0.8);
    border-bottom: solid 1px #222222
}

.navbar-background {
    /*background: rgba(255,255,255,.4);*/
    background: rgba(0,0,0,0.8);
}

.navbar li {
    font-family: 'aleoregular', Arial, sans-serif; 
    font-size: 20px;
    padding-left: 20px;
    padding-right: 20px;
    height: 50px;
}

.navbar li a {
    display: block;
    margin: 14px 0;
    color: #E1E1E1;
}

.navbar li a:hover { text-decoration: none}

.navbar-content {    
    font-family: Agenda-Light,Agenda\ Light,Agenda,Arial\ Narrow,sans-serif;
    color: #fff;
    font-size: 1.2em;
    position:relative;
    height: 50px;
}

.vanillainfo { margin: 5px 0 !important; height:40px;}

.vanillainfo img {
    display: inline-block;
    float: left;
    margin: 0 20px 0 0;
    width: 40px;
}

.vanillainfo h3 {
    display: inline-block;
    text-transform: none;
    font-weight: 400;
    font-size: 20px;
    padding: 2px 0;
    margin: 0;
    word-wrap: nowrap;
}

.vanillanav ul {
    display: none;
    float: right;
    position: absolute;
    right: 0;
    top: 50px;
    line-height: 125%;
    padding-top:2em;
    z-index: 99999;
    border: solid 1px #444444;
    border-top: solid 1px #000000;
    background-color: rgba(0,0,0,0.6);
}

.vanillanav li:hover > ul {
    display: block;
}

.vanillanav ul li {
    display: block !important;
    margin: 10px 0;
    height: 22px;
}

.vanillanav .sub-menu a {
    margin: 20px 0;
    text-transform: none !important;
}

#lablaunch {
    font-family: 'aleobold', Arial, sans-serif;
    font-weight: bold;
    font-size: 28px;
    color: #d4d69e;
    text-shadow: 2px 2px #000000;
}

#lablaunch span {
    font-family: 'aleoregular', Arial, sans-serif;
    font-weight: normal;
}

.content-gradient {
    background: url('../../../static/content-gradient.png') 0 365px repeat-x;
    position: absolute;
    width: 100%;
    height: 100%;
    min-height: 2000px;
    z-index: -10;
    top: 0;
}

.ui-ftl {
    background: url('../../../static/frame-top-left.png') top right no-repeat;
    background-size: contain;
    display: block;
    float: left;
    width: 176px;
    height: 71px;
}

.ui-ft {
    background: url('../../../static/frame-top.png') top left repeat-x;
    background-size: contain;
    width: 400px;
    height: 71px;
    float: left;
}

.ui-ftr {
    background: url('../../../static/frame-top-right.png') top left no-repeat;
    background-size: contain;
    display: block;
    float: left;
    width: 172px;
    height: 71px;
}

.ui-frame {
    background: url('../../../static/frame.png') top left repeat;
    background-size: contain;
    width: 400px;
    height: 140px;
    overflow: hidden;
    float:left;
}

.ui-left {
    background: url('../../../static/frame-left.png') top right repeat-y;
    background-size: contain;
    display: block;
    float: left;
    width: 176px;
    height: 140px;
}

.ui-right {
    background: url('../../../static/frame-right.png') top left repeat-y;
    background-size: contain;
    display: block;
    float: left;
    width: 172px;
    height: 140px;
}

.ui-fbl {
    background: url('../../../static/frame-bottom-left.png') top right no-repeat;
    background-size: contain;
    display: block;
    float: left;
    width: 176px;
    height: 104px;
}

.ui-fb {
    background: url('../../../static/frame-bottom.png') top left repeat-x;
    background-size: contain;
    width: 400px;
    height: 104px;
    float: left;
}

.ui-fbr {
    background: url('../../../static/frame-bottom-right.png') top left no-repeat;
    background-size: contain;
    display: block;
    float: left;
    width: 172px;
    height: 104px;
}

.launchcallout {
    background: url('../../../static/ui-frame-flat.png') 50% 0% no-repeat;
    background-size: contain;
    overflow: hidden;
    margin: 0 auto 0 !important;
    width: 900px;
    height: 250px;
}

.launchcallout h4 {
    font-family: 'SchadowAntDMedi', Arial, sans-serif;
    color: #d4d69e;
    text-shadow: 2px 2px #000000;
    font-size: 32px;
    font-weight: bold;
    margin: 0 auto 25px;
}

.launchcallout p {margin: 65px auto; font-size: 24px; width: 600px;}

#primary {
    max-width: 1080px;
    margin: 25px auto;
}

.id-complete-projcont {
    position: relative;
    width: 100% !important;
    max-width: 681px !important;
}

.product-post-output img {
    width: 100%;
}

.product-post-output p, .product-post-output li {
    text-align: left;
    line-height: 150%;
}

.product-post-output p {
    margin: 1em 0;
}

.product-post-output h1 {
   margin: 1em auto;
}

.product-post-output br {
    display: none;
}

#prodfaq {
    text-align: left;
}

.navbar-brand {
/*    float:left;*/
    font-family: 'aleobold', Arial, sans-serif;
    font-size: 28px;
    position: relative;
    height: 50px;
    top: 0;
}

.navbar-brand h1 {
    font-size: inherit;
    top: 7px;
    margin: 0;
    position: absolute;
    margin: 2px 0 0 0;
    font-weight: normal;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0);
    background: url('../../../static/labyrinth.png') top left no-repeat;
    height: 48px;
    width: 216px;
}

#main-cta {
    background: url('../../../static/lab-btn-rest.png') 50% 0% no-repeat;
    background-size: contain;
    display: inline-block;
    max-height: 100px;
    width: 800px;
    white-space: nowrap;
    text-align: center;
    margin: -95px 0 0 0;
}

#main-cta:hover {
    background: url('../../../static/lab-btn-hover.png') 50% 0% no-repeat;
    background-size: contain;
}

#main-cta .cta-wrap {
    width: 100%;
}

.main-cta-l {
    width: 156px;
    height: 100px;
    display: inline-block;
    position: relative;
    top: 0;
    margin: 0 0 0 auto;
    float: left;
    background-size: contain;
}

.main-cta-r {
    width: 156px;
    height: 100px;
    display: inline-block;
    position: relative;
    float:left;
    margin: 0 auto 0 0;
    top: 0;
    background-size: contain;
}

@font-face {
    font-family: 'SchadowAntDMedi';
    src: url('../../../static/btns.ttf');
}

@font-face {
    font-family: 'AmaranthBold';
    src: url('../../../static/amaranthb.otf');
}

#main-cta a {
    font-family: 'SchadowAntDMed';
    font-size: 24px;
    height: 100%;
    margin: 18px auto;
    font-weight: 500;
    display: block;
    text-shadow: 2px 2px #000000;
    color: #d4d69e;
}

.main-cta-mid {
    width: 488px;
    height: 100px;
    float: left;
    position: relative;
    top: 0;
    background-size: contain;
    display: inline-block;
    white-space: nowrap;
}

#main-cta a:hover {
    text-decoration: none;
}

.navbar-brand h1 a {
    color: rgba(0, 0, 0, 0);
}

.navbar-collapse {
    position: absolute;
    right: 0px;
    top: 0px;
    margin: 0
}
.navbar-mobile {
    position: absolute;
    right: 0px;
    top: 0px;
    margin: 12px 0
}

.slicknav_menu {
    background: none;
    padding: 0;
    
}

.slicknav_nav {
    background: rgba(0,0,0,0.8);
    z-index: 998;
/*    position:fixed;*/
    /*top: 65px;*/
    /*left: 30%;*/
    width: 100%;
    margin-top: 40px;
    display:none;
}

.slicknav_nav li {
    height: inherit;
    padding: 0;
    width: 100%;
}

.slicknav_btn {
    margin: 0;
}



ul.horizontal {
    list-style-type: none;
    padding-left: 0;
}

ul.horizontal li {
    display: inline-block;
}

.navbar-collapse ul {
    margin: 0;
    padding: 0;
}

.contents, .content {
    text-align: center;
}

.content-join {
    margin-top: 300px;
}


.content-cards {
    margin: 40px auto 0;
    max-width: 1080px;
}

.content-cards > p {
    padding-bottom: 20px;
}

.content-cards p {    
    padding-left: 9%;
    padding-right: 9%;
    font-size: 20px;
    line-height: 30px;
}
.content-cards ul li div > h4 {    
    padding-top: 20px;
}


.clearfix {
    clear: both;
}

.content-cards ul {
    margin: 0;
    padding: 0;
}

.content-cards li > div {
    background-color: #161616;
    margin: 10px;
}

.card-description {
    padding: 10px 10px 30px 10px;
    font-size: 16px;
    line-height: 30px;
}

.content-join-form {
    
}

table.panel {
    border-spacing: 0;
}

table.panel td {
    padding: 0;
}

table.panel .top-left {
    background-image: url('images/bg-frame-top-left.png');
    width: 40px;
    height: 14px;
}
table.panel .top-middle {
    background-image: url('images/bg-frame-top-middle.png');
    background-size: 100% 15px;
    height: 14px;
}
table.panel .top-right {
    background-image: url('images/bg-frame-top-right.png');
    width: 40px;
    height: 14px;
}
table.panel .middle-left {
    background-image: url('images/bg-frame-middle-left.png');
}
table.panel .middle-middle {
    background-image: url('images/bg-frame-middle-middle.png');
    background-size: 100% 100%;
}
table.panel .middle-right {
    background-image: url('images/bg-frame-middle-right.png');
}
table.panel .bottom-left {
    background-image: url('images/bg-frame-bottom-left.png');
    width: 40px;
    height: 14px;
}
table.panel .bottom-middle {
    background-image: url('images/bg-frame-bottom-middle.png');
    background-size: 100% 15px;
    height: 14px;
}
table.panel .bottom-right {
    background-image: url('images/bg-frame-bottom-right.png');
    width: 40px;
    height: 14px;
}

.join-form {
    max-width: 345px;
    text-align: initial;
    font-size:16px;
    line-height: 24px;
    padding: 20px 20px 0 20px;
}

.join-form input[type=text] {
    background-color:#0a0a0a;
    width: 100%;
    color: white;
    height: 48px;
    border:none;
    border-right: 1px solid rgba(255,255,255,0.05);
    border-bottom: 1px solid rgba(255,255,255,0.05);
    padding: 0;
}


.content-callout {
    background-image: url('images/bg-callout.png'); 
    position: relative; 
    text-align: center;
    margin-top: 80px;
}

.content-callout-center-block {
    display: inline-block;
    z-index: 100;
    position: relative; 
}

.content-nav-bottom {
    margin-top: 159px;
}

.content-nav-bottom li {
    padding-left: 20px;
    padding-right: 20px;
}

.content-nav-bottom ul {
    margin: 0;
    padding: 0;
}

.content-footer {
    margin-top: 16px;
    margin-bottom: 16px;
    color: #666666;
    font-size: 16px;
    line-height: 24px;
}

#habla_window_div {
    right: 35%;
}

/*
.kickstarter-button-frame { 
    background: url('images/btn-kickstarter.png');
    background-position: 0 0;
    background-size: 100%;
    display: inline-block;
}
.kickstarter-button-frame:hover { background-position: 0 50%;}
.kickstarter-button-frame:active { background-position: 0 100%;}
*/

.kickstarter-button-frame { 
    background: url('../../uploads/2015/12/BackerButton1.png');
    background-size: 100%;
    display: inline-block;
}
.kickstarter-button-frame:hover { background: url('../../uploads/2015/12/BackerButton2.png');}
.kickstarter-button-frame:active { background: url('../../uploads/2015/12/BackerButton3.png');}

.join-button-frame { 
    background: url('images/btn-join-frame.png'); 
    background-position: 0 0;
    background-size: 100%;
    display: inline-block;
}    
.join-button-frame:hover { background-position: 0 50%;}
.join-button-frame:active { background-position: 0 100%;}
.join-button { 
    background: url('images/btn-join.png'); 
    background-position: 0 0;
    background-size: 100%;
    display: inline-block;
}
.join-button:hover { background-position: 0 50%; }
.join-button:active { background-position: 0 100%; }

.join-button-forum-frame { 
    background: url('images/btn-forum-frame.png'); 
    background-position: 0 0;
    background-size: 100%;
    display: inline-block;
}    
.join-button-forum-frame:hover { background-position: 0 50%;}
.join-button-forum-frame:active { background-position: 0 100%;}

.join-button-frame, join-button-forum-frame, kickstarter-button-frame {
    cursor: pointer;
}

.learn-more {
    cursor: pointer;
}

.join-forum {
    cursor: pointer;
}

a { color: #ffcc99; text-decoration: none;}
a:hover { text-decoration: underline;}

.icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border: 1px solid white;
  background-color: white;
  margin: 3px;
}



button:active { outline: none; }
button:focus { outline: none; }


.join-form #user_login, .join-form #user_email { font-family: 'Open Sans', Arial, sans-serif; font-size: 18px; font-weight: 300; padding-left: 10px; }