:root {
    --color-primary: white;
    --color-border:  #006391;
    --color-border-one: #006391;
    --border-radius: 0;
}

header, footer {
    background-color: #006391 !important;
    background-image: url("https://www.transparenttextures.com/patterns/black-orchid.png");
}

body {
    background-color: #006391;
    background-image: url("https://www.transparenttextures.com/patterns/black-felt.png");
}

div.container {
    gap: var(--gap);
    grid-template-columns: 1fr 2.5fr;
}

div.container>div {
    border: 1px solid var(--color-border);
    background-color: var(--color-primary);
    padding: var(--gap);
}

div.left {
    display: flex;
    flex-direction: column;
}

div.container>div.left>section.txtpost1 {
    grid-template-columns: auto !important;
}

@media screen and (max-width: 1200px) {
    :root {
        --gap: .8rem;
    }

    div.container {
        grid-template-columns: 1fr 2fr;
    }
}

@media screen and (max-width: 1024px) {
    :root {
        --gap: .6rem;
    }

    div.container {
        grid-template-columns: auto
    }

    div.container>div.left {
        order: 2;
    }

    div.container>div.right {
        order: 1;
    }
}

@media screen and (max-width: 768px) {
    :root {
        --gap: .5rem;
    }
}