/**
 *  apps
 *
 *
 *
 */

 .apps {
    &__item {
        display: flex;
        flex-flow: column;
        justify-content: space-between;

        border: 1px solid var(--border);

        // background image default
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 50%;

        height: 450px;

        transition: transform 0.25s, box-shadow 0.5s;

        &:hover {
            cursor: pointer;
            transform: scale(1.05);
            box-shadow: 10px 10px 0 rgb(228, 228, 228);
        }

        &-panel {
            background-color: rgba(255, 255, 255, 0.45);

            h3 {
                font-size: 1.2rem;
            }
        }
    }
}