@charset "UTF-8";
/*
  Copyright 2023 by 𝓡𝓸𝓬𝓬𝓪𝓷𝓸. All rights reserved. 
  https://roccano.it
*/
body {
  margin: 0;
  overflow: hidden;
  font-family: "Comic Sans MS", "Comic Sans", cursive;
}

main {
  width: 100vw;
  height: 100vh;
  background-image: linear-gradient(rgb(38, 0, 255) 30%, rgb(255, 255, 255));
  overflow: hidden;
}

.marquee-top {
  background-image: radial-gradient(white 0%, cyan 10%, rgb(34, 38, 255) 60%, white 90%);
  color: #fff;
  font-size: 2rem;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  font-weight: 600;
  height: 5%;
  cursor: n-resize;
}
.marquee-top:hover {
  background-image: linear-gradient(white 0%, cyan 10%, rgb(34, 38, 255) 60%, white 90%);
}

.scacchiera1 {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 500%;
  height: 5%;
  background-image: repeating-linear-gradient(white 0%, rgb(58, 58, 58) 20%);
  box-shadow: 6px 12px 50px 10px rgb(255, 200, 230);
  border: 0 solid black;
  z-index: 100;
  transition: all ease-in-out 0.3s;
  cursor: row-resize;
}
.scacchiera1:hover {
  height: 10%;
  transition: all ease-in-out 0.3s;
}

.scacchiera2 {
  position: absolute;
  bottom: 0%;
  right: 0%;
  width: 10%;
  height: 10%;
  background-image: repeating-linear-gradient(white 0%, rgb(58, 58, 58) 20%);
  box-shadow: 6px 12px 50px 10px rgba(83, 83, 83, 0.5);
  border: 0 solid black;
  z-index: 100;
  transition: all ease-in-out 0.3s;
  cursor: row-resize;
}
.scacchiera2:hover {
  height: 20%;
  transition: all ease-in-out 0.3s;
}

.scacchiera3 {
  position: absolute;
  top: 0%;
  right: 0%;
  width: 3%;
  height: 50%;
  background-image: repeating-linear-gradient(90deg, white 0%, rgb(58, 58, 58) 33.3333%);
  box-shadow: 6px 12px 50px 10px rgba(83, 83, 83, 0.5);
  border: 0 solid black;
  z-index: 0;
  transition: all ease-in-out 0.3s;
}
.scacchiera3:hover {
  filter: blur(0px);
  transition: all ease-in-out 0.3s;
}

.scacchiera4 {
  position: absolute;
  bottom: 15%;
  right: 80%;
  width: 15%;
  height: 15%;
  background-image: repeating-radial-gradient(white 40%, rgb(189, 255, 34) 50%);
  box-shadow: 6px 5px 50px 10px rgb(189, 255, 34);
  border: 0 solid black;
  border-radius: 9999%;
  filter: blur(10px);
  z-index: 100;
  transition: all ease-in-out 0.3s;
}
.scacchiera4:hover {
  filter: blur(0px);
  transition: all ease-in-out 0.3s;
}
.scacchiera4.active {
  filter: blur(0px);
  transition: all ease-in-out 0.3s;
}

.finestra1 {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 10%;
  width: 50%;
  background-image: radial-gradient(white 0%, rgb(255, 136, 0) 5%, rgb(251, 255, 34) 60%, black 90%);
  box-shadow: 6px 12px 50px 10px rgba(34, 38, 255, 0.3);
  border: 10px solid white;
  border-radius: 0;
  z-index: 100;
  transition: all ease-in-out 0.3s;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff50abdf", endColorstr="#ff1f78aa", GradientType=0);
  background-repeat: repeat;
  background-size: 100% 50%;
  background-position: 0 -50%;
  cursor: crosshair;
}
.finestra1:hover {
  filter: blur(0px);
  transition: all ease-in-out 0.3s;
  background-image: radial-gradient(white 0%, rgb(255, 0, 85) 5%, rgb(255, 34, 34) 60%, black 90%);
  background-position: 0 0;
  height: 30%;
}
.finestra1.active {
  filter: blur(0px);
  transition: all ease-in-out 0.3s;
}

.luce1 {
  position: absolute;
  top: 5%;
  left: 10%;
  width: 400px;
  height: 600px;
  background-image: radial-gradient(rgb(208, 255, 0), rgba(107, 107, 107, 0) 50%);
  box-shadow: 0;
  border: 0 solid white;
  border-radius: 100%;
  z-index: 1;
  transition: all ease-in-out 0.3s;
  cursor: crosshair;
  -webkit-animation: moveUpAndDown 4s linear infinite;
          animation: moveUpAndDown 4s linear infinite;
}
.luce1:hover {
  filter: blur(50px);
  transition: all ease-in-out 0.3s;
}

.luce2 {
  position: absolute;
  top: 5%;
  right: 10%;
  width: 500px;
  height: 300px;
  background-image: radial-gradient(rgba(0, 255, 106, 0.8), rgba(107, 107, 107, 0) 50%);
  box-shadow: 0;
  border: 0 solid white;
  border-radius: 100%;
  z-index: 1;
  transition: all ease-in-out 0.3s;
  cursor: crosshair;
  -webkit-animation: moveRightAndLeft 4s linear infinite;
          animation: moveRightAndLeft 4s linear infinite;
}
.luce2:hover {
  filter: blur(50px);
  transition: all ease-in-out 0.3s;
}

@-webkit-keyframes moveUpAndDown {
  0% {
    top: 0;
  }
  50% {
    top: 200px;
  }
  100% {
    top: 0;
  }
}

@keyframes moveUpAndDown {
  0% {
    top: 0;
  }
  50% {
    top: 200px;
  }
  100% {
    top: 0;
  }
}
@-webkit-keyframes moveRightAndLeft {
  0% {
    right: 0;
  }
  60% {
    right: 5%;
  }
  100% {
    right: 0;
  }
}
@keyframes moveRightAndLeft {
  0% {
    right: 0;
  }
  60% {
    right: 5%;
  }
  100% {
    right: 0;
  }
}/*# sourceMappingURL=style.css.map */