.site_header {
    position: relative;
}

@import "../components/togglenav";
@import "../components/topnav";

/*
 *  3.3 Head Section
 * ------------------
 */
.head {
    padding-top: 55px;
    @media screen and (max-width: 800px) {
        font-size: .5em;
        word-break: break-all;
    }
    .content {
        @include flexbox(row, wrap, space-around, center);
        
        img{
            width: 100%;
            height: auto;
        }
    }
    .logo {
        width: 30%;
    }
    .head_img {
        display: block;
        width: 100%;
    }
    h1 {
        font: {
            size: 5em;
            family: $sfont;
            weight: $sweight;
        }
        text-transform: uppercase;
        letter-spacing: .4em;
        text-align: center;
        line-height: 2;
        a & {
            color: $main_title_color;
        }
        a:hover & {
            color: $main_title_hover_color;
        }
    }
    h2 {
        text-align: center;
        font: {
            size: 2em;
        }
        line-height: 1;
        margin-bottom: 40px;
    }
}