* {
    box-sizing: border-box;
    line-height: 1;
}


h1,
h2,
h3,
h4,
h5 {
    margin: 0 0 2rem;
    line-height: 1.2;
}

h1 {
    font-size: 4rem;
    margin-bottom: 0;
}

strong {
    font-weight: 700;
}

p {
    line-height: 1.5;
}

html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    background-attachment: fixed;
    background-color: #f1f1f1;
    background-image: url("data:image/svg+xml,%3Csvg width='100' height='20' viewBox='0 0 100 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.184 20c.357-.13.72-.264 1.088-.402l1.768-.661C33.64 15.347 39.647 14 50 14c10.271 0 15.362 1.222 24.629 4.928.955.383 1.869.74 2.75 1.072h6.225c-2.51-.73-5.139-1.691-8.233-2.928C65.888 13.278 60.562 12 50 12c-10.626 0-16.855 1.397-26.66 5.063l-1.767.662c-2.475.923-4.66 1.674-6.724 2.275h6.335zm0-20C13.258 2.892 8.077 4 0 4V2c5.744 0 9.951-.574 14.85-2h6.334zM77.38 0C85.239 2.966 90.502 4 100 4V2c-6.842 0-11.386-.542-16.396-2h-6.225zM0 14c8.44 0 13.718-1.21 22.272-4.402l1.768-.661C33.64 5.347 39.647 4 50 4c10.271 0 15.362 1.222 24.629 4.928C84.112 12.722 89.438 14 100 14v-2c-10.271 0-15.362-1.222-24.629-4.928C65.888 3.278 60.562 2 50 2 39.374 2 33.145 3.397 23.34 7.063l-1.767.662C13.223 10.84 8.163 12 0 12v2z' fill='%23cccccc' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
    background-position: top center;
    color: #555;
    font-family: 'Nunito Sans', Arial, Helvetica, sans-serif;
    font-size: 16px;
    height: 100%;
}

.subheading {
    color: #777;
    font-size: 2rem;
    font-weight: 100;
}

.content {
    border: 1px solid #ccc;
    border-radius: 15px;
    box-shadow: -2px 7px 10px rgba(0, 0, 0, .09);
    height: auto;
}

.header {
    background-color: #F15722;
    height: 110px;
    /* height: 150px; */
    margin: 0;
    text-align: center;
}

.wrapper {
    margin: 0 auto;
    max-width: 900px;
}

.header__logo {
    background-color: #fff;
    border-radius: 300px;
    bottom: -35px;
    /* bottom: -85px; */
    margin: 0 auto;
    max-width: 165px;
    position: relative;
    transition: bottom .2s ease-in-out;
    width: 100%;
}

.header__logo:hover {
    bottom: -25px;
}

.header__logo a {
    display: block;
}

.header__logo svg {
    margin: 0 auto;
    max-width: 160px;
    width: 100%;
}

.main {
    background-color: #fff;
    /* border: 1px solid #ddd; */
    border-top: 0;
    border-radius: 0 0 15px 15px;
    line-height: 1.5;
    margin: 0 auto;
}

.site-nav {
    background-color: #F15722;
    padding: 15px 25px;
    /* position: relative;
    z-index: 1; */
}

.site-nav .wrapper {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.site-nav a {
    border-right: 1px solid rgba(255, 255, 255, .2);
    /* border-radius: 5px; */
    color: #fff;
    display: block;
    font-size: 1rem;
    padding: 0 10px;
    text-align: center;
    text-decoration: none;
    /* width: 100%; */
}

.site-nav a:first-of-type {
}

.site-nav a:last-of-type {
    border-right: 0;
}

.site-nav a:hover {
    /* border-color: #d44c1f; */
    /* background-color: #eee; */
    /* color: #fff; */
    /* border-bottom: 1px solid #eee; */
    text-decoration: underline;
}

.card {
    background: url(/assets/body-bkg.svg) no-repeat 100% 108%/ 197px;
    padding: 4rem;
    padding: 4rem 3rem 3rem;
}

.card .wrapper {
    /* border: 1px solid #eee;
    border-radius: 6px;
    padding: 3rem; */
}

.card a,
.card a:visited {
    /* color: #F15722;*/
    color: inherit;
    font-weight: 700;
    text-decoration: none;
}

.card a:hover {
    text-decoration: underline;
}

.footer {
    background: #fff;
    border-top: 1px solid #eee;
}

.social {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.social a {
    border-right: 1px solid #f1f1f1;
    color: #777;
    display: block;
    padding: 30px;
    text-decoration: none;
    width: 100%;
}

.social a:hover {
    background-color: #fafafa;
}

.social a:first-of-type {
    border-left: 1px solid #f1f1f1;
}

.social a:last-of-type {

}

.social a span {
    display: inline-block;
}

.social svg {
    display: inline-block;
    fill: currentColor;
    margin-right: 5px;
    max-height: 22px;
    max-width: 22px;
    vertical-align: sub;
}

/* FORM */
.input-row {
    margin: 1rem 0;
}

form,
input,
textarea {
    font-family: 'Nunito Sans';
    font-size: 1rem;
}

label {
    display: none;
}

input[type="text"],
textarea {
    -webkit-appearance: none;
    padding: 15px;
    border-radius: 0;
    border: 1px solid #ddd;
    width: 100%;
}

input[type="submit"] {
    -webkit-appearance: none;
    cursor: pointer;
    padding: 1rem 9rem;
    font-size: 1.2rem;
    border-radius: 4px;
    border: 0;
    background: #555;
    color: #FFF;
}

input[type="submit"]:hover {
    background: #F15722;
}


/* gallery */
.gallery {

}

.gallery__item {
    border-bottom: 1px solid #eee;
    display: flex;
    padding: 2rem 0;
}

.gallery__item:last-of-type {
    border-bottom: 0;
}

.gallery__item h3 {
    font-size: 3rem;
    font-weight: 100;
    margin-bottom: 0;
}

.gallery__img {
    width: 55%;
}

.gallery__img img {
    width: 100%;
}

.gallery__info {
    padding: 1.5rem 0 1.5rem 1.5rem;
    width: 45%;
}

.gallery__info a,
.gallery__info a:visited {
    color: inherit;
}

a.gallery__link {
    font-weight: 400;
}

.gallery__link:before {
    background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' enable-background='new 0 0 512.001 512.001'  viewBox='0 0 512.001 512.001' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m124.216 512.001c-32.708.001-63.596-12.96-87.427-36.79-24.953-24.954-37.987-57.649-36.703-92.064 1.327-35.543 17.384-69.686 46.436-98.738l52.308-52.521c7.794-7.827 20.457-7.853 28.284-.058 7.826 7.794 7.853 20.458.058 28.284l-52.336 52.551c-42.411 42.411-46.413 97.61-9.761 134.262 36.653 36.655 91.852 32.652 134.232-9.732l71.887-71.887c21.789-21.788 33.805-46.667 34.748-71.945.865-23.17-8.019-45.291-25.015-62.287-5.695-5.694-11.996-10.526-18.729-14.361-9.598-5.467-12.947-17.68-7.48-27.277 5.468-9.598 17.681-12.946 27.277-7.48 9.838 5.604 18.995 12.614 27.217 20.835 24.953 24.953 37.987 57.648 36.703 92.063-1.327 35.543-17.384 69.687-46.436 98.738l-71.887 71.887c-29.053 29.052-63.195 45.108-98.738 46.436-1.548.055-3.097.084-4.638.084zm133.068-189.436c5.467-9.598 2.117-21.811-7.48-27.277-6.733-3.835-13.035-8.667-18.729-14.36-36.652-36.653-32.65-91.852 9.732-134.234l71.887-71.886c42.383-42.381 97.581-46.384 134.232-9.732 36.652 36.652 32.65 91.851-9.761 134.262l-52.336 52.551c-7.795 7.826-7.769 20.49.058 28.284 7.826 7.795 20.489 7.767 28.284-.058l52.308-52.522c29.052-29.052 45.108-63.195 46.436-98.737 1.284-34.415-11.75-67.111-36.703-92.064-24.954-24.954-57.666-37.986-92.064-36.704-35.543 1.327-69.686 17.384-98.737 46.436l-71.888 71.886c-29.052 29.052-45.108 63.195-46.436 98.737-1.284 34.415 11.75 67.111 36.703 92.065 8.221 8.22 17.378 15.229 27.217 20.834 3.124 1.779 6.524 2.625 9.88 2.625 6.953-.001 13.709-3.633 17.397-10.106z'/%3E%3C/svg%3E");
    content: '';
    display: inline-block;
    height: 20px;
    margin-right: 10px;
    width: 20px;
}

@media (max-width: 700px) {
    .header {
        height: 110px;
    }

    .header__logo {
        bottom: -15px;
        max-width: 125px;
    }

    .site-nav {
        background-color: #fff;
        padding: 65px 15px 0;
        justify-content: space-evenly;
    }

    .site-nav a {
        border: 1px solid #555;
        color: inherit;
        display: block;
        font-weight: 600;
        padding: 15px 20px;
        margin: 0 5px;
        border-radius: 5px;
        width: 100%;
    }

    .site-nav a:last-of-type {
        border-right: 1px solid #555;;
    }

    .card {
        padding: 2rem 1rem 2rem;
    }

    input[type="submit"] {
        width: 100%;
    }
}

@media (max-width: 750px) {
    .footer,
    .social {
        border-radius: 0;
        flex-direction: column;
    }

    .social a {
        border-right: 0;
        border-bottom: 1px solid #f1f1f1;
        text-align: center;
    }

    .social a:last-of-type {
        border-radius: 0;
        border-bottom: 0;
    }

    .social a:first-of-type {
        border-radius: 0;
    }
}

@media (max-width: 820px) {
    body {
        background: #f1f1f1;
        padding: 0;
    }

    .content {
        border-radius: 0;
        box-shadow: none;
    }

    .header {
        border-radius: 0;
    }

    .card {
        /* padding: 4rem 1rem 2rem; */
    }

    h1 {
        font-size: 2rem;
    }

    .subheading {
        font-size: 1.3rem;
    }

    .gallery__item {
        flex-direction: column;
    }

    .gallery__img,
    .gallery__info {
        width: 100%;
    }

    .gallery__info {
        padding: 1.5rem 1rem;
    }
}
