html
{
        scroll-behavior: smooth;
}

body {
  padding: 0;
  margin: 0;
}

.holder {
  width: 600px;
  height: 600px;
  background: url(img/bg.jpg) top center no-repeat;
  position: relative;
  text-align: left;
  box-shadow: 0px 0px 25px #dfdfdf;
  margin: 0 auto;
  overflow: hidden;
}

.logo {
  margin-left: 85px;
  margin-top: 25px;
  margin-bottom: 20px;
}

.wheel-holder {
  position: relative;
  width: 300px;
  margin-left: -14px;
}

.wheel {
  position: absolute;
  margin-top: 45px;
  margin-left: 30px;
}

.glow {
  position: absolute;
  margin-top: -236px;
  margin-left: -243px;
}

.wheel_frame {position: absolute;}

.icons {
  position: relative;
  margin-top: 360px;
  margin-left: 25px;
  width: 250px;
}

.text {
  position: absolute;
  right: -1px;
  top: 0;
}

.games {
  position: absolute;
  margin-top: 315px;
  margin-left: 59px;
}

.coins {position: absolute;}

.gold {
  margin-left: 220px;
  z-index: 9;
  margin-top: 60px;
  transform: translatey(0px);
	animation: float 6s ease-in-out infinite;
}

.silver {
  margin-left: 20px;
  margin-top: -10px;
  transform: translatey(0px);
	animation: float 9s ease-in-out infinite;
}

.bronze {
  margin-left: 55px;
  margin-top: 246px;
  transform: translatey(0px);
	animation: float2 7s ease-in-out infinite;
}


.floating {  
  animation-name: floating;
  animation-duration: 5s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

@keyframes floating {
  from { transform: translate(0,  0px) rotate(0deg); }
  65%  { transform: translate(0, 15px) rotate(-15deg); }
  to   { transform: translate(0, -0px) rotate(0deg); }    
}


@keyframes float {
	0% {

		transform: translatey(0px) rotate(0deg);
	}
	50% {

		transform: translatey(-20px) rotate(15deg);
	}
	100% {

		transform: translatey(0px) rotate(0deg);
	}
}


@keyframes float2 {
	0% {

		transform: translatey(0px) rotate(0deg);
	}
	50% {

		transform: translatey(20px) rotate(-15deg);
	}
	100% {

		transform: translatey(0px) rotate(0deg);
	}
}



@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.rotating {
  -webkit-animation: rotating 6s linear infinite;
  -moz-animation: rotating 6s linear infinite;
  -ms-animation: rotating 6s linear infinite;
  -o-animation: rotating 6s linear infinite;
  animation: rotating 6s linear infinite;
}