:root{
	
	/*--coin-anim-speed:4s;*/
	--coin-anim-speed:5s;
	
	/*--gold-color1:#bba53d;*/
	/*--gold-color1:#DBAC34;*/
	/*--gold-color1:#f4e58e;*/
	/*--gold-color1:#b39d5f;*/
	/*--gold-color1:#897039;*/
	/*--gold-color1:#dacd7c;*/
	/*--gold-color1:#c6b862;*/
	/*--gold-color1:#ffcd03;*/
	/*--gold-color1:#5a4d16;*/
	/*--gold-color1:#f3d93b;*/
	/*--gold-color1:#f1d972;*/
	/*--gold-color1:#76661e;*/
	--gold-color1:#ffe15b;
	/*5a5336*/
	
	/*--gold-color2:#aa7f2e;*/
	/*--gold-color2:#bba53d;*/
	/*--gold-color2:#876b2f;*/
	/*--gold-color2:#897039;*/
	/*--gold-color2:#c6b862;*/
	/*--gold-color2:#625b2e;*/
	--gold-color2:var(--gold-color1);

}

.dark-mode{
	--gold-color1:#f9d64b;
	--gold-color2:var(--gold-color1);
}

.coin {
  font-size:13px;
  width: 5px;
  height: 26px;
  /*background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E5ODgwNSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzE0MTAwMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');*/
  background: var(--gold-color1);
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, var(--gold-color1)), color-stop(100%, var(--gold-color2)));
  background: -moz-linear-gradient(var(--gold-color1), var(--gold-color2));
  background: -webkit-linear-gradient(var(--gold-color1), var(--gold-color2));
  background: linear-gradient(var(--gold-color1), var(--gold-color2));
  margin: auto;
  position: absolute;
  /*top: 0;*/
  /*left: 0;*/
  /*right: 0;*/
  /*bottom: 0;*/
  display:flex;
  align-items:center;
  justify-content:center;
  transform: rotateY(90deg);
  
  
  -moz-transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;

}
.coin.animated{

/*backface-visibility: hidden;*/
/*-webkit-backface-visibility: hidden;  */

/*perspective: 1000px;*/
/*-webkit-perspective: 1000px; */
 
  /*transform: rotateY(0deg);*/
  -webkit-animation: rotate var(--coin-anim-speed) infinite linear;
  -moz-animation: rotate var(--coin-anim-speed) infinite linear;
  animation: rotate var(--coin-anim-speed) infinite linear;
}

.side-bg {
	
	position:absolute;
	width:26px;
	height:26px;
	
	/*display:none;*/
	
}
.side-bg svg{
	width:100%;
	height:100%;
}

.side-content {
	position:absolute;
	width:26px;
	/*height:26px;*/
	line-height:26px;
	z-index:2;
	display:flex;
	align-items:center;
	justify-content:center;
}


.heads .side-content {
width: 26px;
height: 26px;
top:0px;

}
.tails .side-content {
width: 26px;
height: 26px;
top:1px;
font-style:italic;
}

.coin .side, 
.coin:before, 
.coin:after {
  content: "";
  position: absolute;
  width: 26px;
  height: 26px;
  overflow: hidden;
  background: #DAB007;
  border-radius: 50%;
  /*right: -0.4em;*/
  right: -8px;
  text-align: center;
  line-height:28px;
  color: #d0a807;
  /*text-shadow: 1px 2px 0 #fbe27f, -1px -2px 0 #463802;*/
  /*text-shadow: 0.5px 1px 0 #fbe27f, -0.5px -1px 0 #463802;*/
  text-shadow: 0.5px 1px 0 var(--gold-color2), -0.5px -1px 0 var(--gold-color2);
  -moz-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  -webkit-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
  -moz-backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.coin .tails, 
.coin:after {
  /*left: -0.4em;*/
  left:-8px;
  -moz-transform: rotateY(90deg);
  -ms-transform: rotateY(90deg);
  -webkit-transform: rotateY(90deg);
  transform: rotateY(90deg);
}


.coin:before, 
.coin:after {
	/*a98805*/
	/*141001*/
  /*background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E5ODgwNSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzE0MTAwMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');*/
  background: var(--gold-color1);
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, var(--gold-color1)), color-stop(100%, var(--gold-color2)));
  background: -moz-linear-gradient(var(--gold-color1), var(--gold-color2));
  background: -webkit-linear-gradient(var(--gold-color1), var(--gold-color2));
  background: linear-gradient(var(--gold-color1), var(--gold-color2));
  -moz-backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-transform: rotateY(90deg);
  -ms-transform: rotateY(90deg);
  -webkit-transform: rotateY(90deg);
  transform: rotateY(90deg);
}
.coin:after {
  -moz-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  -webkit-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
}

@-webkit-keyframes rotate {
  0%{
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  	
  }	
  25%{
    -moz-transform: rotateY(90deg);
    -ms-transform: rotateY(90deg);
    -webkit-transform: rotateY(90deg);
    transform: rotateY(90deg);
  	
  }
  50%{
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
  	
  }  
  75%{
    -moz-transform: rotateY(270deg);
    -ms-transform: rotateY(270deg);
    -webkit-transform: rotateY(270deg);
    transform: rotateY(270deg);
  	
  }
  100% {
    -moz-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}
/*@-moz-keyframes rotate {*/
/*  100% {*/
/*    -moz-transform: rotateY(360deg);*/
/*    -ms-transform: rotateY(360deg);*/
/*    -webkit-transform: rotateY(360deg);*/
/*    transform: rotateY(360deg);*/
/*  }*/
/*}*/
@keyframes rotate {
  0%{
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  	
  }	
  25%{
    -moz-transform: rotateY(90deg);
    -ms-transform: rotateY(90deg);
    -webkit-transform: rotateY(90deg);
    transform: rotateY(90deg);
  	
  }
  50%{
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
  	
  }  
  75%{
    -moz-transform: rotateY(270deg);
    -ms-transform: rotateY(270deg);
    -webkit-transform: rotateY(270deg);
    transform: rotateY(270deg);
  	
  }
  100% {
    -moz-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}

    /*@keyframes slideIn {*/
    /*  0% {*/
    /*    opacity: 0;*/
    /*    transform: translate(-50%, -50%) scale(0.5);*/
    /*  }*/
    /*  100% {*/
    /*    opacity: 1;*/
    /*    transform: translate(0, 0) scale(1);*/
    /*  }*/
    /*}*/