@font-face {
	font-family: "Warnes";
	font-style: normal;
	font-weight: 400;
	src: local("Warnes"), local("Warnes-Regular"), url("IeM26aZh6wEmm42pWGUMfg.woff2") format("woff2");
}
@font-face {
	font-family: "happymonkey";
	src:url("../../../../../fonts/HappyMonkey-Regular.ttf");
}

.place_value {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	font-size: 1.3em;
	background: #fff;
	box-shadow: inset 0 0 30px #f2f2f2;
}

.place_value, .place_value * {
	position: relative;
	margin: 0;
}

.place_value .nextBtn {
	display: none;
	position: absolute;
	bottom: 0%;
	right: 0%;
	width: 7%;
	height: 10%;
}

.place_value .prevBtn {
	display: none;
	position: absolute;
	bottom: 0%;
	left: 0%;
	width: 7%;
	height: 10%;
}

/*=====================================
 =            common styles            =
 =====================================*/
.board {
	position: relative;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	text-align: center;
}

.vertical-horizontal-center {
	position: relative;
	top: 45%;
	left: 50%;
	transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	text-align: center;
}

.vertical-center {
	position: relative;
	top: 45%;
	transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	text-align: center;
}

.coverboardfull {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*=====  End of common styles  ======*/

/*===============================================
 =            general template layout            =
 ===============================================*/

div.generalTemplateblock {
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	/*border   : 1px solid red; */
}
/*-------------- For Loading ---------------*/

#loading-wrapper {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-color: #222;
}

#loading-text {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	color: #999;
	text-align: center;
	transform: translate(-50%, -50%);
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 3vmin;
}

#loading-content {
	display: block;
	position: absolute;
	left: 40%;
	top: 33.35%;
	width: 20%;
	height: 33.3%;
	transform: translate(-50%, -50%);
	border: 3px solid #F00;
}

#loading-content:after {
	content: "";
	position: absolute;
	border: 3px solid #0F0;
	left: 15%;
	right: 15%;
	top: 15%;
	bottom: 15%;
}

#loading-content:before {
	content: "";
	position: absolute;
	border: 3px solid #00F;
	left: 5%;
	right: 5%;
	top: 5%;
	bottom: 5%;
}

#loading-content {
	border: 3px solid transparent;
	border-top-color: #4D658D;
	border-bottom-color: #4D658D;
	border-radius: 50%;
	-webkit-animation: loader 2s linear infinite;
	-moz-animation: loader 2s linear infinite;
	-o-animation: loader 2s linear infinite;
	animation: loader 2s linear infinite;
}

#loading-content:before {
	border: 3px solid transparent;
	border-top-color: #D4CC6A;
	border-bottom-color: #D4CC6A;
	border-radius: 50%;
	-webkit-animation: loader 3s linear infinite;
	-moz-animation: loader 2s linear infinite;
	-o-animation: loader 2s linear infinite;
	animation: loader 3s linear infinite;
}

#loading-content:after {
	border: 3px solid transparent;
	border-top-color: #84417C;
	border-bottom-color: #84417C;
	border-radius: 50%;
	-webkit-animation: loader 1.5s linear infinite;
	animation: loader 1.5s linear infinite;
	-moz-animation: loader 2s linear infinite;
	-o-animation: loader 2s linear infinite;
}

@-webkit-keyframes loaders {
	0% {
		-webkit-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
/*===================================
 =            HeaderBlock            =
 ===================================*/

div.headerblock {
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 10%;
	/*border   : 1px solid red;*/
}

div.headerblock p.headertextstyle {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	padding: 1% 2%;
	font-size: 1.3em;
	font-weight: bold;
	color: rgb(238, 110, 115);
	background-color: rgb(252, 252, 252);
	text-align: center;
}

div.generalTemplateblock[data-templatecontains='hasheaderblock'] div.headerblock {
	height: 13%;
}

div.generalTemplateblock[data-templatecontains='hasheaderblock'] div.headerblock p.headertextstyle {
	padding: 2%;
}

/*=====  End of HeaderBlock  ======*/

/*====================================
 =            ContentBlock            =
 ====================================*/

div.generalTemplateblock div.contentblock {
	position: absolute;
	width: 100%;
	padding: 1%;
	/*border   : 1px solid blue;*/
}

div.generalTemplateblock[data-templatecontains='hasheaderblock'] div.contentblock {
	top: 13%;
	height: 87%;
}

div.generalTemplateblock[data-templatecontains='hasonlycontent'] div.contentblock {
	top: 0%;
	height: 100%;
}

/*=====  End of ContentBlock  ======*/

/*==================================
 =            Text Block            =
 ==================================*/

div.textblock {
	position: relative;
	margin-top: 1%;
	/*border   : 1px solid green; */
}

/*=====  End of Text Block  ======*/

/*===================================
 =            Image Block            =
 ===================================*/

div.imageblock {
	position: absolute;
	margin-top: 2%;
	margin-bottom: 2%;
	width: 100%;
	height: 100%;
	/*border     : 1px solid green; */
}

img.singleimgstyle {
	display: table;
	margin: 0 auto;
	position: relative;
	padding: 1%;
	width: 40%;
}

div.imageblock label {
	position: absolute;
	right: 59%;
	left: 10%;
	text-align: right;
}

/*=====  End of Image Block  ======*/

/*============================================
 =            Definition layout               =
 ============================================*/
div.definitionblock > img {
	position: relative;
	width: 50%;
	left: -20%;
}

div.definitionblock > figcaption {
	position: relative;
	margin-top: -8%;
	left: -21%;
	font-size: 2em;
	color: rgb(201, 136, 116);
}

div.definitionblock > p.definitiontextstyle {
	position: relative;
	text-align: left;
	margin-top: 15%;
	font-size: 1.5em;
	padding: 0% 2%;
	/* border  : 1px solid red; */
}

/*=====  End of Definition layout  ======*/

/*=====  End of general template layout  ======*/

/*====================================
 =            Digit Block            =
 ====================================*/
div.digitblock {
    position: relative;
    width: 100%;
    height: 100%;
    top: -23%;
    left: 2%;
}
div.digitblock1 {
    position: relative;
    width: 100%;
    height: 100%;
    top: -5%;
    left: 2%;
}
div.contentblock  input {
	z-index: 200;
	position: absolute;
	text-align: center;
	width: 8%;
	height: 10%;
	resize: none;
	border: 4px solid #fff;
}

div.digitblock > p {
    position: absolute;
    text-align: center;
    margin-top: 1%;
    width: 8%;
    font-size: 3vmin;
/*    padding: 0.1% 0.4% 0.1% 0.4%;
*/    resize: none;
}

div.digitblock > button {
	position: absolute;
	text-align: center;
	width: 15%;
	height: 10%;
	box-shadow: none;
	/*padding: 0.4% 2% 0.4% 2%;*/
}
.ones-box1 {
    background: #0EB8B4;
    border-radius: 2vmin;
    top: 47%;
    left: 21%;
    font-size: 4vmin;
    border: none;
    color: white;
}

.tens-box1 {
    background: #0EB8B4;
    border-radius: 2vmin;
    top: 47%;
    left: 12.5%;
    font-size: 4vmin;
    border: none;
    color: white;
}
.hundreds-box1 {
	background: #0EB8B4;
	border-radius: 2vmin;
	top: 47%;
	left: 4%;
	font-size: 4vmin;
	border: none;
    color: white;
}
.ones-box {
	border-radius: 2vmin;
	top: 47%;
	left: 21%;
	font-size: 4vmin;
	border: 4px solid #666666 !important;
  background: #FEFAC5;
}

.tens-box {
	border-radius: 2vmin;
	top: 47%;
	left: 12.5%;
	font-size: 4vmin;
	border: 4px solid #666666 !important;
  background: #FEFAC5;

}
.hundreds-box {
    border-radius: 2vmin;
    top: 47%;
    left: 4%;
    font-size: 4vmin;
		border: 4px solid #666666 !important;
    background: #FEFAC5;
}

.ones-label-box {
	position: absolute;
	text-align: center;
	margin-top: 1%;
	width: 8%;
	font-size: 4vmin;
	padding: 0.1% 0.4% 0.1% 0.4%;
	resize: none;
	font-size: 3vmin;
	top: 57%;
	left: 21%;
	color: #7B74D4;
	font-size: 3vmin;
	font-family: sniglet;
}

.tens-label-box {
    position: absolute;
	text-align: center;
	margin-top: 1%;
	width: 8%;
	font-size: 4vmin;
	padding: 0.1% 0.4% 0.1% 0.4%;
	resize: none;
	font-size: 3vmin;
  top: 57%;
  left: 12.5%;
	color: #7B74D4;
	font-size: 3vmin;
	font-family: sniglet;
}

.hundreds-label-box {
	position: absolute;
	text-align: center;
	margin-top: 1%;
	width: 11%;
	font-size: 4vmin;
	padding: 0.1% 0.4% 0.1% 0.4%;
	resize: none;
	top: 57%;
	left: 1%;
	color: #7B74D4;
	font-size: 3vmin;
	font-family: sniglet;
}

.check-button {
	z-index: 200;
	position: absolute;
	position: absolute;
	text-align: center;
	width: 15%;
	height: 10%;
	box-shadow: none;
	color: #FFF;
	background: #6FA8DC;
	border-radius: 2vmin;
	border: 2px solid #ddd;
	font-size: 4vmin;
	top: 47%;
	left: 30%;
}

.check-button-bottom {
	z-index: 200;
	position: absolute;
	position: absolute;
	text-align: center;
	width: 15%;
	height: 10%;
	box-shadow: none;
	color: #FFF;
	background: #3c78d8;
	border-radius: 2vmin;
	border: 4px solid #1155cc;
	font-size: 4vmin;
	top: 67%;
	left: 9%;
}

.check-button:hover, .check-button-bottom:hover {
	background: #8FCAFE;
}
/*=====  End of Digit Block  ======*/

/*====================================
 =           Big Table Block         =
 ====================================*/

div.bigtableblock {
	position: absolute;
	top: 3%;
	width: 100%;
	height: 100%;
	left: 0;
	float: right;
}

.ones-table {
	position: absolute;
	background: #6FA8DC;
	left: 1%;
	width: 28%;
	height: 90%;
	border-radius: 2vmin;
	-webkit-box-shadow: 0 0 2px #aaa;
	box-shadow: 0 0 2px #aaa;
}

.ones-table > th, td {
	text-align: center;
	font-size: 3vmin;
	color: white;
	width: 50%
}

.tens-table {
	position: absolute;
	left: 31%;
	width: 33%;
	height: 90%;
	background: #93C47D;
	border-radius: 2vmin;
	-webkit-box-shadow: 0 0 2px #aaa;
	box-shadow: 0 0 2px #aaa;
}

.tens-table > th, td {
	text-align: center;
	font-size: 3vmin;
	color: white;
	width: 50%
}

.twentys-table {
	position: absolute;
	background: #E06666;
	left: 66%;
	width: 33%;
	height: 80%;
	border-radius: 2vmin;
	-webkit-box-shadow: 0 0 2px #aaa;
	box-shadow: 0 0 2px #aaa;
}

.twentys-table > th, td {
	text-align: center;
	font-size: 3vmin;
	color: white;
	width: 50%
}

/*=====  End of Big Table Block  ======*/

/*=====  End of Table Block  ======*/

/*====================================
 =            Custom Style            =
 ====================================*/
.lesson-title {
	color: #FF6A65;
	font-size: 5em;
}

.sidepara {
	float: left;
	margin-top: 3%;
	text-align: left;
	padding: 3%;
	width: 60%;
	color: #333;
	z-index: 10;
}

.sidepara > p {
    margin-top: 1%;
    text-align: left;
	padding: 2%;
    color: #595959;
    font-family: happymonkey;
}

.baseblock {
	float: left;
	margin-top: 3%;
	text-align: left;
	padding: 3%;
	width: 30%;
	color: #333;
}

.baseblock > p {
	margin-top: 1%;
	text-align: left;
	font-size: 3vmin;
	padding: 3%;
	color: #595959;
}

.check-answer {
    position: absolute;
    bottom: 3%;
    left: 11%;
    font-size: 5vmin;
}

.incorrect-answer {
	display: none;
}

.correct-answer {
	display: none;
}

.not-visible {
	display: none;
}

.sideimage {
	position: absolute;
	height: 79%;
	margin-top: 8%;
	right: 3%;
}

.label-transition {
	position: absolute;
	width: 100%;
	height: 100%;
	color: "#333";
}

.ones-transition {
	display: none;
	font-size: 3vmin;
	position: absolute;
	right: 34.5%;
	top: 13%;
}

.ones-transitionv {
	position: absolute;
	font-size: 3vmin;
	right: 34.5%;
	top: 13%;
}


.tens-transition {
	display: none;
	font-size: 3vmin;
	position: absolute;
	right: 34.5%;
	top: 43%;
}
.tens-transitionv {
	position: absolute;
	font-size: 3vmin;
	right: 34.5%;
	top: 43%;
}

.hundreds-transition {
	display: none;
	font-size: 3vmin;
	position: absolute;
	right: 32%;
	top: 78%;
}

.invisible {
	display: none;
}

.transition-arrow01 {
	display: none;
	width:10%;
	position: absolute;
	right: 19%;
	top: 10%;
}

.transition-arrow02 {
	display: none;
	width:10%;
	position: absolute;
	right: 44%;
	top: 10%;
}
.transition-arrow01v {
	position: absolute;
	width:10%;
	right: 19%;
	top: 10%;
}

.transition-arrow02v {
	position: absolute;
	width:10%;
	right: 44%;
	top: 10%;
}

.transition-arrow03 {
	display: none;
	width:10%;
	position: absolute;
	right: 19%;
	top: 40%;
}

.transition-arrow04 {
	display: none;
	width:10%;
	position: absolute;
	right: 44%;
	top: 40%;
}
.transition-arrow03v {
	position: absolute;
	width:10%;
	right: 19%;
	top: 40%;
}

.transition-arrow04v {
	position: absolute;
	width:10%;
	right: 44%;
	top: 40%;
}
.transition-arrow05 {
	display: none;
	width:10%;
	position: absolute;
	right: 19%;
	top: 75%;
}

.transition-arrow06 {
	display: none;
	width:10%;
	position: absolute;
	right: 44%;
	top: 75%;
}

.transitionapple {
	position: absolute;
	width:8%;
	right: 60%;
	height 10%;
	top: 7%;
}

.transitionbox {
	position: absolute;
	height 3%;
	right: 7%;
	top: 9%;
	height:10%;
}

.transitionbasket {
	position: absolute;
	height: 10%;
	right: 56%;
	top: 38%;
}

.transitionblock10 {
	position: absolute;
	right: 7%;
	height: 20%;
	top: 32%;
}

.transitiondrum {
	position: absolute;
	height: 30%;
	right: 58%;
	top: 58%;
}

.transitionblock100 {
	position: absolute;
	right: 1%;
	height: 10%;
	top: 70%;
}

.apple-fade {
	animation: apple-right 2s linear;
	-webkit-animation: apple-right 2s linear;
}

.drum-fade {
	animation: drum-right 2s linear;
	-webkit-animation: drum-right 2s linear;
}

.block-fade {
	animation: block1-right 2s linear;
	-webkit-animation: block1-right 2s linear;
}

.block10-fade {
	animation: block10-right 2s linear;
	-webkit-animation: block10-right 2s linear;
}

.block100-fade {
	animation: block100-right 2s linear;
	-webkit-animation: block100-right 2s linear;
}

/* Animations with fades */
@-webkit-keyframes
apple-right {
0%   {right: 60%; opacity:1; height:14%;}
50% {right: 30%; opacity:0; height:8%;}
100% {right: 7%; opacity:0; height:8%;}
}
@keyframes
apple-right {
0%   {right: 60%; opacity:1; height:14%;}
50% {right: 30%; opacity:0; height:8%;}
100% {right: 30%; opacity:0; height:8%;}
}

@-webkit-keyframes
drum-right {
0%   {right: 60%; opacity:1; height:35%;}
50% {right: 30%; opacity:0; height:25%;}
100% {right: 7%; opacity:0; height:25%;}
}
@keyframes
drum-right {
0%   {right: 60%; opacity:1; height:35%;}
50% {right: 30%; opacity:0; height:25%;}
100% {right: 7%; opacity:0; height:25%;}
}

@-webkit-keyframes
block1-right {
0%   {right: 60%; opacity:0; height: 7%;}
50%  {right: 30%; opacity:0; height: 7%;}
100% {right: 7%; opacity:1; height: 10%;}
}
@keyframes
block1-right {
0%   {right: 60%; opacity:0; height: 7%;}
50%  {right: 30%; opacity:0; height: 7%;}
100% {right: 7%; opacity:1; height: 10%;}
}

@-webkit-keyframes
block10-right {
0%   {right: 60%; opacity:0; height: 15%;}
50%  {right: 30%; opacity:0; height: 15%;}
100% {right: 7%; opacity:1; height: 20%;}
}
@keyframes
block10-right {
0%   {right: 60%; opacity:0; height: 15%;}
50%  {right: 30%; opacity:0; height: 15%;}
100% {right: 7%; opacity:1; height: 20%;}
}

@-webkit-keyframes
block100-right {
0%   {right: 60%; opacity:0; height: 10%;}
50%  {right: 30%; opacity:0; height: 10%;}
100% {right: 7%; opacity:1; height: 15%;}
}
@keyframes
block100-right {
0%   {right: 60%; opacity:0; height: 10%;}
50%  {right: 30%; opacity:0; height: 10%;}
100% {right: 7%; opacity:1; height: 15%;}
}

/*====================================
 =        Block100 Positions         =
 ====================================*/

.block100-08{
	display: none;
	position: absolute;
	height: 14%;
	right: 16%;
	top: 4%;
}
.block100-07{
	display: none;
	position: absolute;
	height: 14%;
	right: 10%;
	top: 9%;
}
.block100-06{
	display: none;
	position: absolute;
	height: 14%;
	right: 16%;
	top: 14%;
}
.block100-05{
	display: none;
	position: absolute;
	height: 14%;
	right: 10%;
	top: 19%;
}
.block100-04{
	display: none;
	position: absolute;
	height: 14%;
	right: 16%;
	top: 24%;
}
.block100-03{
	display: none;
	position: absolute;
	height: 14%;
	right: 10%;
	top: 29%;
}
.block100-02{
	display: none;
	position: absolute;
	height: 14%;
	right: 16%;
	top: 34%;
}
.block100-01{
	display: none;
	position: absolute;
	height: 14%;
	right: 10%;
	top: 39%;
}
.block100-00{
	display: none;
	position: absolute;
	height: 14%;
	right: 16%;
	top: 44%;
}

/*=====  End of Block100 Block  ======*/

/*====================================
 =        Block10 Positions         =
 ====================================*/

.block10-08{
	display: none;
	position: absolute;
	height: 30%;
	right: 18%;
	bottom: 4%;
}
.block10-07{
	display: none;
	position: absolute;
	height: 30%;
	right: 22%;
	bottom: 5%;
}
.block10-06{
	display: none;
	position: absolute;
	height: 30%;
	right: 26%;
	bottom: 4%;
}
.block10-05{
	display: none;
	position: absolute;
	height: 30%;
	right: 30%;
	bottom: 5%;
}
.block10-04{
	display: none;
	position: absolute;
	height: 30%;
	right: 34%;
	bottom: 4%;
}
.block10-03{
	display: none;
	position: absolute;
	height: 30%;
	right: 38%;
	bottom: 5%;
}
.block10-02{
	display: none;
	position: absolute;
	height: 30%;
	right: 42%;
	bottom: 4%;
}
.block10-01{
	display: none;
	position: absolute;
	height: 30%;
	right: 46%;
	bottom: 5%;
}
.block10-00{
	display: none;
	position: absolute;
	height: 30%;
	right: 50%;
	bottom: 4%;
}

/*=====  End of Block10 Block  ======*/

/*====================================
 =        Block1 Positions         =
 ====================================*/

.block1-00{
	display: none;
	position: absolute;
	height: 4%;
	right: 9%;
	bottom: 4%;
}
.block1-01{
	display: none;
	position: absolute;
	height: 4%;
	right: 5%;
	bottom: 5%;
}
.block1-02{
	display: none;
	position: absolute;
	height: 4%;
	right: 9%;
	bottom: 9%;
}
.block1-03{
	display: none;
	position: absolute;
	height: 4%;
	right: 5%;
	bottom: 13%;
}
.block1-04{
	display: none;
	position: absolute;
	height: 4%;
	right: 9%;
	bottom: 17%;
}
.block1-05{
	display: none;
	position: absolute;
	height: 4%;
	right: 5%;
	bottom: 21%;
}
.block1-06{
	display: none;
	position: absolute;
	height: 4%;
	right: 9%;
	bottom: 25%;
}
.block1-07{
	display: none;
	position: absolute;
	height: 4%;
	right: 5%;
	bottom: 29%;
}
.block1-08{
	display: none;
	position: absolute;
	height: 4%;
	right: 9%;
	bottom: 33%;
}

/*=====  End of Block1 Block  ======*/

/*====================================
 =            Apple Positions        =
 ====================================*/
.leftappleimage {
	position: absolute;
	height: 14%;
	right: 31.3%;
	top: 23.3%;
}
.rightappleimage {
	position: absolute;
	right: 2%;
	height: 14%;
	top: 23.3%;
}

.floorappleimage00 {
	position: absolute;
	right: 7%;
	height: 10%;
	bottom: 68%;
}
.floorappleimage01 {
	position: absolute;
	right: 17%;
	height: 10%;
	bottom: 68%;
}
.floorappleimage02 {
	position: absolute;
	right: 27%;
	height: 10%;
	bottom: 68%;
}
.floorappleimage03 {
	position: absolute;
	right: 37%;
	height: 10%;
	bottom: 68%;
}
.floorappleimage04 {
	position: absolute;
	right: 47%;
	height: 10%;
	bottom: 68%;
}
.floorappleimage05 {
	position: absolute;
	right: 13%;
	height: 10%;
	bottom: 81%;
}
.floorappleimage06 {
	position: absolute;
	right: 23%;
	height: 10%;
	bottom: 81%;
}
.floorappleimage07 {
	position: absolute;
	right: 33%;
	height: 10%;
	bottom: 81%;
}
.floorappleimage08 {
	position: absolute;
	right: 43%;
	height: 10%;
	bottom: 81%;
}
/* Basket */
.floorbasketimage00 {
	position: absolute;
	right: 1%;
	height: 9%;
	bottom: 42%;
}
.floorbasketimage01 {
	position: absolute;
	right: 21%;
	height: 9%;
	bottom: 42%;
}

.floorbasketimage02 {
	position: absolute;
	right: 41%;
	height: 9%;
	bottom: 42%;
}

.floorbasketimage03 {
	position: absolute;
	right: 1%;
	height: 9%;
	bottom: 55%;
}

.floorbasketimage04 {
	position: absolute;
	right: 21%;
	height: 9%;
	bottom: 55%;
}

.floorbasketimage05 {
	position: absolute;
	right: 41%;
	height: 9%;
	bottom: 55%;
}

/* Drum Apple */
.drumapple00 {
	position: absolute;
	right: 10%;
	height: 40%;
	bottom: 15%;
}

.drumapple01 {
	position: absolute;
	right: 1%;
	height: 35%;
	bottom: 5%;
}

.drumapple02 {
	position: absolute;
	right: 21%;
	height: 35%;
	bottom: 5%;
}

.drumapple03 {
	position: absolute;
	right: 41%;
	height: 35%;
	bottom: 5%;
}

/*=====  End of Apple Block  ======*/

.textgreen {
	color: #93C496;
}

.textred {
	color: #E06666;
}

/*=====  End of Custom Style  ======*/
@media screen and (min-aspect-ratio: 4/3) {
    /*vh*/
    .sidepara > p {
		font-size: 3.5vh;
    }

}
.play-again-button {
	display: none;
     background: #48d477;
  background-image: -webkit-linear-gradient(top, #48d477, #77d496);
  background-image: -moz-linear-gradient(top, #48d477, #77d496);
  background-image: -ms-linear-gradient(top, #48d477, #77d496);
  background-image: -o-linear-gradient(top, #48d477, #77d496);
  background-image: linear-gradient(to bottom, #48d477, #77d496);
    -webkit-border-radius: 28;
    -moz-border-radius: 28;
    border-radius: 15px;
    color: #ffffff;
    font-size: 23px;
    text-decoration: none;
    width: 21% !important;
    top: 90%;
    left: 6%;
    height: 8% !important;
    box-shadow: none;
    outline: none;
    border-style: solid;
}

.play-again-button:hover {
  background: #52ba74;
  background-image: -webkit-linear-gradient(top, #52ba74, #40cf70);
  background-image: -moz-linear-gradient(top, #52ba74, #40cf70);
  background-image: -ms-linear-gradient(top, #52ba74, #40cf70);
  background-image: -o-linear-gradient(top, #52ba74, #40cf70);
  background-image: linear-gradient(to bottom, #52ba74, #40cf70);
  text-decoration: none;
}
div.digitblock > input:nth-child(4){
	display: none;
}
.nodisplay
{
	display: none;
}

.pnkBg{
	background: #f2c2e8;
}