/* Typography */
html, body {height: 100%;}
html {font-size: 100%;}
body {overflow-x:hidden;font-size: 12px;color: #000;background: #ffd8e6;font-family: Arial, Helvetica, sans-serif;}
h1, .h1, h2, .h2, h3, .h3 {margin-top: 20px;margin-bottom: 10px;}
h4, .h4, h5, .h5, h6, .h6 {margin-top: 10px;margin-bottom: 10px;}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {line-height: 1.1;}
h1 {font-size: 1em;opacity: 0;position: absolute;z-index: -1;}
h2{font-size: 1.5em;}
h3{font-size: 1.3em;}
h4{font-size: 1.2em;}
h5{font-size: 1em;}
h6{font-size: 0.857em;}
p {font-size: 1em;line-height:1.42857143;text-align:left;}
p {margin: 0 0 15px;}
.x-small{font-size:80%;}
a{text-decoration:none;color: #000;}
a:focus, a:hover {text-decoration:none;color: #000;}
/* END Tipography*/

#itemscope{display: none;}

/*HEADER*/
header{padding: 30px 60px;}
header img{height: 75px;}
header .last img{float: right;}
header h2{font-weight: 900;text-align: center;font-size: 2.5em;text-transform: uppercase;margin: 0;color: #FFF;line-height: 1em;}
header h2 span{color: #87a188;}

/*BODY*/
article{padding: 0px 60px;padding-bottom: 60px;}
.container_answer{margin-bottom: 30px;}
.box_img{background: #FFF;padding: 30px 60px;text-align: center;position: relative;}
.box_img img{position: absolute;left: 50%;top: 50%;-webkit-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);transform: translate(-50%,-50%);text-align: center;}
#box-1 img{height: 100px;}
#box-2 img{height: 80px;}
#box-3 img{height: 150px;}
#box-4 img{height: 120px;}
#box-5 img{height: 120px;}
.box_answer{background: #FFF;padding: 30px 60px;position: relative;}
.box_answer h3{margin: 0;font-weight: 600;font-size: 1.5em;margin-bottom: 30px;}
.box_answer h3 span{color: #87a188;}
.box_answer p{font-weight: 600;font-size: 2em;margin-bottom: 0;}
.vero_falso{display: inline-block;margin-top: 30px;}
.vero{background: #599e43;padding: 3px 12px;float: left;margin-right: 15px;cursor: pointer;}
.vero:hover, .vero.active{background: #6bbf51;}
.vero p{color: #FFF;text-align: center;margin: 0;font-size: 1.1em;font-weight: 400;line-height: 1.2em;}
.vero .big_text{font-size: 2em;font-weight: 600;}
.falso{background: #c4221a;padding: 3px 12px;float: left;cursor: pointer}
.falso:hover, .falso.active{background: #e0281e;}
.falso p{color: #FFF;text-align: center;margin: 0;font-size: 1.1em;font-weight: 400;line-height: 1.2em;}
.falso .big_text{font-size: 2em;font-weight: 600;}
.errore{position: absolute;left: 210px;bottom: 45px;display: none;}
.errore img{height: 24px !important;margin-top: -5px;margin-right: 5px;}
.errore p{display: inline-block;font-size: 1.1em !important;color: #db0000;margin: 0;}
.esatto{position: absolute;left: 210px;bottom: 45px;display: none;}
.esatto img{height: 24px !important;margin-top: -5px;margin-right: 5px;}
.esatto p{display: inline-block;font-size: 1.1em !important;color: #599e43;margin: 0;}

/*FOOTER*/
footer{padding: 30px 60px;}
footer p{color: #FFF;float: right;margin: 0;}
#page-foglio-rosa footer{position: fixed;bottom: 30px;right: 60px;padding: 0;}

@media (max-width: 1600px) {

}
@media (max-width: 1500px) {

}
@media (max-width: 1400px) {
    #box-1 img{height: 90px;}
    #box-2 img{height: 70px;}
    #box-3 img{height: 130px;}
    #box-4 img{height: 110px;}
    #box-5 img {height: 90px;}
    .box_answer p, .vero .big_text, .falso .big_text{font-size: 1.7em;}
    .falso, .vero{padding: 5px 12px;}
    .errore, .esatto {left: 230px;bottom: 50px;}    
}
@media (max-width: 1200px) {
    #box-1 img{height: 80px;}
    #box-2 img{height: 60px;}
    #box-3 img{height: 120px;}
    #box-4 img{height: 100px;}
    #box-5 img {height: 80px;}
    .errore img, .esatto img {height: 18px !important;margin-top:-3px;}
    .errore p, .esatto p{font-size: 1em !important;}
    .errore, .esatto {left: 220px;bottom: 50px;}    
}
@media (max-width: 992px) {
    article {padding: 0px 15px;}
    header {padding: 30px 15px;}
    footer {padding: 30px 15px;}
    #page-foglio-rosa footer{bottom: 30px;right: 30px;}
    #box-1 img{height: 70px;}
    #box-2 img{height: 50px;}
    #box-3 img{height: 110px;}
    #box-4 img{height: 90px;}
    #box-5 img {height: 60px;}
    .box_answer h3{font-size: 1.2em;}
    .box_answer p, .vero .big_text, .falso .big_text{font-size: 1.5em;}
    .box_answer, .box_img{padding: 15px 30px;}
    .errore, .esatto {left: 175px;bottom: 35px;}
}
@media (max-width: 767px) {
    header img {height: 45px;}
    header h2{font-size: 1.8em;}
    header .col-sm-3{width: 25%;}
    header .col-sm-6{width: 50%;}
    article .col-sm-4{width: 33.33333333%;padding-right: 5px;}
    article .col-sm-8{width: 66.66666667%;padding-left: 5px;}
    #box-1 img{height: 55px;}
    #box-2 img{height: 35px;}
    #box-3 img{height: 95px;}
    #box-4 img{height: 75px;}
    #box-5 img {height: 30px;}
    .box_answer{padding: 30px 15px;}
    .box_img {padding: 15px;}
    .box_answer p, .vero .big_text, .falso .big_text {font-size: 1.2em;}
    .box_answer h3 {font-size: 1em;margin-bottom: 15px;}
    .container_answer{margin-bottom: 15px;}
    .vero_falso{margin-top: 15px;}
    .errore, .esatto {left: 15px;bottom: 8px;}
    div#white-player{text-align: initial !important;width: calc(100% - 15px) !important;position: static !important;-webkit-transform: none !important;-ms-transform: none !important;transform: none !important;margin-top: 0px !important;}
    div#white-player-center img.main-album-art{margin-bottom: 30px !important;}
    #white-player-center{padding-top: 15px !important;}
    div#white-player-controls{padding-bottom: 15px !important;}
    #page-foglio-rosa footer{position: static;margin-top: 30px;padding-bottom: 30px;margin-right: 15px;}
}
@media (max-width: 375px) and (max-height: 600px) {
    
}
@media (max-width: 320px) {
}