.container {margin: 0 auto; width: 100%; max-width: 940px; padding: 0}

h1 {text-align: center; margin-bottom: 40px;}
h2 {margin-bottom: 15px;}

/*.servico:first-child, :not(.servico) + .servico { border:none }*/

.servico {float: left; width: 100%; border-bottom: 1px solid #e1e1e1; padding-bottom: 15px; padding-top: 15px; position: relative;}

.servico b {float:left; font-size: 20px;}
.servico b:first-child {width: 60%;}
.servico span {float: right; width: 20px; height: 20px;  border-radius: 5em / 5em; border: 1px solid black; }

.firstline {background: #f1f1f1;}
.firstline b:last-child {float: right;}

.status1 {background-color: green;}
.status2, .status0 {background-color: #FFFF00; }
.status3 {background-color: #FF0000; }

.explicando {float: left; width: 100%; margin-top: 40px; position: relative;}
.legenda {float: left; clear: both; width: 100%; margin-bottom: 7px;}
.legenda span {float: left; width: 14px; height: 14px; margin-right: 7px; margin-top: 1px;  border-radius: 5em / 5em; border: 1px solid black;}

.posto1 {display: none} /*qunado posto está no ar nao mostra nada */
.posto0 {float: left; width: 100%; margin-top: 8px; color: #D21D1D; font-size: 15px;} /*quando posto está fora do ar*/

@media only screen and (max-width: 980px) {
	h1 {margin-top: 35px; float: left; width: 100%;}
	b {font-size: 16px; }
	b:first-child {width: 100%;}
	.firstline {background: white;}
	.firstline b {display: none;}
	span {position: absolute; right: 0; top: 23px;}
	.legenda span {position: relative; top: 0px;}
}