/* ##############################################
#												#
#	Esportsify Stylesheets						#
#	Author: Gavin Weeks							#
#	Platform: Esportsify by Gavin Weeks			#
#												#
###############################################*/


.anim-005 {-webkit-transition: all 0.05s ease;
		-moz-transition: all 0.05s ease;
		-o-transition: all 0.05s ease;
		-ms-transition: all 0.05s ease;
		transition: all 0.05s ease;
		}

.anim-01 {-webkit-transition: all 0.1s ease;
		-moz-transition: all 0.1s ease;
		-o-transition: all 0.1s ease;
		-ms-transition: all 0.1s ease;
		transition: all 0.1s ease;
		}

.anim-02 {-webkit-transition: all 0.2s ease;
		-moz-transition: all 0.2s ease;
		-o-transition: all 0.2s ease;
		-ms-transition: all 0.2s ease;
		transition: all 0.2s ease;
		}

.anim-03 {-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
		transition: all 0.3s ease;
		}
		
.anim-04 {-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		-o-transition: all 0.4s ease;
		-ms-transition: all 0.4s ease;
		transition: all 0.4s ease;
		}

.visibilityIn {
	visibility: hidden;
	-webkit-animation:visibilityIn ease 1;
	-moz-animation:visibilityIn ease 1;
	-o-animation:visibilityIn ease 1;
	animation:visibilityIn ease 1;
	-webkit-animation-fill-mode:forwards;
	-moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
}

.fadeIn {
	opacity:0;
	-webkit-animation:fadeIn ease-in 1;
	-moz-animation:fadeIn ease-in 1;
	-o-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;
	-webkit-animation-fill-mode:forwards;
	-moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
}

.fadeOut {
	opacity:1;
	-webkit-animation:fadeOut ease-in 1;
	-moz-animation:fadeOut ease-in 1;
	-o-animation:fadeOut ease-in 1;
	animation:fadeOut ease-in 1;
	-webkit-animation-fill-mode:backwards;
	-moz-animation-fill-mode:backwards;
	-o-animation-fill-mode:backwards;
	animation-fill-mode:backwards;
}
 
/* Animation Times 
---------------------------------------------------- */
.fadeIn-01s {
	-webkit-animation-duration:0.1s;
	-moz-animation-duration:0.1s;
	-o-animation-duration:0.1s;
	animation-duration:0.1s;
}
.fadeIn-02s {
	-webkit-animation-duration:0.2s;
	-moz-animation-duration:0.2s;
	-o-animation-duration:0.2s;
	animation-duration:0.2s;
}

.fadeIn-03s {
	-webkit-animation-duration:0.3s;
	-moz-animation-duration:0.3s;
	-o-animation-duration:0.3s;
	animation-duration:0.3s;
}

.fadeIn-04s {
	-webkit-animation-duration:0.4s;
	-moz-animation-duration:0.4s;
	-o-animation-duration:0.4s;
	animation-duration:0.4s;
}

.fadeIn-06s {
	-webkit-animation-duration:0.6s;
	-moz-animation-duration:0.6s;
	-o-animation-duration:0.6s;
	animation-duration:0.6s;
}

.fadeIn-1s {
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	-o-animation-duration:1s;
	animation-duration:1s;
}


.fadeIn-2s {
	-webkit-animation-duration:2s;
	-moz-animation-duration:2s;
	-o-animation-duration:2s;
	animation-duration:2s;
}

.fadeIn-3s {
	-webkit-animation-duration:3s;
	-moz-animation-duration:3s;
	-o-animation-duration:3s;
	animation-duration:3s;
}

.fadeIn-4s {
	-webkit-animation-duration:4s;
	-moz-animation-duration:4s;
	-o-animation-duration:4s;
	animation-duration:4s;
}
 
.fadeIn-5s {
	-webkit-animation-duration:5s;
	-moz-animation-duration:5s;
	-o-animation-duration:5s;
	animation-duration:5s;
}



/* Animation Delay
---------------------------------------------------- */
.fadeIn-Delay-01s {
	-webkit-animation-delay:0.1s;
	-moz-animation-delay:0.1s;
	-o-animation-delay:0.1s;
	animation-delay:0.1s;
}
.fadeIn-Delay-02s {
	-webkit-animation-delay:0.2s;
	-moz-animation-delay:0.2s;
	-o-animation-delay:0.2s;
	animation-delay:0.2s;
}

.fadeIn-Delay-03s {
	-webkit-animation-delay:0.3s;
	-moz-animation-delay:0.3s;
	-o-animation-delay:0.3s;
	animation-delay:0.3s;
}

.fadeIn-Delay-04s {
	-webkit-animation-delay:0.4s;
	-moz-animation-delay:0.4s;
	-o-animation-delay:0.4s;
	animation-delay:0.4s;
}

.fadeIn-Delay-05s {
	-webkit-animation-delay:0.5s;
	-moz-animation-delay:0.5s;
	-o-animation-delay:0.5s;
	animation-delay:0.5s;
}

.fadeIn-Delay-1s {
	-webkit-animation-delay:1s;
	-moz-animation-delay:1s;
	-o-animation-delay:1s;
	animation-delay:1s;
}

.fadeIn-Delay-101s {
	-webkit-animation-delay:1.1s;
	-moz-animation-delay:1.1s;
	-o-animation-delay:1.1s;
	animation-delay:1.1s;
}

.fadeIn-Delay-102s {
	-webkit-animation-delay:1.2s;
	-moz-animation-delay:1.2s;
	-o-animation-delay:1.2s;
	animation-delay:1.2s;
}


.fadeIn-Delay-103s {
	-webkit-animation-delay:1.3s;
	-moz-animation-delay:1.3s;
	-o-animation-delay:1.3s;
	animation-delay:1.3s;
}

.fadeIn-Delay-104s {
	-webkit-animation-delay:1.4s;
	-moz-animation-delay:1.4s;
	-o-animation-delay:1.4s;
	animation-delay:1.4s;
}

.fadeIn-Delay-105s {
	-webkit-animation-delay:1.5s;
	-moz-animation-delay:1.5s;
	-o-animation-delay:1.5s;
	animation-delay:1.5s;
}

.fadeIn-Delay-106s {
	-webkit-animation-delay:1.6s;
	-moz-animation-delay:1.6s;
	-o-animation-delay:1.6s;
	animation-delay:1.6s;
}

.fadeIn-Delay-2s {
	-webkit-animation-delay:2s;
	-moz-animation-delay:2s;
	-o-animation-delay:2s;
	animation-delay:2s;
}

.fadeIn-Delay-3s {
	-webkit-animation-delay:3s;
	-moz-animation-delay:3s;
	-o-animation-delay:3s;
	animation-delay:3s;
}

.fadeIn-Delay-302s {
	-webkit-animation-delay:3.2s;
	-moz-animation-delay:3.2s;
	-o-animation-delay:3.2s;
	animation-delay:3.2s;
}

.fadeIn-Delay-303s {
	-webkit-animation-delay:3.3s;
	-moz-animation-delay:3.3s;
	-o-animation-delay:3.3s;
	animation-delay:3.3s;
}

.fadeIn-Delay-304s {
	-webkit-animation-delay:3.4s;
	-moz-animation-delay:3.4s;
	-o-animation-delay:3.4s;
	animation-delay:3.4s;
}

.fadeIn-Delay-4s {
	-webkit-animation-delay:4s;
	-moz-animation-delay:4s;
	-o-animation-delay:4s;
	animation-delay:4s;
}
 
.fadeIn-Delay-5s {
	-webkit-animation-delay:5s;
	-moz-animation-delay:5s;
	-o-animation-delay:5s;
	animation-delay:5s;
}
 
/* Key Frames
---------------------------------------------------- */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-o-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }	

@-webkit-keyframes visibilityIn { from { visibility: hidden; } to { visibility: visible; } }
@-moz-keyframes visibilityIn { from {  visibility: hidden; } to { visibility: visible; } }
@-o-keyframes visibilityIn { from {  visibility: hidden; } to { visibility: visible; } }
@keyframes visibilityIn { from { visibility: hidden; } to {  visibility: visible; } }	

@-webkit-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-ms-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-o-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.uil-ring-css {
  background: none;
  position: relative;
  width: 200px;
  height: 200px;
  margin: 0 auto;
}
.uil-ring-css > div {
  position: absolute;
  display: block;
  width: 160px;
  height: 160px;
  top: 20px;
  left: 20px;
  border-radius: 80px;
  -ms-animation: uil-ring-anim 1s linear infinite;
  -moz-animation: uil-ring-anim 1s linear infinite;
  -webkit-animation: uil-ring-anim 1s linear infinite;
  -o-animation: uil-ring-anim 1s linear infinite;
  animation: uil-ring-anim 1s linear infinite;
}


