:root {
    --width-content: 1400px;
    --width-spacing: 30px;
}

.container {
    padding: var(--width-spacing);
}

.row { 
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: var(--width-spacing);
    margin-left: auto;
    margin-right: auto;
    max-width: var(--width-content);
}

.flex-align-center {
    align-items: center;
}

.flex-full-height {
    height: calc(100vh - 220px);
}

@media only screen and (min-width: 600px) {
    .row {
        flex-direction: row;
    }
}

.col { flex: 1; }
.col.order-1 { order: 1 }
.col.order-2 { order: 2 }
.col.order-3 { order: 3 }

@media only screen and (min-width: 600px) {
    .col { order: unset !important; }
}