/* btn */
.%css-ctar% .aiin-btn {
	position:relative;
	display:inline-block;
	background-color:#2072be;
	background:linear-gradient(to top,#2072be,#8ebce7);

	cursor:pointer;
	user-select:none;
	-moz-user-select:none;
	-webkit-tap-highlight-color:transparent;
	line-height:1;
	/* cut off sticking-out corners for chrome */
	overflow:hidden;
	z-index:0;
	border-radius:5px;
}
.%css-ctar% .aiin-btn.aiin-sel {
}
.%css-ctar% .aiin-btn.aiin-not-allowed {
	cursor:default;
}
/* board */
.%css-ctar% .aiin-board {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
/* bubble-heart */
.%css-ctar% .aiin-bubble-heart {
	position:absolute;

	background:url("%url-tpl%/img/heart-1.png");
	background-size:120% 120%;
	background-position:center center;

	transform:translate(-50%,-50%);
	opacity:1;

	animation-name:%css-ctar%-kf-bubble-heart-hover;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	animation-play-state:paused;
}
.%css-ctar% .aiin-btn:hover .aiin-bubble-heart {
	animation-play-state:running;

	background:url("%url-tpl%/img/heart-2.png");
	background-size:120% 120%;
	background-position:center center;
}
@keyframes %css-ctar%-kf-bubble-heart-hover {
	0% {
		top:200%;
	}
	100% {
		top:-100%;
	}
}
.%css-ctar% .aiin-bubble-heart-1 {
	width:8px;
	height:8px;
	left:10%;
	animation-delay:-1s;
	animation-duration:1.9s;
}
.%css-ctar% .aiin-bubble-heart-2 {
	width:10px;
	height:10px;
	left:20%;
	animation-delay:-8s;
	animation-duration:3.7s;
}
.%css-ctar% .aiin-bubble-heart-3 {
	width:6px;
	height:6px;
	left:30%;
	animation-delay:-3s;
	animation-duration:2.5s;
}
.%css-ctar% .aiin-bubble-heart-4 {
	width:12px;
	height:12px;
	left:40%;
	animation-delay:-2s;
	animation-duration:3.1s;
}
.%css-ctar% .aiin-bubble-heart-5 {
	width:8px;
	height:8px;
	left:50%;
	animation-delay:-6s;
	animation-duration:2.2s;
}
.%css-ctar% .aiin-bubble-heart-6 {
	width:13px;
	height:13px;
	left:60%;
	animation-delay:-4s;
	animation-duration:3.3s;
}
.%css-ctar% .aiin-bubble-heart-7 {
	width:9px;
	height:9px;
	left:70%;
	animation-delay:-7s;
	animation-duration:2.3s;
}
.%css-ctar% .aiin-bubble-heart-8 {
	width:5px;
	height:5px;
	left:80%;
	animation-delay:-12s;
	animation-duration:2.6s;
}
.%css-ctar% .aiin-bubble-heart-9 {
	width:11px;
	height:11px;
	left:90%;
	animation-delay:-5s;
	animation-duration:3.5s;
}
/* bubble-label */
.%css-ctar% .aiin-bubble-label {
	position:absolute;

	background:url("%url-tpl%/img/label-1.png");
	background-size:100% 100%;
	background-position:center center;

	opacity:1;

	animation-name:%css-ctar%-kf-bubble-label-hover;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	animation-play-state:paused;
}
.%css-ctar% .aiin-btn:hover .aiin-bubble-label {
	animation-play-state:running;

	background:url("%url-tpl%/img/label-2.png");
	background-size:100% 100%;
	background-position:center center;
}
@keyframes %css-ctar%-kf-bubble-label-hover {
	0% {
		top:200%;
		transform:rotateY(0deg) rotateX(0deg);
	}
	33% {
		transform:rotateY(-30deg) rotateX(30deg);
	}
	66% {
		transform:rotateY(30deg) rotateX(-30deg);
	}
	100% {
		top:-100%;
		transform:rotateY(0deg) rotateX(0deg);
	}
}
.%css-ctar% .aiin-bubble-label-1 {
	width:30px;
	height:8px;
	left:-10%;
	animation-delay:-4s;
	animation-duration:4.3s;
}
.%css-ctar% .aiin-bubble-label-2 {
	width:40px;
	height:10px;
	left:60%;
	animation-delay:-9.1s;
	animation-duration:5.7s;
}
.%css-ctar% .aiin-bubble-label-3 {
	width:45px;
	height:14px;
	left:15%;
	animation-delay:-10.3s;
	animation-duration:7.3s;
}
.%css-ctar% .aiin-bubble-label-4 {
	width:25px;
	height:6px;
	left:40%;
	animation-delay:-18.5s;
	animation-duration:6.4s;
}
.%css-ctar% .aiin-bubble-label-5 {
	width:36px;
	height:9px;
	left:70%;
	animation-delay:-10s;
	animation-duration:4.8s;
}
/* vcnt */
.%css-ctar% .aiin-vcnt-ctar {
	position:relative;
	width:100%;
	padding:30px 30px;
	line-height:30px;
	text-align:center;
	transition:transform 0.6s;
}
.%css-ctar% .aiin-btn.aiin-sel .aiin-vcnt-ctar {
	transform:translateY(15px);
}
.%css-ctar% .aiin-vcnt {
	color:white;
	font-family:"Times New Roman","serif";
	font-size:26px;
	font-style:italic;
	text-shadow:
		0 0 1px #8ff,
		0 0 2px #8ff,
		0 0 3px #8ff,
		0 0 4px #8ff,
		0 0 5px #8ff,
		0 0 10px #8ff,
		0 0 15px #8ff,
		0 0 20px #8ff,
		0 0 25px #8ff,
		0 0 30px #8ff,
		0 0 35px #8ff,
		0 0 40px #8ff,
		0 0 45px #8ff;
	letter-spacing:1px;
}
/* check */
.%css-ctar% .aiin-check-ctar {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	transform:translateY(-45px);
	transition:transform 0.6s;
}
.%css-ctar% .aiin-btn.aiin-sel .aiin-check-ctar {
	transform:translateY(0);
}
.%css-ctar% .aiin-check-inner {
	position:absolute;
	top:0;
	left:50%;
	width:50px;
	height:50px;
	transform:translate(-50%,-50%) rotateZ(-45deg);
	background-color:rgba(255,255,255,0.6);
	background:linear-gradient(45deg,rgba(255,255,255,0.4),rgba(255,255,255,1) 60%);
}
.%css-ctar% .aiin-check {
	position:absolute;
	bottom:10%;
	left:10%;
	width:20px;
	height:20px;
	transform:rotateZ(45deg);
	background:url("%url-tpl%/img/check.png");
	background-size:100% 100%;
	background-position:center center;
}
.%css-ctar% .aiin-btn.aiin-sel:hover .aiin-check {
	animation-name:%css-ctar%-kf-check-hover;
	animation-iteration-count:3;
	animation-duration:0.8s;
}
@keyframes %css-ctar%-kf-check-hover {
	50% {
		opacity:0;
	}
}
/* remove in ie9  */
@media all and (min-width:0\0) and (min-resolution:.001dpcm) {
	.aiin-check-ctar,
	.aiin-bubble-label,
	.aiin-bubble-heart {
		display:none;
	}
}