p {
   background-image: url("../images/semaforo.png");
   background-repeat: no-repeat;
   background-position: center;
   height: 71px;
}
.semaforo_verde {
    height: 33px;
    width: 33px;
    margin-top: 19px;
    background: rgba(0, 0, 0, 1.0);
    border-radius: 50%;
    display: inline-block;
}
.semaforo_giallo {
    height: 33px;
    width: 33px;
    margin-left: 3px;
    background: rgba(0, 0, 0, 1.0);
    border-radius: 50%;
    display: inline-block;
}
.semaforo_rosso {
    height: 33px;
    width: 33px;
    margin-left: 3px;
    background: rgba(0, 0, 0, 1.0);
    border-radius: 50%;
    display: inline-block;
}
.testo_qa1:before {
   content: "Aria eccellente";
   display: block;
   text-align: center;
}
.testo_qa2:before {
   content: "Aria accettabile";
   display: block;
   text-align: center;
}
.testo_qa3:before {
   content: "Aria sufficiente";
   display: block;
   text-align: center;
}
.testo_qa4:before {
   content: "Aria scadente";
   display: block;
   text-align: center;
}
.testo_qa5:before {
   content: "Aria pessima";
   display: block;
   text-align: center;
}
.semaforo_verde_blink {
    height: 33px;
    width: 33px;
    margin-top: 19px;
    background: rgba(0, 128, 0, 1.0);
    border-radius: 50%;
    animation: blinkingBackground 2s step-start infinite;
    display: inline-block;
}
.semaforo_giallo_blink {
    height: 33px;
    width: 33px;
    margin-left: 3px;
    background: rgba(254, 233, 44, 1.0);
    border-radius: 50%;
    animation: blinkingBackground 2s step-start infinite;
    display: inline-block;
}
.semaforo_rosso_blink {
    height: 33px;
    width: 33px;
    margin-left: 3px;
    background: rgba(255, 0, 0, 1.0);
    border-radius: 50%;
    animation: blinkingBackground 2s step-start infinite;
    display: inline-block;
}
@keyframes blinkingBackground {
    50% { background-color: #000000; }
}