*{
    margin: 0; padding: 0;
}

body{
    width: 100%;
    height: 100vh;
    background: repeating-linear-gradient(0deg,#fff 0%, #fff 50%, #000 50%, #000 100%),
    repeating-linear-gradient(0 deg,#fff 0%, #fff 50%, #000 50%, #000 100%);
    background-size: 30px 30px;
    background-blend-mode: difference;
    overflow: hidden;
}

h1{
    justify-content: center;
    text-align: center;
}

span{
    display: block;
    position: absolute;
    width: 150px;
    height: 150px;
    background: url(./taza-js.png);
    background-size: cover;
    background-attachment: fixed;
    pointer-events: none;
    border-radius: 50%;
}