/*
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
SPINNER
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
.spinner-content {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 110;
	background-color: rgba(255, 255, 255, 0.5);
	display: block; 
}

.spinner-content .spinner-bg {
	  width: 100%;
	  height: 100%;
	  display: -webkit-box;
	  /* OLD - iOS 6-, Safari 3.1-6 */
	  display: -moz-box;
	  /* OLD - Firefox 19- (buggy but mostly works) */
	  display: -ms-flexbox;
	  /* TWEENER - IE 10 */
	  display: -webkit-flex;
	  /* NEW - Chrome */
	  display: flex;
	  /* NEW, Spec - Opera 12.1, Firefox 20+ */
	  -webkit-flex-direction: column;
	  flex-direction: column;
	  align-items: center;
	  justify-content: center;
	  -webkit-align-items: center;
	  align-items: center; 
}

.spinner-content .spinner-bg .spinner {
	animation: rotate 2s linear infinite;
	z-index: 2;
	position: absolute;
	width: 50px;
	height: 50px; 
}

.spinner-content .spinner-bg .spinner .path {
	stroke: #5072FF;
	stroke-linecap: round;
	animation: dash 1.5s ease-in-out infinite; 
}

@keyframes rotate {

	100% {
	  transform: rotate(360deg); 
	} 

}

@keyframes dash {

	0% {
	  stroke-dasharray: 1, 150;
	  stroke-dashoffset: 0; 
	}

	50% {
	  stroke-dasharray: 90, 150;
	  stroke-dashoffset: -35; 
	}

	100% {
	  stroke-dasharray: 90, 150;
	  stroke-dashoffset: -124; 
	} 
}