@media screen and (max-width: 1040px) {
    .section,
    .footer {
        padding: 0 20px;
    }
}

@media screen and (max-width: 900px) {
    .stamp {
        top: 15px;
        right: 0;
    }
}

@media screen and (max-width: 840px) {
    iframe {
        max-width: 100%;
    }

    body {
        position: relative;
        left: 0;
    }

    body.show-menu {
        left: 200px;
    }

    .navwrap {
        font-size: 1.4em;
        font-weight: 300;

        height: 15px;

        background-color: #443928;
        background-image: none;
    }

    .mobile-toggle {
        display: block;
    }

    .menu-primary-container {
        position: fixed;
        z-index: 1;
        top: 0;
        bottom: 0;
        left: -200px;

        width: 200px;
        padding: 50px 20px;

        background: #443928;
    }

    .menu-primary-container.show-menu {
        left: 0;
    }

    body,
    .menu-primary-container {
        -webkit-transition: all 0.3s ease;
                transition: all 0.3s ease;
    }

    nav ul::before,
    nav ul::after {
        display: none;

        content: '';
    }

    nav li {
        float: none;

        width: 100%;

        text-align: left;
    }

    nav li a {
        height: auto;
        margin: 0;
        padding: 8px 12px;
    }

    .main-navigation li:hover > ul {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    .section {
        padding: 30px;
    }

    .article,
    .aside {
        float: none;

        width: 100%;
        min-height: 0;
        margin: 0 0 20px;
        padding: 0;
    }
}

@media screen and (max-width: 700px) {
    .logo {
        max-width: 60%;
    }

    .stamp {
        max-width: 20%;
    }

    .section {
        padding: 30px 15px;
    }

    .item {
        width: 50%;
    }
}

@media screen and (max-width: 600px) {
    .article {
        font-size: 1.4em;
    }

    .aside {
        font-size: 1.2em;
    }
}
