html, body{padding:0;margin:0;width: 100%;height: 100%;font-family: 'Montserrat'}
*{box-sizing:border-box;}
a{color: inherit;}
.wpClima{padding: 0 80px;width: 100%;position: relative;padding-top: 140px;}
.wpClima h1{font-size: 90px;text-transform: uppercase;color: #d8d5ce;display: flex;flex-wrap: wrap;padding-bottom: 10px;border-bottom: 1px solid #8d8a8a;font-weight: 900;align-items: flex-end;justify-content: space-between;margin-bottom: 70px;}
.wpClima h1 small{font-size: 35px;font-weight: 700;text-transform: initial;}
.current_day{display: flex;flex-wrap: wrap}
.buttons{
	float: right;
	position: relative;
	color: #413c3c;
	font-size: 20px;
}
.buttons a{display: block;width: 260px;height: 85px;padding: 20px;background-color: #e6e6e6;margin-bottom: 4px;display: flex;align-items: center;}
.current_day .card{
	width: 500px;
	background-color: #16be87;
	color: #FFF;
	padding: 40px;
	padding-bottom: 0;
	position: relative;
}
.current_day .card .day_name,
.current_day .card .day_num_month{font-size: 40px;font-weight: 700;text-transform: uppercase;}
.current_day .card .day_num_month{font-size: 18px;margin-top: 10px;}
.current_day .card .temp_ico{display: flex;align-items: center;justify-content: space-between;margin: 40px 0;}
.current_day .card .temp_ico img{filter: brightness(100);width: 30%;}
.current_day .card .temp_ico .grd *{display: block;font-weight: 700;font-size: 60px;}
.current_day .card .temp_ico .grd small{font-size: 16px;text-transform: uppercase;margin-top: 15px;}
.current_day .card .tmps{margin-bottom: 40px;line-height: 1.6;font-size: 20px;}
.current_day .card .sol{width: calc(100% + 80px);margin-left: -40px;padding: 36px 40px;font-size:22px;display: flex;flex-wrap: wrap;align-items: center;background-color: #2b5749}
.current_day .card .sol .sol_ico{width: 40%;display: flex;align-items: center;}
.current_day .card .sol .sol_ico img{width: 50px;margin-right: 10px;}
.current_day .card .sol .salida:before{
	content: url(../icon_clima/icon-salida-sol.svg);
	width: 10px;
	top: 0;left: 0;
	position: absolute;
}
.current_day .card .sol .puesta:before{
	content: url(../icon_clima/icon-presion.svg);
	width: 10px;
	top: 0;left: 0;
	position: absolute;
}
.current_day .card .sol .salida,
.current_day .card .sol .puesta{width: 30%;padding-left: 15px;position: relative;}
.current_day .hora_datos{width: 100%;font-size: 15px;color: #413c3c;font-weight: 700;padding: 20px 0 40px;}
.current_day .list{padding-left: 40px;font-size: 22px;color: #413c3c;}
.current_day .list h4{text-transform: uppercase;margin-bottom: 30px;}
.current_day .list .dt{position: relative;padding:10px 0;border-top:1px solid #413c3c;min-height: 90px;min-width: 200px;position: relative;}
.current_day .list .dt strong{display: block;margin-bottom: 4px;}
.current_day .list .dt img{position: absolute;top: 10px;right: 0;max-height:30px;max-width: 30px;}

.extended{display: flex;justify-content: space-between;flex-wrap: wrap;color: #fff;margin-bottom: 80px;}
.extended > div{width: calc(20% - 4px);text-align: center;padding: 30px;background-color: #2b5749;position: relative;}
.extended > div:nth-child(2){background-color: #1e6a51}
.extended > div:nth-child(3){background-color: #188762}
.extended > div:nth-child(4){background-color: #1fa176}
.extended > div:nth-child(5){background-color: #16be87}
.extended h4{font-size: 22px;text-transform: uppercase;margin: 10px 0;}
.extended img{filter: brightness(100);margin: 40px 0;width: 100px;height: 100px;}
.extended > div > div.tmp{font-size: 40px;font-weight: 700}
.extended > div > div.tmp small{display:block;font-size: 20px;font-weight: 400;margin-bottom: 5px;}
.extended > div > div.mxmn{line-height:1.3;font-weight:700;text-align: left;width: 100%;padding-top: 20px;margin-top: 20px;border-top: 1px solid #FFF;}
.extended > div a.verExtended{position: absolute;color: #222;width: 100%;text-align: center;bottom: -25px;left: 0;font-weight: 700;font-size: 14px;}

.tabla_dias {color: #413c3c;}
.tabla_dias h3{font-size: 24px;text-transform:uppercase;padding-bottom: 10px;border-bottom: 1px solid #413c3c;margin-bottom: 30px;}
.tabla_dias .day_x_hs{margin-bottom: 50px;}
.tabla_dias .day_x_hs div.row{display: flex;width: 100%;border-bottom: 1px solid #413c3c;}
.tabla_dias .day_x_hs div.row.head{font-weight: 700;line-height: 50px;margin-bottom: 20px;border-bottom: none;background-color: #e6e4de;}
.tabla_dias .day_x_hs div.row > div{min-width: 14.3%;text-align: center;white-space: nowrap;padding: 0 20px;display: flex;align-items: center;line-height: 50px;}
.tabla_dias .day_x_hs div.row:not(.head) > div.ds{text-transform: uppercase;font-size:14px;}
.tabla_dias .day_x_hs div.row .hs{min-width: 175px;justify-content: space-between;}
.tabla_dias .day_x_hs div.row .hs img{width: 30px;}


@media (max-width:900px) {
	.wpClima{padding: 0 20px;padding-top: 80px;padding-right: 40px;}
	.wpClima h1{flex-direction: column;align-items: center;margin-bottom: 25px;font-size: 50px}
	.wpClima h1 small{font-size: 20px}
	.current_day .card{padding: 20px;padding-bottom: 0}
	.current_day .card .sol{width: calc(100% + 40px);margin-left: -20px;padding: 20px;font-size: 16px;}
	.current_day .card .sol .sol_ico img{width: 35px;}
	.current_day .list{padding: 30px 20px;width: 100%}
	.extended{margin-bottom: 50px;}
	.extended > div{min-width: 100%;margin: 0 0px 50px;display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;}
	.extended > div h4{width: 100%;text-align: left;order:-2;margin-bottom: 0;}
	.extended > div > div.tmp{order: -1;text-align: left;font-size: 30px;}
	.extended img{width: 80px;height: 80px;margin: 20px 0;}
	.extended > div > div.mxmn{margin-top: 0;padding-top: 15px;}
	.tabla_dias .day_x_hs div.row{font-size: 12px;}
	.tabla_dias .day_x_hs div.row > div{padding: 0 3px;min-width: 10%;}
	.tabla_dias .day_x_hs div.row.head > div{overflow: hidden;}
	.tabla_dias .day_x_hs div.row .hs{min-width: 100px}
	.tabla_dias .day_x_hs div.row .ps{min-width: 56px}
	.tabla_dias .day_x_hs div.row > div.ds{display: none;}

	.tabla_dias .day_x_hs div.row.head > div{font-size: 0;}
	.tabla_dias .day_x_hs div.row.head > div.hs:before{content: 'Hora';font-size: 14px;}
	.tabla_dias .day_x_hs div.row.head > div.tm:before{content: 'Tem';font-size: 14px;display: block;text-align: center;width: 100%}
	.tabla_dias .day_x_hs div.row.head > div.ps:before{content: 'Pre';font-size: 14px;display: block;text-align: center;width: 100%}
	.tabla_dias .day_x_hs div.row.head > div.hm:before{content: 'Hum';font-size: 14px;display: block;text-align: center;width: 100%}
	.tabla_dias .day_x_hs div.row.head > div.nb:before{content: 'Nub';font-size: 14px;display: block;text-align: center;width: 100%}
	.tabla_dias .day_x_hs div.row.head > div.vn:before{content: 'Viento';font-size: 14px;display: block;text-align: center;width: 100%}

	.buttons{
		float: none;
		position: relative;
		color: #413c3c;
		font-size: 16px;
		margin-bottom: 20px
	}
	.buttons a{display: block;width: 100%;height: 45px;padding: 20px;background-color: #e6e6e6;margin-bottom: 4px;display: flex;align-items: center;}
}



