@font-face {
	font-family: "mvboli";
	src:  url(./mvboli.ttf) format("truetype");
}


.noselect {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
		-webkit-tap-highlight-color: transparent;
}



.button2 {
  /* width: 20em; */
  /* height: 50px; */
  cursor: pointer;
  /* font-size: 20px; */
  font-family: 'mvboli', 'Staatliches', cursive;
  /* letter-spacing: 5px; */
  background: #fff3cf;
	
  border: 4px solid whitesmoke;
	color: #206A8C;
	box-shadow: 7px 10px 25px #fa9d94;
  transition: 500ms;
  border-radius: 50%;;
	padding: 0.8em 1em;
	margin: 1.2em;
	
}

.button-play {
  /* width: 20em; */
  /* height: 50px; */
  cursor: pointer;
  /* font-size: 20px; */
  font-family: 'Staatliches', cursive;
  /* letter-spacing: 5px; */
  background: #5aefef;
  border: 2px solid whitesmoke;
  /* box-shadow: 10px 5px 5px rgb(7, 7, 7); */
  transition: 500ms;
  border-radius: 30px;
	padding: 0.5em 1em;
	
}
.button-play:hover {
	transform: translateY(-5px);
	box-shadow: 0px 10px 10px rgba(0,0,0,0.4);
}
.button-play:hover:after {
	background: white;
	box-shadow: 0px 0px 20px #ffc421, 0px 0px 30px #ffc421, inset 0px 0px 10px #ffc421;
	animation: spin 1s infinite linear;
}
.button-play:focus {
	outline: none;
}



/* .button2:after {
	content: '';
	position: absolute;
	transform: translateX(-55px) translateY(-40px);
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background: transparent;
	box-shadow: 0px 0px 50px transparent;
	transition: 500ms;
} */

.button2:hover {
	transform: translateY(-5px);
	box-shadow: 0px 10px 10px rgba(0,0,0,0.4);
}

.button2:hover:after {
	background: white;
	box-shadow: 0px 0px 20px #ffc421, 0px 0px 30px #ffc421, inset 0px 0px 10px #ffc421;
	animation: spin 1s infinite linear;
}

@keyframes spin{
	25%{transform: translateX(-25px) translateY(-35px);
			width: 15px;
			height: 15px;}
	50% {transform: translateX(-55px) translateY(-30px);
			width: 5px;
			height: 5px;}
	75% {transform: translateX(-85px) translateY(-35px);
			width: 15px;
			height: 15px;}
}

.button2:focus {
	outline: none;
}