body {
    font-family: 'Roboto', sans-serif;
}

h1 {
    font-weight: 300;
    font-size: 50px;
}

.container {
    max-width: 1024px;
}

.brand {
    position: absolute;
    top: 50px;
    padding-left: 15px;
}

.brand h2 {
    font-size: 20px;
    font-weight: 900;
    margin: 0;
}

.lead {
    font-weight: 400;
}

.hr-muted {
    opacity: .3;
}

.hero {
    background: #2775ee;
    background: -moz-linear-gradient(top, #2775ee 0%, #7db9e8 100%);
    background: -webkit-linear-gradient(top, #2775ee 0%,#7db9e8 100%);
    background: linear-gradient(to bottom, #2775ee 0%,#7db9e8 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2775ee', endColorstr='#7db9e8',GradientType=0 );
    color: #fff;
}

@media (min-width: 768px) {

    .hero .row {
        display: flex;
        align-items: center;
        min-height: 100vh;
    }

}

@media (max-width: 768px) {

    .brand {
        position: relative;
        padding-left: 0;
        top: 0;
    }

    .hero {
        padding: 50px 0;
        text-align: center;
    }
    
}

.hero .img-responsive {
    display: inline-block;
}

.h-center {
    float: none;
    margin: 0 auto;
}

.summary {
    padding: 30px 0;
}
.summary h2 {
    font-size: 30px;
    font-weight: 700;
}

.features {
    background-color: #eef4f7;
    padding: 60px 0;
    position: relative;
}
.features .model {
    position: absolute;
    bottom: 0;
}

.footnote {
    background-color: #222;
    padding: 50px 0;
    color: #fff;
}

.download-links img {
    width: 140px;
}