﻿.columns, .rows {
    display: flex;
}

    .columns.center, .rows.center {
        align-items: center;
        justify-content: center;
    }

.rows {
    flex-direction: column;
}

.column,
.row {
    flex: 1;
}

.full {
    width: 100%;
    height: 100%;
}

/* _item */
._items {
    padding: .25rem;
}

._bottom-items {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #fff), color-stop(50%, #ececec));
    background: -o-linear-gradient(top, #fff 50%, #ececec 50%);
    background: linear-gradient(to bottom, #fff 50%, #ececec 50%);
    background-size: 100% 100%;
    background-position: bottom top;
    margin-top: 3rem;
}

    ._bottom-items .container {
        padding-left: .25rem;
        padding-right: .25rem;
    }

._item {
    height: 35vh;
    padding: .25rem;
    position: relative;
    cursor: pointer;
}

    ._item a._item-link::after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        content: "";
        background-color: transparent;
    }

    ._item:hover ._text {
        color: #ececec;
        background-color: rgba(10, 127, 177, 0.75);
    }

._big-item {
    height: 70vh;
}

    ._big-item._big-item-vtwo {
        height: 50vh;
    }

._default-item {
    height: 35vh;
}

    ._default-item._default-item-vtwo {
        height: 25vh;
    }

._static-item {
    height: 15rem;
}

._item ._img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    /* simple */
    border-radius: 0.125rem;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
}

._item ._text {
    font-size: 1rem;
    position: absolute;
    left: .25rem;
    bottom: .25rem;
    right: .25rem;
    color: #fff;
    padding: .5rem;
    background-color: rgba(10, 127, 177, 1);
    /* transition */
    transition: all 0.75s;
    border-bottom-right-radius: .125rem;
    border-bottom-left-radius: .125rem;
}

    ._item ._text._big-text {
        padding: 1.5rem;
        background-color: rgba(0,0,0,0.75);
        font-size: 1.5rem;
    }

/* 1440px */
@media (max-width: 1439.98px) {
    ._big-item {
        height: 60vh;
    }

        ._big-item._big-item-vtwo {
            height: 45vh;
        }

    ._default-item {
        height: 30vh;
    }

        ._default-item._default-item-vtwo {
            height: 22.5vh;
        }

    ._static-item {
        height: 12.5rem;
    }
}

/* 1200px */
@media (max-width: 1199.98px) {
    ._big-item {
        height: 50vh;
    }

        ._big-item._big-item-vtwo {
            height: 40vh;
        }

    ._default-item {
        height: 25vh;
    }

        ._default-item._default-item-vtwo {
            height: 20vh;
        }
}

/* 1024px */
@media (max-width: 1023.95px) {
    ._items {
        flex-direction: column;
    }
}

/* 992px */
@media (max-width: 991.98px) {
    ._items {
        padding-bottom: 0;
    }

    ._bottom-items {
        margin-top: 0;
    }

        ._bottom-items .columns {
            flex-wrap: wrap;
        }

        ._bottom-items .column {
            flex-basis: 50%;
        }

        ._bottom-items ._static-item {
            height: 25vh;
        }
}

/* 768px */
@media (max-width: 767.98px) {
}

/* 576px */
@media (max-width: 575.98px) {
    ._big-item {
        height: 40vh;
    }

        ._big-item._big-item-vtwo {
            height: 35vh;
        }

    ._item ._text._big-text {
        padding: 1rem;
        font-size: 1.25rem;
    }

    ._bottom-items .column {
        flex-basis: 100%;
    }

    #top_columns,
    #btm_columns {
        flex-direction: column;
    }
}