:root{
    --color-primary: #eee3e3 !important;
    --color-border: rgb(57, 59, 45);
    --color-border-one:red;
    --border-radius:0.5rem !important;
}
header,footer{
    background: #2A7B9B ;
    background: linear-gradient(90deg, rgb(172, 166, 132) 0%, rgb(42, 55, 128) 50%,  rgb(29, 170, 226) 100%) !important;
}
body{
    background-color:#f3eded;
}

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;}
}