/* xl - DESKTOP STYLES */ 
.header{ position:absolute; top:20px; left:0; z-index:9999; }

.diamondAnimation {
  position: relative;
  font-size: 18px;
text-align:center;
}
.diamondAnimation h2 span{ color:#C19F5F; }

/* rotating square */
.diamondAnimation::before {
  content: "";
  position: absolute;
  left: 36%;
  top: 50%;
  width: 270px;
  height: 270px;
  border: #C19F5F 1px solid; /* change color */
  transform: translateY(-50%);
  animation: rotateSquare 16s linear infinite;
}

/* animation */
@keyframes rotateSquare {
  from {
    transform: translateY(-50%) rotate(0deg);
  }
  to {
    transform: translateY(-50%) rotate(360deg);
  }
	.imageBox {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.imageBox::before {
  content: "";
  position: absolute;

  left: 50%;
  top: 50%;

  width: 270px;
  height: 270px;

  background: url('/wp-content/uploads/2026/04/dots.png') no-repeat center;
  background-size: contain;

  transform: translate(-50%, -50%);
  animation: rotateDots 12s linear infinite;

  z-index: 1;
}

/* keep image above if needed */
.imageBox img {
  position: relative;
  z-index: 2;
}
	
	

/* rotation */
@keyframes rotateDots {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
	

	
	
	
	
	
	
	
	
	
}
}