body {
    height: 100vh;
    background-image: url('/Content/images/bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
}
html {
    height: 100vh;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Merriweather', serif;
}
h1 {
    font-size:40px;
    color:#fff;
}
h2 {
    color:#eee;
    text-shadow: #000 1px 1px 1px;
}
p{
    margin:0 0 4px;
}
.grid{
    display:grid;
    height:100vh;
    grid-template-rows: 430px auto 240px;
}
.grid-logo {
    display:grid;
    grid-row-start:1;
    grid-row-end: 2;
    grid-template-columns: 320px auto;
}
.grid-footer {
    display:grid;
    grid-row-start:3;
    grid-row-end: 4;
    grid-template-columns: auto auto auto;
}
.logo-container {
    grid-column-start: 1;
    grid-column-end: 2;
    padding-left:40px;
    padding-top:80px;
}
.logo-content {
    position:relative;
    width: 100%;
    height: 340px;
    padding:20px;
}
.logo-bg {
    position: absolute;
    background-color: #fff;
    border-radius: 4px;
    opacity: 0.6;
    width: 100%;
    height: 350px;
    padding: 20px;
    left:0px;
    top:0px;
    z-index:-1;
}
.logo {
    position: relative;
    background-image: url('/Content/images/logo.png');
    background-repeat: no-repeat;
    height: 150px;
}
.opening {
    padding:4px;
    font-size:18px;
}
.contact {
    grid-row-start:3;
    grid-row-end:4;
    grid-column-start:2;
    grid-column-end: 3;
    color: #ccc;
    text-shadow: #000 1px 1px 1px;
    text-align:center;
    margin-bottom:40px;
}
@media only screen and (max-width: 600px) {
    h1 {
        font-size: 36px;
    }
    .grid {
        display: grid;
        height: 100vh;
        grid-template-rows: 380px auto 240px;
    }
    .grid-logo {
        grid-template-columns: auto 280px auto;
    }
    .logo-container {
        grid-column-start: 2;
        grid-column-end: 3;
        padding-top: 40px;
        padding-left:0px;
    }

}