* {
    box-sizing: border-box;
}

body {
    color: rgb(255, 255, 255);
    text-align: center;
}

#principal {
    width: 100%;
    margin: auto;
}

img {
    width: 100%;
}

.fila {
    display: flex;
    flex-wrap: wrap;
    /* border: 1px solid red; */
    align-items: stretch;
    height: auto;
}

footer {
    min-height: 300px;
}

.columna {
    padding: 0;
    width: 100%;
}

.columna img {
    /* width: 100%; */
    height: 100%;
    object-fit: cover;
}

.columna .columna>div {
    background-color: antiquewhite;
}

/* .columna-total {
    width: auto;
    align-items: center;
    justify-content: center;

} */

/* REGLAS DE DISTIBUCION */
.horizontal-final {
    justify-content: flex-end;
}

.horizontal-centro {
    justify-content: center;
}

.horizontal-separado {
    justify-content: space-between;
}

.vertical-centrado {
    align-items: center;
}

/* Consulta de medios MOVIL GRANDE */
@media screen and (min-width:576px) {

    /* .principal {
        width: 540px;
    } */

    .movil-doce {
        width: 100%;
    }

    .movil-once {
        width: 91.6667%;
    }

    .movil-diez {
        width: 83.3333%;
    }

    .movil-nueve {
        width: 75%;
    }

    .movil-ocho {
        width: 66.6667%;
    }

    .movil-siete {
        width: 58.3333%;
    }

    .movil-seis {
        width: 50%;
    }

    .movil-cinco {
        width: 41.6667%;
    }

    .movil-cuatro {
        width: 33.3333%;
    }

    .movil-tres {
        width: 25%;
    }

    .movil-dos {
        width: 16.6667%;
    }

    .movil-uno {
        width: 8.3333%;

    }
}

/* Consulta de medios TABLET vertical */
@media screen and (min-width:768px) {

    /* .principal {
        width: 720px;
    } */

    .tablet-v-doce {
        width: 100%;
    }

    .tablet-v-once {
        width: 91.6667%;
    }

    .tablet-v-diez {
        width: 83.3333%;
    }

    .tablet-v-nueve {
        width: 75%;
    }

    .tablet-v-ocho {
        width: 66.6667%;
    }

    .tablet-v-siete {
        width: 58.3333%;
    }

    .tablet-v-seis {
        width: 50%;
    }

    .tablet-v-cinco {
        width: 41.6667%;
    }

    .tablet-v-cuatro {
        width: 33.3333%;
    }

    .tablet-v-tres {
        width: 25%;
    }

    .tablet-v-dos {
        width: 16.6667%;
    }

    .tablet-v-uno {
        width: 8.3333%;

    }
}

/* Consulta de medios TABLET horizontal */
@media screen and (min-width:992px) {
    /* .principal {
        width: 960px;
    } */

    .tablet-h-doce {
        width: 100%;
    }

    .tablet-h-once {
        width: 91.6667%;
    }

    .tablet-h-diez {
        width: 83.3333%;
    }

    .tablet-h-nuehe {
        width: 75%;
    }

    .tablet-h-ocho {
        width: 66.6667%;
    }

    .tablet-h-siete {
        width: 58.3333%;
    }

    .tablet-h-seis {
        width: 50%;
    }

    .tablet-h-cinco {
        width: 41.6667%;
    }

    .tablet-h-cuatro {
        width: 33.3333%;
    }

    .tablet-h-tres {
        width: 25%;
    }

    .tablet-h-dos {
        width: 16.6667%;
    }

    .tablet-h-uno {
        width: 8.3333%;

    }
}

/* Consulta de medios LAPTOP */
@media screen and (min-width:1200px) {
    /* .principal {
        width: 1140px;
    } */

    .laptop-doce {
        width: 100%;
    }

    .laptop-once {
        width: 91.6667%;
    }

    .laptop-diez {
        width: 83.3333%;
    }

    .laptop-nueve {
        width: 75%;
    }

    .laptop-ocho {
        width: 66.6667%;
    }

    .laptop-siete {
        width: 58.3333%;
    }

    .laptop-seis {
        width: 50%;
    }

    .laptop-cinco {
        width: 41.6667%;
    }

    .laptop-cuatro {
        width: 33.3333%;
    }

    .laptop-tres {
        width: 25%;
    }

    .laptop-dos {
        width: 16.6667%;
    }

    .laptop-uno {
        width: 8.3333%;

    }
}

/* Consulta de medios DESKTOP */
@media screen and (min-width:1400px) {

    /* .principal {
        width: 1200px;
    } */

    .desktop-doce {
        width: 100%;
    }

    .desktop-once {
        width: 91.6667%;
    }

    .desktop-diez {
        width: 83.3333%;
    }

    .desktop-nuehe {
        width: 75%;
    }

    .desktop-ocho {
        width: 66.6667%;
    }

    .desktop-siete {
        width: 58.3333%;
    }

    .desktop-seis {
        width: 50%;
    }

    .desktop-cinco {
        width: 41.6667%;
    }

    .desktop-cuatro {
        width: 33.3333%;
    }

    .desktop-tres {
        width: 25%;
    }

    .desktop-dos {
        width: 16.6667%;
    }

    .desktop-uno {
        width: 8.3333%;

    }
}