@media only screen and (max-width:760px) {
    .container {
        width: 100%;
    }

    .navigation a {
        font-size: 0.8rem;
    }

    .navigation a:hover,
    a.active {
        font-size: 1.0rem;
    }
}

@media only screen and (max-width:690px) {
    .logo {
        display: inline-block;
        vertical-align: top;
        width: 60%;
        margin-left: 0;
    }

    .logo {
        height: 150px;
        background-image: url(../images/arms_small.png);
        background-position: 80px 10px;
    }

    .logo h1 a {
        font-size: 2.5rem;
        letter-spacing: 0.2em;
    }

    .logo p {
        margin-top: -5px;
        font-size: 0.6rem;
        letter-spacing: 0.1em;
        word-spacing: 0.3em;
    }

    .logo h1 {
        margin-top: 75px;
    }

    .logo h1,
    .logo p {
        margin-left: 30px;
    }

    .navigation {
        display: inline-block;
        width: 38%;
    }

    .navigation ul,
    .navigation li {
        display: block;
        width: 100%;
    }

    .navigation a:hover {
        border-bottom: none;
        color: #0064B4;
        text-shadow: rgb(255, 0, 0) 1px 1px 2px;
        background-color: rgba(255, 255, 255, 0.2);
    }

    a.active {
        color: #0064B4;
        text-shadow: rgb(255, 0, 0) 1px 1px 2px;
        background-color: rgba(255, 255, 255, 0.2);
        border-bottom: none;
        border-right: 1px solid #ffff00;
    }

    section.col-2-3,
    aside.col-1-3 {
        display: block;
        width: 100%;
    }

    section.col-2-3 h2,
    section.col-2-3 article {
        width: 100%;
    }

    section.col-2-3 h2 {
        margin: 5px 0;
        font-size: 1.1rem;
    }

    .lenin,
    .stalin,
    .hrushev,
    .breznev,
    .andropov,
    .chernenko,
    .gorbachev {
        width: 120px;
        height: 160px;
        background-repeat: no-repeat;
        background-position: 50% 10%;
    }

    .lenin {
        background-image: url(../images/Lenin_foto_2.jpg);
    }

    .stalin {
        background-image: url(../images/stalin_foto_2.jpg);
    }

    .hrushev {
        background-image: url(../images/hrushev_foto_2.jpg);
    }

    .breznev {
        background-image: url(../images/breznev_foto_2.jpg);
    }

    .andropov {
        background-image: url(../images/andropov_foto_2.jpg);
    }

    .chernenko {
        background-image: url(../images/chernenko_foto_2.jpg);
    }

    .gorbachev {
        background-image: url(../images/gorbachev_foto_2.jpg);
     }

    .lenin a,
    .stalin a,
    .hrushev a,
    .breznev a,
    .andropov a,
    .chernenko a,
    .gorbachev a {
        font-size: 0.9rem;
    }

    .text {
        width: 60%;
    }

    .main-text p,
    .main-text dl,
    .main-text ol,
    .main-text ul,
    table {
        font-size: 1.0rem;
    }

    .foto {
        width: 180px;
    }

}

@media only screen and (max-width:420px) {

    .logo h1 a {
        font-size: 2.5rem;
    }

    .foto {
        width: 120px;
    }
}