@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,500,700);
html{
    font-size: 62.5%;
    box-sizing: border-box;
}
*, *:before, x:after{
    box-sizing: inherit;
}
body{
    font-size: 1.8rem;
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
}
.container{
    width: 80%;
    max-width: 1400px;
    margin: 0 auto;
}
.container h4{
    margin-bottom: -5px;
}
.container p{
    text-align: justify;
}

.navbar{
    list-style-type: none;
    padding: 0;
    width: 100%;
    text-transform: capitalize;
    margin-top: 0px;
    line-height: 80%;
}

.navbar .icon{
    max-height: 0px;
}

.navbar .homebtn{
    border-radius: 1rem 0 0 1rem;
}

.navbar a{
    color: white;
    text-decoration: none;
    -webkit-transition: .5s ease-out;
    transition: .5s ease-out;
    padding-right: 1rem;
    display: block;
}

.navbar a:hover{
    color: orange;
}

@media screen and (min-width:800px){
    .navbar{
        position: fixed;
        right: 0;
        font-size: 1.15rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        -webkit-align-content: flex-start;
            -ms-flex-line-pack: start;
                align-content: flex-start;
        -webkit-flex-flow: wrap;
            -ms-flex-flow: wrap;
                flex-flow: wrap;
    }
    .navbar .icon{
        max-height: 32px;
    }
}

@media screen and (min-width:1000px){
    .navbar{
        font-size: 1.5rem;
    }
    .navbar .icon{
        max-height: 64px;
    }
}

@media screen and (min-width:800px){
    .navbar a{
        background: rgba(0, 0, 0, 0.5);
        padding: .5rem;
    }
}
.home{
    background: -webkit-linear-gradient( top, rgba(0,0,0,.2), rgba(0,0,0,.5)), url('images/backgrounds/bg01.jpg');
    background: linear-gradient( to bottom, rgba(0,0,0,.2), rgba(0,0,0,.5)), url('images/backgrounds/bg01.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 100%;
    background-color: #442314;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    text-align: center;
    height: auto;
}
.home .headline{
    display: none;
}
.home .navline{
    margin: 1.75rem;
}
.home .navline .logo{
    width: 30%;
    max-width: 60px;
    height: 100%;
}
.home .tagline{
    display: none;
    color: white;
}
@media screen and (min-width:800px){
    .home{
        background: -webkit-linear-gradient( top, rgba(0,0,0,.2), rgba(0,0,0,.5)), url('images/backgrounds/bg01.jpg');
        background: linear-gradient( to bottom, rgba(0,0,0,.2), rgba(0,0,0,.5)), url('images/backgrounds/bg01.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        height: 100vh;
        max-height: 100vh;
    }
}
@media screen and (min-width:800px){
    .home .navline{
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }
}
@media screen and (min-width:800px){
    .home .navline .logo{
        max-width: 180px;
    }
}
@media screen and (min-width:800px){
    .home .tagline{
        display: block;
    }
}
.footer{
    background: -webkit-linear-gradient( top, rgba(0,0,0,.2), rgba(0,0,0,.5)), url('images/backgrounds/bg02.jpg');
    background: linear-gradient( to bottom, rgba(0,0,0,.2), rgba(0,0,0,.5)), url('images/backgrounds/bg02.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 100%;
    background-color: #442314;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    text-align: center;
    height: auto;
}
.footer .headline{
    display: none;
}
.footer .navline{
    margin: 1.75rem;
}
.footer .navline .logo{
    width: 30%;
    max-width: 60px;
    height: 100%;
}
.footer .contactinfo p{
    color: white;
}
.footer .copyright{
    display: block;
    max-width: 90%;
    margin: 0 auto;
    color: white;
    font-size: 1.2rem;
}
@media screen and (min-width:800px){
    .footer{
        background: -webkit-linear-gradient( top, rgba(0,0,0,.2), rgba(0,0,0,.5)), url('images/backgrounds/bg02.jpg');
        background: linear-gradient( to bottom, rgba(0,0,0,.2), rgba(0,0,0,.5)), url('images/backgrounds/bg02.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        height: 100vh;
        max-height: 100vh;
    }
}
@media screen and (min-width:800px){
    .footer .navline{
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }
}
@media screen and (min-width:800px){
    .footer .navline .logo{
        max-width: 180px;
    }
}

.genlee{
    background-color: #A4BBDA;
    height: 100%;
    min-height: 100vh;
}

.genlee .heading{
    background: -webkit-linear-gradient( top, transparent, #A4BBDA), url('images/backgrounds/gl.jpg');
    background: linear-gradient( to bottom, transparent, #A4BBDA), url('images/backgrounds/gl.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 80vh;
}

.bluesmob{
    background-color: #8B8585;
    height: 100%;
    min-height: 100vh;
}

.bluesmob p, .bluesmob h4{
    color: white;
}

.bluesmob .heading{
    background: -webkit-linear-gradient( top, transparent, #8B8585), url('images/backgrounds/bm3.jpg');
    background: linear-gradient( to bottom, transparent, #8B8585), url('images/backgrounds/bm3.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 80vh;
}

.nyctaxi{
    background-color: #8B8585;
    height: 100%;
    min-height: 100vh;
}

.nyctaxi p, .nyctaxi h4{
    color: white;
}

.nyctaxi .heading{
    background: -webkit-linear-gradient( top, transparent, #8B8585), url('images/backgrounds/nyc.jpg');
    background: linear-gradient( to bottom, transparent, #8B8585), url('images/backgrounds/nyc.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 80vh;
}

.jurassic{
    background-color: #8B8585;
    height: 100%;
    min-height: 100vh;
}

.jurrassic p, .jurrasic h4{
    color: white;
}

.jurassic .heading{
    background: -webkit-linear-gradient( top, transparent, #8B8585), url('images/backgrounds/jp.jpg');
    background: linear-gradient( to bottom, transparent, #8B8585), url('images/backgrounds/jp.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 80vh;
}

.ltaxi{
    background-color: #8B8585;
    height: 100%;
    min-height: 100vh;
}

.ltaxi p, .ltaxi h4{
    color: white;
}

.ltaxi .heading{
    background: -webkit-linear-gradient( top, transparent, #8B8585), url('images/backgrounds/ltaxi.jpg');
    background: linear-gradient( to bottom, transparent, #8B8585), url('images/backgrounds/ltaxi.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 80vh;
}


.starsky{
    background-color: #8B8585;
    height: 100%;
    min-height: 100vh;
}

.starsky p, .starsky h4{
    color: white;
}

.starsky .heading{
    background: -webkit-linear-gradient( top, transparent, #8B8585), url('images/backgrounds/sh.jpg');
    background: linear-gradient( to bottom, transparent, #8B8585), url('images/backgrounds/sh.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 80vh;
}

.mustang{
    background-color: #8B8585;
    height: 100%;
    min-height: 100vh;
}

.mustang p, .mustang h4{
    color: white;
}

.mustang .heading{
    background: -webkit-linear-gradient( top, transparent, #8B8585), url('images/backgrounds/must3.jpg');
    background: linear-gradient( to bottom, transparent, #8B8585), url('images/backgrounds/must3.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 100vh;
    max-height: 80vh;
}
.gallery{
    background-color: #A4BBDA;
    height: 100%;
    min-height: 100vh;
}
.gallery h4{
    text-align: center;
    margin-top: 0;
    padding-top: 2rem;
}
.gallery .container{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row wrap;
        -ms-flex-flow: row wrap;
            flex-flow: row wrap;
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    max-width: none;
    width: 90%;
}
.gallery .container img{
    padding: 1rem;
    width: 100%;
    height: 100%;
}
@media screen and (min-width:800px){
    .gallery{
        padding-top: 8rem;
    }
}
@media screen and (min-width:600px){
    .gallery .container img{
        width: calc(100%/2);
    }
}
@media screen and (min-width:800px){
    .gallery .container img{
        width: calc(100%/3);
    }
}
@media screen and (min-width:1000px){
    .gallery .container img{
        width: calc(100%/4);
    }
}
