/*Hidden class for adding and removing*/
 .nunil-spinner-blocks.hidden {
     display: none;
}
 .nunil-spinner-blocks {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100vh;
     background: rgba(0,0,0,.8);
     z-index: 999;
     opacity: 1;
     transition: all 0.5s;
     display: flex;
     align-items: center;
     justify-content: center;
}
 @keyframes nunil-spinner-tools {
     0% {background: #a0de59;}
     12.5% {background: #a0de59;}
     12.625% {background: #5f2a62;}
     100% {background: #5f2a62;}
}
/* moving styles from inline */
 .nunil-spinner-box-1 {
	left:0px;
	top:0px;
	animation-delay:0s;
}
 .nunil-spinner-box-2 {
	left:42px;
	top:0px;
	animation-delay:0.125s;
}
 .nunil-spinner-box-3 {
	left:84px;
	top:0px;
	animation-delay:0.25s;
}
 .nunil-spinner-box-4 {
	left:0px;
	top:42px;
	animation-delay:0.875s!important;;
}
 .nunil-spinner-box-5 {
	left:84px;
	top:42px;
	animation-delay:0.375s;
}
 .nunil-spinner-box-6 {
	left:0px;
	top:84px;
	animation-delay:0.75s;
}
 .nunil-spinner-box-7 {
	left:42px;
	top:84px;
	animation-delay:0.625s;
}
 .nunil-spinner-box-8 {
	left:84px;
	top:84px;
	animation-delay:0.5s;
}

 .nunil-spinner-tools div {
     position: absolute;
     width: 40px;
     height: 40px;
     background: #5f2a62;
     animation-name: nunil-spinner-tools;
     animation-duration: 1s;
     animation-timing-function: linear;
     animation-iteration-count: infinite;
}
 .nunil-spinner-tools {
     width: 124px;
     height: 124px;
     position: relative;
     transform: translateZ(0) scale(1);
     backface-visibility: hidden;
     transform-origin: 0 0;
    /* see note above */
}
 .nunil-spinner-tools div {
     box-sizing: content-box;
}
/* generated by https://loading.io/ */