/* ==========================================================================
   Tamburino.it — foglio di stile unico
   Riproduce in CSS puro il tema WordPress (Avada "Tamburino") del vecchio sito.
   Misure, colori e tipografia sono ricavati dal CSS originale.
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-width: 320px;
  background: #fff;
  color: #747474;
  font: 400 16px/20px "PT Sans", Arial, Helvetica, sans-serif;
}

a { color: #333; text-decoration: none; }
a:hover { color: #ef5f00; }

img { border: 0; }
p { margin: 0 0 20px; }
strong { font-weight: 700; }

h1, h2, h3, h4 {
  font-family: "Antic Slab", Arial, Helvetica, sans-serif;
  font-weight: 400;
  color: #333;
}
h1 { font-size: 34px; line-height: 48px; margin: .67em 0; }
h2 { font-size: 18px; line-height: 23px; margin: 0 0 1.1em; }
h3 { font-size: 16px; line-height: 24px; margin: 1em 0; }
h4 { font-size: 13px; line-height: 20px; margin: 1.33em 0; }

label { display: inline-block; margin-bottom: 5px; font-weight: 700; }
button { font-family: Arial, Helvetica, sans-serif; }

/* Icone (simboli SVG inline, glifi Font Awesome 4) */
.fa {
  display: inline-block;
  width: 1em;
  height: 1em;
  fill: currentColor;
  vertical-align: middle;
}

/* Griglia ------------------------------------------------------------------ */
.row { max-width: 1100px; margin: 0 auto; }
.clearfix::after { content: ""; display: table; clear: both; }

.col { position: relative; float: left; margin-right: 4%; margin-bottom: 20px; }
.col-1-5 { width: 16.8%; }
.col-4-5 { width: 79.2%; }
.col-1-4 { width: 22%; }
.col-3-4 { width: 74%; }
.col-1-3 { width: 30.6666%; }
.col-last { margin-right: 0; }

/* Header ------------------------------------------------------------------- */
.site-header {
  background: #fff;
  border-bottom: 1px solid #e5e5e5;
  padding: 10px 30px;
}
.site-header .logo { display: block; max-width: 100%; }
.site-header .logo img { display: block; width: auto; max-width: 100%; height: auto; }
.site-header .patrocinio img { display: block; max-width: 100%; height: auto; }

/* Slider (riproduzione di LayerSlider) ------------------------------------- */
.ls-wrap {
  position: relative;
  width: 100%;
  max-width: 1800px;
  height: 400px;              /* ricalcolata da JS in base alla larghezza */
  margin: 0 auto;
  overflow: hidden;
  background: #fff;
}
.ls-stage {
  position: absolute;
  left: 50%;
  top: 0;
  width: 1600px;              /* larghezza di progetto dello slider */
  height: 400px;
  margin-left: -800px;
  transform-origin: 50% 0;
}
.ls-slide {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity .9s ease, visibility 0s linear .9s;
}
.ls-slide.is-active {
  opacity: 1;
  visibility: visible;
  transition: opacity .9s ease, visibility 0s;
}
.ls-bg {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  max-width: none;
}
.ls-l {
  position: absolute;
  margin: 0; padding: 0; border: 0;
  color: #fff;
  font: 700 46px/normal "PT Sans", Arial, Helvetica, sans-serif;
  white-space: nowrap;
  text-shadow: 0 0 8px #000;
  opacity: 0;
}
.ls-nav {
  position: absolute;
  left: 0; right: 0; bottom: 6px;
  z-index: 5;
  text-align: center;
  font-size: 0;
  line-height: 0;
}
.ls-nav button {
  display: inline-block;
  width: 16px; height: 16px;
  margin: 0 2px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  vertical-align: middle;
  color: #fff;
  opacity: .55;
  transition: opacity .2s;
}
.ls-nav button:hover { opacity: 1; }
.ls-nav .ls-dot::before {
  content: "";
  display: block;
  width: 8px; height: 8px;
  margin: 4px auto;
  border-radius: 50%;
  border: 1px solid #fff;
  background: transparent;
}
.ls-nav .ls-dot.is-active { opacity: 1; }
.ls-nav .ls-dot.is-active::before { background: #fff; }
.ls-nav .ls-arrow .fa { width: 12px; height: 12px; }

/* Contenuto principale ----------------------------------------------------- */
.main { padding: 55px 30px 40px; background: #fff; }

/* Content box colorati (Area Riservata Cinema / Teatri) */
.login-boxes { margin: 0 -15px; }
.login-boxes .cb-col { float: left; width: 50%; padding: 0 15px; }

.cb {
  position: relative;
  min-height: 255px;
  padding: 35px 35px 1px;
  color: #fff;
}
.cb-cinema { background: #e07802; }
.cb-teatri { background: #019e0c; }

.cb .icon {
  position: absolute;
  left: 35px; top: 35px;
  width: 90px; height: 90px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cb .icon .fa { width: 45px; height: 45px; }
.cb-cinema .icon { color: #e07802; }
.cb-teatri .icon { color: #019e0c; }

.cb h2 {
  margin: 0 0 15px;
  padding-left: 112px;
  font-size: 18px;
  line-height: 23px;
  color: #fff;
}
.cb .content { padding-left: 112px; color: #fff; }

/* Form di login (da tamburinoHelper.css) */
.tamburinoform label {
  display: block;
  margin: 0;
  text-align: left;
}
.tamburinoform input[type=text],
.tamburinoform input[type=password] {
  display: block;
  width: 100%;
  height: 29px;
  margin: 0 0 10px;
  padding: 5px 10px;
  border: 1px solid #eee;
  border-radius: 0;
  background: #fff;
  color: #444;
  font: 100% Arial, Helvetica, sans-serif;
}
.tamburinoform input[type=password] { margin-bottom: 20px; }
.tamburinoform input:focus { outline: 2px solid rgba(255,255,255,.6); outline-offset: 1px; }

.tamburinoform button {
  display: flex;
  align-items: center;
  margin: 0 0 0 auto;
  padding: 3px 0;
  border: 0;
  color: #fff;
  font: 17px/20px "PT Sans", Arial, Helvetica, sans-serif;
  cursor: pointer;
}
.tamburinoform button .fa {
  width: 17px; height: 17px;
  margin: 3px 8.5px 0 15px;
}
#cinemaform button { background: #e07802; }
#teatriform button { background: #019e0c; }
.tamburinoform button:hover { background: #ef5f00; }

.logging-in {
  display: none;
  align-items: center;
  justify-content: flex-end;
  font-size: 14px;
}
.logging-in .fa {
  width: 23px; height: 23px;
  margin-right: 11.5px;
  animation: fa-spin 2s linear infinite;
}
@keyframes fa-spin { to { transform: rotate(360deg); } }

/* Avviso errore login */
.alert {
  position: relative;
  display: none;
  margin: 0 0 20px;
  padding: 25px;
  border: 1px solid #b94a48;
  background: #f2dede;
  color: #b94a48;
  font-size: 16px;
  text-align: center;
  text-transform: uppercase;
  box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.alert.is-visible { display: block; }
.alert .alert-icon { margin-right: 10px; }
.alert .close {
  position: absolute;
  right: -1px; top: -1px;
  width: 25px; height: 25px;
  padding: 0;
  border: 1px solid #b94a48;
  background: none;
  color: inherit;
  font-size: 15px;
  line-height: 25px;
  cursor: pointer;
}

/* Box con icona "boxed" (Registrati / Informazioni) */
.boxed {
  position: relative;
  height: 310px;
  padding: 50px 1% 2%;
  text-align: center;
  font-weight: 700;
}
.boxed-blue { border: 1px solid #3eb3e4; }
.boxed-dark { border: 1px solid #313d47; }
.boxed .icon {
  position: absolute;
  left: 50%; top: -40px;
  width: 80px; height: 80px;
  margin-left: -40px;
  border-radius: 50%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.boxed .icon .fa { width: 40px; height: 40px; }
.boxed-blue .icon { border: 1px solid #3eb3e4; color: #3eb3e4; }
.boxed-dark .icon { border: 1px solid #313d47; color: #313d47; }
.boxed h4 { margin: 17px 0; }
.boxed h3 { margin: 16px 0; }
.boxed p  { margin: 0 0 20px; }

.btn-iscriviti, .btn-fornitura {
  display: inline-block;
  margin: 0 auto;
  padding: 5px 15px;
  color: #fff;
  font: 17px/20px Arial, Helvetica, sans-serif;
  text-decoration: none;
  cursor: pointer;
}
.btn-iscriviti { background: #3eb3e4; border: 1px solid #3eb3e4; }
.btn-fornitura { background: #313d47; border: 1px solid #313d47; }
.btn-iscriviti:hover, .btn-fornitura:hover { color: #fff; opacity: .92; }

/* Content box con icona laterale (Orari Inserimento) */
.section-orari { padding-top: 42px; }
.cb-side { position: relative; margin-bottom: 60px; }
.cb-side .icon {
  position: absolute;
  left: 0; top: 0;
  width: 80px; height: 80px;
  border-radius: 50%;
  background: #1e73be;
  border: 1px solid #1e73be;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cb-side .icon .fa { width: 40px; height: 40px; }
.cb-side h2 { margin: 0 0 15px; padding-left: 102px; }
.cb-side .content { padding-left: 102px; }

/* Fascia scura "credito d'imposta" + freccia */
.band {
  margin-top: 40px;
  padding: 30px 0 35px;
  background: #3d3c3c;
  text-align: center;
}
.band h1 { margin: .67em 0; font-size: 30px; line-height: 48px; color: #fff; }
.band p  { margin: -10px 0 20px; font-size: 17px; line-height: 24px; color: #b1b1b1; }

.band-arrow { position: relative; height: 0; }
.band-arrow::before {
  content: "";
  position: absolute;
  left: 50%; top: 0;
  margin-left: -29px;
  border-style: solid;
  border-width: 29px 29px 0;
  border-color: #3d3c3c transparent transparent;
}

.section-cta { padding: 35px 0 10px; }
.sep-double {
  height: 8px;
  margin: 25px auto;
  border-top: 1px solid #f2b168;
  border-bottom: 1px solid #f2b168;
}
.btn-fusion {
  display: inline-block;
  padding: 17px 40px;
  border: 2px solid rgba(255,255,255,.8);
  border-radius: 2px;
  background: #e07802;
  color: rgba(255,255,255,.8);
  font: 700 18px/21px "PT Sans", Arial, Helvetica, sans-serif;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .2s;
}
.btn-fusion:hover {
  background: #e26302;
  border-color: rgba(255,255,255,.9);
  color: rgba(255,255,255,.9);
}
.btn-fusion .fa { margin-right: 10px; vertical-align: -2px; }
.text-center { text-align: center; }

/* Footer ------------------------------------------------------------------- */
.site-footer {
  background: #282a2b;
  border-top: 1px solid #4b4c4d;
  padding: 18px 30px 16px;
  color: #8c8989;
  font-size: 12px;
  text-align: center;
}
.site-footer a { color: #bfbfbf; }
.site-footer a:hover { color: #ef5f00; }

/* Pagina "Vendita programmazione" ------------------------------------------ */
.vendita p { font-size: 15px; }
.frame { display: inline-block; max-width: 100%; font-size: 0; line-height: normal; }
.img-responsive { display: block; max-width: 100%; height: auto; }

.section-clienti { padding: 20px 0; margin-top: 20px; }
.title { margin: 0 0 20px; }
.title h1 { margin: 0; padding-right: 8px; line-height: normal; }

.accordion .panel { border-bottom: 1px solid #e0dede; }
.accordion .panel-title {
  margin: 0;
  font: 400 13px/30px "Antic Slab", Arial, Helvetica, sans-serif;
}
.accordion .panel-title button {
  display: block;
  width: 100%;
  padding: 10px 0;
  border: 0;
  background: none;
  color: #333;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.accordion .panel-title button:hover { color: #ef5f00; }
.accordion .toggle-box {
  float: left;
  width: 22px; height: 22px;
  margin-top: 4px;
  background: #333;
  color: #fff;
  text-align: center;
}
.accordion .toggle-box .fa { width: 11px; height: 11px; vertical-align: 0; }
.accordion .toggle-box .fa-minus { display: none; }
.accordion .panel.is-open .toggle-box { background: #ef5f00; }
.accordion .panel.is-open .toggle-box .fa-plus { display: none; }
.accordion .panel.is-open .toggle-box .fa-minus { display: inline-block; }
.accordion .toggle-heading { display: block; margin-left: 40px; }
.accordion .panel-body { display: none; padding: 0 0 15px; line-height: 20px; }
.accordion .panel.is-open .panel-body { display: block; }
.accordion ul { margin: 0 0 20px; padding-left: 25px; font-size: 15px; }
.accordion li { margin: 0; }

/* Responsive --------------------------------------------------------------- */
@media (max-width: 800px) {
  .col { float: none; width: 100%; margin-right: 0; }
  .col-1-4.col-last { margin-top: 50px; }
  .boxed { height: auto; min-height: 0; padding-bottom: 20px; }
  .section-clienti .col-1-5 { margin-top: 10px; }
  .vendita-img { text-align: center; }
  .vendita-img .frame { max-width: 185px; }
  .section-cta .col-1-3 { margin-bottom: 10px; }
  .section-cta .sep-double { display: none; }
  .band h1 { font-size: 24px; line-height: 32px; }
}

@media (max-width: 640px) {
  .login-boxes .cb-col { float: none; width: 100%; margin-bottom: 20px; }
  .cb { padding: 20px 20px 1px; }
  .cb .icon { left: 20px; top: 20px; width: 60px; height: 60px; }
  .cb .icon .fa { width: 30px; height: 30px; }
  .cb h2, .cb .content { padding-left: 75px; }
  .cb-side .icon { width: 60px; height: 60px; }
  .cb-side .icon .fa { width: 30px; height: 30px; }
  .cb-side h2, .cb-side .content { padding-left: 75px; }
  .main { padding: 40px 15px 30px; }
  .site-header { padding: 10px 15px; }
  .btn-fusion { padding: 14px 20px; font-size: 15px; }
  .btn-fornitura.inline { white-space: normal; }
}

@media (max-width: 479px) {
  .ls-wrap { display: none; }   /* come l'originale (hideOnMobile) */
}

@media (prefers-reduced-motion: reduce) {
  .ls-slide { transition: none; }
  .logging-in .fa { animation: none; }
}