/* 

DOC:
Display Loading Image While Page Loads.
http://talkerscode.com/webtricks/display-loading-image-while-page-loads.php
* Se uso parte del codigo y se implementó una variacion.

Clase para el DIV del loader que cubre la pantalla
Se inicializa display: none; para que solo lo muestre en el submit de un form.
*/
.loader {
	display: none;
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 999999999999;
	/* background: url('../imgs/loader/IconoLoading6.gif') 50% 50% no-repeat transparent; */
	/*background: url('../imgs/loader/Fading lines.gif') 50% 50% no-repeat red;*/
	background-color: rgba(0, 0, 0, 0.6);
	position: fixed;
}

/*
DOC: 
Single Element CSS Spinners
https://projects.lukehaas.me/css-loaders/

Clases del DIV que muestra el icono que indica uploading.
*/
.loaderIcon,
.loaderIcon:after {
  border-radius: 50%;
  width: 10em;
  height: 10em;
}
.loaderIcon {
  margin: 60px auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(255, 255, 255, 0.2);
  border-right: 1.1em solid rgba(255, 255, 255, 0.2);
  border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
  border-left: 1.1em solid #ffffff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}