/* elementi HTML */

/*  GENERAL CLASS */
#iubenda {
    background-color: #eee;
}
a { color: green; }
.center {
    margin-top: 100px;
}
* {  outline: none; outline-style: none;}
/* cookie banner related styles below */

/***************************************************************************
// * Iubenda Cookie Solution                                               *
// *                                                                       *
// * (c) 2015 Iubenda srl <info@iubenda.com>                               *
// * All Rights Reserved.                                                  *
// *                                                                       *
// *************************************************************************
//
// CHANGELOG
// 0.0.1
// - first implementation of customizable css
*/

/*  GENERAL CLASS */
#iubenda-cs-banner{
    /* ------ IMPORTANT NOTICE: don't change these values as
            they may prevent the banner from properly showing. Some of these lines,
            moreover (like z-index) will overwrite the configuration initialized
            by the script you paste in your pages. To show the banner at the bottom
            you can switch to "bottom: 0px !important;". Don't forget to put "slideDown"
            to "false".
     */
    bottom: 0px !important;
    left: 0px !important;
    position: fixed !important;
    width: 100% !important;
    z-index: 99999998 !important;
    background-color: black;
    /* ----------------- */
}

/*  CONTENT CLASS */
.iubenda-cs-content{
    display:block;
    margin:0 auto;
    padding: 20px;
    width:auto;
    font-family: Helvetica,Arial,FreeSans,sans-serif;
    font-size: 14px;
    background: #000;
    color: #fff;
}

.iubenda-cs-rationale{
    max-width: 900px; position:relative; margin: 0 auto;
}

/* STYLE FOR TEXT INTERNAL BANNER */
.iubenda-banner-content > p {
    font-family: Helvetica,Arial,FreeSans,sans-serif;
    line-height: 1.5;
}

/*  CLOSE BUTTON. NOTICE: IMAGE FOR BUTTON NOT IMPLEMENTED YET */
.iubenda-cs-close-btn{
    margin:0;
    color: #fff;
    text-decoration:none;
    font-size:14px;
    position: absolute;
    top: 0;
    right: 0;
    border: none;
}

/*  STYLE FOR TEXT LINK TO PRIVACY POLICY */
.iubenda-cs-cookie-policy-lnk{
    text-decoration: underline;
    color: #fff;
    font-size: 14px;
    font-weight: 900;
}

/*body {background: #F3F3F3 url('../_img2/pattern-natale.png') repeat; color: #000; font: 13px/0.8em 'Raleway', sans-serif}*/
body {background: #F3F3F3; color: #000; font: 13px/0.8em 'Raleway', sans-serif}
@media screen and (max-width:320px) {
  body {font-size: 14px}
}
a, a:hover {color: #000}

.no-scroll {
  overflow: hidden;
  height: 100%;
  position: fixed;
  width: 100%;
}

/* header */


/*section#beta {background: #060; color: #FFF; font-size: 1.1rem; line-height: 1.3rem; padding: 1rem; text-align: center}
  section#beta a {color: #F60; text-decoration: underline}*/

section#preFascetta {background: #e0ff70; color: #fff; display: none; font-family: "Roboto", sans-serif; font-size: 14px; line-height: 1; padding: 5px 0; text-align: center; width: 100%; z-index: 999}
section#preFascetta i.fa {color: #fffb00; font-size: 1rem}
section#preFascetta a, section#preFascetta strong {color: #fffb00; font-weight: bold}
section#fascetta, section#fascettaB {background: #ffd401; border-bottom: 0 solid #fff; color: #000; display: none; line-height: 1.1; padding: 5px 0; width: 100%; z-index: 999}
section#fascettaB {color: #fff; display: none; font-size: 1.1rem; padding: 0}
section#fascetta strong {background: #060; display: inline-block; color: #fff; font-size: 1.1rem; padding: 1px 5px 2px}
/*section#fascetta .strong2 {background: #dd00a5}*/
section#fascetta .strong2 {background: #fe6bb7}
section#fascetta b { color: #000}
section#fascetta small {color: #eddf2c; font-style: italic}
section#fascetta .fa {color: #f07e01}
section#fascettaB .f1 {background: #cbedbb; color: #241a33; padding: 5px 0}
section#fascettaB .f2 {background: #c5eafc; color: #000; display: none; padding: 5px}
section#fascettaB .f1 a, section#fascettaB .f2 a {color: #ff0; font-size: 2rem; font-weight: bold}
@media screen and (max-width: 1023px) {
  section#fascetta {font-size: .95rem}
}
section#fascetta a {color: #000; font-size: 14px; font-style: italic;}
section#fascettaB a {color: #fff; font-size: 14px; font-style: italic;}
/* Large and up */
@media screen and (min-width: 64em) {
 section#preFascetta {background: #e0ff70; border-bottom: 1px solid #fff}
 section#fascetta, section#fascettaB {margin-top: -31px; position: fixed}
}
section#fascetta .decoro {background: #000; border-top: 2px solid #FFF; border-bottom: 2px solid #FFF; display: none; padding-top: 5px}
  section#fascetta img {display: block; margin: 0 auto}

  /* testo scrollabile */
#testoScroll {background: #ffc; height: 55px; position: relative; overflow: hidden}
#testoScroll p {color: #000; font-size: 1.1rem; left: 0; line-height: 1; margin: 0; position: absolute; text-align: center; top: 50%; transform: translateY(-50%); width: 100%}
#testoScroll p strong {color: #bc2f3a}
@media screen and (max-width:414px) {
  #testoScroll p {font-size: 1rem}
}
#testoScroll p a {color: #000}

header {
    background: #FFF;
    box-shadow: 0px 3px 5px 1px #DCDCDC;
    -webkit-box-shadow: 0px 3px 5px 1px #DCDCDC;
    -moz-box-shadow: 0px 3px 5px 1px #DCDCDC;
    -o-box-shadow: 0px 3px 5px 1px #DCDCDC;
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 3
}


/* header per desktop */
header .sopra {
    background: #CBEDBB;
    margin-bottom: 1rem;
}
/* Large and up */
@media screen and (min-width: 64em) {
  /*#testoScroll {margin-top: 40px}*/

  /* header .sopra {
    margin-top: 40px; il margine superiore va rimosso quando non c'è la fascetta fissa
    margin-top: 60px; il margine superiore va rimosso quando non ci sono le fascette fisse
  }*/ 
}

header .sopra .menu li {
    margin-right: .44rem
}

header .sopra .menu a {
    color: #000;
    font-size: 0.75rem;
    padding-top: .35rem;
    padding-bottom: .35rem
}

header .sopra .menu a:hover {
    color: #333
}

header .sopra .menu a .fa {
    bottom: .1rem;
    font-size: 1rem;
    position: relative
}

header .centro {
    font-family: "Roboto", sans-serif
}

header .centro .logo {
    display: block;
    margin-top: -12px;
    margin-bottom: 1rem;
    position: relative
}

header .centro .outlet {
    display: block;
    margin-top: -.6rem
}

header .centro .menu {
    color: #000;
    display: inline-block;
    font-size: 1.3rem;
    margin-top: .5rem
}

header .telefono a, header .spedGratis a {color: #060; font-weight: bold; line-height: 1.6}
@media screen and (min-width: 64em) {
  header .telefono a, header .spedGratis a {line-height: 1}
}
header .spedGratis a {color: #F60}
header .spedGratis a big span {font-size: 20px; display: inline-block}
@media screen and (max-width:320px) {
  header .telefono, header .spedGratis {font-size: 0.8rem}
}

header .centro form {
    margin-top: 1.2rem
}

header .centro form .input-group-field {
    height: 2.2rem;  padding: 0 1rem
}

header .centro form .button {
    background: #333;
    height: 36px;
    padding: .45em
}

header .centro form .button:hover {
    background: #000
}

header .centro .fa-shopping-cart, header .fa-heart {
    color: #000;
    font-size: 3rem;
    line-height: 1;
    position: relative;
    z-index: 1
}
header .fa-heart {font-size: 1.8rem}
header .fa-shopping-cart {margin-top: -14px}
@media screen and (max-width:1023px) {header .fa-shopping-cart {margin-top: -7px}}

header .centro .fa-shopping-cart span {
    background: #F60;
    border-radius: 50%;
    color: #FFF;
    font: 700 1rem/25px "Roboto", sans-serif;
    height: 25px;
    position: absolute;
    right: 10%;
    text-align: center;
    top: 0;
    width: 25px;
    z-index: 2;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%
}


/* mega-menu */

header #menuSotto1 .mega1 {
    font-size: .95rem;
    font-weight: 700;
    position: relative
}

header #menuSotto1 .mega1 > li {
    border-bottom: .5rem solid #FFF;
    margin-right: 0;
    position: static;
    min-width: 9.2%;
    /*white-space: nowrap*/
}
body.en header #menuSotto1 .mega1 > li {min-width: 9.52%}
body.fr header #menuSotto1 .mega1 > li, 
body.de header #menuSotto1 .mega1 > li {min-width: 8.89%}
body.es header #menuSotto1 .mega1 > li {min-width: 8.75%}


@media screen and (min-width:1024px) and (max-width:1188px) {
  header #menuSotto1 .mega1 > li {min-width: 7.52%}
}

header #menuSotto1 li.bg1 {
    background: rgb(203, 237, 187);
    background: -moz-linear-gradient(90deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    background: -webkit-linear-gradient(90deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    background: -o-linear-gradient(90deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    background: -ms-linear-gradient(90deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    background: linear-gradient(180deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    border-top: 1px solid #60C13B
}

header #menuSotto1 li.bg2 {
    background: rgb(250, 250, 180);
    background: -moz-linear-gradient(90deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    background: -webkit-linear-gradient(90deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    background: -o-linear-gradient(90deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    background: -ms-linear-gradient(90deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    background: linear-gradient(180deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    border-top: 1px solid #EECC00
}

header #menuSotto1 li.bg3 {
    background: rgb(250, 225, 200);
    background: -moz-linear-gradient(90deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    background: -webkit-linear-gradient(90deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    background: -o-linear-gradient(90deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    background: -ms-linear-gradient(90deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    background: linear-gradient(180deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    border-top: 1px solid #ED8039
}

header #menuSotto1 li.bg4 {
    background: rgb(225, 220, 240);
    background: -moz-linear-gradient(90deg, rgb(225, 220, 240) 13%, rgb(187, 165, 235) 50%);
    background: -webkit-linear-gradient(90deg, rgb(225, 220, 240) 13%, rgb(187, 165, 235) 50%);
    background: -o-linear-gradient(90deg, rgb(225, 220, 240) 13%, rgb(187, 165, 235) 50%);
    background: -ms-linear-gradient(90deg, rgb(225, 220, 240) 13%, rgb(187, 165, 235) 50%);
    background: linear-gradient(180deg, rgb(225, 220, 240) 13%, rgb(187, 165, 235) 50%);
    border-top: 1px solid #6A5FA5
}

header #menuSotto1 li.bg5 {
    background: rgb(226, 245, 245);
    background: -moz-linear-gradient(90deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    background: -webkit-linear-gradient(90deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    background: -o-linear-gradient(90deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    background: -ms-linear-gradient(90deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    background: linear-gradient(180deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    border-top: 1px solid #5CB6D1
}

header #menuSotto1 li.bg6 {
    background: rgb(240, 220, 235);
    background: -moz-linear-gradient(90deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    background: -webkit-linear-gradient(90deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    background: -o-linear-gradient(90deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    background: -ms-linear-gradient(90deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    background: linear-gradient(180deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    border-top: 1px solid #CC4F96
}

header #menuSotto1 li.bg7 {
    background: rgb(250, 235, 223);
    background: -moz-linear-gradient(90deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    background: -webkit-linear-gradient(90deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    background: -o-linear-gradient(90deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    background: -ms-linear-gradient(90deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    background: linear-gradient(180deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    border-top: 1px solid #B9A995
}

header #menuSotto1 li.bg8 {
    background: rgb(206, 230, 220);
    background: -moz-linear-gradient(90deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    background: -webkit-linear-gradient(90deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    background: -o-linear-gradient(90deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    background: -ms-linear-gradient(90deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    background: linear-gradient(180deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    border-top: 1px solid #50B589
}

header #menuSotto1 li.bg9 {
  background: rgb(250, 223, 223);
  background: -moz-linear-gradient(90deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  background: -webkit-linear-gradient(90deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  background: -o-linear-gradient(90deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  background: -ms-linear-gradient(90deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  background: linear-gradient(180deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  border-top: 1px solid #C25B6D;
}

header #menuSotto1 li.bg1:hover,
header #menuSotto1 li.active.bg1,
header #menuSotto1 li.bg2:hover,
header #menuSotto1 li.active.bg2,
header #menuSotto1 li.bg3:hover,
header #menuSotto1 li.active.bg3,
header #menuSotto1 li.bg4:hover,
header #menuSotto1 li.active.bg4,
header #menuSotto1 li.bg5:hover,
header #menuSotto1 li.active.bg5,
header #menuSotto1 li.bg6:hover,
header #menuSotto1 li.active.bg6,
header #menuSotto1 li.bg7:hover,
header #menuSotto1 li.active.bg7,
header #menuSotto1 li.bg8:hover,
header #menuSotto1 li.active.bg8,
header #menuSotto1 li.bg9:hover,
header #menuSotto1 li.active.bg9,
header #menuSotto1 li.bg99:hover,
header #menuSotto1 li.active.bg99 {
    border-bottom: .5rem solid #F60;
    transition: all 0.8s ease
}

header #menuSotto1 .mega1 > li > a {
    color: #000;
    padding: .52rem .46rem;
    text-align: center
}

header #menuSotto1 .mega1 > li.bg99 > a {
    border-bottom: 1px solid #282828;
    padding: .1rem .6rem .5rem
}

header #menuSotto1 .mega1 > li.bg99 > a img {
    height: 25px
}

header #menuSotto1 .mega1 > li.active > a {
    background: none
}

header #menuSotto1 .mega1 > li.is-dropdown-submenu-parent > a:after {
    display: none
}

header #menuSotto1 .mega2 {
    border: 0;
    border-bottom: .9375rem solid #FFF;
    box-shadow: 0px 3px 5px 1px #DCDCDC;
    -webkit-box-shadow: 0px 3px 5px 1px #DCDCDC;
    -moz-box-shadow: 0px 3px 5px 1px #DCDCDC;
    -o-box-shadow: 0px 3px 5px 1px #DCDCDC;
    color: #333;
    font-size: 0.8rem;
    font-weight: normal;
    height: auto;
    margin-top: 1px;
    overflow: hidden;
    padding: .9375rem;
    padding-bottom: 0;
    width: 100%;
    z-index: 9
}

header #menuSotto1 .mega2 li {
    letter-spacing: .01rem;
    margin-bottom: .8rem !important
}

header #menuSotto1 .mega2 li:last-child {
    margin-bottom: 0 !important
}

header #menuSotto1 .mega2 a {color: #000}

header #menuSotto1 .mega2 .menu.vertical a {
    font-size: .9rem
}

header #menuSotto1 .mega2 .menu.vertical a:before {
    content: "\f105";
    font-family: "FontAwesome";
    margin-left: -15px;
    margin-right: 5px
}

header #menuSotto1 .mega2 a:hover {
    color: #F60
}

header #menuSotto1 .mega2 .titolo {color: #000; display: block; font-size: .95rem; font-weight: bold; margin-bottom: .5rem}
header #menuSotto1 .mega2 a.titolo {color: #333}
header #menuSotto1 .mega2 a.titolo:before {content: "\f105"; font-family: "FontAwesome"; margin-right: 5px; margin-left: -15px}
header #menuSotto1 .mega2 a.titolo:hover,
header #menuSotto1 .mega2 a.titolo.active {color: #F60}

header #menuSotto1 .mega2 .menu {margin-bottom: 2rem; padding-left: 1rem}
header #menuSotto1 .mega2 .columns .menu:last-child {margin-bottom: 0}
header #menuSotto1 .mega2 .menu li {display: block; margin-bottom: .35rem}
  header #menuSotto1 .mega2 .menu li a.active {color: #F60}

header #menuSotto1 .mega2 .topbrands {font-size: .9rem; padding-left: 0}
header #menuSotto1 .mega2 .topbrands span {color: #666; word-spacing: -2px}
  header #menuSotto1 .mega2 .topbrands span a {color: #666}
  header #menuSotto1 .mega2 .topbrands span a:hover {color: #F60}
  header #menuSotto1 .mega2 .topbrands span a:before {content: none !important; margin: 0 !important}

header #menuSotto1 .mega2 .fa-angle-down {font-size: 3rem; margin: -1.5rem 0 .3rem}


header #menuSotto1 .mega2 .prodMenu {margin-bottom: 1rem; overflow: hidden; white-space: normal}
header #menuSotto1 .mega2 .prodMenu:last-child {margin-bottom: 0}
  header #menuSotto1 .mega2 .prodMenu a, header #menuSotto1 .mega2 .prodMenu a:hover {color: #000}
  header #menuSotto1 .mega2 .prodMenu img {float: left; margin-right: 10px; max-width: 35%}
    header #menuSotto1 .mega2 .prodMenu .prezzo {color: #060; font-size: 1.2rem; display: block; font-weight: bold; margin: 5px 0}
      header #menuSotto1 .mega2 .prodMenu .prezzo .da {font-size: .7rem}
    header #menuSotto1 .mega2 .prodMenu .sconto {color: #F60; display: block; font-size: 1rem; font-weight: bold}
      header #menuSotto1 .mega2 .prodMenu .sconto .testo {font-size: .6rem}


/* header per mobile */
header .mobile .riga1 {
    padding: .5rem 0;
    padding-top: 1rem;
}
/* Large and up */
@media screen and (min-width: 64em) {
  /* header .mobile .riga1 {
    margin-top: 40px; il margine superiore va rimosso quando non c'è la fascetta fissa
    margin-top: 60px; il margine superiore va rimosso quando non ci sono le fascette fisse
  } */
}

header .mobile .riga1 .fa-bars,
header .mobile .riga1 .fa-shopping-cart,
header .mobile .riga2 .fa-user {
    color: #000;
    font-size: 2.5rem;
    line-height: 1
}

header .mobile .riga1 .fa-shopping-cart {
    font-size: 3rem;
    position: relative;
    z-index: 1
}

header .mobile .riga1 .fa-shopping-cart span {
    background: #F60;
    border-radius: 50%;
    color: #FFF;
    font: 700 1rem/25px "Roboto", sans-serif;
    height: 25px;
    position: absolute;
    right: 10%;
    text-align: center;
    top: 0;
    width: 25px;
    z-index: 2;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%
}

header .mobile form {
    margin-top: .2rem
}

header .mobile form .input-group-field {
    height: 2rem
}

header .mobile form .button {
    background: #333;
    height: 32px;
    padding: .45em
}

header .mobile form .button:hover {
    background: #000
}


/* header mobile versione 2023 */
header .mobile_new .riga1 {padding: .2.5rem 0 .5rem}
header .mobile_new .riga1 .col1, header .mobile_new .riga1 .col2, header .mobile_new .riga1 .col3, header .mobile_new .riga1 .col4 {display: flex; align-items: center; height: 60px; font-size: 2rem}
header .mobile_new .riga1 .col3, header .mobile_new .riga1 .col4 {font-size: 2rem; justify-content: right}
header .mobile_new .riga1 .col4 .fa-shopping-cart {font-size: 2.5rem; position: relative; z-index: 1}
header .mobile_new .riga1 .col4 .fa-shopping-cart span {
    background: #F60;
    border-radius: 50%;
    color: #FFF;
    font: 700 1rem/25px "Roboto", sans-serif;
    height: 25px;
    position: absolute;
    right: 10%;
    text-align: center;
    top: 0;
    width: 25px;
    z-index: 2;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%
}

header .mobile_new .riga2 {padding: 0  0 .5rem}
header .mobile_new .riga2 .col1, header .mobile_new .riga2 .col2 {display: flex; align-items: center; height: 40px}
header .mobile_new .riga2 .col1 form {width: 100%}
  header .mobile_new .riga2 .col1 form .input-group-field {height: 2rem}
  header .mobile_new .riga2 .col1 form  .button {background: #333; height: 32px; padding: .45em}
  header .mobile_new .riga2 .col1 form  .button:hover {background: #000}
header .mobile_new .riga2 .col2 {justify-content: right; font-size: 2.35rem}
header .mobile_new .riga2 .col2 a {color: #000}

header .mobile_new .riga3 {font-size: 1rem; padding: 0  0 .5rem; text-align: center;}
  header .mobile_new .riga3 .col1 a {color: #000}
  header .mobile_new .riga3 .col1 .fa {font-size: 1.5rem; margin-right: 5px}


section#fascetta2 {
    background: yellow; /* #006400 Verde natalizio scuro */
    color: #000; 
    display: block;
    font-family: "Roboto", sans-serif; 
    font-size: .95rem; 
    line-height: 1.5; 
    margin-top: 10px; 
    padding: .5rem; 
    text-align: center; 
    width: 100%
}
@media only screen and (max-width: 600px) {
    section#fascetta2 {
        font-size: 1rem; 
    }
}




/* menu drilldown */
div#offCanvas a {color: #000; padding: .7rem 1.6rem .7rem .3rem}
div#offCanvas .is-drilldown-submenu-parent > a::after {border-color: transparent transparent transparent #000}
div#offCanvas .js-drilldown-back > a {font-weight: bold}
div#offCanvas .js-drilldown-back > a::before {border-color: transparent #F60 transparent transparent}



  div#offCanvas ul.lvl0 > li > a {font-weight: bold}

div#offCanvas ul.lvl1 a {font-family: Arial, Helvetica, sans-serif; font-size: .85rem}
div#offCanvas ul a.attivo {background: #F3F3F3; font-weight: bold}


/* menu dropdown (e drilldown) */
.menu.vertical {font-size: 16px}
.menu.nested {margin-left: 0}

#riga3 a {color: #000; font-family: "Roboto", sans-serif; line-height: 25px; padding: .3rem 1rem .3rem 0}
#riga3 .is-accordion-submenu-parent > a:after {border-color: #000 transparent transparent; bottom: .15rem; display: inline-block; left: .5rem; position: relative}

#riga3 li.bg1, div#offCanvas li.bg1 {background: #EAFAE2}
#riga3 li.bg1 > a, div#offCanvas li.bg1 > a {
    background: rgb(203, 237, 187);
    background: -moz-linear-gradient(90deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    background: -webkit-linear-gradient(90deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    background: -o-linear-gradient(90deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    background: -ms-linear-gradient(90deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    background: linear-gradient(180deg, rgb(203, 237, 187) 13%, rgb(140, 215, 110) 50%);
    border-top: 1px solid #60C13B
}
#riga3 li.bg1 ul li a, div#offCanvas li.bg1 ul li a {border-bottom: 1px solid #60C13B}

#riga3 li.bg2, div#offCanvas li.bg2 {background: rgb(250, 250, 180)}
#riga3 li.bg2 > a, div#offCanvas li.bg2 > a {
    background: rgb(250, 250, 180);
    background: -moz-linear-gradient(90deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    background: -webkit-linear-gradient(90deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    background: -o-linear-gradient(90deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    background: -ms-linear-gradient(90deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    background: linear-gradient(180deg, rgb(250, 250, 180) 13%, rgb(240, 235, 110) 50%);
    border-top: 1px solid #EECC00
}
#riga3 li.bg2 ul li a, div#offCanvas li.bg2 ul li a {border-bottom: 1px solid #EECC00}

#riga3 li.bg3, div#offCanvas li.bg3 {background: rgb(250, 225, 200)}
#riga3 li.bg3 > a, div#offCanvas li.bg3 > a {
    background: rgb(250, 225, 200);
    background: -moz-linear-gradient(90deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    background: -webkit-linear-gradient(90deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    background: -o-linear-gradient(90deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    background: -ms-linear-gradient(90deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    background: linear-gradient(180deg, rgb(250, 225, 200) 13%, rgb(230, 160, 100) 50%);
    border-top: 1px solid #ED8039
}
#riga3 li.bg3 ul li a, div#offCanvas li.bg3 ul li a {border-bottom: 1px solid #ED8039}

#riga3 li.bg5, div#offCanvas li.bg5 {background: rgb(226, 245, 245)}
#riga3 li.bg5 > a, div#offCanvas li.bg5 > a {
    background: rgb(226, 245, 245);
    background: -moz-linear-gradient(90deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    background: -webkit-linear-gradient(90deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    background: -o-linear-gradient(90deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    background: -ms-linear-gradient(90deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    background: linear-gradient(180deg, rgb(226, 245, 245) 13%, rgb(125, 200, 220) 50%);
    border-top: 1px solid #5CB6D1
}
#riga3 li.bg5 ul li a, div#offCanvas li.bg5 ul li a {border-top: 1px solid #5CB6D1}

#riga3 li.bg6, div#offCanvas li.bg6 {background: rgb(240, 220, 235)}
#riga3 li.bg6 > a, div#offCanvas li.bg6 > a {
    background: rgb(240, 220, 235);
    background: -moz-linear-gradient(90deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    background: -webkit-linear-gradient(90deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    background: -o-linear-gradient(90deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    background: -ms-linear-gradient(90deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    background: linear-gradient(180deg, rgb(240, 220, 235) 13%, rgb(225, 158, 195) 50%);
    border-top: 1px solid #CC4F96
}

#riga3 li.bg6 ul li a, div#offCanvas li.bg6 ul li a {border-bottom: 1px solid #CC4F96}

#riga3 li.bg7, div#offCanvas li.bg7 {background: rgb(250, 235, 223)}
#riga3 li.bg7 > a, div#offCanvas li.bg7 > a {
    background: rgb(250, 235, 223);
    background: -moz-linear-gradient(90deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    background: -webkit-linear-gradient(90deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    background: -o-linear-gradient(90deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    background: -ms-linear-gradient(90deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    background: linear-gradient(180deg, rgb(250, 235, 223) 13%, rgb(215, 200, 190) 50%);
    border-top: 1px solid #B9A995
}
#riga3 li.bg7 ul li a, div#offCanvas li.bg7 ul li a {border-bottom: 1px solid #B9A995}

#riga3 li.bg8, div#offCanvas li.bg8 {background: rgb(206, 230, 220)}
#riga3 li.bg8 > a, div#offCanvas li.bg8 > a {
    background: rgb(206, 230, 220);
    background: -moz-linear-gradient(90deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    background: -webkit-linear-gradient(90deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    background: -o-linear-gradient(90deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    background: -ms-linear-gradient(90deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    background: linear-gradient(180deg, rgb(206, 230, 220) 13%, rgb(115, 190, 165) 50%);
    border-top: 1px solid #50B589
}
#riga3 li.bg ul li a, div#offCanvas li.bg8 ul li a {border-bottom: 1px solid #50B589}

#riga3 li.bg10, div#offCanvas li.bg10 {background: rgb(250, 223, 223)}
#riga3 li.bg10 > a, div#offCanvas li.bg10 > a {
  background: rgb(250, 223, 223);
  background: -moz-linear-gradient(90deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  background: -webkit-linear-gradient(90deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  background: -o-linear-gradient(90deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  background: -ms-linear-gradient(90deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  background: linear-gradient(180deg, rgb(250, 223, 223) 13%, rgb(220, 73, 93) 50%);
  border-top: 1px solid #C25B6D;
}
#riga3 li.bg10 ul li a, div#offCanvas li.bg10 ul li a {border-bottom: 1px solid #C25B6D}

#riga3 li.bg9 ul li a, div#offCanvas li.bg9 ul li a {border-bottom: 1px solid #F60}
div#offCanvas li.lingue {padding: 15px 0 15px; text-align: center}
div#offCanvas li.lingue a {padding-right: .3rem}

#riga3 li.bg93,
#riga3 li.bg99 {border-top: 1px solid #666; border-bottom: 1px solid #222}
#riga3 li.bg93 i {color: #060; display: inline-block; margin-bottom: -3px}

#riga3 li.bg99 {border-top: 0}
#riga3 li.bg99 img {height: 25px}
#riga3 li.bg99 ul li a {border-bottom: 1px solid #F5E9C2}

#riga3 ul.lvl0 > li > a {font-size: 1rem; font-weight: 700; padding-left: 1rem}

#riga3 ul.lvl1 {margin-left: 1.5rem; padding-bottom: 1rem}
#riga3 ul.lvl1 > li > a {font-weight: 400}

#riga3 ul.lvl2 {margin-left: 1.5rem; padding-bottom: 1rem}
#riga3 ul.lvl2 > li > a {font-size: 1.05em; font-weight: 400}

#riga3 ul.lvl3 {margin-left: 1.5rem; padding-bottom: 1rem}
#riga3 ul.lvl3 > li > a {font-size: 1em; font-weight: 400}

#riga3 ul.lvl4 {margin-left: 1.5rem; padding-bottom: 1rem}
#riga3 ul.lvl4 > li > a {font-size: .9em; font-weight: 400}



/* corpo */

div#corpo {
    margin-bottom: 1rem;
    min-height: 350px;
    overflow: hidden;
}

div#mini_menu {display: none; margin-top: .5rem; text-align: center}
  div#mini_menu .column a {background: #FFF; border: 1px solid #FFF; display: block; margin-bottom: .15rem}
  div#mini_menu .column a {-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.75); box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.75)}
  div#mini_menu .column img {margin: 0 auto; width: 45px}
  div#mini_menu .column span.nome {color: #000; display: block; font: 700 .75rem "Roboto", sans-serif}
  div#mini_menu .cani span.nome {border-top-color: #D0B20F}
  div#mini_menu .gatti span.nome {border-top-color: #E54923}
  div#mini_menu .pesci span.nome {border-top-color: #5CB6D1}
  div#mini_menu .altri span.nome {border-top-color: #AD3087}


/* --- contenitore principale --- */


/*.wrapBianco {background: #FFF; box-shadow: 1px 14px 17px 1px #DCDCDD; -webkit-box-shadow: 1px 14px 17px 1px #DCDCDD; -moz-box-shadow: 1px 14px 17px 1px #DCDCDD; -o-box-shadow: 1px 14px 17px 1px #DCDCDD; padding: 1rem}*/

.wrapBianco {
    position: relative
}

.wrapBianco p > a {
    color: #333;
    text-decoration: underline
}

.wrapBianco h1,
.wrapBianco h2,
.wrapBianco h3 {
    color: #333;
    font: 700 2.5rem "Roboto", sans-serif
}

.wrapBianco h2 {
    font-size: 1.8rem
}

.wrapBianco h3 {
    font-size: 1.2rem
}

.wrapBianco p {
    line-height: 1rem
}


/* ordinamento */

section#ordinamento select {
    font-size: .8rem;
    height: auto;
    margin-top: .5rem;
    padding-top: .2rem;
    padding-bottom: .2rem;
    padding-left: .2rem
}


/* paginatore */

.pagination .current {
    background: none;
    border-bottom: 6px solid #F60;
    color: #000;
    font-weight: bold
}

.pagination-previous.disabled::before,
.pagination-previous a::before {
    content: none
}

.pagination-next.disabled::after,
.pagination-next a::after {
    content: none
}


/* --- accordion --- */

section#accordion {
    position: relative
}

section#accordion .accordion-title {
    background: #CCC;
    color: #333;
    font: 700 1.2rem "Roboto", sans-serif;
    padding: .5rem 2.5rem .5rem 1rem
}

section#accordion .accordion-title:hover,
section#accordion .is-active > .accordion-title {
    background-color: #CCC
}

section#accordion .accordion-title:before {
    content: "\f18e";
    font-family: "FontAwesome";
    font-weight: 100;
    top: 40%
}

section#accordion .accordion-title span {
    font-size: 1.6rem
}

section#accordion .is-active > .accordion-title:before {
    content: "\f01a"
}


/* super promozioni & set completi */

section#promoSet {
    background: #FFF;
    margin-bottom: 1rem;
    position: relative
}

section#promoSet .bollino {
    padding: 6px 3px;
    top: 5px
}

section#promoSet .promo a {
    background: #FFF;
    color: #666;
    display: block;
    padding: 0.5rem;
    position: relative;
    overflow: hidden
}

section#promoSet .promo a img {
    padding: 1rem 0 .5rem
}

section#promoSet .promo strong.super {
    background: #CCC;
    color: #000;
    display: block;
    margin-bottom: .5rem;
    padding: 5px
}

section#promoSet .promo strong.super.text-right {
    padding-right: 20px
}

section#promoSet .promo strong.marca {
    display: block;
    color: #F60
}

section#promoSet .promo span.descrizione {
    display: block;
    height: 110px;
    overflow: hidden
}

section#promoSet .promo a .prezzi {
    border-top: 1px solid #CCC;
    margin: 1.5rem 0 .5rem
}

section#promoSet .promo a .prezzo1 {
    text-decoration: line-through
}

section#promoSet .promo a .prezzo2 {
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1rem;
    color: #060
}

section#promoSet .promo a .prezzo2 .cad {
    font-size: 0.6rem;
    font-weight: normal;
    color: #000;
    display: block
}

section#promoSet .slick-next,
section#promoSet .slick-prev {
    border: none;
    color: #060;
    cursor: pointer;
    display: none !important;
    font: 700 2rem "Roboto", sans-serif;
    height: 100%;
    position: absolute;
    top: 0;
    width: 35px
}

section#promoSet .slick-prev {
    left: -35px
}

section#promoSet .slick-next {
    right: -35px
}

section#promoSet .slick-prev i,
section#promoSet .slick-next i {
    margin: 0 0.2rem
}


/* informa */
section#informa .accordion-title {background: #666; color: #FFF; font-size: 1rem; font-weight: bold; padding: 1rem}
section#informa .accordion-title::before {content: "\f105"; font-family: "FontAwesome"}
section#informa .is-active > .accordion-title::before {content: "\f107"; font-family: "FontAwesome"}


/* marche */

section#marche .button {
    font-size: .8rem;
    padding: .5rem
}
section#marche-list .button {
    font-size: .8rem;
    padding: .5rem
}
section#marche-list a:hover.button  {
    color: #fff
}


/* footer */
footer {background: #fff; color: #333}
footer a {color: #333}

footer h1, footer h2 {font-family: "Roboto", sans-serif}
footer h1 {font-size: 1.2rem; font-weight: 500; line-height: 2.5rem; margin-bottom: 0} 
footer h2 {font-size: 1rem; font-weight: 500; margin-bottom: .15rem}

footer ul {list-style: none; margin-left: 0}
@media screen and (max-width:414px) {
  footer ul a {font-size: 1.2rem; line-height: 2.5rem}
}

footer div.n23.riga1 .columns {font-size: 1rem; padding-top: 10px; padding-bottom: 0}
footer div.n23.riga1 .columns p {line-height: 1.25}
footer div.n23.riga1 strong {text-transform: uppercase}
footer div.n23.riga1 a {text-decoration: underline}
@media screen and (max-width:414px) {footer div.n23.riga1 a {display: inline-block; margin: 5px 0}}
footer div.n23.riga1 a:hover {color: #060}
@media screen and (min-width: 64em) {footer div.n23.riga1 img {height: 65px}}

footer div.n23.riga2 {background: #c7d9c7; color: #000; font-size: .88rem;}
footer div.n23.riga2 h2 {border-bottom: 0; font-family: "Roboto", sans-serif; font-size: 1.4rem; margin-top: 1rem; padding-top: 0}
footer div.n23.riga2 p {line-height: 1.2}
footer div.n23.riga2 > .columns {border-top: 1px solid #fff}
footer div.n23.riga2 > .columns:first-child {border-right: 2px solid #fff}
footer section#iscr_newsletter .fa {color: #333; font-size: 1.15rem}
footer section#iscr_newsletter label {font-size: 12px}
footer section#iscr_newsletter label a {text-decoration: underline}
footer div.n23.riga2 .telefono {color: #060; display: flex; align-items: top; font-size: 2rem; font-weight: bold; line-height: 1; margin-bottom: 0}
footer div.n23.riga2 .telefono .fa {font-size: 3.5rem; margin: -3px 15px 0 0}

footer ul.bottoni {margin-bottom: 45px}
footer ul.bottoni a {border-bottom: 1px solid #E0E0E0; display: block; font-size: 1rem; margin-bottom: 0}
footer ul.bottoni a:before {content: "➔ "}


/* footer credits */
footer section#credits {
    background-image: -webkit-gradient(linear, top, bottom, color-stop(0, #DBDBDB), color-stop(1, #F7F7F7));
    background-image: -o-linear-gradient(top, #DBDBDB, #F7F7F7);
    background-image: -moz-linear-gradient(top, #DBDBDB, #F7F7F7);
    background-image: -webkit-linear-gradient(top, #DBDBDB, #F7F7F7);
    background-image: linear-gradient(to bottom, #DBDBDB, #F7F7F7);
    border-top: 1px solid #CCC;
    overflow: hidden;
    padding: 1.5rem 0 .5rem
}

footer section#credits {
    border-bottom: 1px solid #CCC;
    margin-bottom: 2rem;
    padding: .5rem 0
}

footer #spceFooter {
    border-top: 1px solid #CCC;
    overflow: hidden;
    padding: 1.5rem 0 .5rem;

}

footer section#credits img {
    margin-bottom: .5rem
}

footer section#credits h1 {
    font-size: .8rem;
    line-height: 1rem
}


/* pop-up iscrizione newsletter */
section#iscr_newsletter.popup {border-top: 1px solid #fff; color: #000; margin-bottom: 0;}
section#iscr_newsletter.popup h2 {border-bottom: 0; font-family: "Roboto", sans-serif; font-size: 2rem; font-weight: bold; margin-bottom: 0; padding-top: 0;}
section#iscr_newsletter.popup p {font-size: 14px}
section#iscr_newsletter.popup p strong {font-size: 18px; line-height: 0}
section#iscr_newsletter.popup p small {font-size: 12px}
section#iscr_newsletter.popup .fa {color: #333; font-size: 1.15rem}
section#iscr_newsletter.popup input[type="email"] {width: 100%}
section#iscr_newsletter.popup label {font-size: inherit}
section#iscr_newsletter.popup label a {text-decoration: underline}
section#iscr_newsletter .callout {font-size: .8rem; line-height: 1.2}
section#iscr_newsletter .callout.warning {background-color: #fff559}


/* menu */

section#menuFoot {
  margin-bottom: .2rem;
}

section#menuFoot #atftbx {
    margin-bottom: 1.2rem
}

section#menuFoot #atftbx p {
    margin-bottom: .2rem
}

section#menuFoot p.corto {
    line-height: 1.3rem
}

section#menuFoot .input-group {
    margin-top: 5px
}

section#menuFoot .input-group-field {
    border-color: #E0E0E0;
    height: 2.1rem;
    font-size: .8rem
}

section#menuFoot .button {
    background: #D2D2D2;
    color: #333;
    font-weight: bold;
    height: 34px;
    line-height: .5
}

section#menuFoot {
    font-size: 1rem;
    line-height: 2rem
}
section#menuFoot p {
    line-height: 2rem
}

   section#menuFoot h2 {
        font-size: 1.0em
    }
/* --------------------------- */


/* monitor larghi meno di 1122px */

@media screen and (max-width: 70.125em) {
    /* header */
    header #menuSotto1 li.bg99 {
        width: 13.5%
    }

}


/* Small only */
@media screen and (max-width:414px) {
.box-slide .slick-arrow { display: none!important}

}



/* Large and up */

@media screen and (min-width: 64em) {
    /* header */
    /*section#beta {position: fixed; top: 0; z-index: 999; width: 100%}*/
    /*header {padding-top: 31px}*/
    header .sopra .menu {
        float: right;
    }
    header .sopra .menu li {
        margin-right: 1.3rem
    }
    header .sopra .menu li.lingue {
        position: absolute;
        left: -84%
    }
    body.en .sopra .menu li.lingue {left: -79%}
    body.fr .sopra .menu li.lingue {left: -61%}
    body.de .sopra .menu li.lingue {left: -88%}
    body.es .sopra .menu li.lingue {left: -51%}

    header .sopra .menu li.first {
        position: absolute;
        left: -45%
    }
    body.en .sopra .menu li.first {left: -36%}
    body.fr .sopra .menu li.first {left: -36%}
    body.de .sopra .menu li.first {left: -47%}
    body.es .sopra .menu li.first {left: -30%}


    header .sopra .menu li.last{
        margin-right: 0
    }
    header .sopra .menu a {
        font-size: 0.8rem
    }
      section#menuFoot {
        font-size: .9em
    }

    /* super promozioni & set completi */
    section#promoSet .slick-prev,
    section#promoSet .slick-next {
        display: block !important
    }
    /* footer credits */
    footer .telefono {
        margin-bottom: 3rem
    }
    footer section#credits img {
        margin-bottom: 0
    }
    footer section#credits h1 {
        font-size: 1.1rem;
        line-height: 3.1rem
    }
}



/* pop-up */
#mask {background-color: #000; display: none; left: 0; position: absolute; top: 0; z-index: 9000}
#mask {display: none; left: 0; position: absolute; top: 0; z-index: 9000}
#boxes .window {border: 0px solid #666; display: none; height: 500x; width: 400px; position: fixed; z-index: 9999}
#boxes #banner {height: 500px; width: 400px}