body {
      overflow: hidden;
    }

    @keyframes shake {
  10%{
    transform: rotate(-2deg) skew(-2deg, 0);}
  50% {
    transform: rotate(0deg) skew(0deg, 0);}
  70% {
    transform: rotate(-2deg) skew(-2deg, 0);}
  90% {
    transform: rotate(0deg) skew(0deg, 0);}
}


    @keyframes colorchange_i_hot
    {
      0%   {background: #F99A3B;}
      33.5%  {background: #FFFF45;}
      67%  {background:  #F99A3B;}
      100%  {background: #FFFF45;}
    }

     @keyframes colorchange_ii_hot
    {
      0%   {background: #DE0000;}
      33.5%  {background: #FFC433;}
      67%  {background:  #DE0000;}
      100%  {background: #FFC433;}
    }

        @keyframes colorchange_iii_hot
    {
      0%   {background: black;}
      33.5%  {background: red;}
      67%  {background:  black;}
      100%  {background: red;}
    }

     @keyframes colorchange_0_hot
    {
      0%   {background: white;}
      33.5%  {background: #FFFF45;}
      67%  {background:  #FFFF7E;}
      100%  {background: white;}
    }

 	@keyframes colorchange_i_cold
    {
      0%   {background: #2FC4E5;}
      33.5%  {background: #91F8FF;}
      67%  {background:  #2FC4E5;}
      100%  {background: #91F8FF;}
    }

     @keyframes colorchange_ii_cold
    {
      0%   {background: #0253FF;}
      33.5%  {background: #2FC4E5;}
      67%  {background:  #0253FF;}
      100%  {background: #2FC4E5;}
    }

        @keyframes colorchange_iii_cold
    {
      0%   {background: #0E45FF;}
      33.5%  {background: black;}
      67%  {background:  #0E45FF;}
      100%  {background: black;}
    }

     @keyframes colorchange_0_cold
    {
      0%   {background: #CDFCFF;}
      33.5%  {background: #91F8FF;}
      67%  {background:  #CDFCFF;}
      100%  {background: #91F8FF;}
    }



.middle-text {
	font-family: arial, sans-serif;
/*	font-weight: bold;*/
	font-weight: 9pt;
	font-size: 19pt;
	line-height: 19pt;
}
.black-text {
	font-family: arial black, sans-serif;
		font-size: 18pt;
	line-height: 18pt;
}

.small-text {
	font-family: arial, sans-serif;
		font-size: 9pt;
	line-height: 12pt;
}

.right-align {
	margin-top: 0;
	text-align: right;
}

.left-align {
	margin-top: 0;
	text-align: left;
}
.mousedown-c {
	cursor: url(../image/click-down.png), auto;
}

.mousedown-o {
	cursor: url(../image/click_on-down.png), auto;
}

.god {
	position: absolute;
	
	height: 650px;
	width: 847px;
	/*border: 1pt solid red;*/
	padding: none;
	 margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.cursor-c:hover {
	cursor: url(../image/click.png), auto;
}

.cursor-o:hover {
	cursor: url(../image/click_on.png), auto;
}

#left-c {
	margin-left: 1.7%;
	margin-top: 23.75%;
	/*height: 485px;*/
	height: 400px;
	width: 208px;
	/*background-color: orange;*/
	position: absolute;
	   -webkit-transform: rotate(-20deg) skew(-20deg, 0);
    -moz-transform: rotate(-20deg) skew(-20deg, 0);
    -ms-transform: rotate(-20deg) skew(-20deg, 0);
    -o-transform: rotate(-20deg) skew(-20deg, 0);
    transform: rotate(-20deg) skew(-20deg, 0);
    overflow: auto;
    /*cursor: url(../image/click.png), auto;*/
}

#middle-c {
	/*height: 570px;*/
	height: 400px;
	width: 208px;
	margin-left: 26.1%;
	/*background-color: orange;*/
	margin-top: 14.8%;
	position: absolute;
	   -webkit-transform: rotate(-20deg) skew(-20deg, 0);
    -moz-transform: rotate(-20deg) skew(-20deg, 0);
    -ms-transform: rotate(-20deg) skew(-20deg, 0);
    -o-transform: rotate(-20deg) skew(-20deg, 0);
    transform: rotate(-20deg) skew(-20deg, 0);
     overflow: auto;
    /*cursor: url(../image/click.png), auto;*/
}

#right-c {
/*	background-color: orange;*/
	margin-left: 50.6%;
	margin-top: 5.9%;
	/*height: 640px;*/
	height: 400px;
	width: 208px;
	position: absolute;
	   -webkit-transform: rotate(-20deg) skew(-20deg, 0);
    -moz-transform: rotate(-20deg) skew(-20deg, 0);
    -ms-transform: rotate(-20deg) skew(-20deg, 0);
    -o-transform: rotate(-20deg) skew(-20deg, 0);
    transform: rotate(-20deg) skew(-20deg, 0);
     overflow: auto;
    /*cursor: url(../image/click.png), auto;*/
}

#left-o {
	/*background-color: orange;*/
	/*height: 485px;*/
	height: 400px;
	width: 208px;
	margin-left: 24.9%;
	margin-top: 23.75%;
	/*background-color: orange;*/
	position: absolute;
	-moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -webkit-transform: rotate(20deg) skew(20deg, 0);
    -moz-transform: rotate(20deg) skew(20deg, 0);
    -ms-transform: rotate(20deg) skew(20deg, 0);
    -o-transform: rotate(20deg) skew(20deg, 0);
    transform: rotate(20deg) skew(20deg, 0);
     overflow: auto;
   /* cursor: url(../image/click_on.png), auto;*/
    
}

#middle-o {
/*	background-color: orange;*/
	/*height: 570px;*/
	height: 400px;
	width: 208px;
	margin-left: 49.27%;
	margin-top: 14.8%;
	position: absolute;
	    -moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -webkit-transform: rotate(20deg) skew(20deg, 0);
    -moz-transform: rotate(20deg) skew(20deg, 0);
    -ms-transform: rotate(20deg) skew(20deg, 0);
    -o-transform: rotate(20deg) skew(20deg, 0);
    transform: rotate(20deg) skew(20deg, 0);
     overflow: auto;
    /* cursor: url(../image/click_on.png), auto;*/
}

#right-o {
	/*background-color: orange;*/
	/*height: 640px;*/
	height: 400px;
	width: 208px;
	margin-left: 73.8%;
	margin-top: 5.9%;
	position: absolute;
	    -moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -webkit-transform: rotate(20deg) skew(20deg, 0);
    -moz-transform: rotate(20deg) skew(20deg, 0);
    -ms-transform: rotate(20deg) skew(20deg, 0);
    -o-transform: rotate(20deg) skew(20deg, 0);
    transform: rotate(20deg) skew(20deg, 0);
     overflow: auto;
    /* cursor: url(../image/click_on.png), auto;*/
}

::-webkit-scrollbar { 
    display: none; 
}