/*****************
Style Sheet: Custom Styling Settings
By: 6:8 Studios
Date: 4-27-2015
Timestamp: 17:43:00 CST
******************/
body {
    font-family: 'Fira Sans', sans-serif;
}

.outerContainer {
    width: 100%;
}

.phHero {
    width: 100%;
    height: 100vh;
    background-image: url("../assets/images/phHero.jpg");
    background-size: cover;
    text-align: center;
}

.vertical-align {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.phHero > h1{
    font-size: 500%;
    text-transform: uppercase;
    color: #000;
    text-shadow: -3px 2px 5px #999;
}

.phHero > p {
    margin-top: -50px;
    font-size: 100%;
    color: #ddd;
    text-shadow: -1px 1px 1px #555;
}

/* Media Queries */
@media screen and (max-width: 480px) {
    .phHero > h1 {
        font-size: 500%;
        text-shadow: -2px 2px 3px #444;
    }
    .phHero > p {
        margin-top: -25px;
        font-size: 250%;
        color: #ccc;
        text-shadow: -2px 2px 3px #555;
    }
}

@media screen and (max-width: 800px){

}

@media screen and (min-width: 1281px){
    .phHero > p {
        color: #eee;
        text-shadow: -1px 1px 2px #555;
    }
}