body {
 background: url('bg.png');
 height: 100vh;
 color: #2dbb31;
 text-shadow: -3px 2px #3f8524, 3px -2px #68dc3f;
 font-size: 24px;
}

.info {
 float: right;
 background: url('bg2.png');
 border: 12px solid #a6846e;
 border-radius: 36px;
 font-family: lean;
 width: 50%;
}

@font-face {
 font-family: lean;
 src: url(/fonts/Leander.ttf);
}

.CD {
  position: absolute;
  bottom: 25px;
  left: 25px;
  width: 20%;
  background: none;
  padding-top: 20%;
  transition: transform 0.2s cubic-bezier(0.175, 0.985, 0.32, 1.275);
  transform: scale(1);
  overflow: hidden;
  border: none;
}

.spinner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  animation: spin 30s linear infinite;
  will-change: transform;
  transform-origin: center center;
}

.spinner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.CD.clicked {
  transform: scale(1.10);
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

a {
 color: #e27db1; 
}