*{margin:0;padding:0;box-sizing:border-box}body{display:flex;justify-content:center;align-items:center;height:100vh}.viewer-360-deg{position:relative;width:300px;height:450px;display:flex;flex-direction:column;z-index:1;border-radius:15px;box-shadow:0 0 3px #333}.viewer-360-deg__img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;border-radius:16px;box-shadow:0 5px 20px rgba(50,50,50,0.7)}.viewer-360-deg__img:nth-child(2){opacity:1}.viewer-360-deg__selector{position:absolute;z-index:2;top:0;left:calc( 100% / 6 * var(--i));width:calc( 100% / 6);height:100%}.viewer-360-deg__selector:hover+img{opacity:1}