* {
    box-sizing: border-box;
}
.row:after {
    content: "";
    clear: both;
    display: block;
}
[class*="col-"] {
    float: left;
    padding: 2px;
}

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

.header { color: #663300; font-size: 22px; text-align:center; }

h1 {font-size:1.8888888889rem;font-family:"Lato",sans-serif;margin:1.1111111111rem 0}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.barra{padding:20px 0; text-align:center;}
.barra a{padding: 12px 15px 15px 15px; border:solid 1px #c2c2c2; line-height:25px; border-radius:25px; color: #660000; }
.barra a:hover{border:solid 1px #ffcc00; background-image: url("elementi/back2.gif"); color:#fff; text-decoration:none;}

.centro { margin-left: auto; margin-right: auto; text-align: center; }

.linea {line-height: 1.6;}

.menu li {
    	padding: 15px 5px 15px 5px;
    	margin-bottom: 20px;
    	background-image: url("elementi/ask.png");
    	text-align: center;
    	color: #330000; 
    	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	border-radius:5px
}

.menu li:hover {
    	padding-top: 15px;
    	padding-bottom: 15px;
    	margin-bottom: 20px;
    	background-image: url("elementi/ask3.png");
    	color: #ffffff;
}

.nota { text-align:center; background-image: url("elementi/foglio.gif"); }

.note2 { margin-top: 10px; }

.note2 li { padding: 20px 15px; background-image: url("elementi/foglio.gif"); 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:5px; border:solid 1px #ff0000; }

.quiz { height: 90px; margin-top: 10px; }

.quiz li {
    	padding-top: 15px;
    	padding-bottom: 15px;
    	margin-bottom: 10px;
    	background-image: url("elementi/ask.png");
    	text-align: center;
    	color: #330000; 
    	box-shadow: 0 2px 3px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.24);
	border-radius:5px
}

.quiz2 { height: 90px; margin-top: 10px; }

.quiz2 li {
    	padding: 15px 5px 15px 5px;
    	background-image: url("elementi/ask3.png");
    	text-align: center;
    	color: #330000; 
    	box-shadow: 0 2px 3px rgba(0,0,0,0.12), 0 2px 2px rgba(0,0,0,0.24);
	border-radius:5px
}

.quiz3 { height: 90px; margin-top: 10px; }
.quiz3 li { padding: 15px 5px 15px 5px; text-align: center; color: #000000; }

.sbaglio li {
    	padding: 15px 5px 15px 5px;
    	margin-bottom: 20px;
    	text-align: center;	
	background-color: #EB0000;
    	color: #ffffff;
    	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	border-radius:5px
}

.sbaglio li:hover { padding-top: 15px; padding-bottom: 15px; margin-bottom: 20px; color: #ffffff; }

.giusto li {
    	padding: 15px 5px 15px 5px;
    	margin-bottom: 20px;
    	text-align: center;
	background-color: #008A00;
    	color: #ffffff;
    	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	border-radius:5px
}

.giusto li:hover { padding-top: 15px; padding-bottom: 15px; margin-bottom: 20px; color: #ffffff; }

A:link { COLOR: #330000; TEXT-DECORATION: none; }

A:visited { COLOR: #330000; TEXT-DECORATION: none; }

.mezzo { vertical-align: middle; }

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

.lato { vertical-align: middle; text-align: center; font-size: 14px; margin: 9px 0px 7px 0px; }

.footer { background-image: url("elementi/pp4.gif"); padding: 15px 0px 25px 0px; }

.footer A:hover { COLOR: #FF0000; TEXT-DECORATION: none; background-color:yellow; }

.piccolo { float: right; vertical-align: middle; font-size: 11px; }

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

.tab26 { width: 100%; }
.tab26 input[type=button],.tab26 table input[type=button],.tab26 input[type=submit],.tab26 table input[type=submit]{height:40px; color:#fff; border-radius:20px; background-color:#00dad6; font-size: 20px; font-weight:400; line-height:1.6; padding:0 20px}
.tab26 input[type=reset] {height:40px; color:#fff; border-radius:20px; background-color:#00dad6; font-size: 20px; font-weight:400; line-height:1.6; padding:0 20px}

/* 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;
    }
}