/* comuni */
div.pagina {min-height: 500px; overflow: hidden}



/* header */
div#fascetta, div#fascetta2 {background: #ff0; color: #000; font-size: 1rem; padding: .2rem 0 .25rem; text-align: center}
div#fascetta p {margin-bottom: 0}
div#fascetta2 {background: #f00; color: #fff; font-weight: normal}
body.diretta div#fascetta2 {display: none}

#testoScroll {background: #ff0; height: 40px; position: relative; overflow: hidden}
#testoScroll p {color: #222; font-size: 1rem; line-height: 1.2; margin: 0; position: absolute; text-align: center; top: 50%; transform: translateY(-50%); width: 100%}

section#menu1 {background: url(../_img/bg-top.jpg) repeat-y center top}
  section#menu1 .menu {padding: 3px 0}
  section#menu1 li {border-right: 1px solid #B5B7B9}
    section#menu1 li:first-child {border-right: 0}
  section#menu1 li a {color: #555; padding: 0.35rem 0.4rem}
    section#menu1 li a:hover {color: #1A94CC}


section#testata {padding: 15px 0}
  section#testata img {margin-bottom: 15px}
  section#testata img.logo {margin-top: -10px}

  section#testata .cerca {margin-top: 18px}
    section#testata .input-group-field {height: 2.5rem}
    section#testata .input-group-button .button {font-size: 25px; padding: 0.2em 0.5em}
    section#testata .button {background: #F5F5F5; border: 1px solid #CACACA; border-left: 0; border-radius: 0; box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1) inset; box-sizing: border-box; color: #020200}

  section#testata .icone, section#preMenu2 .icone {text-align: center}
  section#testata a.utente, section#testata a.carrello, section#testata a.pagamenti, section#testata a.video,
  section#preMenu2 a.utente, section#preMenu2 a.carrello, section#preMenu2 a.pagamenti, section#preMenu2 a.video, section#preMenu2 a.offerte {color: #111; display: inline-block; font-size: 0.7rem; margin: 9px 10px 0 0; text-align: center; text-transform: uppercase}
  section#preMenu2 a.offerte {color: #a1161f}
    section#testata a.utente:hover, section#testata a.carrello:hover, section#testata a.pagamenti:hover, section#testata a.video:hover,
    section#preMenu2 a.utente:hover, section#preMenu2 a.carrello:hover, section#preMenu2 a.pagamenti:hover, section#preMenu2 a.video:hover, section#preMenu2 a.offerte:hover {color: #1A94CC}
    section#testata a.video, section#preMenu2 a.offerte {margin-right: 0}
    section#testata a.utente .fas, section#testata a.carrello .fas, section#testata a.pagamenti .fas, section#testata a.video .fas,
    section#preMenu2 a.utente .fas, section#preMenu2 a.carrello .fas, section#preMenu2 a.pagamenti .fas, section#preMenu2 a.video .fas, section#preMenu2 a.offerte .fas {display: block; font-size: 2.5rem}
    section#testata a.pagamenti .fas, section#preMenu2 a.pagamenti .fas {font-size: 2.3rem}
    section#testata a.video .fas, section#preMenu2 a.video .fas, section#preMenu2 a.offerte .fas {font-size: 2.15rem}
    section#preMenu2 a.offerte .fas {animation: blink 1.5s infinite}
    @keyframes blink {
      0% {opacity: 1;}
      50% {opacity: 0.1;}
      100% {opacity: 1;}
    }


section#testata2 {padding-top: 15px}
  section#testata2 img {margin-bottom: 15px}
  section#testata2 img.logo {margin-top: -10px}

  section#testata2 .cerca {margin-top: 18px}
    section#testata2 .input-group-field {height: 2.5rem}
    section#testata2 .input-group-button .button {font-size: 25px; padding: 0.2em 0.5em}
    section#testata2 .button {background: #F5F5F5; border: 1px solid #CACACA; border-left: 0; border-radius: 0; box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1) inset; box-sizing: border-box; color: #020200}

  section#testata2 ul.bottoniera {margin: 15px 0 0}
  section#testata2 ul.bottoniera li {border-right: 1px dashed #cacaca; display: inline-block; font-size: 0.75rem; padding: 0 13px}
    section#testata2 ul.bottoniera li:last-child {border-right: 0; padding-right: 0}
  section#testata2 ul.bottoniera a {color: #111; display: inline-block; text-align: center}
    section#testata2 ul.bottoniera a:hover {color: #1A94CC}
  section#testata2 ul.bottoniera .fas {display: block; font-size: 2rem; margin-top: 10px}
  section#testata2 ul.bottoniera li.grande .testo1 {color: #1A94CC; font-size: 1.5em; font-weight: bold; line-height: 1}
  section#testata2 ul.bottoniera li.grande .fas {color: #000; float: left; margin: 12px 10px 0 0}


  section#premenu2 .icone {text-align: center}
  section#premenu2 a.utente, section#premenu2 a.carrello, section#premenu2 a.pagamenti {color: #111; display: inline-block; margin: 9px 15px 0 0; text-align: center; text-transform: uppercase}
  section#premenu2 a.pagamenti {margin-right: 0}
    section#premenu2 a.utente:hover, section#premenu2 a.carrello:hover, section#premenu2 a.pagamenti:hover {color: #1A94CC}
  section#premenu2 a.utente .fas, section#testata a.carrello .fas, section#premenu2 a.pagamenti .fas {display: block; font-size: 2.5rem}
  section#premenu2 a.pagamenti .fas {font-size: 2rem; margin: 5px 0 3px}





section#menu2 {background: #DFE0E0 !important; position: relative; z-index: 3}
body.diretta section#menu2 {display: none}


section#slider {overflow: hidden; position: relative}
  section#slider em {background: url(../_img/bg-caption_slider.png); height: 2000px; position: absolute; right: -50%; top: -500px; transform: rotate(30deg); width: 100%}
  section#slider .flexslider {border: 0; margin:0}
  section#slider .flex-direction-nav a {height: 50px; top: 45%}
  section#slider .flex-control-paging {display: none}
  section#slider .flex-caption {display: none}


/* impaginato */
main section {padding-bottom: 50px}
  main section:first-child {padding-top: 50px}
  body.hp main section {padding: 50px 0}

/* hp */
section.promozioni {background: #DCDDDD; padding-bottom: 10px}
  section.promozioni .row .promozione {margin: 0 -1px 40px 0; border-right: 0.5px solid #999; border-left: 0.5px solid #999}
    section.promozioni .row .promozione:last-child {float: left}
    section.promozioni .row .contenitore {min-height: 153px; position: relative}
  section.promozioni .offerta {background: #fe0000; color: #fff; display: block; padding: 1px 3px; text-align: center; position: absolute; width: 100%; z-index: 99}
  section.promozioni .row .promozione img {margin-bottom: 5px}
  section.promozioni h4 {background: #1A94CC; color: #FFF; font-size: 22px; font-weight: bold; margin: 10px 0; padding: 6px}
    section.promozioni h4 strike {color: #F00; float: right; font-size: 0.5em}
    section.promozioni h4 strike span {color: #FFF}
  section.promozioni h3 {color: #1A94CC; font: bold 14px "Raleway", serif; text-transform: uppercase}
  section.promozioni h3 a {display: block; height: 34px}
  section.promozioni div.testo {height: 88px; margin-bottom: 10px}
  section.promozioni a.button {background: #000; color: #FFF; display: block; font: bold 1em "Lato", sans-serif; margin-bottom: 0; padding: 5px}
    section.promozioni a.button strike {font-size: 0.75rem; margin-top: 2px}
  section.promozioni a.button:hover {background: #FFF; color: #E2001A}
  section.promozioni a.button span.fa {display: inline-block; font-size: 1.2em; margin-right: 5px}


section#slider2 {padding: 30px 0}
  section#slider2 .slideMarche {margin-bottom: 0}
  section#slider2 .slick-slide {background: #FFF; margin: 0 5px}


section#novita {background: #DCDDDD; padding-bottom: 20px}
  section#novita .row .prodotto {margin-bottom: 40px}
  section#novita img {margin-top: 5px; width: 100%}
  section#novita h3 {color: #1A94CC; font: 16px/1em "Raleway", serif; height: 71px; overflow: hidden}
  section#novita a.bottone {background: #000; color: #FFF; display: block; font: bold 1em "Lato", sans-serif; margin-bottom: 0; padding: 5px; position: relative; width: 100%}
  section#novita a.bottone:hover {background: #FFF; color: #E2001A}
  section#novita a.bottone .fas {display: inline-block; font-size: 1.2em}
    section#novita a.bottone .fa-shopping-cart {margin-right: 5px}
    section#novita a.bottone .fa-search {margin-left: 5px}
  section#novita .link2 a.bottone {background: #1A94CC}
  section#novita .link2 a.bottone:hover {background: #FFF; color: #E2001A}


section#news {padding-bottom: 35px}
  section#news a {color: #FFF}
  section#news .fa-edit {background: #1A94CC; border-radius: 50% 50% 50% 50%; float: left; font-size: 2.8em; height: 70px; line-height: 1.65em; margin-bottom: 30px; text-align: center; width: 70px}


body.hp section#video {background: #EFF0F0; font-size: 1.1em}
  body.hp section#video h2 {color: #1A94CC; font: 300 1.8em "Raleway", serif}
  body.hp section#video h3 {color: #1A94CC; font-size: 1.4em}
  body.hp section#video .fa-film, body.hp section#video .fa-clock, body.hp section#video .fa-lightbulb {background: #1A94CC; color: #FFF; border-radius: 50% 50% 50% 50%; float: left; font-size: 0.75em; height: 35px; line-height: 1.55em; margin-right: 10px; text-align: center; width: 40px}
    body.hp section#video .fa-clock {line-height: 1.45em}
    body.hp section#video .fa-lightbulb {line-height: 1.45em}
  body.hp section#video .elenco {font-size: 1.2em; margin-left: 0; list-style: none}
    body.hp section#video .elenco li {margin-bottom: 12px; line-height: 1em}
    body.hp section#video .elenco li:last-child {margin-bottom: 0}
    body.hp section#video .elenco a {color: #473816; display: block; line-height: 1.15em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap}
    body.hp section#video .elenco a:hover {color: #1A94CC}


section#marche {border-top: 1px solid #DCDDDD; background: #DCDDDD; padding: 0}
  section#marche .columns {margin-bottom: 15px}
  section#marche a {color: #473816; display: block; line-height: 1.5em; overflow: hidden; text-overflow: ellipsis; text-transform: lowercase; white-space: nowrap}
  section#marche a:first-letter {color: #473816; display: block; text-transform: uppercase}
    section#marche a:hover, section#marche a:hover:first-letter {color: #9C9E9F}


section#video .datiVideo {margin-bottom: 15px}
section#video .datiVideo .titolo {padding-top: 10px}
section#video .datiVideo .titolo {font-size: 16px}
section#video .datiVideo .titolo > strong {font-size: 20px; line-height: 1.2}
section#video .datiVideo .columns {margin-bottom: 15px}
section#video .datiVideo strong {color: #1779BA; font-size: 15px}
section#video .datiVideo .far {float: left; font-size: 1.8rem; margin-right: 5px}

section#video .prodSlide_container h2 {background: #DCDDDD; font-size: 18px; font-weight: bold; padding: 5px 10px}
section#video .prodSlide {background: #DCDDDD}
section#video .prodSlide .slick-prev, section#video .prodSlide .slick-next {color: #000}
section#video .prodSlide .prodotto {margin: 15px 10px 0; padding-bottom: 10px}
section#video .prodSlide .prodotto img {margin-bottom: 10px}
section#video .prodSlide .prodotto div.testo {height: 52px; margin-bottom: 10px}
  section#video .prodSlide .prodotto div.testo a {color: #000}
section#video .prodSlide .prodotto a.button {background: #000; color: #FFF; display: block; font: bold 1em "Lato", sans-serif; margin-bottom: 0; padding: 5px}
  section#video .prodSlide .prodotto a.button strike {font-size: 0.75rem; margin-top: 2px}
section#video .prodSlide .prodotto a.button:hover {background: #FFF; color: #E2001A}
section#video .prodSlide .prodotto a.button span.fa {display: inline-block; font-size: 1.2em; margin-right: 5px}



/* footer */
footer {color: #6F6F6F}
  footer section {padding: 50px 0}
  footer h3, footer h4 {color: #474D50; font-family: "Lato", sans-serif; font-weight: bold}
  footer a {color: #6F6F6F}
    footer a:hover {color: #434748}


section#social {color: #474D50}
  section#social .input-group-label {background: none; border:0; color: #474D50; font-size: 1.3em; font-weight: bold; padding-left: 0}
  section#social .input-group-field {height: 2.37rem}
  section#social .input-group-button .button {font-size: 29px; height: 38px; padding: 0 0.5em}
  section#social .button {background: #F5F5F5; border: 1px solid #CACACA; border-radius: 0; box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1) inset; box-sizing: border-box; color: #020200}

  section#social .button-group {margin: 0; margin-top: 15px}
  section#social .button-group .button {background: #1992c7; border: 1px solid #1992c7; border-radius: 50% 50% 50% 50%; color: #FFF; height: 60px; margin-right: 8px; width: 60px}
    section#social .button-group .button.bott1 {border-color: #1877f2; background: #1877f2}
    section#social .button-group .button.bott2 {border-color: #f00; background: #f00}
    section#social .button-group .button.bott3 {border-color: #c32aa3; background: #c32aa3}
    section#social .button-group .button.bott4 {border-color: #010101; background: #010101}
    section#social .button-group .button.bott5 {border-color: #0088cc; background: #0088cc}
    section#social .button-group .button:last-child {margin-right: 0}    
  section#social .button-group span {font-size: 30px; line-height: 1.1}


section#menu {border-top: 6px solid #474D50}
  section#menu .col1 .columns {margin-bottom: 15px}
  section#menu .col1 h4 {font-size: 18px}
  section#menu .col1 a {border-bottom: 1px solid #E1E1E1; display: block; line-height: 20px; padding: 10px 0}
    section#menu .col1 a:first-child {padding-top: 0}
    section#menu .col1 a.video {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap}
    section#menu .col1 a.video .fas {margin-right: 10px}

  section#menu .col2 {border-left: 1px solid #E1E1E1}
    section#menu .col2 h3 {font-size: 22px}


section#credits {padding: 0 0 30px}
  section#credits .row {border-top: 1px solid #E1E1E1; font-size: 0.9em; padding-top: 30px}
  section#credits img {margin-top: 15px}



.slicknav_menu { padding: 0;}
body.diretta .slicknav_menu {display: none} 


/* Small only */
@media screen and (max-width: 39.9375em) {
  #testoScroll p {font-size: .8rem !important}
}

@media (min-width:640px)
{
  section#preMenu2 .testata-mobile {margin-bottom: 20px;}
  section#preMenu2 .service-icon a   { font-size: 1.5rem!important}
  section#preMenu2 .service-icon .fas   { padding:10px;}

}

@media (max-width:768px)
{
  main section:first-child { padding-top: 0;}


}

@media (max-width:414px)
{
  body.hp main section {padding: 20px 0}
  section#testata {padding-top: 0}
}
