/* ==== COMMON ==== */
header, main, footer {
    display: flex;
    flex-wrap: wrap; /* Переносить элементы на следующую строку, если не помещаются на экране */
    width: 100%;
}

header,
footer {
    background-color: #343434;
    color: #c0c1c2;

    min-height: 50px;
    padding: 10px 0;

    flex-direction: row;
    justify-content: center;
    align-items: center;
}

header a, main a, footer a {
    transition: color 0.6s ease
}

header a,
footer a {
    color: #c0c1c2;
}

header a:hover,
footer a:hover {
    color: white;
}

/* ==== HEADER ==== */
header a,
header p {
    font-size: 24px;
}

/* ==== MAIN ==== */
main {
    background-color: #f4f4f4;
    padding: 20px 0 5px 0;

    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    flex: 1;
}

main a {
    color: #755f0c;
    color: #654e21;
    text-decoration: underline;
}

main a:hover {
    color: #8f7920;
}

.img {
    border-radius: 15px;
    border: 1px solid silver;
    height: auto;
    max-width: 100%;

    overflow: hidden; /* Обрезать части элемента, выходящие за мои границы */
}

#central {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
}

/* ==== FOOTER ==== */
footer h3 {
    font-size: 18px;
}

footer a,
footer p {
    font-size:16px;
}