.loader { 
  position: relative;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 70px;
  height: 70px;
  left:50%;
  top:50%;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}
.spinner-overlay{
    position: absolute;
    top:0px;
    left:0px;
    width: 100%;
    height: 100%;
 /*   background: black;*/
    opacity: .5;
}




@media (min-width: 350px) {
    	.spinner {
	   position: fixed;
	   left: 45vw;
	   top: 40%;
	   height:10vw;
	   width: 10vw;
	   margin:0px auto;
	   -webkit-animation: rotation .6s infinite linear;
	   -moz-animation: rotation .6s infinite linear;
	   -o-animation: rotation .6s infinite linear;
	   animation: rotation .6s infinite linear;
	   border-left:6px solid rgba(0,174,239,.15);
	   border-right:6px solid rgba(0,174,239,.15);
	   border-bottom:6px solid rgba(0,174,239,.15);
	   border-top:6px solid rgba(0,174,239,.8);
	   border-radius:100%;
	   z-index:5;
	}
}

/* Tablet */
@media (min-width: 760px) {
    	.spinner {
	   position: fixed;
	   left: 46vw;
	   top: 40%;
	   height:8vw;
	   width: 8vw;
	   margin:0px auto;
	   -webkit-animation: rotation .6s infinite linear;
	   -moz-animation: rotation .6s infinite linear;
	   -o-animation: rotation .6s infinite linear;
	   animation: rotation .6s infinite linear;
	   border-left:6px solid rgba(0,174,239,.15);
	   border-right:6px solid rgba(0,174,239,.15);
	   border-bottom:6px solid rgba(0,174,239,.15);
	   border-top:6px solid rgba(0,174,239,.8);
	   border-radius:100%;
	   z-index:5;
	}
}

/* Desktop */
@media (min-width: 1020px) {
    	.spinner {
	   position: fixed;
	   left: 48vw;
	   top: 40%;
	   height:4vw;
	   width: 4vw;
	   margin:0px auto;
	   -webkit-animation: rotation .6s infinite linear;
	   -moz-animation: rotation .6s infinite linear;
	   -o-animation: rotation .6s infinite linear;
	   animation: rotation .6s infinite linear;
	   border-left:6px solid rgba(0,174,239,.15);
	   border-right:6px solid rgba(0,174,239,.15);
	   border-bottom:6px solid rgba(0,174,239,.15);
	   border-top:6px solid rgba(0,174,239,.8);
	   border-radius:100%;
	   z-index:5;
	}
}

/* Grandi Desktop */
@media (min-width: 1800px) {
    	.spinner {
	   position: fixed;
	   left: 48vw;
	   top: 40%;
	   height:5vw;
	   width: 5vw;
	   margin:0px auto;
	   -webkit-animation: rotation .6s infinite linear;
	   -moz-animation: rotation .6s infinite linear;
	   -o-animation: rotation .6s infinite linear;
	   animation: rotation .6s infinite linear;
	   border-left:6px solid rgba(0,174,239,.15);
	   border-right:6px solid rgba(0,174,239,.15);
	   border-bottom:6px solid rgba(0,174,239,.15);
	   border-top:6px solid rgba(0,174,239,.8);
	   border-radius:100%;
	   z-index:5;
	}
}


	

@-webkit-keyframes rotation {
   from {-webkit-transform: rotate(0deg);}
   to {-webkit-transform: rotate(359deg);}
}
@-moz-keyframes rotation {
   from {-moz-transform: rotate(0deg);}
   to {-moz-transform: rotate(359deg);}
}
@-o-keyframes rotation {
   from {-o-transform: rotate(0deg);}
   to {-o-transform: rotate(359deg);}
}
@keyframes rotation {
   from {transform: rotate(0deg);}
   to {transform: rotate(359deg);}
}