@charset "utf-8";
/* CSS Document */

.circle_wrap2{
	position: absolute;
	width: 100px;
	height: 100px;
	top: 0;
   bottom: 0;
	left: 0;
   right: 0;
	margin: auto;
}

.circle {
   background-color: rgba(81,207,253,0);
   border:8px solid rgba(81,207,253,0.90);
   opacity:.9;
   border-right:8px solid rgba(81,207,253,0);
   border-left:8px solid rgba(81,207,253,0);
   border-radius:80px;
   box-shadow: 0 0 35px #000000;
   width:140px;
   height:140px;
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   margin: auto;
   -moz-animation:spinPulse 1s infinite ease-in-out;
   -webkit-animation:spinPulse 1s infinite linear;
   animation-play-state: paused;
}

.circle1 {
	background-color: rgba(0,0,0,0);
	border:5px solid rgba(81,207,253,0.90);
	opacity:.9;
	border-left:5px solid rgba(0,0,0,0);
	border-right:5px solid rgba(0,0,0,0);
	border-radius:50px;
	box-shadow: 0 0 15px #8C8C8C; 
	width:80px;
	height:80px;
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   margin: auto;
   -moz-animation:spinoffPulse 1s infinite linear;
   -webkit-animation:spinoffPulse 1s infinite linear;
   animation-play-state: paused;
}

.circle2{
	width:50%;
	height:50%;
	border-radius:80px;
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   margin: auto;
}

.circle_play{
	width: 30px;
	height: 30px;
	color: rgba(214,0,101,1.00);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  font-size: 180%;
  line-height: 1.0;
  text-align: center;
}

.ciecle_pic:hover .circle{
	animation-play-state: running;
}

.ciecle_pic:hover .circle1{
	animation-play-state: running;
}



@-moz-keyframes spinPulse {
	0% { -moz-transform:rotate(160deg); opacity:1; box-shadow:0 0 1px #FFFFFF;}
	50% { -moz-transform:rotate(145deg); opacity:1; box-shadow:0 0 1px #FFFFFF; }
	100% { -moz-transform:rotate(-360deg); opacity:1; box-shadow:0 0 1px #FFFFFF; }
}
@-moz-keyframes spinoffPulse {
	0% { -moz-transform:rotate(0deg); }
	100% { -moz-transform:rotate(360deg);  }
}
@-webkit-keyframes spinPulse {
	0% { -webkit-transform:rotate(160deg); opacity:1; box-shadow:0 0 1px #FFFFFF; }
	50% { -webkit-transform:rotate(145deg); opacity:1; box-shadow:0 0 1px #FFFFFF; }
	100% { -webkit-transform:rotate(-360deg); opacity:1; box-shadow:0 0 1px #FFFFFF; }
}
@-webkit-keyframes spinoffPulse {
	0% { -webkit-transform:rotate(0deg); }
	100% { -webkit-transform:rotate(360deg); }
}