@media screen {
    div#c-content {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        width: max(85%, 1000px);
        margin: 0 auto;
        padding: 12px;
    }


    div.c-element {
        margin-bottom: 40px;
    }

    div.c-element.middle-element{
        margin-left: auto;
        margin-right: 0;
    }

    a.c-link {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        box-shadow: none;
    }

    div.c-text {
        flex: 1 0;
        margin: auto;
        padding: 15px;
        min-width: 300px;
        /*background-color: var(--background-color);*/
        border-radius: 35px;

    }

    img.c-image {
        flex: 1.7 0;
        width: min(660px, 98%);
        object-fit: cover;
        margin: 15px;
        border-radius: 35px;
        box-shadow: -2px -2px 6px -2px #c0c0c080,
            2px 2px 6px -2px #000000FF;

    }

    p.c-text-header {
        padding-bottom: 10px;
        text-decoration: underline;
        color: var(--text-color);
        font-size: 1.3rem;
    }

    p.c-text-text {
        font-size: 1.1rem;
    }

    a.c-link.middle-element {
        flex-direction: row-reverse;
    }

    .c-text.middle-element {
        text-align: right;
    }
    div.c--content{
        display: flex;
        flex-flow: row wrap;
        justify-content: center;
        gap: 3vw 2%;
        margin: 1% 2%;
    }
    img.c--image{
        width: 48.5%;
        border-radius: 35px;
        box-shadow: -2px -2px 6px -2px #c0c0c0A0,
            2px 2px 8px 0px #000000FF;
    }
}
@media screen and (max-width: 1030px){
    div#c-content{
        width: 98%;
        padding: 0;
    }
    img.c-image{
        margin-left: 0;
        margin-right: 0;
    }
    div.c-element.middle-element{
        margin-left: auto;
        margin-right: auto;
    }
}
@media screen and (max-width: 930px){
    img.c--image{
        width: 97%;
    }
}