* {-webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;}
a, button, button:focus, button:active {text-decoration:none !important; outline:none !important; box-shadow: none !important;}

body{font-family: 'Lato', sans-serif; font-weight: 400; font-size: 1em; color: #242424; background-color: #fff}
.bg-dx{background-color:#31bc71; background-image: url(../imgs/bg-triangoli.png); background-repeat: repeat-x;  min-height: 119px}
.header-top-container{background: url(../imgs/bicolore.png) repeat-y; background-position: center}
.green-head{background: url(../imgs/bg-header.png) no-repeat; min-height: 119px;}
#head-box{position: absolute; top: 0; left: 0; width: 100%; z-index: 10}
.logo-container{display: flex; align-items: center; justify-content: flex-start; min-height: 119px}
.div-logo{font-size: 0.8em; text-transform: uppercase;}
.div-menu{background-color: #009544; margin-top: 1px}
#head-box-sm {display: none;}

.icon-bar {
  width: 32px; 
  height: 3px;
  background-color: #fff;
  display: block;
  transition: all 0.2s;
  margin-top: 5px
}
.navbar-toggler {
  border: none;
  background: transparent !important;
  display: block;
  margin-top:4px !important; margin-bottom: 4px !important
}

.navbar-toggler .top-bar {
  transform: rotate(45deg);
  transform-origin: 10% 10%;
  background-color: #000;
}
 
.navbar-toggler .middle-bar {
  opacity: 0;
}
 
.navbar-toggler .bottom-bar {
  transform: rotate(-45deg);
  transform-origin: 10% 90%;
  background-color: #000;
}
 
.navbar-toggler.collapsed .top-bar {
  transform: rotate(0);
  background-color: #fff;
}
 
.navbar-toggler.collapsed .middle-bar {
  opacity: 1;
}
 
.navbar-toggler.collapsed .bottom-bar {
  transform: rotate(0);
  background-color: #fff;
}


.navbar-nav:first-child{border-left:#fff 1px solid;}
.navbar, .nav-item, .nav-link{margin:0 !important; padding: 0 !important}
.nav-item{border-right: #fff 1px solid}
.nav-link {min-width: 120px; padding-top: 4px !important; padding-bottom: 4px !important; text-align: center; text-transform: uppercase; font-size: 0.9em}
.nav-link:link, .nav-link:visited{color: #fff}
.nav-link:hover{color: #000; background-color: #30d37e}
.dropdown-toggle:focus{background-color: #30d37e; color:#242424;}
.dropdown-menu{background-color: #30d37e; border-radius: 0; margin-left: 115px}
.dropdown-item{background:none !important; margin:0 !important;}
.dropdown-item:link, .dropdown-item:visited {color:#242424;}
.dropdown-item:hover {color:#fff;}
.dropdown-menu hr{margin-top: 4px !important; margin-bottom: 4px !important; padding:0 !important;}
.navbar-nav .dropdown.show > a {
    background-color: #30d37e !important; color:#FF0000 !important;
}


.item-ln{border-left: #fff 1px solid}
.link-ln {max-width: 60px !important; min-width: 60px !important;}
.link-ln:link, .link-ln:visited{background-color: #30d37e !important; color: #000}
.link-ln:hover{background-color: #009544 !important; color: #fff }
.pre-footer{width: 100%; background-color: #ddefe5;}
.pre-footer .row {padding-top: 20px; padding-bottom:20px;}
.pre-footer .ind{font-size: 0.9em}
.intestazione{display: flex; align-items: center;}
.recapiti{display: flex; align-items: center; justify-content: right;}
.recapiti div{text-align: right;}
.recapiti hr{margin:4px 0 4px 0; background-color: #3bd281}
.recapiti i {padding-left: 10px}
.recapiti a:link, .recapiti a:visited {color: #242424}
.recapiti a:hover {color: #009544}
.recapiti a:link i, .recapiti a:visited i {color:#009544 }
.recapiti a:hover i {color: #242424}
.filo{min-width: 100%; background-color: #009544; min-height: 2px; margin-top: 1px; margin-bottom: 1px;}
.footer{min-height: 58px; background: url(../imgs/bicolore-footer.png) repeat-y; background-position: center}
.f-sx{min-height: 58px; background: url(../imgs/bg-footer.png) no-repeat; background-position: center right}
.f-dx{min-height: 58px; font-size: 0.8em; display:flex; align-items: center; justify-content: flex-end;}
h1{font-weight:400; font-size: 2.4em; margin-top: 40px; margin-bottom: 20px;}

.btn-cerca{background:rgba(255,255,255,0.4); color: #178c4f; border-radius: 0; text-transform: uppercase; font-size: 0.9em; border:#fff 1px solid;}
.btn-cerca:hover{background:rgba(255,255,255,1); color: #178c4f;}

/* MODAL PRODUCTS */ 
#modal-filter .modal-header { background-color: #30d37e }
#modal-filter .modal-header button {margin-top: 0 !important; margin-bottom: 0 !important; padding: 0 20px 0 0 !important; color:#fff; opacity: 1 !important}
#modal-filter .modal-content{border-radius: 0 !important}
#modal-filter .modal-body{margin:0 !important; padding:0 !important; }
/* #modal-products .chiudi{background-color: #fff; color:#87b32e;  padding:30px 30px 30px 30px; text-align: center; max-width: 100px; max-height: 100px; border:0 !important; cursor:pointer;} */
#modal-filter h1{font-family: 'Playfair Display', serif; font-weight: 900; font-size:3.2em; color: #fff;}
.cerca-sx{background-color: #87b32e; background-image: url(../imgs/bg-cerca-sx.png); background-repeat: no-repeat; background-size: auto; background-position: center right;  min-height: 770px;
padding-top: 70px; padding-left: 20px}
.cerca-dx{background-color: #fff; background-image: url(../imgs/bg-cerca-dx.png); background-repeat: no-repeat; background-size: auto; background-position: top center;  min-height: 770px;
padding-top: 70px; padding-left: 40px}

.pretty{font-size: 0.8em}
.pretty input:checked~.state.p-success label:after,.pretty.p-toggle .state.p-success label:after{background-color:#30d37e!important}  
.options-container{display: flex; flex-wrap: wrap;}
.box-options{margin:10px 20px 40px 20px; padding: 0; border: #178c4f 1px solid}
.box-tit{background-color: #178c4f; color: #fff; padding-left: 10px; padding-right: 10px}
.box-row{margin-left: 4px}
.btn-app { border-radius:0; width: 100%; padding-top: 4px; padding-bottom: 4px; font-size: 1.2em; font-weight: 700;  margin-top:10px; margin-bottom:10px; background:#178c4f; color:#FFF; text-align: center; max-width: 200px; margin-left: auto; margin-right: auto; }
  .btn-app:hover {background:#30d37e; color:#178c4f;}
  






.icom {width: 18px; height: 18px; border-radius: 3px; text-align: center; display: inline-block; text-transform: uppercase; line-height: 16px; font-size: 12px; font-weight: 700}
.icom-off {border:#7bb997 1px solid; color: #7bb997}
.icom-p {border:#0099ff 1px solid; background-color:#0099ff; color: #fff}
.icom-m {border:#ffff33 1px solid; background-color:#ffff33; color: #000}
.icom-k {border:#eb0b8f 1px solid; background-color:#eb0b8f; color: #fff}
.icom-n {border:#31bc71 1px solid; background-color:#31bc71; color: #fff}
.icom-s {border:#cc3300 1px solid; background-color:#cc3300; color: #fff}
.icom-h {border:#848484 1px solid; background-color:#848484; color: #fff}

 .fondo-categoria{border-bottom: #009544 1px solid; margin-top: 1px; background-image: url(../imgs/punta-bg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover;}
 .fascia-categoria{min-height: 240px; display: flex; align-items:center; justify-content: flex-start; font-size:2em; color: #fff}
 .fascia-categoria span{font-size: 0.8em; color: #30d37e}

@media (max-width: 767px) {
h1{font-weight:400; font-size: 1.8em; margin-top: 40px; margin-bottom: 20px;}
#sub-head-box, #head-box {display: none;}
#head-box-sm {display: block;}
.bg-dx-sm{background-image: url(../imgs/bg-triangoli-sm.png); background-repeat: no-repeat;}
.navbar-nav:first-child, .nav-item{border-width: 0}
.nav-link{text-align: left; margin:6px 0 6px 0 !important; font-size: 1.1em}
.nav-link:hover{background-color: #009544; }
.nav-item{border-top: #30d37e 1px dotted !important}
.dropdown-menu{font-size: 1.1em; margin-left:0}
.item-ln{border-left:0 !important; border-right:0 !important; border-top: #30d37e 1px dotted !important}
.link-ln:link, .link-ln:visited{background-color: #009544 !important; color: #fff !important}
.link-ln:hover{background-color: #009544 !important; color: #000 !important}
.recapiti{justify-content: left; margin-top: 20px}
.fondo-categoria{ background-image: url(../imgs/punta-bg-xs.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover;}
}

@media (max-width: 576px) {
.div-logo img{margin-top: 6px}
.footer{background: none}
.f-dx{background: url(../imgs/pattern-footer-xs.png) no-repeat; background-position: center left}
.btn-cerca{font-size: 0.7em !important; max-width: 100px !important }

}