/*
Project: todini.com
Version: 2.0.0 (responsive)
Author: phollidee.com
*/
/* Small only */
@media screen and (max-width: 39.9375em) {
/* general rules ================================================================== */
h1 {font-size:25px;}
h2 {font-size:21px; font-weight:bold; line-height:1.2;}
h3 {font-size:18px; font-weight:bold; line-height:1.2;}
/* header & footer ================================================================ */
.header {height:auto; padding-bottom:10px; background:#fff;}
.header nav {margin-top:0;}
.main-menu {display:none;}
.main-menu ul {border-top:1px solid #ccc; text-align:left; margin-top:20px; padding-top:10px;}
.main-menu ul li {display:block; height:auto; width:100%; text-align:left;}
.main-menu ul li a {margin-left:0; padding:5px 0; display:block;}
.header a.logo {margin-top:12px; background:url("../images/todini_logo.svg"); background-size:92px 40px; width:92px; height:40px;}
#email-icon {width:34px; height:29px; background:url("../images/ico-email-mobile.svg"); position:absolute; top:19px; right:90px;}
#email-icon a {display:block; width:100%; height:100%;}
/* #email-icon a {display:block; width:34px; height:30px;} */
/* stickytop */
#topbar.stickytop {height:auto; padding-bottom:0px;}
#topbar.stickytop nav {margin-top:0px;}
#topbar.stickytop #nav-icon2 {margin-top:13px;}
#topbar.stickytop #email-icon {top:11px;}
.footer .policies ul {margin-bottom:0;}
.footer .policies ul li a {padding-left:2px; padding-right:6px;}
.footer a.logo-footer {display:block; margin:5px auto 30px;}
.footer .policies span.p-iva {display:block; margin-top:8px;}
.footer .flag {position:relative; margin-top:10px;}
.footer .flag img {width:20px; height:20px;}
.footer .seo-row .ft-expand a {padding-left:12px;}
.footer .ft-col h3 {font-size:14px;}
.footer .ft-col h4 {margin-top:20px;}
.footer .ft-col ul {margin-bottom:30px;}
.title-bar {padding-top:15px; padding-bottom:10px;}
.title-bar h2 {font-size:18px; margin-top:5px;}
/* .hp-hero */
.hp-hero-wrapper { height:300px; }
.hp-hero { height:300px; }
.hp-hero h1 { padding:0 10px 10px; font-weight:bold; margin-top:0px; margin-bottom:16px; }
.hp-hero p { display:none; }
.hp-hero .button { display:inline-block; margin:5px 10px; }
#elements-slide.owl-theme .owl-dots {display:none !important;}
.swipe-icon {text-align:center; margin-top:-10px;}
.swipe-icon span {font-size:13px; line-height:40px; height:34px; background: url("../images/swipe-icon.png") no-repeat; margin:auto; display:inline-block; padding-left:45px;}
/* .wall-elementi */
.wall-elementi {padding-top:20px; padding-bottom:20px; color:#000;}
.wall-elementi p {font-size:14px;}
/* about-us */
.about-us {padding-top:30px; padding-bottom:30px;}
/* .help */
.help {color:#000; font-size:14px;}
.help h3 {font-weight:bold; font-size:21px;}
/* standard */
.button {padding:14px 20px; font-size:15px;}
/* === nel wall in homepage */
.elements-wall {display:none;}
#elements-slide {display:block;}
.wall-elementi .element, .wall-elementi .element a {margin:0; width:auto;}
.wall-elementi .element .element-info {padding:10px;}
.wall-elementi .element .dist {display:none;}
/* === nel listing prodotti */
.element-list-item {margin:10px 0 15px; padding:20px; position:relative;}
.element-list-item .symbol {top:20px; right:20px; height: 48px; width:48px;}
.element-list-item .symbol h1 {height:44px; width:44px; line-height:44px;}
.element-list-item h1.e-name {padding-right:60px;}
.element-list-item p.desc {display:none;}
.element-list-item ul {margin-bottom:20px;}
.element-list-item li {float:none; margin-right:0px; font-size:12px;}
.element-list-item li strong {display:inline; font-size:12px;}
/* === nel listing prodotti in MODALITA CARDS */
.element-card-wrapper .element-list-item:nth-child(odd), .element-card-wrapper .element-list-item:nth-child(even) {width:100%; float:none;}
/* === nello versione SMALL (es. slider) */
.small-elements .element {text-align:center; margin:auto;}
.small-elements .element a {margin:auto;}
.small-elements.owl-theme .owl-nav .owl-prev {top:12px; left: -25px;}
.small-elements.owl-theme .owl-nav .owl-next {top:12px; right: -25px;}
/* main-content */
.main-content h1 {font-size:21px; line-height:1.1;}
.main-content p {color:#000; font-size:14px;}
/* vip */
.vip-content {margin-top:0px;}
.vip-content h1 {font-size:21px;}
.vip-content .top-scheda h3 {font-size:13px;}
.vip-content .scheda-block {padding-bottom:10px;}
.contact-row {text-align:left; color:#000;}
.contact-row h3 {font-weight:bold;}
.contact-row h3, .contact-row p {text-align:left;}
.contact-row .f-email, .contact-row .f-firm {width:100%; float:none;}
.contact-row .f-phone, .contact-row .f-subject {width:100%; float:none;}
.contact-row .button {margin:auto; display:block;}
/* group */
.group-content {margin-top:0px;}
.top-group {margin-bottom:10px;}
.top-group h1 {font-size:36px;}
/* about */
.page-about .about-nav {display:none;}
.page-about .title-bar {text-align:left; padding-top:0;}
.page-about .title-bar h2 {padding:0 100px 0 0; font-size:25px; font-weight:bold;}
.page-about .title-bar p {margin:20px 0px 15px;}
.management {margin:20px auto 0;}
.management h2 {text-align:center; margin:10px auto 0; color:#000;}
.management p {color:#000; font-size:14px;}
.management-slider-wrapper {padding:10px 50px 10px;}
.management-slider.owl-theme .owl-nav .owl-prev {top:100px; left:-40px;}
.management-slider.owl-theme .owl-nav .owl-next {top:100px; right:-40px;}
.storia {margin:20px auto 20px; padding-top:40px; padding-bottom:20px; color:#000; font-size:14px;}
.storia h3 {font-size:21px;}
.regulation {text-align:left; margin:30px auto 30px;}
.regulation.reg-2-col .row .columns {padding-top:0; padding-bottom:10px;}
.regulation.reg-1-col .row .columns {background:linear-gradient(149.03deg, #77BB5B 0%, #197CBE 100%); padding-top:35px; padding-bottom:35px;}
.regulation.reg-1-col .row .columns .reg-1col-wrap {padding:0 20px; background:none;}
.regulation.reg-1-col ul li {margin:0 12px;}
/* contatti/faq */
.tabs-content {box-shadow: none;}
.tabs-title > a[aria-selected='true'] {font-weight:bold; color:#000;}
.form-contatti form {padding:20px 0;}
.form-contatti .address .indirizzo {height:auto; padding:30px 0;}
.form-contatti .address .indirizzo .address-logo {display:none;}
.faq {padding:20px 0;}
.faq h2 {font-size:24px;}
/* rimuove ombra nel form */
input[type="text"], [type="email"] {-webkit-appearance: none;}
}
/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
.footer .flag {position:relative; margin-top:10px;}
/* .hp-hero */
.hp-hero-wrapper { height:350px; }
.hp-hero { height:350px }
.hp-hero h1 { padding:60px 40px 10px; font-size:30px; font-weight:bold; }
.hp-hero p { padding:20px 20px 30px; margin:0; }
.wall-elementi .element, .wall-elementi .element a {margin:0; width:auto;}
.element-card-wrapper .element-list-item:nth-child(odd), .element-card-wrapper .element-list-item:nth-child(even) {width:100%; float:none;}
.vip-content .scheda-block {padding-bottom:10px;}
.page-about .about-nav {}
.page-about .title-bar {text-align:center; padding-top:0;}
.page-about .title-bar h2 {padding:0 30px; font-size:34px; font-weight:bold;}
.management {margin:20px auto 0;}
.storia {margin:20px auto 20px; padding-top:40px; padding-bottom:20px;}
.regulation {text-align:left; margin:30px auto 30px;}
.regulation.reg-2-col .row .columns {padding-top:0; padding-bottom:10px;}
.tabs {margin-top:30px;}
.tabs-content {box-shadow: none;}
.form-contatti .address .indirizzo {height:auto; padding:30px 0;}
.faq h2 {font-size:24px; margin-top:22px}
.main-content .flag {padding-top:20px; padding-bottom:15px;}
}
/* Large only */
@media screen and (min-width: 64em) {
.header nav {transition: all 200ms ease-in-out 0s;}
.about-map .map-wrapper:hover img {-moz-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1); -webkit-backface-visibility: hidden;}
.about-map .map-wrapper img {-moz-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s;}
.about-map .map-wrapper {-moz-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; overflow:hidden;}
.contact-row .button {float:right;}
}
/* DEBUG ************ */
/* @media screen and (max-width: 39.9375em) {body{border-top:2px solid yellow;}}
@media screen and (min-width: 40em) and (max-width: 63.9375em) {body{border-top:2px solid orange;}}
@media screen and (min-width: 64em) {body{border-top:2px solid red;}} */