@charset "utf-8";
body, html{
	padding: 0px;
	margin: 0px;
	}

.calendario {
	width: 50%;
	height: 100vh;
	background-color: #ABC925;
	float: left;
}




.tiempo {
	width: 50%;
	height: 100vh;
	background-color: #ABC925;
	float: left;
}
.tiempo #icono {
	width: 50%;
	height: 100%;
	background-color: #ABC925;
	float: left;
	background: #563258;
}

.tiempo #datos {
	width: 50%;
	height: 100%;
	background-color: #ABC925;
	float: left;
}

.tiempo #datos #datos1 {
	width: 100%;
	height: 50%;
	background-color: #CF3033;
	clear: left;
}

.tiempo #datos #datos2 {
	width: 100%;
	height: 50%;
	background-color: #3045A4;
	clear: left;
}
#datos #datos1 .precipitacion {
	width: 50%;
	height: 100%;
	background-color: #823132;
	float: left;
}
#datos #datos1 #grados {
    width: 50%;
	height: 100%;
	background-color: #822532;
	float: left;
}

#datos #datos2 .humedad {
	width: 50%;
	height: 100%;
	background-color: #827832;
	float: left;
}

#datos #datos2 .viento {
	width: 50%;
	height: 100%;
	background-color: #856832;
	float: left;
}

.tiempo #gráfica {
	width: 100%;
	height: 25%;
	background-color: #564552;
	float: left;
}
.semana .dia .prox_mes {
	color: #D9D9D9;
}

.tiempo .uno {
	width: 100%;
	height: 75%;
}



tr th {
	height: 6vh;
	padding-top: 4vh;
}

tr td {
	text-align: center;
	height: 6vh;
	padding-top: 4vh;
}
.calendario .mes {
	width: 100%;
	height: 10vh;
	color: #FFFFFF;
	text-align: center;
	box-sizing: border-box;
	padding-top: 10vh;
	padding-bottom: 10vh;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}