html{margin:0 auto}body{margin:0;display:flex;place-items:center;color:#fff;font-family:Arial,Helvetica,sans-serif}.slider__wrapper{position:absolute;top:0;left:0;background:blue;display:flex;flex-direction:column;align-items:center;justify-content:space-between;width:100%}.slidecontainer{display:flex;align-items:center;justify-content:space-between;height:50px;z-index:1;width:inherit}.wrapper{position:relative;display:flex;align-items:center;justify-content:center;background:transparent;width:100vw;height:100vh;overflow:hidden;background:black}.sphere{mix-blend-mode:var(--blendMode);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}