/* global */
body {
    color: #5a5a5a;
}

p {
    font-size: 1.25rem;
    font-weight: 300;
    color: #212529;
}

/* container top */
.container-top p {
    font-size: 1.25rem;
    font-weight: 300;
    color: #212529;
}

.container-top {
    display: table;
    background-position: center;
    background-repeat: no-repeat;
    height: 25rem;
    -webkit-background-size: cover;
    width: 100%;
    padding-bottom: 3rem;
}

.container-top-text {
    display: table-cell;
    vertical-align: middle;
    left: 0;
    right: 0;
    bottom: 0;
    top: 13%;
}

.container-top .title {
    font-size: 2.6rem;
    font-weight: 500;
}

.container-top .sub-title {
    margin-bottom: .5rem;
    line-height: 1.2;
    font-size: 1.75rem;
    font-weight: 500;
}

/* large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
    .container-top .title {
        font-size: 2rem;
    }

    .container-top .sub-title {
        font-size: 1.5rem;
    }
}

/* medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {

    #app-title,
    #app-description {
        text-align: center !important;
    }

    .container-top {
        padding: 2rem;
    }
}

/* small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {

    /* hack for mobile menu */
    .container-top {
        margin-top: 0;
    }

    .container-top .title {
        font-size: 1.7rem;
    }

    .container-top .sub-title {
        font-size: 1.25rem;
    }
}

/* extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .container-top .title {
        font-size: 1.4rem;
    }

    .container-top .sub-title {
        font-size: 1.05rem;
    }
}

.caption {
    color: #ffffff;
}

a:hover {
    text-decoration: none;
}