:root {
    --dark-blue: #003a54;
    --orange: #da614e;
}

/**
 * basic
 */
body {
    padding-top: 20px;
    padding-bottom: 20px;
    font-family: 'Calluna-Regular';
    font-size: 15px;
    border-top: 10px solid var(--dark-blue);
}

a {
    color: var(--orange);
}

a:hover {
    color: var(--dark-blue);
}

.orange {
    color: var(--orange);
}

/**
 * header
 */
header {
    padding-bottom: 20px;
}
header .logo {}

header .logo a {
    text-decoration: none;
}

header img.logo {
    height: 120px;
}

header .slogan h1 {
    text-align: right;
    font-family: 'Calluna-Regular' serif;
    font-style: italic;
    font-size: 3em;
    color: var(--dark-blue);
    margin: 1.5em 0 0 0;
}

@media (max-width: 991px) {
    header .slogan h1 {
        margin: 1em 0 0 0;
        text-align: left;
        font-size: 2em;
    }

}

/**
 * footer
 */
footer {
    background-color: var(--dark-blue);
    color: #ffffff;
    font-size: 14px;
    margin-top: 17px;
    padding-bottom: 40px;
}

footer .footer-top {
    background-color: #00b0ff;
    height: 10px;
    margin-bottom: 17px;
}

footer .container {
    padding-left: 10px;
    padding-right: 10px;
}

footer h4 {
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
    padding-bottom: 10px;
    margin-bottom: 2px;
}

footer ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

footer ul li {
    border-bottom: 1px solid #898989;
    line-height: 28px;
}

footer a {
    color: #ffffff;
}

footer a:hover {
    color: #da614e;
}

/**
 * Content
 */

.gallery {
    overflow: auto;
}
.gallery .image {
    padding: 0 20px 20px 0;
    float: left;
}
.gallery .image img {
    height: 100px;
}