body {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.menu {
    position: relative;
    width: 100vw;
    height: 100vh;
    margin: 0 auto;
    overflow: hidden;
    &:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 2;
        margin: auto;
        width: 1px;
        height: 100%;
        background-color: #fff;
    }

    .menu-item {
        position: absolute;
        z-index: 1;
        top: 0;
        width: 50%;
        height: 100%;
        box-sizing: border-box;
        overflow: hidden;
        &:hover {
            .menu-item__bg {
                transform: scale3d(1.3, 1.3, 1);
            }
        }

        .menu-item__bg {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
            transition: transform 0.35s;
        }
    }

    .menu-item-left {
        left: 0;
        .menu-item__bg {
            background-image: url("../images/Yadviga-gC_b9_G.jpeg");
        }
    }
    .menu-item-right {
        right: 0;
        .menu-item__bg {
            background-image: url("../images/Hina-Pumpkin-h7uV0wH.jpg");
        }
    }
    .menu-item-bottom {
        z-index: 3;
        top: 61%;
        left: 0;
        right: 0;
        margin: auto;
        width: auto;
        height: auto;
        padding-top: 100%;
        border: 1px solid #fff;
        overflow: hidden;
        background-color: #fff;
        transform: rotate(45deg);

        &:hover {
            .menu-item__bg {
                transform: rotate(-45deg) scale3d(1.3, 1.3, 1);
            }
        }
        .menu-item__bg {
            top: -25%;
            right: -25%;
            bottom: -25%;
            left: -25%;
            background-image: url("../images/Hina-u4Q2D8O.jpg");
            transform: rotate(-45deg);
        }
    }
}

h1 {
    font-size: 2em;
}

.text-center {
    text-align: center;
}
.text-white {
    color: #fff;
}
