.grid-container {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 5px;
    grid-auto-rows: minmax(22px, auto);
}

.gcol-1 {
    grid-column-end: span 1;
}

.gcol-2 {
    grid-column-end: span 2;
}

.gcol-3 {
    grid-column-end: span 3;
}

.gcol-4 {
    grid-column-end: span 4;
}

.gcol-5 {
    grid-column-end: span 5;
}

.gcol-6 {
    grid-column-end: span 6;
}

.gcol-7 {
    grid-column-end: span 7;
}

.gcol-8 {
    grid-column-end: span 8;
}

.gcol-9 {
    grid-column-end: span 9;
}

.gcol-10 {
    grid-column-end: span 10;
}

.gcol-11 {
    grid-column-end: span 11;
}

.gcol-12 {
    grid-column-end: span 12;
}

.grid-break {
    display: none;
}

.grid-break + .grid-item {
    grid-column-start: 1;
}

.grid-break + .grid-layout-ignore-node .grid-item:first-child {
    grid-column-start: 1;
}

.grid-layout-ignore-node {
    display: contents;
}

.grow-start {
    grid-column-start: 1;
}

/* Otra manera de insertar un salto de linea, ocupando
una linea entera con un elemento
.grid-container > div.row-start2 {
    grid-column-start: 1;
    grid-column-end: 13;
    height: 0;
    padding: 0;
    margin: 0;
    border: none;
}
*/

@media only screen and (max-width: 500px) {
    .label {
        text-align: start;
    }

    .grid-container {
        display: block;
    }
}

.btn-with-select-arrow {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
    /*padding-right: 2.25rem;*/
}

button.selector.btn-with-select-arrow.is-empty {
    color: grey;
}
