/*	################################################################
	12. ANIMATIONS
################################################################# */

	[class*=".effect-"] {
	  -webkit-backface-visibility: hidden;
	  -moz-backface-visibility: hidden;
	  backface-visibility: hidden;
	  -webkit-perspective: 1000;
	  -moz-perspective: 1000;
	  perspective: 1000;
	}
	.effect-fade {
	  opacity: 0;
	}
	.effect-fade.in {
	  opacity: 1;
	}
	.effect-slide-left {
	  -webkit-transform: translate3d(-30%, 0, 0);
	  transform: translate3d(-30%, 0, 0);
	  opacity: 0;
	}
	.effect-slide-left.in {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0);
	  opacity: 1;
	}
	.effect-slide-right {
	  -webkit-transform: translate3d(30%, 0, 0);
	  transform: translate3d(30%, 0, 0);
	  opacity: 0;
	}
	.effect-slide-right.in {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0);
	  opacity: 1;
	}
	.effect-slide-top {
	  -webkit-transform: translate3d(0, -30%, 0);
	  transform: translate3d(0, -30%, 0);
	  opacity: 0;
	}
	.effect-slide-top.in {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0);
	  opacity: 1;
	}
	.effect-slide-bottom {
	  -webkit-transform: translate3d(0, 30%, 0);
	  transform: translate3d(0, 30%, 0);
	  opacity: 0;
	}
	.effect-slide-bottom.in {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0);
	  opacity: 1;
	}
	.effect-pop {
	  opacity: 0;
	}
	.effect-pop.in {
	  -webkit-animation: pop 0.6s ease-out 0.5s both;
	  -moz-animation: pop 0.6s ease-out 0.5s both;
	  -o-animation: pop 0.6s ease-out 0.5s both;
	  animation: pop 0.6s ease-out 0.5s both;
	  opacity: 1 \9;
	}
	@-webkit-keyframes pop {
	  0% {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	  }
	  50% {
		-webkit-transform: scale(1.2);
		-ms-transform: scale(1.2);
		transform: scale(1.2);
		opacity: 1;
	  }
	  100% {
		opacity: 1;
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	  }
	}
	@-moz-keyframes pop {
	  0% {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	  }
	  50% {
		-webkit-transform: scale(1.2);
		-ms-transform: scale(1.2);
		transform: scale(1.2);
		opacity: 1;
	  }
	  100% {
		opacity: 1;
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	  }
	}
	@-o-keyframes pop {
	  0% {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	  }
	  50% {
		-webkit-transform: scale(1.2);
		-ms-transform: scale(1.2);
		transform: scale(1.2);
		opacity: 1;
	  }
	  100% {
		opacity: 1;
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	  }
	}
	@keyframes pop {
	  0% {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	  }
	  50% {
		-webkit-transform: scale(1.2);
		-ms-transform: scale(1.2);
		transform: scale(1.2);
		opacity: 1;
	  }
	  100% {
		opacity: 1;
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	  }
	}
	.effect-fall {
	  opacity: 0;
	  -webkit-transform: scale(1.5);
	  -ms-transform: scale(1.5);
	  transform: scale(1.5);
	}
	.effect-fall.in {
	  -webkit-transform: scale(1);
	  -ms-transform: scale(1);
	  transform: scale(1);
	  opacity: 1;
	}
	.effect-perspective {
	  -webkit-perspective: 1300px;
	  -moz-perspective: 1300px;
	  perspective: 1300px;
	}
	.effect-helix {
	  -webkit-transform-style: preserve-3d;
	  -moz-transform-style: preserve-3d;
	  transform-style: preserve-3d;
	  opacity: 0;
	  -webkit-transform: rotateY(-180deg);
	  -ms-transform: rotateY(-180deg);
	  transform: rotateY(-180deg);
	}
	.effect-helix.in {
	  opacity: 1;
	  -webkit-transform: rotateY(0);
	  -ms-transform: rotateY(0);
	  transform: rotateY(0);
	}

	.dm-shadow {
		-webkit-box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1);	
		-moz-box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1);	
		box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1);	
	}
	
	.rotating {
	  display: inline-block;
	  -webkit-transform-style: preserve-3d;
	  -moz-transform-style: preserve-3d;
	  -ms-transform-style: preserve-3d;
	  -o-transform-style: preserve-3d;
	  transform-style: preserve-3d;
	  -webkit-transform: rotateX(0) rotateY(0) rotateZ(0);
	  -moz-transform: rotateX(0) rotateY(0) rotateZ(0);
	  -ms-transform: rotateX(0) rotateY(0) rotateZ(0);
	  -o-transform: rotateX(0) rotateY(0) rotateZ(0);
	  transform: rotateX(0) rotateY(0) rotateZ(0);
	  -webkit-transition: 0.5s;
	  -moz-transition: 0.5s;
	  -ms-transition: 0.5s;
	  -o-transition: 0.5s;
	  transition: 0.5s;
	  -webkit-transform-origin-x: 50%;
	}
	
	.rotating.flip {
	  position: relative;
	}
	
	.rotating .front, .rotating .back {
	  left: 0;
	  top: 0;
	  -webkit-backface-visibility: hidden;
	  -moz-backface-visibility: hidden;
	  -ms-backface-visibility: hidden;
	  -o-backface-visibility: hidden;
	  backface-visibility: hidden;
	}
	
	.rotating .front {
	  position: absolute;
	  display: inline-block;
	  -webkit-transform: translate3d(0,0,1px);
	  -moz-transform: translate3d(0,0,1px);
	  -ms-transform: translate3d(0,0,1px);
	  -o-transform: translate3d(0,0,1px);
	  transform: translate3d(0,0,1px);
	}
	
	.rotating.flip .front {
	  z-index: 1;
	}
	
	.rotating .back {
	  display: block;
	  opacity: 0;
	}
	
	.rotating.spin {
	  -webkit-transform: rotate(360deg) scale(0);
	  -moz-transform: rotate(360deg) scale(0);
	  -ms-transform: rotate(360deg) scale(0);
	  -o-transform: rotate(360deg) scale(0);
	  transform: rotate(360deg) scale(0);
	}

	.rotating.flip .back {
	  z-index: 2;
	  display: block;
	  opacity: 1;
	  
	  -webkit-transform: rotateY(180deg) translate3d(0,0,0);
	  -moz-transform: rotateY(180deg) translate3d(0,0,0);
	  -ms-transform: rotateY(180deg) translate3d(0,0,0);
	  -o-transform: rotateY(180deg) translate3d(0,0,0);
	  transform: rotateY(180deg) translate3d(0,0,0);
	}
	
	.rotating.flip.up .back {
	  -webkit-transform: rotateX(180deg) translate3d(0,0,0);
	  -moz-transform: rotateX(180deg) translate3d(0,0,0);
	  -ms-transform: rotateX(180deg) translate3d(0,0,0);
	  -o-transform: rotateX(180deg) translate3d(0,0,0);
	  transform: rotateX(180deg) translate3d(0,0,0);
	}
	
	.rotating.flip.cube .front {
	  -webkit-transform: translate3d(0,0,100px) scale(0.9,0.9);
	  -moz-transform: translate3d(0,0,100px) scale(0.85,0.85);
	  -ms-transform: translate3d(0,0,100px) scale(0.85,0.85);
	  -o-transform: translate3d(0,0,100px) scale(0.85,0.85);
	  transform: translate3d(0,0,100px) scale(0.85,0.85);
	}
	
	.rotating.flip.cube .back {
	  -webkit-transform: rotateY(180deg) translate3d(0,0,100px) scale(0.9,0.9);
	  -moz-transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
	  -ms-transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
	  -o-transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
	  transform: rotateY(180deg) translate3d(0,0,100px) scale(0.85,0.85);
	}
	
	.rotating.flip.cube.up .back {
	  -webkit-transform: rotateX(180deg) translate3d(0,0,100px) scale(0.9,0.9);
	  -moz-transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
	  -ms-transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
	  -o-transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
	  transform: rotateX(180deg) translate3d(0,0,100px) scale(0.85,0.85);
	}

	.hovicon {
		display: inline-block;
		line-height: 80px;
		cursor: pointer;
		margin: 20px;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		text-align: center;
		position: relative;
		text-decoration: none;
		z-index: 1;
		color: #fff;
	}
	
	.hovicon:after {
		pointer-events: none;
		position: absolute;
		width: 100%;
		height: 100%;
		border-radius: 50%;
		content:'';
		-webkit-box-sizing: content-box;
		-moz-box-sizing: content-box;
		box-sizing: content-box;
	}
	
	.hovicon:before {
		speak: none;
		font-size: 38px;
		line-height: 80px;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		display: block;
		-webkit-font-smoothing: antialiased;
	}
	
	.hovicon.effect-1 {
		-webkit-transition: background 0.2s, color 0.2s;
		-moz-transition: background 0.2s, color 0.2s;
		transition: background 0.2s, color 0.2s;
	}
	
	.hovicon.effect-1:after {
		top: -7px;
		left: -7px;
		padding: 7px;
		box-shadow: 0 0 0 4px #007acc;
		-webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
		-webkit-transform: scale(.8);
		-moz-transition: -moz-transform 0.2s, opacity 0.2s;
		-moz-transform: scale(.8);
		-ms-transform: scale(.8);
		transition: transform 0.2s, opacity 0.2s;
		transform: scale(.8);
		opacity: 0;
	}
	
	.hovicon.effect-1.sub-a:hover:after {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
		opacity: 1;
	}
