
.widget-meteo * {margin:0;padding:0;text-decoration:none;border:none; box-sizing: border-box;}
.widget-meteo { height:236px; margin: 0 0 24px;position: relative;background: #fdfdfd; border-top: 2px #b5b5b5 solid; }


.widget-meteo:before { content: ''; width: 16px; height: 2px; background-color: #007CFF; position: absolute; top: -2px; left: -1px; z-index: 100;}
.widget-meteo:after { content: ''; width: 4px; height: 2px; position: absolute; top: -2px; left: 16px; background: #fdfdfd;}

/*Label*/
.widget-meteo_label {display: inline-block;position: relative;font-size: 13px;line-height: 13px;font-weight: 500; color:#454545; margin: 0 0 20px;padding: 14px 0 14px 16px; text-transform: uppercase;}

/* Cambia città */
.widget-meteo_switch { display: block; position: absolute; top: 10px; right: 10px; background: #454545; font-size: 11px; color: #fff; padding: 6px 16px; text-transform: uppercase;}
.widget-meteo_switch:hover { background: #087BBA;}


.widget-meteo_timegroup { width:452px; height:180px; margin:0 auto;}
.widget-meteo_timegroup li { width:132px; height:55px; margin-left:20px; line-height:55px; list-style-type: none; border:1px solid #dedede; border-width:0 0 1px 0; display: inline-block; font-size: 13px;}
.widget-meteo_timegroup li:last-child {border-width:0 0 0 0;}
.widget-meteo_timegroup li.current { width:295px; height:160px; float:left; overflow:hidden; border-width:0 1px 0 0; line-height: 27px; font-size: 26px; margin-left:0; padding-top:10px;}
.widget-meteo_timegroup li.current a span {display:block;font-weight: 700;white-space: nowrap;}
.widget-meteo_timegroup li.current a .city {text-overflow: ellipsis;overflow: hidden;}

.widget-meteo_timegroup li.current a time, .widget-meteo_timegroup li.current a .day {font-weight: 400;}
.widget-meteo_timegroup li.current a time {font-size: 20px; color:#999;}
.widget-meteo_timegroup li.current a .temperature { font-size: 60px;margin-top:15px;}
.widget-meteo_timegroup li.current a .image { width:125px; height:125px; background-size:cover; margin-top:15px;}
.widget-meteo_timegroup li a {display:block; color:#3B3B3B;}
.widget-meteo_timegroup li a .image  { width:40px; height:40px; float:left; margin:8px 20px 0 0; background: url('//www.repstatic.it/cless/common/widget/meteo/2017-v1/img/sprite-meteo.svg')0 0 no-repeat;}


/* Sprite Meteo Mattina Pomeriggio  */
.widget-meteo_timegroup li.current a.morning.sereno .image { background-position: 0 -1897px;}
.widget-meteo_timegroup li a.morning.sereno .image { background-position: 0 -608px;}

.widget-meteo_timegroup li.current a.morning.poco-nuvoloso .image { background-position: 0 -122px;}
.widget-meteo_timegroup li a.morning.poco-nuvoloso .image { background-position: 0 -39px;}
.widget-meteo_timegroup li.current a.morning.parz-nuvoloso .image { background-position: 0 -122px;}
.widget-meteo_timegroup li a.morning.parz-nuvoloso .image { background-position: 0 -39px;}

.widget-meteo_timegroup li.current a.morning.molto-nuvoloso .image { background-position: 0 -479px;}
.widget-meteo_timegroup li a.morning.molto-nuvoloso .image { background-position: 0 -153px;}

.widget-meteo_timegroup li.current a.morning.var-rovesci-30 .image { background-position: 0 -239px;}
.widget-meteo_timegroup li a.morning.var-rovesci-30 .image { background-position: 0 -77px;}

.widget-meteo_timegroup li.current a.morning.var-rovesci-90 .image { background-position: 0 -358px;}
.widget-meteo_timegroup li a.morning.var-rovesci-90 .image { background-position: 0 -115px;}

.widget-meteo_timegroup li.current a.morning.pioggia-30 .image { background-position: 0 -594px;}
.widget-meteo_timegroup li a.morning.pioggia-30 .image { background-position: 0 -190px;}
.widget-meteo_timegroup li.current a.morning.pioggia-60 .image { background-position: 0 -594px;}
.widget-meteo_timegroup li a.morning.pioggia-60 .image { background-position: 0 -190px;}
.widget-meteo_timegroup li.current a.morning.pioggia-90 .image { background-position: 0 -594px;}
.widget-meteo_timegroup li a.morning.pioggia-90 .image { background-position: 0 -190px;}

.widget-meteo_timegroup li.current a.morning.temporale .image { background-position: 0 -710px;}
.widget-meteo_timegroup li a.morning.temporale .image { background-position: 0 -227px;}

.widget-meteo_timegroup li.current a.morning.neve-moderata .image { background-position: 0 -829px;}
.widget-meteo_timegroup li a.morning.neve-moderata .image { background-position: 0 -266px;}

.widget-meteo_timegroup li.current a.morning.neve-forte .image { background-position: 0 -949px;}
.widget-meteo_timegroup li a.morning.neve-forte .image { background-position: 0 -303px;}

.widget-meteo_timegroup li.current a.morning.pioggia-neve .image { background-position: 0 -1066px;}
.widget-meteo_timegroup li a.morning.pioggia-neve .image { background-position: 0 -341px;}

.widget-meteo_timegroup li.current a.morning.foschia .image { background-position: 0 -1187px;}
.widget-meteo_timegroup li a.morning.foschia .image { background-position: 0 -379px;}

.widget-meteo_timegroup li.current a.morning.nebbia .image { background-position: 0 -1305px;}
.widget-meteo_timegroup li a.morning.nebbia .image { background-position: 0 -417px;}


/* Sprite Meteo Sera Notte */
.widget-meteo_timegroup li.current a.evening.sereno .image { background-position: 0 -1422px;}
.widget-meteo_timegroup li a.evening.sereno .image { background-position: 0 -455px;}

.widget-meteo_timegroup li.current a.evening.poco-nuvoloso .image { background-position: 0 -1540px;}
.widget-meteo_timegroup li a.evening.poco-nuvoloso .image { background-position: 0 -493px;}
.widget-meteo_timegroup li.current a.evening.parz-nuvoloso .image { background-position: 0 -1540px;}
.widget-meteo_timegroup li a.evening.parz-nuvoloso .image { background-position: 0 -493px;}

.widget-meteo_timegroup li.current a.evening.molto-nuvoloso .image { background-position: 0 -479px;}
.widget-meteo_timegroup li a.evening.molto-nuvoloso .image { background-position: 0 -153px;}

.widget-meteo_timegroup li.current a.evening.var-rovesci-30 .image { background-position: 0 -1657px;}
.widget-meteo_timegroup li a.evening.var-rovesci-30 .image { background-position: 0 -531px;}

.widget-meteo_timegroup li.current a.evening.var-rovesci-90 .image { background-position: 0 -358px;}
.widget-meteo_timegroup li a.evening.var-rovesci-90 .image { background-position: 0 -115px;}

.widget-meteo_timegroup li.current a.evening.pioggia-30 .image { background-position: 0 -594px;}
.widget-meteo_timegroup li a.evening.pioggia-30 .image { background-position: 0 -190px;}
.widget-meteo_timegroup li.current a.evening.pioggia-60 .image { background-position: 0 -594px;}
.widget-meteo_timegroup li a.evening.pioggia-60 .image { background-position: 0 -190px;}
.widget-meteo_timegroup li.current a.evening.pioggia-90 .image { background-position: 0 -594px;}
.widget-meteo_timegroup li a.evening.pioggia-90 .image { background-position: 0 -190px;}

.widget-meteo_timegroup li.current a.evening.temporale .image { background-position: 0 -710px;}
.widget-meteo_timegroup li a.evening.temporale .image { background-position: 0 -227px;}

.widget-meteo_timegroup li.current a.evening.neve-moderata .image { background-position: 0 -829px;}
.widget-meteo_timegroup li a.evening.neve-moderata .image { background-position: 0 -266px;}

.widget-meteo_timegroup li.current a.evening.neve-forte .image { background-position: 0 -949px;}
.widget-meteo_timegroup li a.evening.neve-forte .image { background-position: 0 -303px;}

.widget-meteo_timegroup li.current a.evening.pioggia-neve .image { background-position: 0 -1066px;}
.widget-meteo_timegroup li a.evening.pioggia-neve .image { background-position: 0 -341px;}

.widget-meteo_timegroup li.current a.evening.foschia .image { background-position: 0 -1776px;}
.widget-meteo_timegroup li a.evening.foschia .image { background-position: 0 -568px;}

.widget-meteo_timegroup li.current a.evening.nebbia .image { background-position: 0 -1305px;}
.widget-meteo_timegroup li a.evening.nebbia .image { background-position: 0 -417px;}


@media (max-width: 767px) {

  .widget-meteo {border-top: 2px #b5b5b5 solid;}
  .widget-meteo:before {height: 2px; top: -2px;}
  .widget-meteo:after {height: 2px; top: -2px; }
}

@media only screen and (max-width:480px) {
	.widget-meteo {height: 395px;}
	.widget-meteo_timegroup {width:100%; padding:0 15px 0 15px}
	.widget-meteo_timegroup li { width:100%; display: block; margin-left:0; border-width:1px 0 0 0;}
	.widget-meteo_timegroup li:first-child { border-width:0;}
	.widget-meteo_timegroup li:last-child { border-width:1px 0 0 0;}
	.widget-meteo_timegroup li.current { width:100%; height:100%; float:none; margin:0 auto; padding-top:5px; border-right:0;}
}