* {
    margin: 0;
    padding: 0;
}

.container {
    width: 100vw;
    height: 100vh;
    display: flex;
}

.red {
    background: rgba(255, 0, 0, 0.5);
    width: 50vw;
    height: 100vh;
}

.blue {
    background: rgba(0, 0, 255, 0.5);
    width: 50vw;
    height: 100vh;
}

.block {
    width: 12vw;
    height: 12vw;
    position: absolute;
    display: block;
    z-index: 2;
    border-radius: 10%;
    transition: box-shadow 0.3s ease-in-out;
}

.bl-red {
    background: red;
}

.bl-blue {
    background: blue;
}

.block:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    z-index: 3;
}