* {
    box-sizing: border-box;
}

.row:after {
    content: "";
    clear: both;
    display: block;
}

[class*="col-"] {
    float: left;
    padding: 1px;
}

html { font-family: Verdana, "Lucida Sans", sans-serif; font-size: 18px; }

h1 { color: #ffffff; font-size: 22px; text-align:center; font-weight: bold; background-color:#000000; border-radius:25px; padding:5px; }

h2 { font-size: 32px; text-align:center; font-weight: bold; padding: 120px 0px; }

.quiz { padding: 12px 10px; background-image: url("elementi/sf1.jpg"); text-align:justify; line-height: 1.6; box-shadow: 0 2px 3px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.24); border-radius:10px; border:solid 1px #FFCC00 }

.quiz a { text-decoration:none; font-weight:bold; background-color:#ffffff; border:solid 1px #ffcc00; color:#000; padding: 8px 5px; border-radius:5px; font-family:"Lato",sans-serif; box-shadow: 3px 2px 3px rgba(0,0,0,0.24), 3px 2px 3px rgba(0,0,0,0.24) }
.quiz a:visited { text-decoration:none; font-weight:bold; background-color:#ffffff; border:solid 1px #ffcc00; color:#000; padding: 8px 5px; border-radius:5px; font-family:"Lato",sans-serif; box-shadow: 3px 2px 3px rgba(0,0,0,0.24), 3px 2px 3px rgba(0,0,0,0.24) }
.quiz a:hover { border:solid 1px #ff6600; background-color:#ffcc66; text-decoration:none; font-weight:bold; color:#FF0000; padding: 6px 5px; border-radius:5px; box-shadow: 3px 2px 3px rgba(0,0,0,0.24), 3px 2px 3px rgba(0,0,0,0.24) }

.mezzo { text-align: center; }

hr.new { border-top: 1px solid; color: #993300; }

.footer { background-image: url("elementi/spirale.gif"); padding: 15px 0px 25px 0px; }
.footer A:link { COLOR: #330000; TEXT-DECORATION: none; font-weight:bold; padding: 6px 5px;}
.footer A:visited { COLOR: #330000; TEXT-DECORATION: none; font-weight:bold; padding: 6px 5px;}
.footer A:hover { COLOR: #FF0000; TEXT-DECORATION: none; background-color:yellow; font-weight:bold; padding: 6px 5px;}

.respo { max-width: 100%; height: auto; }

.barra{padding:20px 0; }
.barra a{display:inline-block; background-image: url("elementi/button.jpg"); text-decoration:none; COLOR: #330000; font-weight:bold; padding:0px 20px; height:35px; border:solid 1px #e7e7e7; line-height:28px; border-radius:5px}
.barra a:hover{display:inline-block; background-image: url("elementi/back1.gif"); text-decoration:none; COLOR: #FF0000; font-weight:bold; padding:0px 20px; height:35px; border:solid 1px #ff0000; line-height:28px; border-radius:5px}

/* For desktop: */
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    	font-size: 16px;
    }

}