/*** CSS RESET *****************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strong, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {
    line-height: 1;
}
a{
    outline: 0;
}
/********************/
html, body {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 18px;
	margin:0px;
	padding:0px;
	line-height:1.3;
	height: 100%;
	color: #000;
	font-weight: 400;
}
img {
	border:0px;
}
div {
	outline: none;
}
a{
	color:#e31818;
	text-decoration: underline;
}
a:hover{
}
p{
	margin:0px;
	margin-bottom:6px;
}
h1{
	font-size: 38px;
    margin-top: 20px;
}
h2{
	font-size: 30px;
}
h3{
	font-size: 25px;
}
h4{
	font-size: 21px;
}
h5{
	font-size: 18px;
}
h6{
	font-size: 17px;
}
h1, 
h2, 
h3, 
h4, 
h5, 
h6
{
	/*font-weight: 400;*/
    line-height: 1.1;
}
h1 > strong, h2 > strong, h3 > strong, h4 > strong, h5 > strong, h6 > strong {
    font-weight: 700;
}
hr {
	border:0px;
	border-bottom:1px solid #d7d7d7;
	height:1px;
	margin:25px 0px;
}
input, select, textarea, button {
	font-family: 'Roboto Condensed', sans-serif;
    font-size: 16px;
}
ul {
	margin:0px;
	padding:0px;
}
ol, ul {
	list-style: none outside none;
}
.maiuscolo {
	text-transform:uppercase;
}
.rosso {
	color: #df061b;
}
.layout ul li {
	list-style-type:disc;
	margin-left: 20px;
}
.layout ol li {
	list-style-type:decimal;
	margin-left: 40px;
}
/* editor */
.red {
	color:#e31818;	
}
.gray-box {
	background:#f5f5f5;
	padding: 20px;
}
.red-button {
	font-family: 'Roboto Condensed', sans-serif;
	display:inline-block;
	text-transform:uppercase;
	text-decoration:none !important;
	padding: 20px 35px;
	color:#ffffff !important;
	font-weight: 700;
	margin: 20px 0;
	background: #e2001a;
    border: 0;
}
.red-button:hover {
	text-decoration: none;
	background: #494949;
}
.pulsante-verde {
	font-family: 'Roboto Condensed', sans-serif;
	display:inline-block;
	text-transform:uppercase;
	text-decoration:none !important;
	padding: 15px 15px;
	color:#ffffff !important;
	font-weight: 700;
	margin: 10px 0;
    background-color: #27ae2e;
    border-radius: 5px;
    border: 0;
    font-size: 28px;
}
.pulsante-verde:hover {
	text-decoration: none;
	background: #494949;
}




.header {
    position: fixed;
    padding: 50px 0;
    width: 100%;
    z-index: 1;
}
.footer {
    position: fixed;
    padding: 20px 0;
    width: 100%;
    z-index: 1;
    bottom: 0;
    transition: background-color 300ms;
    color: #fff;
}
body:not(.fp-viewing-0) .footer {
    background-color: #df061b;
}
.footer a {
    color: #fff;
}
.footer .social {
    margin: 0 50px;
}
.footer .social ul {
    list-style-type: none;
}
.footer .social ul li {
    float: left;
    margin-right: 8px;
}
.footer .backtop {
    display: none;
    position: absolute;
    left: 50%;
    margin: 5px 0;
    margin-left: -25px;
}
.footer .backtop img {
    display: block;
}
body.fp-viewing-1 .footer .backtop,
body.fp-viewing-2 .footer .backtop {
    margin-left: -45px;    
}
.footer .freccia-giu-w {
    display: none;
    position: absolute;
    left: 50%;
    margin: 5px 0;
    margin-left: 0px;
}
.footer .freccia-giu-w img {
    display: block;
}
.footer .freccia-giu {
    content: url(../images/freccia-giu.svg);
    position: absolute;
    bottom: 20px;
    left: 50%;
    right: 0;
    margin-left: -25px;
    animation: bounce 2s infinite;
    z-index: 1;
    display: none;
}
body:not(.fp-viewing-0) .footer .backtop,
body:not(.fp-viewing-0):not(.fp-viewing-3) .footer .freccia-giu-w {
    display: block;
}
body.fp-viewing-0 .footer .freccia-giu {
    display: block;
}
.footer .privacy {
    float: right;
    margin: 0 50px;
    padding: 10px 0;
    color: #000;
    font-size: 12px;
}
body:not(.fp-viewing-0) .footer .privacy {
    color: #fff;
}
.footer .privacy a {
    background-color: #df061b;
    padding: 8px 15px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 15px;
    margin-left: 10px;
}
body:not(.fp-viewing-0) .footer .privacy a {
    background-color: #fff;
    color: #df061b;
}
.logo {
    float: left;
    margin-left: 50px;
}
.logo .st1 {
    transition: fill 300ms;
}
body:not(.fp-viewing-0) .logo .st1 {
    fill: #df061b;
}
.fiera {
    float: right;
    background-color: #fff;
    padding: 5px 20px;
    transition: background-color 300ms;
    position: relative;
}
.fiera::after {
    content: url(../images/ombra-fiera.png);
    position: absolute;
    left: 0;
    top: 100%;
}
body:not(.fp-viewing-0) .fiera {
    background-color: #df061b;
}
.fiera img {
    float: left;
    margin-right: 15px;
    margin-top: 12px;
    display: block;
}
.fiera .fiera-logo-r {
    display: none;
}
.fiera .data {
    float: left;
    font-weight: 700;
    font-style: oblique;
    color: #df061b;
    font-size: 43px;
    padding-right: 5px;
    margin-top: 5px;
    margin-bottom: 0;
}
.fiera .stand {
    font-weight: bold;
    font-size: 24px;
    margin-bottom: 0;
}
body:not(.fp-viewing-0) .fiera .data,
body:not(.fp-viewing-0) .fiera .stand {
    color: #fff;
}
body:not(.fp-viewing-0) .fiera .fiera-logo {
    display: none;
}
body:not(.fp-viewing-0) .fiera .fiera-logo-r {
    display: block;
}
.lingue {
    clear: both;
    float: right;
    padding: 5px 15px;
    margin: 30px 25px;
    position: relative;
    transition: 300ms;
}
.lingue svg {
    display: block;
}
.lingue svg .st0 {
    transition: 300ms;
    fill: #fff;
}
body:not(.fp-viewing-0) .lingue svg .st0,
.lingue.hover svg .st0 {
    fill: #E20917;
}
.lingue.hover {
    background-color: #fff;
    border-radius: 5px 5px 0 0;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
.lingue ul {
    position: absolute;
    right: 0;
    background-color: #fff;
    border-radius: 5px 0 5px 5px;
    text-align: right;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
    height: 0;
    overflow: hidden;
    opacity: 0;
    margin: 5px 0;
    transition: opacity 300ms linear 150ms;
}
.lingue.hover ul {
    padding: 20px;
    height: auto;  
    opacity: 1;
}
.lingue.hover li a {
    text-decoration: none;    
}
.lingue.hover li.sel a {
    font-weight: bold;
    color: #333;
}
.cnt {
    height: 100%;
}
.cnt section {
    width: 100%;
    height: 100%;
}
.home {
    background-image: url(../images/home.jpg);
    background-position: center center;
    background-size: cover;
    height: 100%;
}
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
	40% {
        transform: translateY(-20px);
    }
	60% {
        transform: translateY(-10px);
    }
}
.home .testo {
    color: #fff;
    padding: 50px;
    width: 30%;
}
.home .testo h1 {
    font-size: 60px;
    font-family: 'revolution-gothic', sans-serif;
    font-style: italic;
    font-weight: 700;
    line-height: 0.9;
}
.ru .home .testo h1 {
    font-size: 40px;
    font-family: 'Roboto Condensed', sans-serif;
}
.home .testo p {
    font-size: 28px;
    font-weight: 300;
    line-height: 1.1;
    margin: 30px auto;
}
.ru .home .testo p {
    font-size: 24px;
}
.layout1,
.layout2 {
    font-size: 30px;
    letter-spacing: -1px;
    width: 90%;
    position: relative;
}
.layout2 {
    margin-left: 10%;
}
.layout1 .titolo,
.layout2 .titolo {
    font-family: 'Archivo Black', sans-serif;
    letter-spacing: 3px;
    background-color: #df061b;
    text-shadow:
        -1px -1px 0 #fff,  
        1px -1px 0 #fff,
        -1px 1px 0 #fff,
        1px 1px 0 #fff;
    color: #df061b;
    padding: 15px;
    position: absolute;
    width: calc(100% - 30px);
}
.layout1 .titolo img,
.layout2 .titolo img {
    vertical-align:text-bottom
}
.layout1 .titolo {
    text-align: right;
}
.layout1 .titolo h2,
.layout2 .titolo h2 {
    font-size: 60px;
}
.layout1 .img-txt,
.layout2 .img-txt {
    position: relative;
}
.layout1 .img-txt .img {
    float: left;
    width: 65%;
}
.layout2 .img-txt .img {
    float: right;
    width: 65%;
}
.layout1 .img-txt .img,
.layout2 .img-txt .img {
    opacity: 0;
    transition-delay: 300ms;
    transition-duration: 600ms;
}
.layout1 .img-txt .img {
    transform: scale(1.2) translate(-20%, 0);
}
.layout2 .img-txt .img {
    transform: scale(1.2) translate(20%, 0);
}
.section.active .layout1 .img-txt .img,
.section.active .layout2 .img-txt .img {
    opacity: 1;
    transform: translate(0, 0);
    transform: scale(1);
}
.layout1 .img-txt .img img,
.layout2 .img-txt .img img {
    width: 100%;
}
.layout1 .img-txt .txt {
    float: right;
    padding: 15px;
    width: calc(35% - 30px);
    margin-top: 120px;
}
.layout2 .img-txt .txt {
    float: left;
    padding: 15px;
    width: calc(35% - 30px);
    margin-top: 120px;
}
.layout1 .img-txt .txt,
.layout2 .img-txt .txt {
    opacity: 0;
    transition-delay: 600ms;
    transition-duration: 400ms;
    transform: translate(0, 20%);
}
.section.active .layout1 .img-txt .txt,
.section.active .layout2 .img-txt .txt {
    opacity: 1;
    transform: translate(0, 0);
}
.section.b3 .titolo h2 img {
    height: 30px;
    vertical-align: top;
    margin-top: 10px;
}
.section.gate .layout1 .img-txt .img {
    width: 55%;
}
.section.gate .layout1 .img-txt .img img {
    width: calc(100% - 40px);
    margin-right: 40px;
}
.section.gate .layout1 .img-txt .txt {
    width: calc(45% - 30px);
    margin-top: 0;
}
.section.gate .layout1 .img-txt .txt img {
    display: block;
    margin: auto;
}
.app-download {
    clear: both;
    text-align: right;
    padding: 30px 40px;
    
    opacity: 0;
    transition-delay: 600ms;
    transition-duration: 1000ms;
}
.section.active .app-download {
    opacity: 1;
}
.download {
    text-align: center;
    margin: 20px auto 0;
}
.download img {
    display: inline-block !important;
    width: auto !important;
    margin: 0 5px !important;
}

#fp-nav ul li a span, .fp-slidesNav ul li a span {
    background: #df061b;
}
.cookiebanner {
    max-width: 200px;
    left: auto !important;
    right: 10px !important;
    bottom: 10px !important;
}
@media screen and (max-width: 958px) {
    .cookiebanner {
        font-size: 12px !important;
        line-height: 1.3 !important;
    }
}

/* Schermi piccoli ----------- */
@media only screen 
and (max-width : 1200px), screen 
and (max-height : 880px) {
/* Styles */
    .header {
        padding: 20px 0;
    }
    .logo svg {
        max-width: 250px;
    }
    .fiera {
        transform: scale(0.7);
        transform-origin: right;
    }
    .home .testo h1 {
        font-size: 40px;
    }
    .ru .home .testo h1 {
        font-size: 30px;
    }
    .home .testo p {
        font-size: 22px;
    }
    .ru .home .testo p {
        font-size: 18px;
    }
    .pulsante-verde {
        font-size: 22px;
    }
    .layout1, .layout2 {
        font-size: 24px;
    }
    .layout1 .titolo, .layout2 .titolo {
        padding: 5px 15px;
    }
    .layout1 .titolo h2, .layout2 .titolo h2 {
        font-size: 40px;
    }
    .layout1 .titolo img, .layout2 .titolo img {
        height: 36px;
    }
    .section.b3 .titolo h2 img {
        height: 20px;
    }
    .section.gate .layout1 .img-txt .txt img {
        max-width: 300px;
    }
    .layout1 .img-txt .txt,
    .layout2 .img-txt .txt {
        margin-top: 100px;
    }
    .app-download {
        padding: 15px 40px;
    }
    .footer {
        padding: 10px 0;
    }
}

@media screen and (max-width: 958px) {
    
}

/* RESPONSIVE */

/* Smartphones (portrait and landscape) ----------- */
@media handheld, only screen and (max-width: 767px) {
/* Styles */
    body {
        font-size: 15px;
        background-color: #fff;
    }
    h1{
        font-size: 32px;
        margin-top: 0;
    }
    h2{
        font-size: 24px;
    }
    h3{
        font-size: 19px;
    }
    h4{
        font-size: 15px;
    }
    h5{
        font-size: 14px;
    }
    h6{
        font-size: 13px;
    }
    .nomob {
        display: none;
    }
    .header {
        padding: 0;
    }
    .logo {
        margin: 0 10px;
        width: calc(40% - 20px);
    }
    .logo svg {
        width: 100%;
    }
    .fiera {
        transform: none;
        padding: 5px 8px;
    }
    .fiera img {
        height: 45px;
    }
    .fiera .data {
        font-size: 16px;
    }
    .fiera .stand {
        font-size: 12px;
    }
    .lingue {
        margin: 0;
    }
    .home {
        background-position: right bottom;
        background-size: 110%;
        background-repeat: no-repeat;
        background-color: #df061b;
    }
    .home .testo {
        width: calc(100% - 40px);
        padding: 20px;
        padding-bottom: 30%;
    }
    .home .testo h1 {
        font-size: 30px;
    }
    .ru .home .testo h1 {
        font-size: 26px;
    }
    .home .testo p {
        font-size: 16px;
    }
    .ru .home .testo p {
        font-size: 16px;
    }
    .pulsante-verde {
        font-size: 16px;
        padding: 8px;
    }
    .footer {
        padding: 5px 0;
    }
    .footer .social {
        float: left;
        margin: 10px 10px;
        margin-right: 0;
    }
    .footer .social a img {
        height: 20px;
        background-color: #df061b;
        border-radius: 100%;
        padding: 1px;
    }
    .footer .backtop,
    .footer .freccia-giu-w {
        padding: 10px 5px;
        background-color: #df061b;
        border-radius: 4px;
        bottom: 60px;
        left: auto;
        right: 10px;
    }
    .footer .freccia-giu-w {
        right: 60px;
    }
    .footer .backtop img,
    .footer .freccia-giu-w img {
        width: 30px;
    }
    .footer .privacy {
        margin: 0 10px;
        font-size: 10px;
        letter-spacing: -0.8px;
    }
    .footer .privacy a {
        padding: 3px 5px;
        font-size: 13px;
        margin-left: 3px;
    }
    .layout1, .layout2 {
        width: 95%;
        font-size: 20px;
    }
    .layout2 {
        margin-left: 5%;
    }
    .layout1 .titolo, .layout2 .titolo {
        position: static;
        line-height: 0;
    }
    .layout1 .titolo img, .layout2 .titolo img {
        height: 20px;
    }
    .layout1 .img-txt .img,
    .layout2 .img-txt .img,
    .section.gate .layout1 .img-txt .img {
        float: none;
        width: 100%;
        margin: 10px 0;
    }
    .layout1 .img-txt .txt,
    .layout2 .img-txt .txt,
    .section.gate .layout1 .img-txt .txt {
        float: none;
        width: calc(100% - 20px);
        padding: 10px;
        margin-top: 0;
        font-size: 18px;
    }
    .section.gate .layout1 .img-txt .txt {
        font-size: 15px;        
    }
    .section.gate .layout1 .img-txt .txt img {
        width: 50%;
    }
    #fp-nav.right {
        right: 0;
    }
    .download img {
        max-width: 40% !important;
    }
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
	
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */

}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */

}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */

}
/* iPads (portrait) ----------- */
@media only screen and (min-width: 768px) and (max-width: 959px) {
/* Styles */
    body {
        font-size: 15px;
        background-color: #fff;
    }
    h1{
        font-size: 32px;
        margin-top: 0;
    }
    h2{
        font-size: 24px;
    }
    h3{
        font-size: 19px;
    }
    h4{
        font-size: 15px;
    }
    h5{
        font-size: 14px;
    }
    h6{
        font-size: 13px;
    }
    .nomob {
        display: none;
    }
    .header {
        padding: 0;
    }
    .logo {
        margin: 0 10px;
        width: calc(45% - 20px);
    }
    .logo svg {
        width: 100%;
    }
    .fiera {
        transform: none;
        padding: 5px 8px;
    }
    .fiera img {
        height: 45px;
    }
    .fiera .data {
        font-size: 16px;
    }
    .fiera .stand {
        font-size: 12px;
    }
    /*.home {
        background-position: right bottom;
        background-size: 110%;
        background-repeat: no-repeat;
        background-color: #df061b;
    }*/
    .home .testo {
        width: calc(100% - 40px);
        padding: 20px;
    }
    .home .testo h1 {
        font-size: 30px;
    }
    .ru .home .testo h1 {
        font-size: 26px;
    }
    .home .testo p {
        font-size: 16px;
    }
    .ru .home .testo p {
        font-size: 16px;
    }
    .pulsante-verde {
        font-size: 16px;
        padding: 8px;
    }
    .footer {
        padding: 5px 0;
    }
    .footer .social {
        float: left;
        margin: 10px 10px;
    }
    .footer .social a img {
        height: 20px;
        background-color: #df061b;
        border-radius: 100%;
        padding: 1px;
    }
    .footer .privacy {
        margin: 0 10px;
        font-size: 10px;
        letter-spacing: -0.3px;
    }
    .footer .privacy a {
        padding: 3px 5px;
        font-size: 13px;
        margin-left: 3px;
    }
    .layout1, .layout2 {
        width: 95%;
        font-size: 20px;
    }
    .layout2 {
        margin-left: 5%;
    }
    .layout1 .titolo, .layout2 .titolo {
        position: static;
        line-height: 0;
    }
    .layout1 .titolo img, .layout2 .titolo img {
        height: 20px;
    }
    .layout1 .img-txt .img,
    .layout2 .img-txt .img,
    .section.gate .layout1 .img-txt .img {
        float: none;
        width: 100%;
        margin: 10px 0;
    }
    .layout1 .img-txt .txt,
    .layout2 .img-txt .txt,
    .section.gate .layout1 .img-txt .txt {
        float: none;
        width: calc(100% - 20px);
        padding: 10px;
        margin-top: 0;
        font-size: 18px;
    }
    .section.gate .layout1 .img-txt .txt {
        font-size: 15px;        
    }
    .section.gate .layout1 .img-txt .txt img {
        width: 50%;
    }

}
/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1200px) {
/* Styles */
}
/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1260px) {
/* Styles */
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */

}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */

}
/***************************************************************************************/