html, BODY{
background: url("../img/background.png");
background-size:100% 100%;
-moz-background-size:100% 100%;
background-repeat:no-repeat;
background-attachment: fixed;
background-color:white; 
background-position: center;
height: 100%;
font-family:Arial;
color:#336699;
} 
div {
    display: inline-block;
}

* {
margin: 3;
}
p.*{
	background-color:white;
}
b.*{
	background-color:white;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -4em;
}
.footer, .push {
height: 4em;
font-family:arial;
color:#000000;
font-size:12px; 
text-align:center;
}
input.* {
	max-width: 800px;
	min-width: 500px;
}
 div.resum{

		border-radius: 4px;
		float: center;
		box-shadow: 8px 8px 5px #888888;
		color: blank;
		background-color:white;
		font-size:x-small;
		overflow-x:auto;
 }
 div.resum2{
		max-width: 500px;
	    min-width: 200px;
		h4: center;
 }
  div.resumm{

		border-radius: 4px;
		float: center;
		position: absolute;
		box-shadow: 8px 8px 5px #888888;
		color: blank;
		background-color:white;
		max-width: 100%;
		-webkit-animation-name: Carga; /* Chrome, Safari, Opera */
		-webkit-animation-duration: 4s; /* Chrome, Safari, Opera */
		animation-name: Carga;
		animation-duration: 5s;
		animation-delay: 2s;
		overflow-x:auto;
		border-collapse: collapse;
		border-spacing: 0;
		
 }
 div.aviso{

		border-radius: 4px;
		float: center;
		position: absolute;
		box-shadow: 8px 8px 5px #888888;
		color: blank;
		font-size:12px; 
		text-align:center;
		max-width: 90%;
		max-height: 90%;
		-webkit-animation-name: Carga; /* Chrome, Safari, Opera */
		-webkit-animation-duration: 4s; /* Chrome, Safari, Opera */
		animation-name: Carga;
		animation-duration: 5s;
		animation-delay: 2s;
		overflow-x:auto;
		border-collapse: collapse;
		border-spacing: 0;
		left: 50%;
		top: 50%;
		
 }
 
  div.avisoimp{

		border-radius: 4px;
		float: center;
		position: absolute;
		box-shadow: 8px 8px 5px #888888;
		color: blank;
		font-size:12px; 
		text-align:center;
		max-width: 100%;
		-webkit-animation-name: Carga; /* Chrome, Safari, Opera */
		-webkit-animation-duration: 4s; /* Chrome, Safari, Opera */
		animation-name: Carga;
		animation-duration: 5s;
		animation-delay: 2s;
		overflow-x:auto;
		border-collapse: collapse;
		border-spacing: 0;	
		left: 0%;
		top: 0%;		
 }
 table {     font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    font-size: 12px;    margin: 4px;     max-width: 99%; text-align: left;    border-collapse: collapse; border-radius: 4px;}

th {     font-size: 13px;     font-weight: bold;     padding: 8px;     background: #b9c9fe;
    border-top: 4px solid #aabcfe;    border-bottom: 1px solid #fff; color: #039; }

td {    padding: 8px;     background: #e8edff;     border-bottom: 1px solid #fff;
    color: #669;    border-top: 1px solid transparent;  text-align: left; vertical-align: top;}

tr:hover td { background: #d0dafd; color: #339; }
 
 img.graf {
		
		border-radius: 4px;	
			float: center;
			max-width: 95%;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes Carga {
    from {left:500px; top:500px;}
    to {float: left;}
}

/* Standard syntax */
@keyframes Carga {
    from {left:500px; top:500px;}
    to {float: left;}
}




#loader {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 350px;
  height: 350px;
  margin: -75px 0 0 -75px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 1s linear infinite;
  animation: spin 2s linear infinite;
  -webkit-transform: rotateX(45deg); /* Chrome, Safari, Opera  */
  transform: rotateX(45deg);
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}

.modalDialog {
		position: fixed;
		font-family: Arial, Helvetica, sans-serif;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: rgba(0,0,0,0.8);
		z-index: 99999;
		opacity:0;
		-webkit-transition: opacity 400ms ease-in;
		-moz-transition: opacity 400ms ease-in;
		transition: opacity 400ms ease-in;
		pointer-events: none;
	}

	.modalDialog:target {
		opacity:1;
		pointer-events: auto;
	}

	.modalDialog > div {
		width: 400px;
		position: relative;
		margin: 10% auto;
		padding: 5px 20px 13px 20px;
		border-radius: 10px;
		background: #fff;
		background: -moz-linear-gradient(#fff, #999);
		background: -webkit-linear-gradient(#fff, #999);
		background: -o-linear-gradient(#fff, #999);
	}

	.close {
		background: #606061;
		color: #FFFFFF;
		line-height: 25px;
		position: absolute;
		right: -12px;
		text-align: center;
		top: -10px;
		width: 24px;
		text-decoration: none;
		font-weight: bold;
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px;
		-moz-box-shadow: 1px 1px 3px #000;
		-webkit-box-shadow: 1px 1px 3px #000;
		box-shadow: 1px 1px 3px #000;
	}

	.close:hover { background: #00d9ff; }
	
window.addEventListener("load",function() {setTimeout(function(){ window.scrollTo(0, 1);   }, 0); });