/* @import url("//fonts.googleapis.com/css?family=Poiret+One|Josefin+Sans"); */

html {
height:100%;
}
/* Video Overlay */

#overlay {
background-color:rgba(0,0,0,.37);
height:60%;
left:0;
position:relative;
top:0;
transition:background-color 300ms ease;
width:100%;
}

.fade { background-color:rgba(0,0,0,.705) !important; }

/* Hero Video + Fallback */

#hero-vid {
backface-visibility:hidden;
background:url("../assets/img/studio.jpg") no-repeat scroll 0 0 #000;
background-size:cover;
bottom:0;
height:auto;
min-height:100%;
min-width:100%;
perspective:1000;
position:fixed;
right:0;
width:auto;
z-index:-1;
}

#hero-pic {
display:block;
height:auto;
width:100%;
}

#state {
bottom:0;
cursor:pointer;
font-size:2.25rem;
left:0;
line-height:1;
padding:2rem 2.5rem 1.65rem;
position:absolute;
}


/* Content Styles */

#title {
backface-visibility:hidden;
/* left:0; */
perspective:1000;
position:fixed;
width:100%;
}

#title h1 {
    background-color:rgba(31, 31, 31, 0.719);
    color: #FFFFFF;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
    font-family:"Saira", sans-serif;
    font-size:2.5rem;
}

#content {
background-color:#FFFFFF;
/* padding:2.5rem; */
position:relative;
z-index:1;
}


/* Media Queries */

@media only screen and (max-width:768px) {
    #overlay { height:auto; }
}


/* Visibility Helpers */

@media only screen and (min-width:769px) {
    .visible-mobile,.visible-tablet,.hidden-desktop { display:none !important; }
}

@media only screen and (min-width:480px) and (max-width:768px) {
    .visible-mobile,.hidden-tablet,.visible-desktop { display:none !important; }
}

@media only screen and (max-width:479px) {
    .hidden-mobile,.visible-tablet,.visible-desktop { display:none !important; }
}