::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #666!important;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #666!important;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #666!important;
}
:-moz-placeholder { /* Firefox 18- */
  color: #666!important;
}


#checkout h2 { font-size: 1.3rem}
#checkout .fa-stack { color:#060}
#checkout .fa-stack strong { color:#fff}

/* --- menù checkout --- */
section#navCheckout {background: url(../_img2/bg_titolo.gif) 0 40% repeat-x; display: block; text-align: center}
  section#navCheckout a {background: #F3F3F3; color: #C8D3E2; display: inline-block; font-family: "Roboto", sans-serif; font-size: 1.083em; margin: 0 2% 2rem; padding: 0 1em; text-align: center; text-transform: uppercase; position: relative}
  section#navCheckout a:hover, section#navCheckout a.active {color: #F60}
    section#navCheckout a .step {display: inline-block; font-weight: 700; position: relative}
      section#navCheckout a .step:before {content: "\f096"; font-family: 'FontAwesome'; font-weight: 400; left: -.4rem; top: .1rem; position: absolute; font-size: 1.5rem}
    section#navCheckout a span {display: inline-block; margin-left: .5rem}


/* --- back --- */
section#back {display: none}

/* --- button  --- */
#checkout .button.grigio, #checkout .button.arancio {background: #666; padding:0.3rem; width:145px; font-size:0.8rem; margin-top:15px}
#checkout .button.arancio {background: #F6A508}
  #checkout .button.grigio:hover, #checkout .button.arancio:hover {background: #B3B3B3}


/* --------- carrello --------- */

  /* --- modali --- */
  div.aggiornato, div.rimosso, div.spedizione, div.promoLibri {padding: .5rem 1rem}
    div.spedizione {background: #FFC}
    div.promoLibri {background: #e1faea}
  div.aggiornato h5, div.rimosso h5, div.spedizione h5, div.promoLibri h5 {font-size: .9rem; margin-bottom: 0}
  .close-button {right: .3rem; top: .3rem}


  /* --- prodotti --- */
  section#prodCart {position: relative}
    section#prodCart table {border-collapse: collapse; font-size: 14px; position: relative}
      section#prodCart table tr.bordo td {border-bottom: 1px solid #F1F1F1}
        section#prodCart table tr:last-child {border-bottom: 0}
        section#prodCart table tr:nth-of-type(even) {background-color: transparent !important}
      section#prodCart table p {margin-bottom: .2rem}
        section#prodCart table p:last-child {margin-bottom: 0}
        section#prodCart table p strong {color: #060}
      section#prodCart table input {display: inline-block; font-size: .8rem; margin-bottom: .5rem; max-width: 50px}
      section#prodCart table a.aggiorna {color: #000; font-size: .7rem}
        section#prodCart table a.aggiorna .fa {color: #060}
      section#prodCart table .fa-times-circle-o, section#prodCart table .fa-shopping-cart {font-size: 2em; color: #9B9B9B}
        section#prodCart table .fa-times-circle-o:hover, section#prodCart table .fa-shopping-cart:hover {color: #F60}

  /* quantità */
  .wrapQty .qty {background: #FFF !important; height: 20px; font-size: 0.75em; margin-bottom: 0 !important; padding: 0; text-align: center; width: 40px}
  .wrapQty input.qtyminus, .wrapQty input.qtyplus {background: #060; border: 1px solid #006FDE; color: #FFF; font-size: .9rem !important; height: 21px; margin-bottom: 0 !important; width: 22px}
  .wrapQty input.qtyplus {margin-right: 2px}
  .wrapQty span.rimuovi {display: inline-block; font-size: .8rem}


  /* --- regali --- */
  section#regali {background: #F3F3F3; padding: 1rem}
  section#regali .columns {margin-bottom: 1.5rem}
    section#regali .row:first-child .columns, section#regali .row:last-child .columns {margin-bottom: 0}
  section#regali img {cursor: pointer; margin: .5rem 0}
    section#regali .row.prima img {margin-top: 0}
    section#regali p {margin-bottom: .5rem}
      section#regali input {float: left; margin: 0 .5rem 3.5rem 0}
      section#regali .prezzo {color: #F00; display: inline-block; margin: 0 1rem; text-decoration: line-through}
        section#regali .prezzo span {color: #333}


  /* --- totali --- */
  section#totali {line-height:1.3;}


    /* --- omaggi --- */
    div#omaggio .titolo {font-size: 1.2rem; font-weight: bold; line-height: 1}
      div#omaggio span {font-size: 1.5rem}
    div#omaggio img {border-width: 5px 0; border-style: solid; border-color: #FFF; margin-top: 1rem}
    div#omaggio p:first-child {margin-top: 1rem}


    /* buono sconto */
    section#buonoSconto, section#premium, section#importi {background: #F3F3F3; padding: 1rem}
      section#buonoSconto strong {color: #000}
      section#buonoSconto [type="text"], section#buonoSconto .button {margin-bottom: 0; margin-top: .5em}
        section#buonoSconto .button {padding-top: .53rem; padding-bottom: .53rem}

    /* tessera premium  */
    section#premium {margin-bottom: 180px}
    section#premium2 {padding: 1rem 0}
    section#premium .wrapper, section#premium2 .wrapper {background: #EFFAED; padding: 1rem}
    section#premium img, section#premium2 img {margin-bottom: .5rem}
      section#premium2 img {float: left; margin-right: .5rem; width: 100px}

    /* spedizione gratuita */
    section#spedizione {color: #333; margin: 1rem 0}
      section#spedizione h2 {color: #13601D; font: 700 1.2rem "Roboto", sans-serif}
        section#spedizione h2 span {font-size: 2.5rem; line-height: 1}
      section#spedizione ul {list-style: none; margin-left: 0}
      section#spedizione p:last-child {margin-bottom: 0}
      section#spedizione strong {color: #000}
      section#spedizione .fa-long-arrow-right {color: #F60; font-size: 1rem; margin: 0 .3rem}

    /* svuota il carrello */
    a.svuotacart {color: #9b9b9b; font-size: .9rem}
    a.svuotacart:hover {color: #f60}


  /* --- importi --- */
  @media screen and (min-width: 64em) {
    div.wrapImporti {border: 1px solid #060}
    section#importi {border: 5px solid #FFF}
  }
  section#importi .riga {border-bottom: 1px solid #E6E6E6}
    section#importi .riga > .columns {padding-bottom: 1rem; margin-top: 1rem}
    section#importi .riga:first-child > .columns {margin-top: 0}
    section#importi .riga.premium em {font-size: .7rem; margin-left: 1.2rem}
  section#importi span.totale {color: #060; font: 700 1.25rem "Roboto", sans-serif}
  section#importi input {margin-bottom: 0}
section .totale { padding:  0 0 10px 0}


  .row.notepagamento {margin: 2rem 0 0}
  .row.notepagamento p:last-child {margin: 2rem 0 0}



/* --------- indirizzi --------- */
  /* --- indirizzi --- */
  section#accordion li#indirizzi .spunte input {float: left; margin: .1rem .5rem 0 0}
  section#accordion li#indirizzi .spunte p {font-size: .8rem; margin-bottom: .3rem}
  span.prefissoIVA {font-size: 1.2rem; line-height: 2}
  /*input#partita_iva {width: 90%}*/


  /* --- metodi di pagamento --- */
#pagamenti {margin: 1rem 0 2rem}
  input[type=radio].css-checkbox {clip: rect(0 0 0 0); height:1px; z-index:-1000; left:-1000px; margin:-1px; overflow: hidden; position:absolute; width:1px; padding:0; border:0}
  input[type=radio].css-checkbox + label.css-label {background-repeat: no-repeat; background-position: 0 0; cursor:pointer; display:inline-block; line-height: 28px; height: 28px; padding-left: 40px; vertical-align:middle}
  input[type=radio].css-checkbox:checked + label.css-label {background-position: 0 -28px}
  label.css-label {background-image: url(../_img2/radio-button.png); -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none}
    label.css-label img {margin-left: .8rem; max-width: 300px}


  #pagamenti .metodo {margin-bottom: 1.5rem}
    #pagamenti .metodo:last-child {margin-bottom: 0}

  @media screen and (min-width: 40em) {
    #pagamenti .metodo {margin-bottom: 0}
  }


    .note {padding: .3rem 0 0 4rem}
      .note p {margin-bottom: 0}



/* --------- GDPR --------- */
div#gdpr {border: 1px dashed #F6A508; padding: 1rem}
div#gdpr h3 {color: #000}
div#gdpr .testo {background: #FBFBFB; border: 1px solid #CCC; height: 75px; margin-bottom: 1rem; overflow-y: scroll; padding: 3px 5px}
  div#gdpr .testo .tit1 {font-size: 1.2rem}
  div#gdpr .testo .tit2 {font-size: .9rem}
  div#gdpr .testo p:last-child {margin-bottom: 0}
div#gdpr fieldset {overflow: hidden}
  div#gdpr fieldset .radio1 {color: #000; font-weight: bold}
  div#gdpr fieldset .radio2 {color: #666}
div#gdpr #avviso_gdprA, div#gdpr #avviso_gdprB {background: #FFC; border: 1px dashed #F6A508; margin: 0 auto .5rem; padding: .5rem; width: 315px}
@media screen and (min-width: 40em) {div#gdpr #avviso_gdprA, div#gdpr #avviso_gdprB {width: 60%}}



/* --------- riepilogo --------- */
  /* --- totali --- */
  section#totali textarea {height: 5.8rem; margin-bottom: 5px}



/* --------- gateway --------- */
  /* --- totali --- */
  section#avviso {border: 1px solid #E0E0E0; padding: 1rem; padding-bottom: 0}
    section#avviso h1 {color: #060; font-size: 1.1rem}
    section#avviso .button {background: #FFF22E; border-radius: 1rem; color: #000; display: block; font-weight: bold; margin-top: 1rem}



/* --------- grazie / pagato --------- */

  /* grazie */
  body.grazie div#corpo p {font-size: .9rem; line-height: 1.2rem}

  /* --- tempi --- */
  section#tempi .fa-plus {color: #F60; font-size: 3rem; margin: 1.5rem 0 2rem}



/* --------------------------- */



@media screen and (min-width: 40em) {
/* --- menù checkout --- */
  section#navCheckout a {margin-bottom: 0}


/* --------- carrello --------- */
  /* --- prodotti --- */
  section#prodCart img {max-width: 90px}


  /* --- importi --- */
  section#importi span.totale {font-size: 2.5rem; line-height: .5}

/* --------- gateway --------- */
  /* --- totali --- */
    section#avviso .button {display: inline-block; line-height: 0; margin-top: 0; margin-bottom: -.1rem}
}


/* --- loading overlay --- */
#checkout-loading-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.85);
  z-index: 9999;
  justify-content: center;
  align-items: center;
}

#checkout-loading-overlay.active {
  display: flex;
}

.loading-content {
  text-align: center;
  color: #fff;
}

.loading-spinner {
  width: 70px;
  height: 70px;
  border: 5px solid rgba(255, 255, 255, 0.3);
  border-top-color: #F60;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin: 0 auto 1.5rem;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.loading-content h3 {
  color: #f60;
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
}

.loading-content p {
  color: #fff;
  font-size: 1.2rem;
  margin-bottom: 0;
}


/* Large and up */
@media screen and (min-width: 64em) {
  /* --- metodi di pagamento --- */
    label.css-label img {max-width: none}
}