.container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 576px) {
    .container {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .container {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}

.container-fluid {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 576px) {
    .container {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .container {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}

.fila,
.fila-2,
.fila-3,
.fila-4,
.fila-5,
.fila-6,
.fila {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

.fila .columna-25 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}

.fila .columna-75 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
}

.columna {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

.fila-2 .columna {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

.fila-3 .columna {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

.fila-4 .columna {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}

.fila-5 .columna {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

.fila-6 .columna {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
}


/* Espacios */

.h-20 {
    height: 20px;
}

.h-30 {
    height: 30px;
}

.h-40 {
    height: 40px;
}

.h-50 {
    height: 50px;
}

.h-60 {
    height: 60px;
}

.h-70 {
    height: 70px;
}

.h-80 {
    height: 80px;
}

.h-100 {
    height: 100px;
}

.vh-20 {
    height: 20vh;
}

.vh-30 {
    height: 30vh;
}

.vh-40 {
    height: 40vh;
}

.vh-50 {
    height: 50vh;
}

.vh-60 {
    height: 60vh;
}

.vh-70 {
    height: 70vh;
}

.vh-80 {
    height: 80vh;
}

.vh-90 {
    height: 90vh;
}

.vh-100 {
    height: 100vh;
}

@media (max-width: 768px) {
    /*     Rejilla de 3 Columnas */
    .fila-3 .columna:nth-child(1),
    .fila-3 .columna:nth-child(2) {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .fila-3 .columna:nth-child(3) {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        margin: auto;
    }
    /*  Regilla de 4 Columnas */
    .fila-4 .columna {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    /*  Regilla de 5 Columnas */
    .fila-5 .columna {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .fila-5 .columna:nth-child(5) {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        margin: auto;
    }
    .fila-6 .columna {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (max-width: 576px) {
    /*     Rejilla de 3 Columnas */
    .fila-3 .columna:nth-child(1),
    .fila-3 .columna:nth-child(2),
    .fila-3 .columna:nth-child(3) {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    /*     Rejilla de 4 Columnas */
    .fila-5 .columna:nth-child(5) {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .fila-2 .columna,
    .fila-4 .columna,
    .fila-5 .columna,
    .fila-6 .columna {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}