#map{
  display: block;
  margin: 0;
  padding: 0;
  position: absolute; /* posición absoluta a navegador */
  top: 100px;      /* 100px debajo de borde de navegador */
  left: 5px;        /* ajusta a borde de navegador */
  right: 5px;
  bottom: 60px;
  border-radius: 10px;
  border-color: black;
  border-width: 3px;
  border-style: solid;
  background: rgba(117, 111, 111, 1); /* gris si no hay mapa */
}

#reloj{
	display: block;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 10px;
	left: 30px;
	font-size: 4em;
	vertical-align: middle;
	border-width: 1px;
	border-style: solid;
	border-color: black;
	border-radius: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-right: 5px;
	padding-left: 5px;
	background-color: #AFE7AB;
}

#pendulo{
	top: 10px;
	right: 5px;
	height: 80px;
	position: absolute;
	border-width: 4px;
	border-color: orange;
	border-style: solid;
}

header{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  display: inline-block;
}

h1{
  	margin: 0 auto;
  	font-size: 2em;
  	line-height: 50px;
  	vertical-align:middle;
  	text-align: center; 
}

#botones{
	text-align: center;
}

.button{
  	border-radius: 5px;
 	font-family: 'Courier', cursive;
 	background-color: #AFE7AB;
  	font-weight: bold;
 	font-size: 1.5em;
 	border-color: black; 
 	border-style:solid;
 	border-width: 1px;
 	margin-top: 50px;
}

button:hover{
	background-color: #00FF80;
}

footer{
	position: absolute;
	bottom: 15px;
}