/* ================================================================
   MAX HI-FI — STYLESHEET
   ================================================================
   INDICE:
   1.  VARIABILI CSS (Design Tokens)
   2.  RESET & BASE
   3.  UTILITÀ GENERALI (Bootstrap fixes, helpers, scrollToTop)
   4.  HEADER & NAVBAR
   5.  MENU (desktop + mobile)
   6.  BREADCRUMB & PAGE TITLE
   7.  SLIDER / BANNER / GRID LAYOUT
   8.  PRODOTTI (card, toolbar categoria, paginazione)
   9.  PAGINA PRODOTTO (dettaglio, tab, carousel)
  10.  SIDEBAR (colonna sinistra/destra, filtri)
  11.  FOOTER
  12.  NEWSLETTER BLOCK
  13.  SERVIZI (service boxes)
  14.  MODAL (quickview, newsletter popup)
  15.  FORM / BUTTON
  16.  ALTRE PAGINE (account, contatti, checkout, ecc.)
  17.  UTILITY CLASSI (mt-*, common)
  18.  HOME GRID BANNER
  ── LIBRERIE ESTERNE ──────────────────────────────────────
  19.  ANIMATE.CSS (non modificare)
  ── OVERRIDE MAX HI-FI ────────────────────────────────────
  20.  VARIABILI OVERRIDE v4
  21.  HEADER OVERRIDE
  22.  MENU NAVBAR OVERRIDE
  23.  PRODOTTO PAGE OVERRIDE
  24.  FOOTER OVERRIDE
  25.  WIDGET FAB / SCROLL-TOP
  26.  LOADER — FIRST VISIT (Pioneer CT-A7X)
  27.  LOADER — PAGE LOADER (Compact Cassette)
  28.  RESPONSIVE — MEDIA QUERIES CONSOLIDATE
  ================================================================ */

:root {
  /* Palette */
  --black:        #0a0806;
  --dark-1:       #111008;
  --dark-2:       #1a1710;
  --dark-3:       #252018;
  --dark-4:       #302a20;
  --mid:          #4a4030;
  --gold:         #c9a84c;
  --gold-light:   #e8c96a;
  --gold-dim:     #7a6428;
  --gold-glow:    rgba(201,168,76,.15);
  --silver:       #b8b4ae;
  --silver-light: #d8d4ce;
  --cream:        #f0e8d0;
  --text-hi:      #f0ece4;
  --text-mid:     #9a9080;
  --text-lo:      #5a5040;
  --border:       rgba(201,168,76,.18);
  --border-dim:   rgba(255,255,255,.06);

  /* Typography */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-ui:      'Oswald', sans-serif;
  --font-body:    'Barlow', sans-serif;

  /* Spacing scale */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px;
  --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px;

  /* Shadows */
  --shadow-card: 0 2px 20px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.6);
  --shadow-hover: 0 8px 40px rgba(0,0,0,.7), 0 0 0 1px var(--border);
  --glow-gold: 0 0 30px rgba(201,168,76,.12);
}

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

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-body);
  background: var(--black);
  color: var(--text-hi);
  font-size: 15px;
  line-height: 1.6;
  overflow-x: hidden;
}

/* ---- Texture grain globale ---- */
body::before {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  pointer-events: none; z-index: 9999; opacity: .6;
}

 .container {
    width: 100%;
    padding: 0 var(--s7);
    max-width: 1280px;
}

/* ══════════════════════════════════════════════════════
   §1 — RESET & BASE
   ══════════════════════════════════════════════════════ */
h1, h2, h3, h4, h5, h6 {

    font-weight: 500;
    text-transform: capitalize;
    font-family: var(--font-display);
    color: var(--g);
}
/* Override the bootstrap defaults */
h1 {
    font-size: 30px;
}
h2 {
    font-size: 28px;
}
h3 {
    font-size: 21px;
}
h4 {
    font-size: 16px;
}
h5 {
    font-size: 12px;
}
h6 {
    font-size: 10.2px;
}
a {

}
a:hover {
    text-decoration: none;
}
.alert a {
    color: var(--primary-color);
}
.fa {
    font-size: 14px;
}
legend {
    font-size: 18px;
    font-weight: 500;
    padding: 7px 0px;

    border-bottom: 1px solid var(--border-color);
}
label {
    font-size: 14px;
    font-weight: normal;
}
select.form-control,
textarea.form-control,
input[type="text"].form-control,
input[type="password"].form-control,
input[type="datetime"].form-control,
input[type="datetime-local"].form-control,
input[type="date"].form-control,
input[type="month"].form-control,
input[type="time"].form-control,
input[type="week"].form-control,
input[type="number"].form-control,
input[type="email"].form-control,
input[type="url"].form-control,
input[type="search"].form-control,
input[type="tel"].form-control,
input[type="color"].form-control {
    font-size: 14px;
}
.input-group input,
.input-group select,
.input-group .dropdown-menu,
.input-group .popover {
    font-size: 14px;
}
.input-group .input-group-addon {
    font-size: 14px;
    height: 30px;
}

/* Fix some bootstrap issues */
span.hidden-xs,
span.hidden-sm,
span.hidden-md,
span.hidden-lg {
    display: inline;
}
a:focus, a:hover, div:focus, img:focus {
    text-decoration: none;
    outline: none;
    color: var(--primary-hover-color);
}
div.required .control-label:before {
    content: '* ';
    color: #F00;
    font-weight: bold;
}
.btn.focus:active,
.btn:active:focus,
.btn:focus,
.addcart:focus {
    outline: none;
}
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
div:focus,
img:focus,
.form-control:focus,
i:focus{
    outline: none;
    box-shadow: none;
    text-decoration: none;
}

/* ══════════════════════════════════════════════════════
   §3 — UTILITÀ GENERALI  (scrollToTop, helpers)
   ══════════════════════════════════════════════════════ */
a.scrollToTop {
    position: fixed;
    right: 50px;
    bottom: 50px;
    height: 46px;
    width: 34px;
    text-align: center;
    z-index: 5;
    border-radius: 0;
    background: url(../image/mahardhi/sprite.png) 98px 87px;
}
a.scrollToTop:hover {
    background: url(../image/mahardhi/sprite.png) 44px 87px;
}
a.scrollToTop i {
    font-size: 0;
    display: block;
    line-height: 46px;
    background: url(../image/mahardhi/sprite.png) 98px 53px;
}
a.scrollToTop:hover i {
    background: url(../image/mahardhi/sprite.png) 44px 47px;
}


.circle_btn {
    width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(168, 168, 168, 0.2);
  border: 2px solid var(--secondary-color);
  border-radius: 50%;
  transition: all 0.3s;
  backdrop-filter: blur(10px);
}
.circle_btn > svg {
    width: 24px;
  height: 24px;
  fill: var(--secondary-color);
  transition: fill 0.3s;
}
.circle_btn:hover {
  background: rgba(192, 192, 192, 0.3);
  border-color: #D0D0D0;
  transform: scale(1.1);
  box-shadow: 0 5px 20px rgba(192, 192, 192, 0.4);

}

/* ══════════════════════════════════════════════════════
   §14 — QUICKVIEW
   ══════════════════════════════════════════════════════ */
#quickview-modal {
  z-index: 9999;
}
 .quickview-wrapper {
    background-color: var(--background-color);
    display: none;
    height: 80vh;
    left: 0;
    margin: 0 auto;
    overflow: auto;
    padding: 20px 0;
    position: fixed;
    right: 0;
    top: 7%;
    width: 70%;
    z-index: 9999;
}
.quickview-overlay {
    display: none;
    background-color: rgba(0,0,0,0.8);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    position: fixed;
    z-index: 99;
}
#quickview-modal .close {

    opacity: 1;
}
.quickview-btn {
    position: absolute;
    z-index: 200;
    top: 0;
    right: 0;
    font-size: 12px;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center;
    color: var(--primary-color);
    background: var(--secondary-color);
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}
.quickview-loader{
    display: none;
    position: fixed;
    top: 0;
    width: 50px;
    height: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    z-index: 9999;
    margin: auto;
    background-color: transparent;
    line-height: 50px;
}
.quickview-loader-inner{
    font-size: 16px;
}

.quickview-gallery {
  width: 100%;
}

.quickview-gallery .qv-main {
  width: 100%;
  margin-bottom: 10px;
  background: var(--secondary-color);
  padding: 5px;
}
.qv-main > div {
  position: relative;
  overflow: hidden;
}
.qv-main .badge-sold-out {
  top: 45%;
}

.quickview-gallery .qv-thumbs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
}

.quickview-gallery .qv-thumbs img {
  width: 70px;
  height: auto;
  cursor: pointer;
  opacity: 0.7;
  border: 1px solid #ddd;
}

.quickview-gallery .qv-thumbs img:hover,
.quickview-gallery .qv-thumbs img.active {
  opacity: 1;
  border-color: #000;
}


/* ── ALERT ────────────────────────────────────────── */
.alert.alert-success {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 999;
    border-radius: 0;
    margin: 0 0 20px 0;
}
.alert {
    padding: 9px 30px 9px 15px;
    border-radius: 0;
    text-align: center;
    position: relative;
    line-height: 20px;
    z-index: 1;
}
.alert-dismissable .close,
.alert-dismissible .close {
    font-size: 22px;
    opacity: 1;
    position: absolute;
    right: 10px;
    top: 0;
    line-height: 38px;
    text-shadow: none;
}
.newsletterblock .alert {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 11;
}
#form-review .alert.alert-success,
#post_comment .alert{
    position: relative;
}


/* ══════════════════════════════════════════════════════
   §14b — NEWSLETTER POPUP MODAL
   ══════════════════════════════════════════════════════ */
.newsletter-wrap {
    background: url(../image/mahardhi/newsletter-popup.jpg) no-repeat center center;
    background-size: cover;
}
.newsletter-content {
    padding: 43px 30px;
    text-align: center;
}
.newsletter-content-innner {
    width: 60%;
    margin: auto;
}
#newsletter-popup .modal-content {
    background: transparent;
    box-shadow: none;
}
.modal-dialog-centered {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100% - (.5rem * 2));
}
.modal-content{
    border: none;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: var(--background-color);
    background-clip: padding-box;
    border-radius:0;
}
#newsletter-popup::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 0.8;
    background: var(--primary-color);
}
.newsletter-popup .modal-dialog{
    margin: 20px auto;
    max-width: 660px;
    text-align: center;
}
.newsletter-btn-close.close{
    position: absolute;
    right: -13px;
    top: -13px;
    opacity: 1;
    width: 26px;
    height: 26px;
    line-height: 26px;
    text-shadow: none;
    font-size: 12px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;


}
.newsletter-btn-close.close i {
    display: block;
}
.newsletter-btn-close.close:hover{
    color: var(--primary-color);
    background: var(--secondary-color)
}
.newsletter-popup .modal-body {
    padding: 0;
    z-index: 1;
}
.newsletter-content-innner h3 {
    font-family: 'Mr Dafoe', cursive;
    font-size: 40px;
    margin: 0;
    font-weight: 500;
    text-transform: capitalize;
    position: relative;
    color: var(--primary-hover-color);
}
.newsletter-content-innner p {
    margin: 30px 0;
    font-size: 18px;
    line-height: 24px;
    color: var(--primary-color);
}
.newsletter-content-innner input[type="text"] {
    width: 70%;
    margin: 0 auto;
    height: 42px;
    border: 1px solid #ddd;
    padding: 0 10px;
}
.newsletter-content-bottom {
    margin-top: 20px;
    color: var(--primary-color);
}
.newsletter-content-innner .alert {
    margin: 15px 0 10px;
    display: table;
    position: relative;
    width: 100%;
}
.newsletter-content-innner .newsletter_usr_popup_email::placeholder {
    color: var(--primary-color);
}
.newsletter-content-innner .newsletter_usr_popup_email{
    border: none;
    padding: 5px;
    width: 100%;
    height: 40px;
    border-radius: 5px;
    text-align: center;
    color: var(--primary-color);
    background: var(--secondary-color);
}
#frmnewsletterpopup {
    margin: 20px 0;
}
#frmnewsletterpopup button {
    margin: 20px 0 0 0;
    padding: 10px 30px;


}
#frmnewsletterpopup button:hover {
    background: var(--secondary-color);
    color: var(--primary-color);
}
.newsletter-content-bottom label {
    margin: 0;
}

/* ---- Gold divider ---- */
.gold-divider {
  display: flex; align-items: center; gap: var(--s4); margin: var(--s7) 0;
}
.gold-divider::before, .gold-divider::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-dim), transparent);
}
.gold-divider__diamond {
  width: 6px; height: 6px;
  background: var(--gold-dim);
  transform: rotate(45deg); flex-shrink: 0;
}


/* ══════════════════════════════════════════════════════
   §4 — HEADER & NAVBAR
   ══════════════════════════════════════════════════════ */
.top-nav {
    height: 30px;
    background: rgba(0,0,0,0);
}

/* ============================================================
   HEADER
   ============================================================ */

.header-main {
  position: sticky;
  top: 0;
  z-index: 1100;
  width: 100%;
  background: rgba(0,0,0,0);
}
header {
  background: rgba(10,8,5,.97);
  border-bottom: 1px solid rgba(201,168,76,.1);
  box-shadow: 0 2px 20px rgba(0,0,0,.7);
  backdrop-filter: blur(10px);
}

.header__inner {
  max-width: 1280px; margin: 0 auto;
  padding: 0 var(--s7);
  height: 72px;
  display: flex; align-items: center; justify-content: space-between; gap: var(--s6);
}

.header__logo {
  display: flex; flex-direction: column; gap: 1px; flex-shrink: 0;
}
.header__logo-main {
  font-family: var(--font-display); font-size: 22px; font-weight: 700;
  letter-spacing: 4px; color: var(--text-hi); line-height: 1;
  text-transform: uppercase;
}
.header__logo-main em {
  font-style: normal; color: var(--gold);
  text-shadow: 0 0 20px rgba(201,168,76,.3);
}
.header__logo-sub {
  font-family: var(--font-ui); font-size: 8px; letter-spacing: 5px;
  color: var(--text-lo); text-transform: uppercase;
}

/* ============================================================
   NAVBAR
   ============================================================ */
#menu .navbar-nav > li.menulist > a,
#menu .nav.navbar-nav > li > a {
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--text-mid);
  padding: 0 10px;
  height: 72px;
  display: flex;
  align-items: center;
  position: relative;
  transition: color .25s;
}
#menu .navbar-nav > li.menulist > a:hover,
#menu .navbar-nav > li.menulist.active > a,
#menu .nav.navbar-nav > li > a:hover,
#menu .nav.navbar-nav > li.active > a {
  color: var(--text-hi);
  background: transparent;
}
#menu .navbar-nav > li.menulist.active > a,
#menu .nav.navbar-nav > li.active > a {
  color: var(--gold);
}
/* gold underline */
#menu .navbar-nav > li.menulist > a::after,
#menu .nav.navbar-nav > li > a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 10px;
  right: 10px;
  height: 2px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .25s ease;
}
#menu .navbar-nav > li.menulist:hover > a::after,
#menu .navbar-nav > li.menulist.active > a::after,
#menu .nav.navbar-nav > li:hover > a::after,
#menu .nav.navbar-nav > li.active > a::after {
  transform: scaleX(1);
}

/* Mobile menu */
.menu-close { background: var(--d3); color: var(--t1); border-bottom: 1px solid var(--d4); }
.menu_mobile #topCategoryList.box-menu {
  background: var(--d2);
  border-right: 1px solid var(--d4);
}

/* Header actions */
.header__actions {
  display: flex; align-items: center; gap: var(--s4); flex-shrink: 0;
}
.header__search {
  display: flex; align-items: center; gap: var(--s2);
  background: var(--dark-2); border: 1px solid var(--dark-4);
  padding: var(--s2) var(--s3); border-radius: 2px;
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 1.5px;
  color: var(--text-lo); cursor: text; transition: border-color .2s;
  width: 180px;
}
.header__search:hover { border-color: var(--border); }
.header__search svg { opacity: .4; flex-shrink: 0; }
.header__cart {
  position: relative; width: 38px; height: 38px;
  border: 1px solid var(--dark-4); border-radius: 2px;
  display: flex; align-items: center; justify-content: center;
  background: var(--dark-2); transition: all .2s; cursor: pointer;
}
.header__cart:hover { border-color: var(--border); background: var(--dark-3); }
.header__cart-badge {
  position: absolute; top: -6px; right: -6px;
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--gold); color: var(--black);
  font-family: var(--font-ui); font-size: 9px; font-weight: 600;
  display: flex; align-items: center; justify-content: center;
}
.header__cart a {
    display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.header__cart a svg {
    width: 16px;
  height: 16px;
  fill: none;
  stroke: currentcolor;
  stroke-width: 1.5px;
}

/* Nav */
.header__nav {
  display: flex; align-items: center; gap: 0; flex: 1 1 400px; justify-content: center;
}
.header__nav a {
  font-family: var(--font-ui); font-size: 11px; font-weight: 400;
  letter-spacing: 2.5px; text-transform: uppercase; color: var(--text-mid);
  padding: 0 var(--s5); height: 72px;
  display: flex; align-items: center; position: relative;
  transition: color .25s;
}
.header__nav a::after {
  content: ''; position: absolute; bottom: 0; left: var(--s5); right: var(--s5);
  height: 2px; background: var(--gold);
  transform: scaleX(0); transform-origin: center;
  transition: transform .25s ease;
}
.header__nav a:hover { color: var(--text-hi); }
.header__nav a:hover::after { transform: scaleX(1); }
.header__nav a.active { color: var(--gold); }
.header__nav a.active::after { transform: scaleX(1); }

/* Header actions */
.header__actions {
  display: flex; align-items: center; gap: var(--s4); flex-shrink: 0;
}
.header__search {
  display: flex; align-items: center; gap: var(--s2);
  background: var(--dark-2); border: 1px solid var(--dark-4);
  padding: var(--s2) var(--s3); border-radius: 2px;
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 1.5px;
  color: var(--text-lo); cursor: text; transition: border-color .2s;
  width: 180px;
}
.header__search:hover { border-color: var(--border); }
.header__search svg { opacity: .4; flex-shrink: 0; }
.header__search input {
  background: rgba(0,0,0,0);
  border: none;
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 1.5px;
  color: var(--text-lo);
}


/*header search*/
.header-right i{
    font-size: 20px;
    display: block;
}
.btn_search {
    position: relative;
}
.search-down {
    display: none;
    position: absolute;
    right: 0;
    left: auto;
    width: 280px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    z-index: 2;
    border-top: 2px solid var(--primary-hover-color);
    box-shadow: 0 0 10px 1px rgba(0,0,0,0.1);
}
.search-btn i,
#header_ac i {
    padding: 10px 0;
}

/*-- mahardhi edit --*/
#search,
#search{
    display: flex;
    align-items: center;
    background: var(--primary-color);
    border-radius: 5px;
}
#search > input,
#search > input {
    background: var(--primary-color);
    display: block;
    padding: 0 10px;

    font-size: 14px;
    border: none;
    border-radius: 5px;
}
#search .form-control::placeholder,
#search .form-control::placeholder {

}
#search .btn-search,
#search .input-group-btn{
    width: auto;
    background: transparent;
}
#search .btn-search button,
#search .input-group-btn button {
    padding: 12px;
    border: none;

    background: var(--primary-color);
    border-radius: 5px;
}
#search .btn-search button:hover,
#search .input-group-btn button:hover {
    color: var(--primary-hover-color);
}
#search .btn-search button i,
#search .input-group-btn button i {
    font-size: 16px;
    display: block;
}
.ui-autocomplete.ui-menu .ui-menu-item {
    list-style-image: none;
    background: var(--primary-color);
}
.ui-autocomplete .mahardhi-search {
    position: relative;
    display: table;
    width: 100%;
    padding: 5px 0px;
}
.ui-autocomplete .mahardhi-search > div {
    display: table-cell;
    vertical-align: top;
}
.ui-autocomplete .mahardhi-search .images {
    width: 80px;
    padding-right: 10px;
}
.ui-autocomplete .mahardhi-search .images img {
    border-radius: 5px;
}
.ui-autocomplete .mahardhi-search .product-detail {
    font-size: 14px;

}
.ui-autocomplete .mahardhi-search .product-detail .price-old {
    color: var(--secondary-light-color);
    text-decoration: line-through;
    margin-left: 10px;
}
#search select.form-control.input-lg {
    padding: 2px 30px 2px 20px;
    line-height: 1.42857143;
    color: var(--primary-color);
    background: var(--background-color);
    min-width: 198px;
    height: 50px;
    border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
}
.category-search{
    position: relative;
}
.category-search:after {
    content: '\f107';
    font-family: 'fontawesome';
    position: absolute;
    right: 20px;
    line-height: 50px;
    color: var(--primary-color);
    z-index: 11;
}

/*header right*/
.header-links {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.header-links > div + div{
    margin: 0 0 0 30px;
}

/*account*/
#form-currency .dropdown-toggle,
#form-language .dropdown-toggle {
    border-bottom: 1px solid var(--border-color);
    width: 100%;
    padding: 5px 0;
    margin: 2px 0;
    border-radius: 0;
    font-weight: 500;

}
.language .language-drop,
.currency .currency-drop {
    padding: 0 0 5px;
    border-bottom: 1px solid #eee;
    width: 100%;
    display: block;
    margin: 10px 0;
    text-align: left;
}
.language-dropdown li,
.currency-dropdown li {
    display: block;
}
.language-dropdown,
.currency-dropdown {
    padding: 0;
}
.language .language-selector li,
.currency .currency-selector li{
    display: block;
}
#header_ac button {
    text-align: left;
    padding: 5px 10px;
    text-transform: capitalize;
    border: none;

}
#header_ac button:hover,
#header_ac .dropdown-menu a:hover{
    color: var(--primary-hover-color);
}
#header_ac .dropdown-menu {
    padding: 7px 15px;
    width: 200px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border: none;
    border-top: 2px solid var(--primary-hover-color);
}
#header_ac .dropdown-menu li a {
    padding: 5px 0;
    text-align: left;
    border: none;

}

/* Wishlist */
.wishlist-header #wishlist-total i {
    font-size: 22px;
    display: block;
}

/*cart
.header_cart {
    position: relative;
}
#cart {
    vertical-align: top;
}
#cart > .btn {
    background: transparent;
    padding: 10px 0;
    border: none;

    display: flex;
    align-items: center;
    box-shadow: none;
}
#cart > .btn:hover {
    color: var(--primary-hover-color);
}
#cart-total {
    position: absolute;
    right: -2px;
    top: 3px;
    height: 16px;
    width: 16px;
    line-height: 16px;
    font-size: 12px;
    text-align: center;
    border-radius: 50%;


}
#cart > .btn:before {
    content: "\e954";
    font-family: 'Mahardhi-Fonts';
    font-size: 20px;
    padding: 0 6px 0 0;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
#cart .dropdown-menu {
    overflow: hidden;
    display: none;
    z-index: 1001;
    margin: 0;
    padding: 0px;
    width: 300px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-top: 2px solid var(--primary-hover-color);
}
#cart .dropdown-menu li {
    float: none;
    padding: 0px 20px;
}
#cart .dropdown-menu li p {
    margin: 0;
    font-size: 14px;

}
#cart .dropdown-menu li p .btn {
    padding: 10px 20px;
}
.product-cart-empty {
    padding: 20px 0;
}
.header_cart i.fa.fa-shopping-cart {
    display: none;
}
#cart .dropdown-menu .cart-content-product {
    max-height: 285px;
    overflow-y: auto;
    overflow-x: hidden;
}
#cart .dropdown-menu table {
    margin-bottom: 10px;
    border: none;
}
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: transparent;
}
#cart .dropdown-menu > li.cart-content-product .table > tbody > tr:last-child {
    border-bottom: none;
    padding-bottom: 10px;
    margin-bottom: 0px;
}
#cart .dropdown-menu > li.cart-content-product .table > tbody > tr {
    padding-bottom: 20px;
    padding-top: 20px;
    position: relative;
    border-bottom: 1px solid var(--border-color);
    display: block;
}
#cart .dropdown-menu .table>tbody>tr>td,
#account-address .table>tbody>tr>td {
    vertical-align: top;
}
#cart .dropdown-menu table td.product-cart-thumb {
    padding: 0;
    width: 75px;
}
#cart .dropdown-menu table td {
    background: none;
    border: none;
    padding: 5px 4px;

}
#cart .dropdown-menu li td,
td.cart-total-price {
    font-size: 16px;
    font-weight: 500;
}
#cart .img-thumbnail {
    padding: 0;
    border-radius: 0;
    max-width: unset;
}
#cart .dropdown-menu table td.product-cart-details {
    padding-left: 10px;
    padding-right: 10px;
}
#cart .dropdown-menu .product-item-name,
#cart .product-cart-info .product-cart-qty {
    font-weight: normal;
    display: inline-block;
    font-size: 16px;
}
#cart .product-cart-info .product-cart-qty {

}
.product-cart-info {
    margin-top: 8px;
}
#cart .product-cart-info .product-cart-price,
.product-cart-total {
    font-size: 16px;
    color: var(--primary-hover-color);
}
#cart .dropdown-menu li tr:last-child td:last-child,
tr:last-child td.cart-total-price:last-child {
    font-size: 16px;
    color: var(--primary-hover-color);
}
#cart .dropdown-menu table td.product-cart-close,
#cart .dropdown-menu table td.voucher-close {
    position: absolute;
    top: 20px;
    right: 0;
    padding: 0;
}
#cart .dropdown-menu .btn-danger {
    background: transparent;
    color: var(--primary-color);
    border-radius: 0;
    line-height: 20px;
    font-size: 12px;
    padding: 0;
    border: none;
    box-shadow: none;
    -webkit-box-shadow: none;
}
#cart .dropdown-menu li + li {
    border-top: 1px solid var(--border-color);
    padding: 10px 20px 0px 20px;
}
#cart .dropdown-menu li td strong,
#cart .dropdown-menu li small,
td.cart-total-title {
    font-size: 16px;
    font-weight: 500;
}
.product-cart-button {
    padding: 0px 0px 20px 0px;
}


*/

/* ══════════════════════════════════════════════════════
   §5 — MENU  (desktop + mobile)
   ══════════════════════════════════════════════════════ */
.menu_mobile {
  margin: 1px 0 0 0;
  position: fixed;
  height: 100%;
  width: Calc(100% - 100px);
  max-width: 400px;
  top: 0;
  right: 100%;
  z-index: 11000;
  background: red;
}

.header-bottom {
    text-align: center;
}
#menu {
    border: none;
    border-radius: 0;
    text-transform: uppercase;
    min-height: unset;
    display: inline-block;
    vertical-align: top;
    margin: 0;
    width: 100%;
}
#menu .nav > li > a {
    font-family: Oswald;
    padding: 40px 22px;
    font-size: 18px;
    font-weight: 400;
    border-radius: 0;

    background: transparent;
    text-transform: capitalize;
}
#menu .dropdown-inner,
#navCategory .dropdown-inner {
    display: table;
}
#menu .dropdown-inner ul,
#navCategory .dropdown-inner > ul {
    display: table-cell;
}
#menu .menulist .dropdown-menu a {
    font-size: 16px;
    text-transform: capitalize;
}
#menu .dropdown-inner ul.mega-dropdown-menu.childs_1 > li > a:hover,
#menu .nav.navbar-nav li:hover > span,
#menu .dropdown-inner li:hover > a,
#navCategory .dropdown-inner li a:hover,
.vertical-category ul > li:hover > a,
#menu #topCategoryList .dropdown-inner li:hover > a,
#menu .column-1 .dropdown-inner li.dropdown-submenu:hover > .fa {
    color: var(--primary-hover-color);
    background-color: transparent;
}
#menu .dropdown-inner .dropdown-submenu,
#navCategory .dropdown-inner .dropdown-submenu {
    position: relative;
}
#menu .column-1 .dropdown-inner li.dropdown-submenu > .fa {
    position: absolute;
    right: 10px;
    top: 0;
    padding: 8px 0;
}
#menu .see-all {
    display: block;
    margin-top: 0.5em;
    border-top: 1px solid #ddd;
    padding: 3px 20px;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 3px 3px;
    font-size: 12px;
}
#menu .see-all:hover,
#menu .see-all:focus {
    text-decoration: none;
    color: var(--primary-hover-color);
    background-color: #229ac8;
    background-image: linear-gradient(to bottom, #23a1d1, #1f90bb);
    background-repeat: repeat-x;
}

/* ======================================================
   MOBILE DRAWER MENU
   ====================================================== */

.menu-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s;
  z-index: 10999;
}

.menu-drawer{
  position: fixed;
  top: 0;
  left: 0;

  width: 320px;
  max-width: 85vw;
  height: 100vh;

  background: var(--d2);
  border-right: 1px solid var(--d4);

  transform: translateX(-100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);

  overflow-y: auto;
  z-index: 11000;
}

.header__nav .navbar-nav {
  display: flex;
  justify-content: space-evenly;
  width: 100%;
}


/* open state */
body.menu-open .menu-overlay{
  opacity: 1;
  pointer-events: auto;
}

body.menu-open .menu-drawer{
  transform: translateX(0);
}


/* header */
.menu-close{
  padding: 18px;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  background: var(--d3);
  border-bottom: 1px solid var(--d4);
  display:flex;
  justify-content: space-between;
}


/* list */
.menu-list{
  list-style:none;
  margin:0;
  padding:0;
}

.menu-item > a{
  display:block;
  padding:14px 18px;
  font-size:12px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--text-mid);
  border-bottom:1px solid rgba(255,255,255,.05);
}

.menu-item > a:hover{
  color:var(--gold);
  background:var(--dark-3);
}


/* submenu */
.submenu{
  display:none;
  background:var(--dark-2);
}

.has-children.active .submenu{
  display:block;
}

.submenu a{
  padding-left:32px;
  font-size:11px;
  opacity:.85;
}

.menu_mobile .header__cart {
  padding: 14px 18px;
  margin: 20px;
  width: Calc(100% - 40px);
}
.menu_mobile .header__cart a {
    gap: 2rem;
}

.menu_mobile .btn_search {
  padding: 14px 18px;
  margin: 20px;
  width: Calc(100% - 40px);
}
.menu_mobile .header__search {
  width: 100%;
  border-color: var(--text-mid);
  color: var(--t1);
}


/* ══════════════════════════════════════════════════════
   §7 — SLIDER / HOME OFFSET
   ══════════════════════════════════════════════════════ */
#common-home {
  top: -97px;
  position: relative;
}

/* ── SLIDER SWIPER ─────────────────────────────────── */
.common-home .swiper-viewport {
    box-shadow: none;
    border: none;
    border-radius: 0;
    background: transparent;
    margin: 0;
}

/* ── BANNER ─────────────────────────────────────────── */
.html1, .html2,
.banners {
    position: relative;
    overflow: hidden;
}
.banner-inner,
.banner-inner > div,
.banner-inner > div > div,
.banner-inner1 {
    padding: 0;
}
.banner-inner > div {
    display: flex;
    align-items: center;
    background: var(--background-color);
}
.banners .inner1 img {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    transition: all 500ms cubic-bezier(.725,.24,.75,.75);
}
.banners:hover .inner1 img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    transition: all 500ms cubic-bezier(.725,.24,.75,.75);
}
.banners .inner1 img {
    width: 100%;
}
.inner2 {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.inner2 .promo-desc {
    font-size: 18px;

}
.inner2 .promo-title {
    font-size: 36px;
    line-height: 36px;
    font-weight: 600;
    margin: 15px 0 23px;

}
.inner2 .button {
    font-size: 14px;
    padding: 10px 30px;
}
.inner2 .button:hover {
  /**/
}


/* ══════════════════════════════════════════════════════
   §15 — FORM & BUTTON
   ══════════════════════════════════════════════════════ */
.buttons {
    margin: 1em 0;
}
#tab-review .buttons {
    margin: 1em 0 0;
}
button{
    transition-duration: 500ms;
    -webkit-transition-duration: 500ms;
    -moz-transition-duration: 500ms;
    -ms-transition-duration: 500ms;
    -o-transition-duration: 500ms;
}
.btn {
    font-size: 14px;
  line-height: 20px;
    background: linear-gradient(135deg, #C0C0C0 0%, #A8A8A8 100%);
  border: none;
  border-radius: 4px;
  color: #000;
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s;
  text-transform: uppercase;
  letter-spacing: 3px;
    transition-duration: 500ms;
    -webkit-transition-duration: 500ms;
    -moz-transition-duration: 500ms;
    -ms-transition-duration: 500ms;
    -o-transition-duration: 500ms;
}
.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(192, 192, 192, 0.5);
  background: linear-gradient(135deg, #D0D0D0 0%, #B8B8B8 100%);
}

.btn-xs {
    font-size: 9px;
}
.btn-sm {
    font-size: 10.2px;
}
.btn-lg {
    padding: 8px 20px;
    font-size: 14px;
}
.btn-group > .btn,
.btn-group > .dropdown-menu,
.btn-group > .popover {
    font-size: 14px;
}
.btn-group > .btn-xs {
    font-size: 9px;
}
.btn-group > .btn-sm {
    font-size: 10.2px;
}
.btn-group > .btn-lg {
    font-size: 14px;
}
#cart .text-right .addtocart-btn,
#cart .text-right .checkout-btn,
.btn-default,
.btn-primary {
    width: auto;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px 30px;
    border: none;
    color: var(--primary-color);
    background: var(--secondary-color);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
#cart .text-right .addtocart-btn:hover,
#cart .text-right .addtocart-btn:focus,
#cart .text-right .checkout-btn:hover,
#cart .text-right .checkout-btn:focus,
.open>.dropdown-toggle.btn-primary.focus,
.open>.dropdown-toggle.btn-primary:focus,
.open>.dropdown-toggle.btn-primary:hover,
.btn-primary[disabled].active,
.btn-primary[disabled].focus,
.btn-primary[disabled]:active,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:hover,
.btn-default:hover,
.btn-default:focus,
.btn-default:active:hover,
.btn-default:active,
.btn-default:active:focus,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:active:hover,
.btn-primary:active:focus,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled],
.btn-info:hover,
.btn-info:active,
.btn-info.active,
.btn-info.disabled,
.btn-info[disabled],
.btn-info.focus,
.btn-info:focus,
.btn-info:active:focus,
.btn-info:active:hover{


    box-shadow: none;
}
.btn-warning {

    background-color: #faa732;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: 700;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.btn-danger {

    background-color: #da4f49;
    text-transform: uppercase;
    padding: 10px 30px;
    font-weight: 700;
    border: none;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.btn-success {
    font-weight: 700;

    background-color: #5bb75b;
    background-repeat: repeat-x;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.btn-info {
    color: var(--primary-color);
    background: var(--secondary-color);
    border: none;
    font-weight: 700;
    padding: 10px 30px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    text-transform: uppercase;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.btn-link {
    border-color: rgba(0, 0, 0, 0);
    cursor: pointer;
    color: var(--primary-color);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.btn-link,
.btn-link:active,
.btn-link[disabled] {
    background-color: rgba(0, 0, 0, 0);
    background-image: none;
    box-shadow: none;
}
.btn-inverse {
    color: var(--primary-hover-color);
    background-color: #363636;
    background-repeat: repeat-x;
    border-color: var(--primary-color) var(--primary-color) #000000;
}
.btn-inverse:hover,
.btn-inverse:active,
.btn-inverse.active,
.btn-inverse.disabled,
.btn-inverse[disabled] {
    background-color: var(--primary-color);
}
.btn-link:focus,
.btn-link:hover {

    text-decoration: none;
    outline: none;
}

/* list group */
.list-group a {
    border: none;
    color: var(--secondary-light-color);
    padding: 8px 12px;
}
.list-group a.active,
.list-group a.active:hover,
.list-group a:hover {
    color: var(--primary-color);

}


/* products */

.owl-item.active.center .row-items,
.owl-item.active .image-additional,
.owl-item.active .product-layout,
.owl-item.active .category-layout {
    -moz-animation: zoomIn 500ms ease;
    -o-animation: zoomIn 500ms ease;
    -webkit-animation: zoomIn 500ms ease;
    animation: zoomIn 500ms ease;
}
.page-title {
    position: relative;
}
.page-title h3{
  font-family: 'Orbitron', sans-serif;
  text-align: center;
  font-size: 34px;
  margin: 0 0 32px;
  position: relative;
  line-height: 40px;

  font-weight: 700;
  text-shadow: 0px 0px 20px rgba(192, 192, 192, 0.6), 3px 3px 10px rgba(0, 0, 0, 1);
  letter-spacing: 3px;
  text-transform: uppercase;
}
.product-thumb{
    margin-bottom: 24px;
}
.badge-sold-out {
  position: absolute;
  top: 35%;
  left: 50%;
  text-align: center;
  font-weight: 600;
  background: red;
  font-size: 16px;
  text-transform: uppercase;
  color: #fff;
  padding: 6px 10px;
  width: 200%;
  transform: translate(-50%) rotate(-37deg);
  transform-origin: 50% 50%;
  z-index: 2;
}

.product-thumb .image {
    overflow: hidden;
  background: var(--dark-3);
  position: relative;
}
.product-thumb .image a {
    display: block;
    border: 1px solid var(--primary-hover-color);
    background: var(--secondary-color);
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
}

.product-thumb .image img {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
.product-thumb .button-group button {
    position: relative;
    display: block;
    font-size: 16px;
    padding: 0;
    bottom: 0;
    height: 44px;
    width: 44px;
    border-radius: 0;
    background: var(--secondary-light-color);
    color: var(--primary-color);
    border: none;
    transition-duration: 500ms;
    -webkit-transition-duration: 500ms;
    -moz-transition-duration: 500ms;
    -ms-transition-duration: 500ms;
    -o-transition-duration: 500ms;
    z-index: 1;
}
.product-thumb .button-group button + button {
}
.product-thumb .button-group button:hover {
    box-shadow: none;
    color: var(--t2);
}
.product-thumb .button-group button i {
    display: block;
}
.product-thumb .addcart {
    opacity: 0;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -20px;
    margin: auto;
    border: none;
    line-height: 18px;
    padding: 0;
    font-size: 14px;
    font-weight: 700;
    width: fit-content;
    text-align: center;
    z-index: 1;
    text-transform: uppercase;
    background: transparent;

    border-bottom: 1px solid var(--secondary-color);
    transition-duration: 500ms;
    -webkit-transition-duration: 500ms;
    -moz-transition-duration: 500ms;
    -ms-transition-duration: 500ms;
    -o-transition-duration: 500ms;
}
.product-thumb .addcart:hover{
    color: var(--primary-hover-color);
    border-color: var(--primary-color);
}
.product-thumb:hover .addcart {
    opacity: 1;
    bottom: 2px;
}
.sale-text {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    padding: 0 5px;
    z-index: 1;

    color: var(--primary-color);
}
.product-thumb .description {
    color: #777777;
    line-height: 24px;
    margin: 5px 0 0;
    font-size: 16px;
}
.thumb-description {
    position: relative;
    overflow: hidden;
}
.product-list .thumb-description {
    overflow: hidden;
}
.product-thumb .caption {
    padding: 7px 5px 0;
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.product-thumb .price {
    display: inline-block;
    vertical-align: middle;
    font-size: 18px;
    margin: 0;
    line-height: 20px;
    transition-duration: 500ms;
    -webkit-transition-duration: 500ms;
    -moz-transition-duration: 500ms;
    -ms-transition-duration: 500ms;
    -o-transition-duration: 500ms;
}
.product-thumb .price-new {
    margin-right: 5px;
}
.product-thumb .price-old {
    margin-left: 5px;
    text-decoration: line-through;
    display: inline-block;
    vertical-align: middle;
    font-weight: 700;
    font-size: 16px;
    color: var(--secondary-light-color);
    line-height: 20px;
}
.product-thumb .product-title {
    margin: 0;
}
.product-thumb .product-title a {
    text-transform: capitalize;
    font-size: 18px;
    font-weight: 600;
    display: block;
    margin: 0 0 8px;
}
.product-thumb .price-tax {
    display: none;
}
.product-thumb .rating {
    position: relative;
    margin-top: 11px;
    font-weight: 400;
    text-transform: capitalize;
    font-size: 0;
    z-index: 1;
    line-height: 16px;
    transition-duration: 500ms;
    -webkit-transition-duration: 500ms;
    -moz-transition-duration: 500ms;
    -ms-transition-duration: 500ms;
    -o-transition-duration: 500ms;
    opacity: 1;
}
/*.product-thumb:hover .rating {
    opacity: 0;
}*/
.product-list .product-thumb .image {
    border: none;
    max-height: 282px;
    max-width: 282px;
}
.product-list .product-thumb .product-title a {
    margin: 0 0 9px;
}
.product-list .product-thumb .btn-list > button {
    position: relative;
    display: inline-block;
}
.product-list .product-thumb .button-group button + button {
    margin: 0 0 0 8px;
}
.product-list .product-thumb .button-group button i {
    display: block;
}
.product-thumb .btn-list,
.product-list .product-thumb .button-group {
    position: relative;
  opacity: 1;
  left: 0;
  visibility: visible;
  margin: 0;
    margin-top: 0px;
  top: 0;
  background: rgba(0,0,0,0);
  padding: 0;
  border-width: 0;
  border-radius: 0;
  flex-direction: row;
  height: 100%;
  bottom: 0;
  margin-top: 50px;
}
.product-list .product-thumb .thumb-description .rating,
#column-left .product-thumb .thumb-description .rating,
#column-right .product-thumb .thumb-description .rating {
    display: block;
    position: unset;
    margin: 10px 0 0;
}
#column-left .product-thumb:hover .rating,
#column-right .product-thumb:hover .rating,
.product-list .product-thumb:hover .rating {
    opacity: 1;
}
.product-list .product-thumb .thumb-description .rating {
    margin: 13px 0 0;
}
.product-list .product-thumb .all-btn {
    margin: 5px 0 0;
    position: relative;
    overflow: hidden;
}
.product-list .product-thumb .btn-list {
    position: unset;
    opacity: 1;
    display: block;
    margin: 15px 0 0;
    visibility: visible;
}

/*product hover */
.product-thumb .hover-img {
    left: 0;
    max-width: 100%;
    opacity: 0;
    position: absolute;
    right: 0;
    text-align: left;
    top: 0;
    transition-duration: 500ms;
    transform: translateY(100%);
    -moz-transform: translateY(100%);
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
}
.product-thumb:hover .hover-img {
    opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    overflow: hidden;
    transform: translateY(0%);
    -moz-transform: translateY(0%);
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transition-duration: 500ms;
    -webkit-transition-duration: 500ms;
    -moz-transition-duration: 500ms;
    -ms-transition-duration: 500ms;
    -o-transition-duration: 500ms;
}

.product-thumb .product-image-rollover {
  position: relative;
}

.product-image-rollover img.img-main,
.product-image-rollover img.img-hover {
  display: block;
  width: 100%;
  transition: opacity .3s ease;
}

.product-image-rollover img.img-hover {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.product-thumb:hover .product-image-rollover img.img-hover {
  opacity: 1;
}

.product-thumb:hover .product-image-rollover img.img-main {
  opacity: 0;
}

.product-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(10,8,6,.9) 100%);
  opacity: 0;
  transition: opacity .3s;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: var(--s4);
}
.product-thumb:hover .product-card__overlay {
  opacity: 1;
}

.btn-quickview {
  font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--gold);
  border: 1px solid var(--gold);
  padding: var(--s2) var(--s5);
  background: rgba(10,8,6,.7);
  transition: all .2s;
}


/*product tab*/
.product-tabs-section {
  margin: 40px 0;
}

#home-product-tabs > li > a {
  padding: 10px 20px;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 14px;
}

#home-product-tabs > li.active > a,
#home-product-tabs > li.active > a:focus,
#home-product-tabs > li.active > a:hover {
  background: #111;
  color: #fff;
  border-color: #111;
}

.product-tabs-section .tab-pane {
  padding-top: 20px;
}

._tabs .nav-tabs {
    position: relative;
    border: none;
    margin: 0 0 30px;
    padding: 0;
    text-align: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow-x: auto;
}
._tabs .nav-tabs > li {
    margin: 0;
    float: none;
    display: inline-block;
}
._tabs .nav-tabs::-webkit-scrollbar {
    display: none;
}
._tabs .nav-tabs::before {
    display: none;
}
._tabs .nav-tabs>li> a{
    display: inline-block;
  padding: 0 30px;
  text-transform: uppercase;
  font-size: 16px;
  border: none;
  line-height: 20px;
  color: var(--secondary-light-color);
  background: transparent;
  border: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  font-family: 'Oswald', sans-serif;
}
._tabs .nav-tabs>li> a:hover,
._tabs .nav-tabs>li> a:focus,
._tabs .nav-tabs>li> a.selected{
    color: var(--primary-hover-color);
    background: transparent;
    border: none;
}
._tabs .nav-tabs li + li:before {
    content: '';
    background: var(--silver-gradient);
    height: 7px;
    width: 7px;
    position: absolute;
    left: -8px;
    top: 0;
    bottom: 0;
    margin: auto;
    vertical-align: middle;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}

.product-list .product-thumb .all-btn .addcart {
    position: unset;
    opacity: 1;
}
.product-list .product-thumb .addcart i,
#button-cart i,
#quick-cart i {
    padding: 0 9px 0 0;
}


/*----------------------------------------------
/* swiper pager */

.swiper-viewport .swiper-pager > div,
.owl-carousel.owl-theme .owl-nav div {
    color: var(--primary-color);
    padding: 0;
    margin: 0 14px;
    opacity: 1;
    text-shadow: none;
    display: inline-block;
    text-align: center;
    line-height: 20px;
    height: 34px;
    width: 46px;
    border-radius: 0;
    border: none;
    background: transparent;
    transition: unset;
}
.owl-carousel.owl-theme:hover .owl-nav div {
    opacity: 1;
}
.owl-carousel.owl-theme:hover .owl-nav .disabled {
    opacity: 0.6;
}
.swiper-viewport {
    border: unset;
}
.swiper-pagination {
    display: none;
}
.owl-carousel.owl-theme .owl-nav .fa,
.swiper-viewport .fa {
    font-size: 0;
    line-height: 34px;
    display: block;
    text-align: center;
}

.carousel .swiper-slide {
  display: flex;
}
.carousel .swiper-slide .text-center {
  padding: 0 30px;
  border: 1px solid var(--secondary-color);
}
/*
.owl-carousel.owl-theme .owl-nav .owl-prev,
.swiper-viewport .swiper-pager .swiper-button-prev,
.brand .swiper-viewport .swiper-pager .swiper-button-prev,
.brand .swiper-viewport:hover .swiper-pager .swiper-button-prev {
    background: url(../image/mahardhi/sprite.png) 2px -10px;
}
.owl-carousel.owl-theme .owl-nav .owl-prev .fa,
.swiper-viewport .swiper-pager .swiper-button-prev .fa {
    background: url(../image/mahardhi/sprite.png) -16px -52px;
}
.swiper-viewport .swiper-pager .swiper-button-prev:hover,
.owl-carousel.owl-theme .owl-nav .owl-prev:hover {
    background: url(../image/mahardhi/sprite.png) 2px -94px;
}
.owl-carousel.owl-theme .owl-nav .owl-prev:hover .fa,
.swiper-viewport .swiper-pager .swiper-button-prev:hover .fa {
    background: url(../image/mahardhi/sprite.png) -8px -136px;
}
.owl-carousel.owl-theme .owl-nav .owl-next,
.swiper-viewport .swiper-pager .swiper-button-next,
.brand .swiper-viewport .swiper-pager .swiper-button-next,
.brand .swiper-viewport:hover .swiper-pager .swiper-button-next {
    background: url(../image/mahardhi/sprite.png) 44px -10px;
}
.owl-carousel.owl-theme .owl-nav .owl-next .fa,
.swiper-viewport .swiper-pager .swiper-button-next .fa {
    background: url(../image/mahardhi/sprite.png) 61px -52px;
}
.swiper-viewport .swiper-pager .swiper-button-next:hover,
.owl-carousel.owl-theme .owl-nav .owl-next:hover {
    background: url(../image/mahardhi/sprite.png) 44px -94px;
}
.owl-carousel.owl-theme .owl-nav .owl-next:hover .fa,
.swiper-viewport .swiper-pager .swiper-button-next:hover .fa {
    background: url(../image/mahardhi/sprite.png) 54px -136px;
}
*/
.swiper-viewport .swiper-pager > div.swiper-button {
  fill: #fff;
  height: 40px;
}
.swiper-viewport .swiper-pager > div.swiper-button > svg {
  height: 100%;
}

/*carousel*/
.owl-carousel.owl-theme .owl-nav {
    margin-top: 0;
    text-align: center;
    margin: 0 auto;
    left: 0;
    right: 0;
}
.carousel .swiper-viewport:hover .swiper-button-next,
.carousel .swiper-viewport:hover .swiper-pager .swiper-button-prev {
    opacity: 1;
}
.brand .swiper-pager > div {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: auto;
    border: none;
    height: fit-content;
}
.brand .swiper-viewport .swiper-pager > div:hover {
    background: transparent;
    color: var(--primary-hover-color);
}
.brand .swiper-viewport .swiper-pager .swiper-button-prev,
.brand .swiper-viewport:hover .swiper-pager .swiper-button-prev {
    right: auto;
    left: 0px;
}
.brand .swiper-viewport .swiper-pager .swiper-button-next,
.brand .swiper-viewport:hover .swiper-pager .swiper-button-next {
    right: 0px;
    left: auto;
}

/*dots*/
.swiper-pagination span,
.owl-theme .owl-dots .owl-dot span{
    width: 10px;
    height: 10px;
    background: var(--secondary-color);
    box-shadow: none;
    margin: 0 3px;
}
.owl-theme .owl-dots .owl-dot.active span{
    border: 2px solid var(--primary-hover-color);
    height: 14px;
    width: 14px;
    margin-top: 0;
    margin-bottom: 0;
}

.owl-theme .owl-nav.disabled+.owl-dots{
    margin: 0;
}

/* =========================================
   SLIDESHOW — altezza minima fissa
   ========================================= */

.slideshow,
.slideshow .swiper-viewport,
.slideshow .swiper-container,
.slideshow .swiper-wrapper,
.slideshow .swiper-slide{
  min-height: 500px;
}

/* immagine deve riempire */
.slideshow .swiper-slide img{
  width: 100%;
  height: 700px;
  object-fit: cover;   /* riempie senza deformare */
}

/*slideshow*/
/*.slideshow {
    position: relative;
    overflow: hidden;
}
.slideshow img {
    width: 100%;
}
*/
/* --- FULL WIDTH SLIDESHOW --- */
/* ===========================
   HERO BANNER FULL WIDTH
   =========================== */

/* Sblocca eventuali clip del tema sulla home */
.common-home #content {
  overflow: visible;
  padding-top: 0;
  padding-bottom: 0;
}

.slideshow {
  min-height: 600px;
  position: relative;
}

/* Contenitore principale hero: esce dal .container */
.slideshow.hero-banner {
  position: relative;
  width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  overflow: hidden;
}

/* Togli padding orizzontali alla container sulla home
.common-home .container {
  padding-left: 0;
  padding-right: 0;
}*/
.common-home #content > .container {
  padding-left: 0;
  padding-right: 0;
}

/* Viewport Swiper: occupa tutta la larghezza */
.slideshow.hero-banner .swiper-viewport {
  width: 100%;
  max-width: 100%;
  border: none;
  box-shadow: none;
}

/* Altezza del hero: regola a gusto */
.slideshow.hero-banner,
.slideshow.hero-banner .swiper-viewport,
.slideshow.hero-banner .swiper-container,
.slideshow.hero-banner .swiper-wrapper,
.slideshow.hero-banner .swiper-slide {
  min-height: 380px;   /* minimo per desktop */
}

/* Allinea il contenuto al centro */
.slideshow.hero-banner .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Immagine: deve riempire tutta l'area */
.slideshow.hero-banner img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* Override robe tipo .img-responsive del tema */
.slideshow.hero-banner img.img-responsive {
  max-width: none;
}

/* Bottoni di navigazione sopra il banner */
.slideshow.hero-banner .swiper-button-next,
.slideshow.hero-banner .swiper-button-prev {
  width: 44px;
  height: 44px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.85;
}

/* Paginazione centrata sotto il banner */
.slideshow.hero-banner .swiper-pagination {
  bottom: 20px;
}

/* Se il tema mette bordi o background strani sul viewport, li annulliamo */
.slideshow.hero-banner .swiper-viewport {
  background: transparent;
  border: 0;
}


.slideshow .swiper-pagination {
    display: none;
}
.swiper-button-next:before,
.swiper-button-prev:before {
    display: none;
}
.slideshow .swiper-pager {
    position: absolute;
    left: 0;
    right: 0;
    top: auto;
    bottom: 50px;
    margin: auto;
    width: fit-content;
    line-height: initial;
}
.slideshow .swiper-button-next,
.slideshow .swiper-button-prev {
    position: relative;
    top: auto;
}
.slideshow .swiper-viewport .swiper-pager > div {
    opacity: 1;
}
.slideshow .swiper-viewport .fa {
  line-height: 40px;
  position: absolute;
  color: #fff;
  width: 100%;
  top: 50%;
  font-size: 1.6em;
  margin-top: -20px;
}
.slideshow .swiper-viewport .swiper-pager .swiper-button-prev {
    left: 0;
}
.slideshow .swiper-viewport .swiper-pager .swiper-button-next {
    right: 0;
}

.slideshow .swiper-viewport .swiper-pager .swiper-button-prev > i {
    left: -20px;
}
.slideshow .swiper-viewport .swiper-pager .swiper-button-next > i {
    right: -20px;
}

.slideshow .swiper-viewport .swiper-pager .swiper-button:hover {
    color: var(--primary-hover-color);
    fill: var(--primary-hover-color);
}
.slideshow .swiper-viewport .swiper-pager .swiper-button-prev:hover > i {
    color: var(--primary-hover-color);
    left: -10px;
}
.slideshow .swiper-viewport .swiper-pager .swiper-button-next:hover > i {
    color: var(--primary-hover-color);
    right: -10px;
}

/* hero deco */
.hero__deco {
  position: absolute;
  right: var(--s7);
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: var(--s2);
  z-index: 2;
  writing-mode: vertical-rl;
  font-family: var(--font-ui);
  font-size: 8px;
  letter-spacing: 3px;
  color: var(--text-lo);
  text-transform: uppercase;
  align-items: center;
}
.hero__deco::before {
  content: '';
  width: 1px;
  height: 50px;
  background: linear-gradient(180deg, transparent, var(--gold-dim));
  margin-bottom: var(--s2);
}

/* ======================================
   SLIDESHOW — DOTS
   ====================================== */

.slideshow .swiper-pagination{
  bottom: 22px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: var(--s3);
  z-index: 3;
  justify-content: center;
}

.slideshow .swiper-pagination-bullet{
  width: 20px;
  height: 2px;
  background: var(--dark-4);
  cursor: pointer;
  transition: all .3s;
}

.slideshow .swiper-pagination-bullet:hover{
  background: rgba(255,255,255,.6);
}

.slideshow .swiper-pagination-bullet-active{
  background: var(--gold);
  width: 32px;
}

/* brand */

.brand .swiper-viewport {
    background: transparent;
}
.brand .swiper-slide > div {
    padding: 30px 0;
    border: 1px solid var(--secondary-color);
}
.brand .swiper-pager {
    display: none;
}


/* ══════════════════════════════════════════════════════
   §BLOG
   ══════════════════════════════════════════════════════ */
/* blog */

.link_info {
    position: relative;
}
.blog-block{
    margin-bottom: 30px;
    position: relative;
}
.zoom-post {
    opacity: 0;
    position: absolute;
    top: 10px;
    right: -40px;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.blog-block:hover .zoom-post {
    opacity: 1;
    right: 10px;
}
.blog-block .zoom-post a::before {
    bottom: 10px;
    display: block;
    margin: 0;
    height: 40px;
    width: 40px;
    line-height: 40px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    background: var(--secondary-color);
    color: var(--primary-color);
    border: none;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.blog-block .zoom-post .hover-post::before{
    margin: 5px 0 0;
}
.blog-block .zoom-post a:hover::before{


}
.blog-block .zoom-post a::before{
    transition: all 0.3s ease-in-out 0s;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
}
.blog-block .hover-zoom::before,
.blog-block .hover-post:before{
    font-family: FontAwesome;
    font-size: 14px;
    margin: 0;
    display: block;
    text-align: center;
}
.blog-block .hover-zoom::before{
    content: "\f002";
}
.blog-block .hover-post:before {
    content: '\f0c1';
}
.blog-block .caption {
    margin-top: -80px;
    padding: 12px 10px 30px;
    background: var(--background-color);
}
.block-date {
    font-size: 18px;
    font-weight: 700;
    display: inline-block;
    text-align: center;
    padding: 0;
    color: var(--primary-hover-color);
}
.block-day {
    font-size: 40px;
    line-height: 40px;
    font-weight: 700;
    display: block;
    margin-bottom: 2px;
}
.block-month {
    margin-bottom: 6px;
}
.link_info {
    padding: 26px 30px 0 70px;
}
.blog-block h4,
h3.article-page-title{
    margin: 0;
    line-height: 24px;
    font-size: 24px;
    font-weight: 400;
    text-transform: capitalize;
}
.blog-info .image {
    overflow: hidden;
    position: relative;
    border-radius: 0;
    margin: 0 30px 0 80px;
}
.blog-read.btn {
    padding: 0;
    text-transform: uppercase;
    border: none;
    line-height: 14px;
    font-weight: 700;
    box-shadow: none;
    background: transparent;

    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-bottom: 1px solid var(--secondary-color);
}
.blog-read:hover {
    background: transparent;
    color: var(--primary-hover-color);
    border-color: var(--primary-hover-color);
}
.product-list .blog-block.product-thumb .image {
    box-shadow: none;
    margin: 0;
}

/* ══════════════════════════════════════════════════════
   §BLOG
   ══════════════════════════════════════════════════════ */
/* blog page */

.blog-category .blog-img {
    position: relative;
    overflow: hidden;
    display: block;
}
.caption-blog  p,
.info_blog p{
    margin: 20px 0 0;
}
.blog-block img{
    width: 100%;
}
.blog-text {
    color: var(--secondary-light-color);
    margin: 15px 0 10px;
    line-height: 24px;
    font-size: 16px;
}
.product-list.blog-category.col-sm-6:nth-child(2n+1) {
    clear: left;
}


/* article blog page */

.article-container .singblog-description {
    background: var(--background-color);
    padding: 20px;
}
.article-container .blog-block {
    margin-bottom: 0;
}
#content-blogs .thumbnails .thumbnail {
    border: unset;
    margin: 0;
    padding: 0;
}
.article-container .leave-hedding {
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    padding: 15px 20px;
    line-height: 20px;
    margin: 0;


    border-radius: 0;
}
h3.article-page-title{
    margin: 13px 0 0;
}
.article-container .page-title {
    margin-bottom: 30px;
}
.article-container .post-comment .form-group {
    margin-right: 0;
    margin-left: 0;
}
#post_comment #commnt_form.form-horizontal .control-label {
    text-align: left;
}
.comment_cust h4 {
    margin-bottom: 20px;
}
.commentlist ul {
    padding: 0px;
    margin: 0px;
    list-style: none;
}
.commentlist ul li:last-child {
    padding-bottom: 0;
}
.commentlist ul li + li {
    padding-top: 10px;
}
.comment_cust .comment-text .user_img {
    float: left;
    height: 60px;
    width: 60px;
    background-color: var(--background-color);
    text-align: center;

    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
}
.comment_cust .comment-text .user_img i {
    font-size: 26px;
    line-height: 60px;
}
.comment_cust .comment-desc {
    padding-left: 80px;
    line-height: 26px;
}
.comment_cust .comment-desc .name {
    font-weight: 400;
    text-transform: capitalize;
    font-size: 16px;
}
.comment_cust .comment-desc .date {
    color: var(--secondary-light-color);
}
.comment-dis {
    color: var(--secondary-light-color);
    line-height: 22px;
}
#post_comment{
    background: var(--background-color);
    padding: 20px 20px 1px;
    border-radius: 0 0 5px 5px;
}
.comment_cust {
    padding: 20px;
    background: var(--background-color);
    border: none;
}
.comment-text {
    padding: 20px;
    background: var(--primary-color);
}
.singblog-description .blog-text {
    margin: 11px 0 0;
}


/* ── TESTIMONIAL ────────────────────────────────────── */
.row-items {
    margin-bottom: 30px;
}
.testimonial-images {
    position: relative;
    overflow: hidden;
}
.testimonial-inner .testimonial-author {
    position: absolute;
    top: auto;
    left: 30px;
    right: 30px;
    bottom: 30px;
    margin: auto;
    font-size: 24px;
    line-height: 24px;
    font-weight: 600;
    padding: 18px 10px;
    text-align: center;
    color: var(--primary-color);
    background: rgba(255, 255, 255, 0.8);
    opacity: 1;
    visibility: visible;
}
.testimonial-inner:hover .testimonial-author {
    opacity: 0;
    visibility: hidden;
}
.testimonial-text p {
    margin: 0;
}
.testimonial-author-text {
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 28px;
    color: var(--primary-color);
}
.testimonial-text {
    position: relative;
    font-size: 16px;
    line-height: 26px;
    color: #777777;
}
.testimonial-customer {
    color: var(--secondary-light-color);
}


/* ══════════════════════════════════════════════════════
   §12 — NEWSLETTER BLOCK
   ══════════════════════════════════════════════════════ */
.title-text h4 {
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;

    margin: 0 0 20px;
}
.news-description {

    line-height: 24px;
    font-size: 16px;
}
.subscribe-form {
    margin-top: 10px;
}
.subscribe-form #newsletter_usr_email {
    padding: 5px 0;
    border: none;
    background: transparent;

    border-radius: 0;
    border-bottom: 1px solid var(--secondary-color);
}
.subscribe-form #newsletter_usr_email::placeholder {

}
.subscribe-btn {
    border: none;
    background: var(--secondary-color);
    color: var(--primary-color);
    padding: 10px 30px;
    margin-top: 30px;
    font-weight: 700;
    border-radius: 5px;
    text-transform: uppercase;
}
.subscribe-btn:hover {


}


/* ══════════════════════════════════════════════════════
   §11 — FOOTER
   ══════════════════════════════════════════════════════ */
footer {
    position: relative;
    background: url(../image/footer-bg.jpg) no-repeat center center;
    background-size: cover;
}
footer h5,
footer h4 {
    text-transform: uppercase;
    font-size: 18px;
    margin: 0 0 14px;
    line-height: 20px;
    position: relative;
    font-weight: 600;

}
footer .col-sm-2 a,
footer .col-sm-3 a {
    font-size: 16px;
    padding: 8px 0;
    display: block;
    color: var(--secondary-light-color);
}
footer a:hover,
footer a:focus {
    color: var(--primary-hover-color);
}
.footer-top {
    padding: 76px 0 80PX;
}

/* footer left */
.position-footer-left h5 {
    margin: 0 0 16px;
}
.position-footer-left li > div {
    display: flex;
    padding: 4px 0;
    line-height: 24px;
    font-size: 16px;
}
.position-footer-left li .contact_site a {
    padding: 0;
    display: initial;
    color: var(--secondary-light-color);
}
.contact_title {
    text-transform: capitalize;
    margin-right: 5px;
    color: var(--secondary-light-color);
}
.contact_site {
    color: var(--secondary-light-color);
}

/* footer bottom*/
.footer_bottom {
    padding: 28px 0;
    text-align: center;
    border-top: 1px solid var(--secondary-color);
}
footer .footer_bottom p {
    font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--text-lo);
  transition: all .2s;
  display: flex;
  align-items: center;
  gap: var(--s2);
}
footer .footer_bottom p a {

}
.footer_bottom .container {
  display: flex;
  justify-content: space-between;
}
.toggled.active .fa-chevron-down:before {
    content: "\f077";
}

/* social media*/
.position-footer-left .social-media {
    margin: 22px 0 0;
}
footer .col-sm-3 .social-media a {
    display: inline-block;
    padding: 0;
}
.social-media a i {
    height: 34px;
    width: 34px;
    line-height: 34px;
    border-radius: 50px;

    text-align: center;
}
.social-media {
  list-style: none;
  display: flex;
  gap: 8px;
}
.social-media a + a {
    margin: 0 0 0 10px;
}
.social-media a .fa-facebook {
    background: #3b5998;
}
.social-media a .fa-instagram {
  background: #833ab4;
  background: linear-gradient( to right, #833ab4,#fd1d1d,#fcb045 );
}
.social-media a .fa-twitter {
    background: #00acee;
}
.social-media a .fa-youtube-play {
    background: #c4302b;
}
.social-media a .fa-google-plus {
    background: #db3236;
}
.social-media a .fa-pinterest-p {
    background: #c8232c;
}


/* ══════════════════════════════════════════════════════
   §13 — SERVIZI
   ══════════════════════════════════════════════════════ */
.service {
    text-align: center;
}
.service-icon {
    margin: 0 0 18px;
}
.service .service-icon i {
    display: inline-block;
}
.service:hover .service-icon i {
    -webkit-animation: tada 1s linear infinite;
    -moz-animation: tada 1s linear infinite;
    -ms-animation: tada 1s linear infinite;
    animation: tada 1s linear infinite;
}
.service .service-icon .fa {
    font-size: 50px;
}
.service .promo-title {
    margin: 0 0 10px;
    font-size: 18px;
    text-transform: capitalize;
    font-weight: 600;

}
.service .promo-desc {
    display: block;
    font-size: 16px;
    text-transform: capitalize;
    color: var(--secondary-light-color);
}


/* ── PAGE TITLE ─────────────────────────────────────── */
.page_title {
    font-size: 18px;
    text-transform: uppercase;
    margin: 0;
    font-weight: 600;
    line-height: 20px;
    display: none;
}

/* ══════════════════════════════════════════════════════
   §6 — BREADCRUMB
   ══════════════════════════════════════════════════════ */
.breadcrumb-back {
    background: url(../image/breadcrumbs-bg.jpg) no-repeat center center;
    background-size: cover;
    margin-bottom: 30px;
    padding: 260px 0 120px;
    text-align: center;
}
.breadcrumb {
    padding: 0;
    border: none;
    background: transparent;
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    text-transform: capitalize;
}
.breadcrumb > li {
    position: relative;
}
.breadcrumb li:last-child a {
  color: var(--text-mid);
  pointer-events: none;
}
.breadcrumb > li + li:before {
    content: "/";

    padding: 0 8px 0 4px;
}


/* ══════════════════════════════════════════════════════
   §10 — SIDEBAR  (column-left / column-right)
   ══════════════════════════════════════════════════════ */
#column-left > div,
#column-right > div {
    margin: 30px 0 0;
    box-shadow: none;
    padding: 0;
    width: auto;
    float: unset;
}
#column-left > div:first-child,
#column-right > div:first-child{
    margin-top: 0;
}
#column-left h3,
#column-right h3,
#column-left .box-content h3,
#column-right .box-content h3 {
  font-family: Oswald;
  display: block;
  margin: 0;
  padding: 15px 20px;
  font-size: 16px;
  text-align: left;
  text-transform: uppercase;
  position: relative;
  font-weight: 500;
  border-radius: 0;
  border: none;
  line-height: 20px;

  color: var(--primary-color);
}
a.list-group-item.active,
a.list-group-item.active:focus,
a.list-group-item.active:hover,
a.list-group-item:hover,
a.list-group-item:focus,
button.list-group-item:focus,
button.list-group-item:hover {
    color: var(--primary-hover-color);
    text-decoration: none;
    background-color: transparent;
}
.filter_box,
#column-left .block_box,
#column-right .block_box,
.category-list #selectMe-desk,
.featured-aside-content,
.account-content .list-unstyled,
.sidebar .list-unstyled{
    padding: 30px 20px;
    margin: 0;
    background: var(--background-color);
    border-radius: 0;
}
#column-left .row,
#column-right .row{
    margin: 0;
}
#column-left .box .container,
#column-right .box .container{
    width: auto;
    padding: 0;
}
.category-list .list-group-item,
.sidebar li, .account-content .list-group a{
    border: none;
    border-radius: 0;
    margin: 0;
    background: transparent;
    padding: 8px 0;
    text-transform: capitalize;
    color: var(--secondary-light-color);
    font-size: 14px;
    font-weight: 600;
}
.category-list .list-group-item {
    padding: 8px 13px 8px 0;
}
.category-list ul#selectMe-desk > li:first-child > a.list-group-item,
.account-content .list-group ul > li:first-child a,
.sidebar li:first-child {
    padding-top: 0;
    margin-top: -4px;
}
.category-list ul#selectMe-desk > li:last-child > a.list-group-item,
.account-content .list-group ul > li:last-child a,
.sidebar li:last-child{
    padding-bottom: 0;
}
.category-list .has-more-category .toggled {
    position: absolute;
    right: 0;
}
.child-categories { display: none; }
.main-item.active .toggled > .fa-plus:before,
.toggle-menu.active > .fa-plus:before {
    content: "\f068";
}

/*sidebar category*/
.box-category .list-unstyled.childs_1 {
    display: none;
}
.parent li .toggled span {
    color: var(--primary-color);
    font-size: 12px;
    position: absolute;
    right: 5px;
    padding: 0 5px;
}
.parent .active .open-menu::after {
    color: var(--primary-color);
    content: "\f068";
    font-family: "FontAwesome";
    font-size: 14px;
}
.parent .open-menu::after {
    color: var(--primary-color);
    content: "\f067";
    font-family: "FontAwesome";
    font-size: 14px;
}

/*REFINE SEARCH*/
.list-group-filter {
    margin-bottom: 27px;
}
.panel-default.filter {
    border: none;
}
.panel {
    border-radius: 0;
    box-shadow: none;
}
.filter_box .list-group a {

    text-transform: capitalize;
    margin: -4px 0 12px;
    background: transparent;
    font-size: 18px;
    font-weight: 400;
}
.filter_box .checkbox,
.filter_box .checkbox .radio {
    margin: 9px 0;
}
.filter_box .list-group-item {
    border: none;
    padding: 0px;
    background: transparent;
}
.filter_box .list-group-items + .list-group-items {
    margin: 27px 0 0;
}
.checkbox label, .radio label {
    text-transform: capitalize;
    font-size: 16px;
    color: var(--secondary-light-color);
}
#filter .panel-footer {
    text-align: left;
    padding: 0;
    background: transparent;
}

/*banner*/
#column-left .swiper-viewport,
#column-right .swiper-viewport{
    border: none;
}
#column-left .swiper-slide img,
#column-right .swiper-slide img{
    width: 100%;
}

/*INFORMATION*/
.sidebar li a:hover,
.account-content .list-group a:hover{
    color: var(--primary-hover-color);
}
.account-content .list-group{
    margin: 0;
}

/*product*/
#column-left .product-thumb,
#column-right .product-thumb{
    margin: 0;
    background: transparent;
    box-shadow: none;
    display: grid;
  grid-template-columns: 80px auto;
  grid-gap: 10px;
  align-items: start;
}
#column-left .product-layout + .product-layout .product-thumb,
#column-right .product-layout + .product-layout .product-thumb {
    margin: 30px 0 0 0;
}
#column-left .product-layout,
#column-right .product-layout{
    width: 100%;
    padding: 0;
}
#column-left .product-thumb > .image,
#column-right .product-thumb > .image {
    float: left;
    width: 80px;
    margin-right: 15px;
}
#column-left .product-thumb > .thumb-description,
#column-right .product-thumb > .thumb-description {
    float: left;
    width: 100%;
}
#column-left .product-thumb .button-group,
#column-right .product-thumb .button-group,
#column-left .product-thumb .addcart,
#column-right .product-thumb .addcart,
#column-left .product-thumb .wishlist,
#column-right .product-thumb .wishlist {
    display: none;
}
#column-left .product-thumb .price,
#column-right .product-thumb .price,
.product-list .product-thumb .price {
    opacity: 1;
}

#column-left .product-thumb .product-title a,
#column-right .product-thumb .product-title a {
    margin: 2px 0 7px;
}
#column-left .product-thumb .caption,
#column-right .product-thumb .caption {
    padding: 0;
    text-align: left;
}


/* ══════════════════════════════════════════════════════
   §8 — CATEGORIA  (toolbar, filtri, griglia)
   ══════════════════════════════════════════════════════ */
.cat-banner {
    border: none;
    padding:0;
    background: transparent;
    border-radius: 0;
    margin: 0 0 14px;
}
.cat-description p {
    margin: 0 0 24px;
    color: var(--secondary-light-color);
    line-height: 24px;
    font-size: 16px;
}
.cat_info {
    margin: 0 0 30px;
    background: var(--background-color);
    padding: 10px 20px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.refine-search {
    margin: 0 0 20px;
}
#content .refine-text {
    font-size: 18px;
    margin: 0 0 11px;
    font-weight: 400;
}
.cat-name {
    font-size: 16px;
    padding: 0;
    margin: 0;
    text-transform: capitalize;
}
.cat-name li {
    display: inline-block;
}
.cat-name li a {
    font-size: 14px;
    background: var(--secondary-color);
    color: var(--primary-color);
    padding: 7px 20px;
    display: inline-block;
    margin: 0 6px 10px 0;
    border: none;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.cat-name li a:hover{


}
#list-view.btn-default,
#grid-view.btn-default {
    height: 40px;
  width: 40px;
  padding: 0;
  border: none;
  background: rgba(0,0,0,0);
  color: var(--t3);
  box-shadow: none;
  border-radius: 0;
}
#grid-view.btn-default {
    margin: 0 10px 0 0;
}
#grid-view.btn-default.active,
#list-view.btn-default.active {
    color: var(--g);
}
#grid-view.btn-default:hover,
#list-view.btn-default:hover {
    color: var(--t2);
}
#list-view.btn-default i,
#grid-view.btn-default i{
    font-size: 20px;
    display: block;
}
#compare-total.btn.btn-link {
    text-decoration: none;
    font-size: 15px;
    outline: none;
    padding: 10px 0;
    border: none;
    text-transform: capitalize;
    font-weight: 400;
    color: var(--secondry-color);
}
#compare-total.btn.btn-link:hover{
    color: var(--primary-hover-color);
}
.cat-pagination-right {
    text-align: right;
}
.cat-pagination-right > div {
    display: inline-block;
    vertical-align: top;
    padding-top: 2px;
    padding-bottom: 2px;
}
.cat-pagination-right .cat-show {
    padding-left: 12px;
}
.text-right.show-text {
    padding: 0px 14px;
}
.text-right.show-text,
.text-right.show-select{
    width: auto;
    float: left;
}
.text_limit,
.text_sort{
    margin: 8px 0;
    font-size: 14px;
}
.select-filter-sort,
.select-filter-show {
    position: relative;
    color: var(--text-mid);
}
.cat-pagination-right .form-control {
    padding: 4px 25px 4px 10px;
    font-size: 14px;
    margin: 0;
    height: 36px;
    background: var(--background-color);
    border-color: var(--border-color);
}
select.form-control,
.form-control {
    appearance: none;
    -o-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}
.form-control:focus{
    border-color: var(--border-color);
}
.select-filter-show::after,
.select-filter-sort::after {
    font-family: 'fontawesome';
  content: '\f0dd';
  font-size: 16px;
  position: absolute;
  right: 7px;
  top: 5px;
  pointer-events: none;
  color: currentColor;
  line-height: 1;
}
.product-grid .description,
.product-grid .pro_description {
    display: none;
}
.product-list .product-thumb .caption{
    padding: 7px 15px 10px 0;
    text-align: left;
}
.rating .fa-stack,
#tab-review .fa-stack{
    font-size: 8px;
}
.rating .fa-star-o,
#tab-review .fa-star-o,
.rating .fa-star,
#tab-review .fa-star{
  font-size: 15px;
  color: var(--g);
}

.empty_message {
    font-size: 14px;
  color: var(--text-mid);
  line-height: 1.8;
}
/* ============================================================
   BANNER PROMO 2 COLONNE
   ============================================================ */
.promo-banner {
  margin: 0; padding: var(--s8) var(--s7);
  background: var(--dark-1);
  border-top: 1px solid var(--dark-3);
  border-bottom: 1px solid var(--dark-3);
}
.promo-banner__inner {
  max-width: 1280px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
}
.promo-banner__item {
  position: relative; overflow: hidden;
  aspect-ratio: 2.2 / 1; cursor: pointer;
}
.promo-banner__item-bg {
  position: absolute; inset: 0; transition: transform .6s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
.promo-banner__item:hover .promo-banner__item-bg { transform: scale(1.04); }

.promo-banner__content {
  position: relative; z-index: 2;
  padding: var(--s7); height: 100%;
  display: flex; flex-direction: column; justify-content: flex-end; gap: var(--s3);
}
.promo-banner__item:nth-child(2) .promo-banner__content { align-items: flex-end; text-align: right; }

.promo-banner__tag {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--gold);
  display: flex; align-items: center; gap: var(--s2);
}
.promo-banner__item:nth-child(2) .promo-banner__tag { flex-direction: row-reverse; }
.promo-banner__tag::before {
  content: ''; width: 18px; height: 1px; background: var(--gold);
}

.promo-banner__title {
  font-family: var(--font-display); font-size: clamp(1.3rem, 2.5vw, 2rem);
  font-weight: 600; color: var(--text-hi); line-height: 1.2;
}

.promo-banner__cta > a {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--text-mid);
  display: flex; align-items: center; gap: var(--s2);
  transition: color .2s;
}
.promo-banner__item:hover .promo-banner__cta { color: var(--gold); }
.promo-banner__item:nth-child(2) .promo-banner__cta { flex-direction: row-reverse; }
.promo-banner__cta > a::after {
  content: '→'; transition: transform .2s;
}
.promo-banner__item:hover .promo-banner__cta > a::after { transform: translateX(4px); }

.promo-banner__item:nth-child(2) .promo-banner__cta > a::after {
  content: '';
}
.promo-banner__item:nth-child(2) .promo-banner__cta > a::before {
  content: '←'; transition: transform .2s;
}
.promo-banner__item:nth-child(2):hover .promo-banner__cta > a::before { transform: translateX(-4px); }

.promo-banner__item::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: .6;
  pointer-events: none;
}
.promo-banner__item:nth-child(1)::after {
  background: linear-gradient(110deg, rgba(10,8,6,.9) 0%, rgba(10,8,6,.5) 60%, rgba(10,8,6,.2) 100%), radial-gradient(ellipse at 80% 50%, #3a2e18 0%, #1a1408 70%);
}
.promo-banner__item:nth-child(2)::after {
  background: linear-gradient(110deg, rgba(10,8,6,.9) 0%, rgba(10,8,6,.5) 60%, rgba(10,8,6,.2) 100%), radial-gradient(ellipse at 80% 50%, #3a2e18 0%, #1a1408 70%);
}

/* ============================================================
   FEATURES — 4 PILLARS
   ============================================================ */
.features {
  background: var(--dark-1);
  border-bottom: 1px solid var(--dark-3);
}
.features__inner {
  max-width: 1280px; margin: 0 auto;
  padding: var(--s7) var(--s7);
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--dark-3);
}
.feature-item {
  background: var(--dark-1);
  padding: var(--s7) var(--s6);
  display: flex; flex-direction: column; gap: var(--s4);
  position: relative; overflow: hidden;
  transition: background .3s;
}
.feature-item:hover { background: var(--dark-2); }
.feature-item::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 2px; background: var(--gold);
  transform: scaleX(0); transform-origin: left; transition: transform .4s ease;
}
.feature-item:hover::before { transform: scaleX(1); }

.feature-item__icon {
  width: 40px; height: 40px;
  border: 1px solid var(--dark-4); border-radius: 2px;
  display: flex; align-items: center; justify-content: center;
  color: var(--gold); transition: border-color .3s;
}
.feature-item:hover .feature-item__icon { border-color: var(--border); }

.feature-item__title {
  font-family: var(--font-ui); font-size: 12px; font-weight: 500;
  letter-spacing: 2px; text-transform: uppercase; color: var(--text-hi);
}
.feature-item__desc {
  font-size: 13px; color: var(--text-mid); line-height: 1.6;
}

/* ── PAGINAZIONE ────────────────────────────────────── */
.pro_pagination {
    font-size: 14px;
    clear: both;
    background: var(--background-color);
    padding: 12px 5px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.pro_pagination .text-left {
    line-height: 36px;
    float: left;
    font-size: 16px;

}
.pagination {
    padding: 0;
    margin: 0;
    vertical-align: top;
}
.pro_pagination .pagination > li.active > span,
.pagination>li>a:focus,
.pagination>li>a:hover,
.pagination>li>span:focus,
.pagination>li>span:hover {
    cursor: pointer;
    z-index: 2;
}
.pagination>li>a,
.pagination>li>span {
    color: var(--primary-color);
    background-
    float: left;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    padding: 0;
    position: relative;
    text-decoration: none;
    border: none;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-size: 16px;
    box-shadow: none;
}
.pagination>li+li>a,
.pagination>li+li>span{
    margin: 0 0 0 10px;
}


/* ══════════════════════════════════════════════════════
   §9 — PAGINA PRODOTTO
   ══════════════════════════════════════════════════════ */
.thumbnails {
    overflow: auto;
    clear: both;
    list-style: none;
    padding: 0;
    margin: 0;
}
a.thumbnail {
    padding: 0;
    border: none;
    margin: 0;
    background-color: rgba(0,0,0,0);
  width: 100%;
}
.pro-image img {
    width: 100%;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
#product-page .product-additional {
    text-align: center;
    position: relative;
}
.quickview-container .pro-image,
#product-page .pro-image {
    margin: 0 0 20px 0;
}
#additional-carousel .image-additional a,
#quick-carousel .image-additional a {
    margin: 0 10px;
    display: block;
}
#additional-carousel{
    margin: 0 auto;
    position: relative;
    display: block;
    vertical-align: top;
    width: calc(100% - 32.5%);
}
#additional-carousel.owl-carousel.owl-theme .owl-nav{
    position: unset;
    top: unset;
    left: unset;
    right: unset;
}
#additional-carousel.owl-carousel.owl-theme .owl-nav .owl-prev:before,
#additional-carousel.owl-carousel.owl-theme .owl-nav .owl-next:before{
    display: none;
}
#additional-carousel .owl-nav > div,
#quick-carousel .owl-nav div {
    border: none;
    width: 25px;
    top: 0;
    bottom: 0;
    position: absolute;
    margin: auto;
    height: fit-content;
    background: transparent;
}
#additional-carousel .owl-nav > div i,
#quick-carousel.owl-carousel.owl-theme .owl-nav > div i {
    font-size: 0;
    color: var(--primary-color);
}
#additional-carousel .owl-nav .owl-prev {
    left: -20px;
    right: auto;
}
#additional-carousel .owl-nav .owl-next {
    right: -20px;
    left: auto;
}
#additional-carousel .owl-nav .owl-prev .fa,
#quick-carousel .owl-nav .owl-prev .fa {
    background-position: 39px -52px;
}
#additional-carousel .owl-nav .owl-prev:hover .fa,
#quick-carousel .owl-nav .owl-prev:hover .fa {
    background-position: 39px 129px;
}
#additional-carousel .owl-nav .owl-next .fa,
#quick-carousel .owl-nav .owl-next .fa {
    background-position: -15px -52px;
}
#additional-carousel .owl-nav .owl-next:hover .fa,
#quick-carousel .owl-nav .owl-next:hover .fa {
    background-position: -15px 129px;
}
#quick-carousel .owl-nav div::before,
#quick-carousel .owl-nav div::after{
    display: none;
}
#quick-carousel {
    padding: 0 40px;
    margin-bottom: 20px;
}
#quick-carousel.owl-carousel.owl-theme .owl-nav {
    position: unset;
    margin: 0;
}
#quick-carousel .owl-nav div:hover {
    color: var(--primary-hover-color);
}
#quick-carousel .owl-nav .owl-prev {
    left: 20px;
    right: auto;
}
#quick-carousel .owl-nav .owl-next {
    right: 20px;
    left: auto;
}
.right_info h1,
.quick-product-right h1 {
    font-size: 24px;
    text-transform: capitalize;
    margin: 0 0 18px;
    font-weight: 500;
}
.right-info-inner{
    padding: 7px 0 0;
}
.rating .product-rating {
    float: left;
    margin-right: 20px;
}
.rating .write-review {
    padding: 0 0 0 15px;
    margin: 0 0 0 15px;
    position: relative;
}
.rating .reviews,
.rating .write-review{
    font-size: 16px;
    color: var(--secondary-light-color);
}
.pro-deatil .rating .write-review:before {
    content: "";
    background: var(--border-color);
    height: 14px;
    width: 1px;
    position: absolute;
    left: 0;
    margin: auto;
    top: 0;
    bottom: 0;
}
.rating .reviews:hover,
.rating .write-review:hover,
.rating .write-review:hover .fa-pencil{
    color: var(--primary-hover-color);
}
.rating .fa-pencil {
    padding-right: 5px;

}
.right_info .disc {

    margin-right: 5px;
    line-height: 27px;
    min-width: 125px;
    font-size: 16px;
    display: inline-block;
}
.right_info .disc1 {
    color: var(--secondary-light-color);
    margin-right: 10px;
    font-size: 16px;
}
.pro_price {
    font-size: 24px;
    display: inline-block;
    font-weight: 600;

}
.pro_oldprice {
    color: var(--secondary-light-color);
    margin-left: 10px;
    font-size: 16px;
    text-decoration: line-through;
}
.right_info .tax {
    margin: 7px 0 5px;
    color: var(--secondary-light-color);
}
.product-options h3 {
    font-size: 18px;
    text-transform: capitalize;
    font-weight: 500;
}
.right_info .control-label {
    font-size: 16px;
    font-weight: 500;
    line-height: 25px;
    text-transform: capitalize;
    margin: 0 20px 0 0;
    display: inline-block;
}
.right_info .checkbox,
.right_info .radio {
    margin-top: 0;
}
.product-options .alert {
    margin-top: 15px;
}
.product-btn-quantity .minus-plus{
    margin: 0 15px 0 0;
    display: inline-flex;
    background: transparent;
    border: 1px solid var(--border-color);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
#product .minus-plus > * {
    text-align: center;
    border: none;
    background: transparent;
    padding: 0 5px;
    border-radius: 0;
    height: 40px;
    width: 40px;
}
#product .minus-plus > button:hover{
    color: var(--primary-hover-color);
}
.product-btn-quantity #input-quantity{
    width: 42px;
    border: none;
}
#product .btn-groups {
    display: inline-block;
    vertical-align: top;
}
#button-cart,
#quick-cart{
    display: flex;
    align-items: center;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    margin: 0 10px 0 0;
}
.pro_wish,
.pro_comper{
    text-align: center;
    background: transparent;
    border: none;
    display: inline-block;
    vertical-align: middle;

}
.pro_wish:hover,
.pro_comper:hover {
    color: var(--primary-hover-color);
    border-color: var(--primary-hover-color);
}
.pro_wish i,
.pro_comper i {
    font-size: 18px;
    margin: 0 10px 0 0;
    display: inline-block;
    vertical-align: middle;
}
#product .product-btn-quantity {
    display: flex;
    align-items: center;
}
.tab-content #tab-description {
    font-size: 16px;
}
.propage-tab h2 {
    font-size: 18px;
    margin: 25px 0 15px 0;
}
#form-review.form-horizontal .control-label {
    padding: 0;
}

.quickview-actions {
  display: flex;
  flex-flow: wrap;
  gap: 15px;
}
.quickview-wrapper-inner.container {
    width: auto;
}
#button-upload222 {
    margin-left: 10px;
}
.related-products-block{
    clear: both;
    padding-top: 50px;
}
.propage-tab {
    margin-top: 80px;
    background: var(--background-color);
}
#product-page .nav-tabs {
    display: flex;
    justify-content: center;
    border: none;

}
#product-page .tab-content {
    padding: 30px;
    color: var(--secondary-light-color);
}
#product-page .tab-content strong {
    font-weight: 500;
    text-transform: capitalize;
}
#product-page .nav-tabs li {
    margin: 0 25px;
}
#product-page .nav-tabs>li> a{
    padding: 15px 0;
    line-height: 20px;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
}
.nav-tabs>li> a {
    text-transform: capitalize;
    padding: 12px 25px;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    border: none;
    margin: 0;

}
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover,
.nav-tabs>li>a:hover,
.nav>li>a:focus,
.nav>li>a:hover{
    background: transparent;

    border: none;
}
#product-page .nav-tabs>li> a:after {
    content: "";
    height: 2px;
    width: 0;
    background: var(--secondary-color);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
#product-page .nav-tabs>li> a:hover:after,
#product-page .nav-tabs>li.active> a:after {
    width: 50%;
}


/* ── CONTATTI ───────────────────────────────────────── */
.information-contact .contact-left .title i.fa {

    border: none;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    color: var(--primary-color);
    font-size: 16px;
    height: 35px;
    margin: 0px 10px 10px 0;
    padding: 9px;
    text-align: center;
    width: 35px;
}
.information-contact .contact-left .title{
    font-size: 16px;
}
.content-address{
    margin-bottom: 15px;
}
.contact-left .btn-info i {
    font-size: 16px;
}
.content-details {
    padding: 15px;
    color: var(--secondary-light-color);
    background: var(--background-color);
}
.contact-left .content-details > div{
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--border-color);
}
.contact-left .content-details .comment-info{
    border: none;
    padding:0;
    margin: 0px;
}
#information-contact .panel-body .col-sm-3 {
    float: left;
    width: 100%;
    padding: 15px;
    line-height: 25px;
}
.contact-title {
    margin: 0 0 20px 0;
    font-size: 20px;
}


/* ── CHECKOUT / CART ────────────────────────────────── */
#accordion .panel-heading h4.panel-title a i.fa-caret-down {
    float: right;
}
#accordion.panel-group .panel {
    border-radius: 0;
    border: none;
    background: var(--background-color);
    box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.1);
}
#accordion.panel-group .panel+.panel {
    margin-top: 15px;
}
#accordion.panel-group .panel-default>.panel-heading {

    padding: 14px 15px;
    border: none;
    border-radius: 0;
}
#accordion h4.panel-title,
#accordion .panel-title a {

}
.checkout-cart .input-group.btn-block .form-control {
    min-width: 45px;
    text-align: center;
    padding: 6px;
}
.checkout .input-group .form-control {
    z-index: 1;
    background: transparent;
}
.panel-group .panel-heading+.panel-collapse>.list-group,
.panel-group .panel-heading+.panel-collapse>.panel-body{
    border-top: none;
}


/* ══════════════════════════════════════════════════════
   §16 — ALTRE PAGINE  (account, search, compare...)
   ══════════════════════════════════════════════════════ */
#button-search {
    margin: 0 0 20px 0;
}
h3.search-criteria {
    font-size: 17px;
}
#product-search #input-search {
    margin-bottom: 10px;
}
.table-bordered {
  border: 1px solid var(--d3);
  background: var(--d2);
  font-size: 12px;
  color: var(--t3);
  line-height: 1.55;
  margin-top: 5px;
}
.table-bordered>tbody>tr>td,
.table-bordered>tbody>tr>th,
.table-bordered>tfoot>tr>td,
.table-bordered>tfoot>tr>th,
.table-bordered>thead>tr>td,
.table-bordered>thead>tr>th{
    border: 1px solid var(--d3)
}

/* manufacture page */
.manufactures_list {
    font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t3);
}
.manufactures_list .btn-default {
  padding: 10px;
  background: rgba(0,0,0,0);
  color: var(--t3);
}
.manufactures_list .btn-default:hover {
  color: var(--t2);
}

#product-manufacturer #content p> a {
    color: var(--primary-hover-color);
}
.manufacturer-list {
    margin-bottom: 20px;
    padding: 5px;
    background: var(--background-color);
}
.manufacturer-heading {
    background: var(--primary-color);
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 5px;
    padding: 5px 8px;
}

.manufacturer_title {
  color: var(--gold);
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 2vw, 3rem) !important;
  font-weight: 600;
  line-height: 1.2;
}

.manufacturer_link figure {
  border: none;
  padding: 10px;
  background: transparent;
}

.manufacturer_link figure > img {
  filter: brightness(0) invert(1) opacity(.18);
  max-height: 55px;
  width: auto;
  margin: 0 auto;
  transition: filter .3s;
}

.manufacturer-content {
    padding: 8px;
}

.search_form_box {
  display: flex;
  gap: 2rem;
}
.search_form_box > div:first-child {
  flex: 1 1 200px;
}

/*account*/
#account-account .account-list-content {
    margin-bottom: 20px;
}
#account-account .account-list-content:last-child {
    margin-bottom: 0;
}
.well {
    padding: 19px;
    border-radius: 5px;
    border: none;
    background: var(--background-color);
}
.well h2 {
    margin: 0px;
    padding-bottom: 10px;
    font-size: 18px;
    font-weight: 500;
}
.well strong {
    font-weight: 500;
}
.account-list-heading {
    font-size: 18px;
    margin: 0 0 10px;
}
.account-list-content li a {
    color: var(--secondary-light-color);
    padding: 3px 0;
    display: inline-block;
    font-size: 15px;
}
.account-list-content li a:hover{
    color: var(--primary-hover-color);
}

/*sitemap*/
#information-sitemap #content .row li > a {
    padding: 5px 0;
    display: inline-block;
}

/*compare*/
#product-compare .table {
    display: inherit;
    overflow: auto;
}
.product-compare .btn-primary {
    margin: 5px 0 5px;
}
#product-compare .table>tbody+tbody {
    border-top: 1px solid #ddd;
}

/*checkout*/
#checkout-cart .img-thumbnail {
    padding: 0;
    border-radius: 0;
}

/*about us*/
#information-information #content .about-us {
    padding: 20px 5px;
    background: var(--background-color);
}
.about-us img{
    width: 100%;
}
.about-us h3 {
    font-family: var(--font-display);
  font-size: clamp(2.6rem, 4.5vw, 3.8rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--g);
  margin: 0 0 20px 0;
}
.about-us h4 {
    font-size: 16px;
    color: var(--primary-hover-color);
    margin: 15px 0;
    font-weight: 400;
}
.about-us p{
    line-height: 1.8;
  color: var(--text-mid);
  font-size: 14px;
}

.about-us ol, .about-us ul {
  margin-top: 0;
  margin-bottom: 10px;
  padding-left: 30px;
  list-style: none;
}

.about-us ul > li {
  position: relative;
}
.about-us ul > li::before {
  content: '';
  width: 5px;
  height: 5px;
  background: var(--text-lo);
  transform: rotate(45deg);
  display: block;
  position: absolute;
  top: 12px;
  left: -16px;
}

/* ══════════════════════════════════════════════════════
   §17 — UTILITY CLASSI  (mt-*, helpers, common)
   ══════════════════════════════════════════════════════ */
.mt-110{
    margin-top: 110px;
}
.mt-80{
    margin-top: 80px;
}
.mt-60{
    margin-top: 60px;
}
.mt-50{
    margin-top: 50px;
}
.mt-40{
    margin-top: 40px;
}
.mt-30{
    margin-top: 30px;
}
.mt-20{
    margin-top: 20px;
}
.img-thumbnail {
    border: none;
    padding: 0;
}
#content {
    min-height: 600px;
}
.common-home #content {
    min-height: unset;
}
#content > h3 {
    margin-top: 0;
    font-size: 18px;
}
.relative {
    position: relative;
}
.m-auto {
    margin: 0px auto;
}
.m-image-auto {
    width: auto;
}
ul.list-unstyled{
    margin: 0;
}
.owl-carousel {
    touch-action: manipulation;
}
.dropdown-menu {
    background: var(--primary-color);
    z-index: 1001;
    margin: 0;
    border-radius: 0;
    border: none;
    box-shadow: 0 0 10px 1px rgba(0,0,0,0.1);
}
.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
    background-color: transparent;
}
.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
    padding: 10px 15px;
    vertical-align: middle;

}
.table-bordered>thead>tr>td,
.table-bordered>thead>tr>th {
    font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--text-lo);
  padding: var(--s4) var(--s5);
  border-bottom: 1px solid var(--dark-3);
  background: var(--dark-1);
}
.table>tbody>tr>td {
    border-top: none;
}
.table > tbody > tr > td:first-child {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--text-mid);
  background: var(--dark-2);
}
.table > tbody > tr > td:last-child {
  color: var(--text-hi);
}

.table_product_name {
      font-family: var(--font-display);
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--text-hi);
  line-height: 1.3;
}
.table_product_price {
    font-family: var(--font-ui);
  font-size: 1.6rem;
  letter-spacing: 1px;
  color: var(--gold);
}

.form-group {
    margin-bottom: 20px;
}
.form-control {
    display: block;
    width: 100%;
    height: 40px;
    padding: 6px 15px;
    font-size: 14px;
    line-height: 20px;
    color: var(--secondary-light-color);
    background: var(--primary-color);
    background-color: var(--primary-color);
    background-image: none;
    border: 1px solid var(--border-color);
    box-shadow: none;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
select.form-control option, .form-control option {

}

/* fixed mobile cart quantity input */
.input-group .form-control[name^=quantity] {
    min-width: 44px;
}


/* mahardhi */


/* ══════════════════════════════════════════════════════
   §18 — HOME GRID BANNER
   ══════════════════════════════════════════════════════ */
.home-grid-banner {
  margin: 120px 0;
}

.grid-banner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--background-color);
}

/* LEFT */
.grid-left {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
}

/* GENERIC */
.grid-tile,
.grid-right {
  position: relative;
  overflow: hidden;
  display: flex;
  align-content: center;
  justify-content: center;
}

.grid-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: grayscale(1);
  transition: all 500ms cubic-bezier(.725,.24,.75,.75);
}
.grid-banner img:hover {
  filter: grayscale(0);
}

/* HTML BOX EXAMPLE */
.promo-box,
.hero-box {
  height: 100%;
  background: #111;
  color: #fff;
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hero-box {
  background: #000;
}

/* RESPONSIVE */


.service-boxes{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:stretch;
  margin: 0 24px 80px;
}

.service-box{
  flex: 1 1 220px;
  max-width: 320px;
  text-align:center;
}

.service-box__link{
  display:block;
  text-decoration:none;
  color:inherit;
}

.service-box__media{
  margin-bottom:10px;
}

.service-box__media i{
  font-size:36px;
  line-height:1;
}

.service-box__media img{
  max-width:80px;
  height:auto;
  display:inline-block;
}

.service-box__title{
  margin:0 0 6px 0;
  font-weight:600;
}

.service-box__text{
  margin:0;
  opacity:.85;
}


/* ================================================================
   ANIMATE.CSS — non modificare
   ================================================================ */

@charset "UTF-8";

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.7.0
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2018 Daniel Eden
 */

@-webkit-keyframes bounce {
	0%,
	20%,
	53%,
	80%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		-webkit-transform: translateZ(0);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		transform: translateZ(0)
	}
	40%,
	43% {
		-webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
		-webkit-transform: translate3d(0, -30px, 0);
		animation-timing-function: cubic-bezier(.755, .05, .855, .06);
		transform: translate3d(0, -30px, 0)
	}
	70% {
		-webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
		-webkit-transform: translate3d(0, -15px, 0);
		animation-timing-function: cubic-bezier(.755, .05, .855, .06);
		transform: translate3d(0, -15px, 0)
	}
	90% {
		-webkit-transform: translate3d(0, -4px, 0);
		transform: translate3d(0, -4px, 0)
	}
}

@keyframes bounce {
	0%,
	20%,
	53%,
	80%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		-webkit-transform: translateZ(0);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		transform: translateZ(0)
	}
	40%,
	43% {
		-webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
		-webkit-transform: translate3d(0, -30px, 0);
		animation-timing-function: cubic-bezier(.755, .05, .855, .06);
		transform: translate3d(0, -30px, 0)
	}
	70% {
		-webkit-animation-timing-function: cubic-bezier(.755, .05, .855, .06);
		-webkit-transform: translate3d(0, -15px, 0);
		animation-timing-function: cubic-bezier(.755, .05, .855, .06);
		transform: translate3d(0, -15px, 0)
	}
	90% {
		-webkit-transform: translate3d(0, -4px, 0);
		transform: translate3d(0, -4px, 0)
	}
}

.bounce {
	-webkit-animation-name: bounce;
	-webkit-transform-origin: center bottom;
	animation-name: bounce;
	transform-origin: center bottom
}

@-webkit-keyframes flash {
	0%,
	50%,
	to {
		opacity: 1
	}
	25%,
	75% {
		opacity: 0
	}
}

@keyframes flash {
	0%,
	50%,
	to {
		opacity: 1
	}
	25%,
	75% {
		opacity: 0
	}
}

.flash {
	-webkit-animation-name: flash;
	animation-name: flash
}

@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	50% {
		-webkit-transform: scale3d(1.05, 1.05, 1.05);
		transform: scale3d(1.05, 1.05, 1.05)
	}
	to {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}

@keyframes pulse {
	0% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	50% {
		-webkit-transform: scale3d(1.05, 1.05, 1.05);
		transform: scale3d(1.05, 1.05, 1.05)
	}
	to {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}

.pulse {
	-webkit-animation-name: pulse;
	animation-name: pulse
}

@-webkit-keyframes rubberBand {
	0% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	30% {
		-webkit-transform: scale3d(1.25, .75, 1);
		transform: scale3d(1.25, .75, 1)
	}
	40% {
		-webkit-transform: scale3d(.75, 1.25, 1);
		transform: scale3d(.75, 1.25, 1)
	}
	50% {
		-webkit-transform: scale3d(1.15, .85, 1);
		transform: scale3d(1.15, .85, 1)
	}
	65% {
		-webkit-transform: scale3d(.95, 1.05, 1);
		transform: scale3d(.95, 1.05, 1)
	}
	75% {
		-webkit-transform: scale3d(1.05, .95, 1);
		transform: scale3d(1.05, .95, 1)
	}
	to {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}

@keyframes rubberBand {
	0% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	30% {
		-webkit-transform: scale3d(1.25, .75, 1);
		transform: scale3d(1.25, .75, 1)
	}
	40% {
		-webkit-transform: scale3d(.75, 1.25, 1);
		transform: scale3d(.75, 1.25, 1)
	}
	50% {
		-webkit-transform: scale3d(1.15, .85, 1);
		transform: scale3d(1.15, .85, 1)
	}
	65% {
		-webkit-transform: scale3d(.95, 1.05, 1);
		transform: scale3d(.95, 1.05, 1)
	}
	75% {
		-webkit-transform: scale3d(1.05, .95, 1);
		transform: scale3d(1.05, .95, 1)
	}
	to {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}

.rubberBand {
	-webkit-animation-name: rubberBand;
	animation-name: rubberBand
}

@-webkit-keyframes shake {
	0%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	10%,
	30%,
	50%,
	70%,
	90% {
		-webkit-transform: translate3d(-10px, 0, 0);
		transform: translate3d(-10px, 0, 0)
	}
	20%,
	40%,
	60%,
	80% {
		-webkit-transform: translate3d(10px, 0, 0);
		transform: translate3d(10px, 0, 0)
	}
}

@keyframes shake {
	0%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	10%,
	30%,
	50%,
	70%,
	90% {
		-webkit-transform: translate3d(-10px, 0, 0);
		transform: translate3d(-10px, 0, 0)
	}
	20%,
	40%,
	60%,
	80% {
		-webkit-transform: translate3d(10px, 0, 0);
		transform: translate3d(10px, 0, 0)
	}
}

.shake {
	-webkit-animation-name: shake;
	animation-name: shake
}

@-webkit-keyframes headShake {
	0% {
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
	6.5% {
		-webkit-transform: translateX(-6px) rotateY(-9deg);
		transform: translateX(-6px) rotateY(-9deg)
	}
	18.5% {
		-webkit-transform: translateX(5px) rotateY(7deg);
		transform: translateX(5px) rotateY(7deg)
	}
	31.5% {
		-webkit-transform: translateX(-3px) rotateY(-5deg);
		transform: translateX(-3px) rotateY(-5deg)
	}
	43.5% {
		-webkit-transform: translateX(2px) rotateY(3deg);
		transform: translateX(2px) rotateY(3deg)
	}
	50% {
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
}

@keyframes headShake {
	0% {
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
	6.5% {
		-webkit-transform: translateX(-6px) rotateY(-9deg);
		transform: translateX(-6px) rotateY(-9deg)
	}
	18.5% {
		-webkit-transform: translateX(5px) rotateY(7deg);
		transform: translateX(5px) rotateY(7deg)
	}
	31.5% {
		-webkit-transform: translateX(-3px) rotateY(-5deg);
		transform: translateX(-3px) rotateY(-5deg)
	}
	43.5% {
		-webkit-transform: translateX(2px) rotateY(3deg);
		transform: translateX(2px) rotateY(3deg)
	}
	50% {
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
}

.headShake {
	-webkit-animation-name: headShake;
	-webkit-animation-timing-function: ease-in-out;
	animation-name: headShake;
	animation-timing-function: ease-in-out
}

@-webkit-keyframes swing {
	20% {
		-webkit-transform: rotate(15deg);
		transform: rotate(15deg)
	}
	40% {
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg)
	}
	60% {
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg)
	}
	80% {
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg)
	}
	to {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
}

@keyframes swing {
	20% {
		-webkit-transform: rotate(15deg);
		transform: rotate(15deg)
	}
	40% {
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg)
	}
	60% {
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg)
	}
	80% {
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg)
	}
	to {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
}

.swing {
	-webkit-animation-name: swing;
	-webkit-transform-origin: top center;
	animation-name: swing;
	transform-origin: top center
}

@-webkit-keyframes tada {
	0% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	10%,
	20% {
		-webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
		transform: scale3d(.9, .9, .9) rotate(-3deg)
	}
	30%,
	50%,
	70%,
	90% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
	}
	40%,
	60%,
	80% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
	}
	to {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}

@keyframes tada {
	0% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
	10%,
	20% {
		-webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
		transform: scale3d(.9, .9, .9) rotate(-3deg)
	}
	30%,
	50%,
	70%,
	90% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
	}
	40%,
	60%,
	80% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
		transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
	}
	to {
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}

.tada {
	-webkit-animation-name: tada;
	animation-name: tada
}

@-webkit-keyframes wobble {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	15% {
		-webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
		transform: translate3d(-25%, 0, 0) rotate(-5deg)
	}
	30% {
		-webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
		transform: translate3d(20%, 0, 0) rotate(3deg)
	}
	45% {
		-webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
		transform: translate3d(-15%, 0, 0) rotate(-3deg)
	}
	60% {
		-webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
		transform: translate3d(10%, 0, 0) rotate(2deg)
	}
	75% {
		-webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
		transform: translate3d(-5%, 0, 0) rotate(-1deg)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes wobble {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	15% {
		-webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg);
		transform: translate3d(-25%, 0, 0) rotate(-5deg)
	}
	30% {
		-webkit-transform: translate3d(20%, 0, 0) rotate(3deg);
		transform: translate3d(20%, 0, 0) rotate(3deg)
	}
	45% {
		-webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg);
		transform: translate3d(-15%, 0, 0) rotate(-3deg)
	}
	60% {
		-webkit-transform: translate3d(10%, 0, 0) rotate(2deg);
		transform: translate3d(10%, 0, 0) rotate(2deg)
	}
	75% {
		-webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg);
		transform: translate3d(-5%, 0, 0) rotate(-1deg)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.wobble {
	-webkit-animation-name: wobble;
	animation-name: wobble
}

@-webkit-keyframes jello {
	0%,
	11.1%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	22.2% {
		-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
		transform: skewX(-12.5deg) skewY(-12.5deg)
	}
	33.3% {
		-webkit-transform: skewX(6.25deg) skewY(6.25deg);
		transform: skewX(6.25deg) skewY(6.25deg)
	}
	44.4% {
		-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
		transform: skewX(-3.125deg) skewY(-3.125deg)
	}
	55.5% {
		-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
		transform: skewX(1.5625deg) skewY(1.5625deg)
	}
	66.6% {
		-webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
		transform: skewX(-.78125deg) skewY(-.78125deg)
	}
	77.7% {
		-webkit-transform: skewX(.390625deg) skewY(.390625deg);
		transform: skewX(.390625deg) skewY(.390625deg)
	}
	88.8% {
		-webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
		transform: skewX(-.1953125deg) skewY(-.1953125deg)
	}
}

@keyframes jello {
	0%,
	11.1%,
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	22.2% {
		-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
		transform: skewX(-12.5deg) skewY(-12.5deg)
	}
	33.3% {
		-webkit-transform: skewX(6.25deg) skewY(6.25deg);
		transform: skewX(6.25deg) skewY(6.25deg)
	}
	44.4% {
		-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
		transform: skewX(-3.125deg) skewY(-3.125deg)
	}
	55.5% {
		-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
		transform: skewX(1.5625deg) skewY(1.5625deg)
	}
	66.6% {
		-webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
		transform: skewX(-.78125deg) skewY(-.78125deg)
	}
	77.7% {
		-webkit-transform: skewX(.390625deg) skewY(.390625deg);
		transform: skewX(.390625deg) skewY(.390625deg)
	}
	88.8% {
		-webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
		transform: skewX(-.1953125deg) skewY(-.1953125deg)
	}
}

.jello {
	-webkit-animation-name: jello;
	-webkit-transform-origin: center;
	animation-name: jello;
	transform-origin: center
}

@-webkit-keyframes heartBeat {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	14% {
		-webkit-transform: scale(1.3);
		transform: scale(1.3)
	}
	28% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	42% {
		-webkit-transform: scale(1.3);
		transform: scale(1.3)
	}
	70% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

@keyframes heartBeat {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	14% {
		-webkit-transform: scale(1.3);
		transform: scale(1.3)
	}
	28% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	42% {
		-webkit-transform: scale(1.3);
		transform: scale(1.3)
	}
	70% {
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}

.heartBeat {
	-webkit-animation-duration: 1.3s;
	-webkit-animation-name: heartBeat;
	-webkit-animation-timing-function: ease-in-out;
	animation-duration: 1.3s;
	animation-name: heartBeat;
	animation-timing-function: ease-in-out
}

@-webkit-keyframes bounceIn {
	0%,
	20%,
	40%,
	60%,
	80%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: scale3d(.3, .3, .3);
		opacity: 0;
		transform: scale3d(.3, .3, .3)
	}
	20% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1);
		transform: scale3d(1.1, 1.1, 1.1)
	}
	40% {
		-webkit-transform: scale3d(.9, .9, .9);
		transform: scale3d(.9, .9, .9)
	}
	60% {
		-webkit-transform: scale3d(1.03, 1.03, 1.03);
		opacity: 1;
		transform: scale3d(1.03, 1.03, 1.03)
	}
	80% {
		-webkit-transform: scale3d(.97, .97, .97);
		transform: scale3d(.97, .97, .97)
	}
	to {
		-webkit-transform: scaleX(1);
		opacity: 1;
		transform: scaleX(1)
	}
}

@keyframes bounceIn {
	0%,
	20%,
	40%,
	60%,
	80%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: scale3d(.3, .3, .3);
		opacity: 0;
		transform: scale3d(.3, .3, .3)
	}
	20% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1);
		transform: scale3d(1.1, 1.1, 1.1)
	}
	40% {
		-webkit-transform: scale3d(.9, .9, .9);
		transform: scale3d(.9, .9, .9)
	}
	60% {
		-webkit-transform: scale3d(1.03, 1.03, 1.03);
		opacity: 1;
		transform: scale3d(1.03, 1.03, 1.03)
	}
	80% {
		-webkit-transform: scale3d(.97, .97, .97);
		transform: scale3d(.97, .97, .97)
	}
	to {
		-webkit-transform: scaleX(1);
		opacity: 1;
		transform: scaleX(1)
	}
}

.bounceIn {
	-webkit-animation-duration: .75s;
	-webkit-animation-name: bounceIn;
	animation-duration: .75s;
	animation-name: bounceIn
}

@-webkit-keyframes bounceInDown {
	0%,
	60%,
	75%,
	90%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: translate3d(0, -3000px, 0);
		opacity: 0;
		transform: translate3d(0, -3000px, 0)
	}
	60% {
		-webkit-transform: translate3d(0, 25px, 0);
		opacity: 1;
		transform: translate3d(0, 25px, 0)
	}
	75% {
		-webkit-transform: translate3d(0, -10px, 0);
		transform: translate3d(0, -10px, 0)
	}
	90% {
		-webkit-transform: translate3d(0, 5px, 0);
		transform: translate3d(0, 5px, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes bounceInDown {
	0%,
	60%,
	75%,
	90%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: translate3d(0, -3000px, 0);
		opacity: 0;
		transform: translate3d(0, -3000px, 0)
	}
	60% {
		-webkit-transform: translate3d(0, 25px, 0);
		opacity: 1;
		transform: translate3d(0, 25px, 0)
	}
	75% {
		-webkit-transform: translate3d(0, -10px, 0);
		transform: translate3d(0, -10px, 0)
	}
	90% {
		-webkit-transform: translate3d(0, 5px, 0);
		transform: translate3d(0, 5px, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.bounceInDown {
	-webkit-animation-name: bounceInDown;
	animation-name: bounceInDown
}

@-webkit-keyframes bounceInLeft {
	0%,
	60%,
	75%,
	90%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: translate3d(-3000px, 0, 0);
		opacity: 0;
		transform: translate3d(-3000px, 0, 0)
	}
	60% {
		-webkit-transform: translate3d(25px, 0, 0);
		opacity: 1;
		transform: translate3d(25px, 0, 0)
	}
	75% {
		-webkit-transform: translate3d(-10px, 0, 0);
		transform: translate3d(-10px, 0, 0)
	}
	90% {
		-webkit-transform: translate3d(5px, 0, 0);
		transform: translate3d(5px, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes bounceInLeft {
	0%,
	60%,
	75%,
	90%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: translate3d(-3000px, 0, 0);
		opacity: 0;
		transform: translate3d(-3000px, 0, 0)
	}
	60% {
		-webkit-transform: translate3d(25px, 0, 0);
		opacity: 1;
		transform: translate3d(25px, 0, 0)
	}
	75% {
		-webkit-transform: translate3d(-10px, 0, 0);
		transform: translate3d(-10px, 0, 0)
	}
	90% {
		-webkit-transform: translate3d(5px, 0, 0);
		transform: translate3d(5px, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.bounceInLeft {
	-webkit-animation-name: bounceInLeft;
	animation-name: bounceInLeft
}

@-webkit-keyframes bounceInRight {
	0%,
	60%,
	75%,
	90%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: translate3d(3000px, 0, 0);
		opacity: 0;
		transform: translate3d(3000px, 0, 0)
	}
	60% {
		-webkit-transform: translate3d(-25px, 0, 0);
		opacity: 1;
		transform: translate3d(-25px, 0, 0)
	}
	75% {
		-webkit-transform: translate3d(10px, 0, 0);
		transform: translate3d(10px, 0, 0)
	}
	90% {
		-webkit-transform: translate3d(-5px, 0, 0);
		transform: translate3d(-5px, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes bounceInRight {
	0%,
	60%,
	75%,
	90%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: translate3d(3000px, 0, 0);
		opacity: 0;
		transform: translate3d(3000px, 0, 0)
	}
	60% {
		-webkit-transform: translate3d(-25px, 0, 0);
		opacity: 1;
		transform: translate3d(-25px, 0, 0)
	}
	75% {
		-webkit-transform: translate3d(10px, 0, 0);
		transform: translate3d(10px, 0, 0)
	}
	90% {
		-webkit-transform: translate3d(-5px, 0, 0);
		transform: translate3d(-5px, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.bounceInRight {
	-webkit-animation-name: bounceInRight;
	animation-name: bounceInRight
}

@-webkit-keyframes bounceInUp {
	0%,
	60%,
	75%,
	90%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: translate3d(0, 3000px, 0);
		opacity: 0;
		transform: translate3d(0, 3000px, 0)
	}
	60% {
		-webkit-transform: translate3d(0, -20px, 0);
		opacity: 1;
		transform: translate3d(0, -20px, 0)
	}
	75% {
		-webkit-transform: translate3d(0, 10px, 0);
		transform: translate3d(0, 10px, 0)
	}
	90% {
		-webkit-transform: translate3d(0, -5px, 0);
		transform: translate3d(0, -5px, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes bounceInUp {
	0%,
	60%,
	75%,
	90%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		-webkit-transform: translate3d(0, 3000px, 0);
		opacity: 0;
		transform: translate3d(0, 3000px, 0)
	}
	60% {
		-webkit-transform: translate3d(0, -20px, 0);
		opacity: 1;
		transform: translate3d(0, -20px, 0)
	}
	75% {
		-webkit-transform: translate3d(0, 10px, 0);
		transform: translate3d(0, 10px, 0)
	}
	90% {
		-webkit-transform: translate3d(0, -5px, 0);
		transform: translate3d(0, -5px, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.bounceInUp {
	-webkit-animation-name: bounceInUp;
	animation-name: bounceInUp
}

@-webkit-keyframes bounceOut {
	20% {
		-webkit-transform: scale3d(.9, .9, .9);
		transform: scale3d(.9, .9, .9)
	}
	50%,
	55% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1);
		opacity: 1;
		transform: scale3d(1.1, 1.1, 1.1)
	}
	to {
		-webkit-transform: scale3d(.3, .3, .3);
		opacity: 0;
		transform: scale3d(.3, .3, .3)
	}
}

@keyframes bounceOut {
	20% {
		-webkit-transform: scale3d(.9, .9, .9);
		transform: scale3d(.9, .9, .9)
	}
	50%,
	55% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1);
		opacity: 1;
		transform: scale3d(1.1, 1.1, 1.1)
	}
	to {
		-webkit-transform: scale3d(.3, .3, .3);
		opacity: 0;
		transform: scale3d(.3, .3, .3)
	}
}

.bounceOut {
	-webkit-animation-duration: .75s;
	-webkit-animation-name: bounceOut;
	animation-duration: .75s;
	animation-name: bounceOut
}

@-webkit-keyframes bounceOutDown {
	20% {
		-webkit-transform: translate3d(0, 10px, 0);
		transform: translate3d(0, 10px, 0)
	}
	40%,
	45% {
		-webkit-transform: translate3d(0, -20px, 0);
		opacity: 1;
		transform: translate3d(0, -20px, 0)
	}
	to {
		-webkit-transform: translate3d(0, 2000px, 0);
		opacity: 0;
		transform: translate3d(0, 2000px, 0)
	}
}

@keyframes bounceOutDown {
	20% {
		-webkit-transform: translate3d(0, 10px, 0);
		transform: translate3d(0, 10px, 0)
	}
	40%,
	45% {
		-webkit-transform: translate3d(0, -20px, 0);
		opacity: 1;
		transform: translate3d(0, -20px, 0)
	}
	to {
		-webkit-transform: translate3d(0, 2000px, 0);
		opacity: 0;
		transform: translate3d(0, 2000px, 0)
	}
}

.bounceOutDown {
	-webkit-animation-name: bounceOutDown;
	animation-name: bounceOutDown
}

@-webkit-keyframes bounceOutLeft {
	20% {
		-webkit-transform: translate3d(20px, 0, 0);
		opacity: 1;
		transform: translate3d(20px, 0, 0)
	}
	to {
		-webkit-transform: translate3d(-2000px, 0, 0);
		opacity: 0;
		transform: translate3d(-2000px, 0, 0)
	}
}

@keyframes bounceOutLeft {
	20% {
		-webkit-transform: translate3d(20px, 0, 0);
		opacity: 1;
		transform: translate3d(20px, 0, 0)
	}
	to {
		-webkit-transform: translate3d(-2000px, 0, 0);
		opacity: 0;
		transform: translate3d(-2000px, 0, 0)
	}
}

.bounceOutLeft {
	-webkit-animation-name: bounceOutLeft;
	animation-name: bounceOutLeft
}

@-webkit-keyframes bounceOutRight {
	20% {
		-webkit-transform: translate3d(-20px, 0, 0);
		opacity: 1;
		transform: translate3d(-20px, 0, 0)
	}
	to {
		-webkit-transform: translate3d(2000px, 0, 0);
		opacity: 0;
		transform: translate3d(2000px, 0, 0)
	}
}

@keyframes bounceOutRight {
	20% {
		-webkit-transform: translate3d(-20px, 0, 0);
		opacity: 1;
		transform: translate3d(-20px, 0, 0)
	}
	to {
		-webkit-transform: translate3d(2000px, 0, 0);
		opacity: 0;
		transform: translate3d(2000px, 0, 0)
	}
}

.bounceOutRight {
	-webkit-animation-name: bounceOutRight;
	animation-name: bounceOutRight
}

@-webkit-keyframes bounceOutUp {
	20% {
		-webkit-transform: translate3d(0, -10px, 0);
		transform: translate3d(0, -10px, 0)
	}
	40%,
	45% {
		-webkit-transform: translate3d(0, 20px, 0);
		opacity: 1;
		transform: translate3d(0, 20px, 0)
	}
	to {
		-webkit-transform: translate3d(0, -2000px, 0);
		opacity: 0;
		transform: translate3d(0, -2000px, 0)
	}
}

@keyframes bounceOutUp {
	20% {
		-webkit-transform: translate3d(0, -10px, 0);
		transform: translate3d(0, -10px, 0)
	}
	40%,
	45% {
		-webkit-transform: translate3d(0, 20px, 0);
		opacity: 1;
		transform: translate3d(0, 20px, 0)
	}
	to {
		-webkit-transform: translate3d(0, -2000px, 0);
		opacity: 0;
		transform: translate3d(0, -2000px, 0)
	}
}

.bounceOutUp {
	-webkit-animation-name: bounceOutUp;
	animation-name: bounceOutUp
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

.fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn
}

@-webkit-keyframes fadeInDown {
	0% {
		-webkit-transform: translate3d(0, -100%, 0);
		opacity: 0;
		transform: translate3d(0, -100%, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes fadeInDown {
	0% {
		-webkit-transform: translate3d(0, -100%, 0);
		opacity: 0;
		transform: translate3d(0, -100%, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown
}

@-webkit-keyframes fadeInDownBig {
	0% {
		-webkit-transform: translate3d(0, -2000px, 0);
		opacity: 0;
		transform: translate3d(0, -2000px, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes fadeInDownBig {
	0% {
		-webkit-transform: translate3d(0, -2000px, 0);
		opacity: 0;
		transform: translate3d(0, -2000px, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.fadeInDownBig {
	-webkit-animation-name: fadeInDownBig;
	animation-name: fadeInDownBig
}

@-webkit-keyframes fadeInLeft {
	0% {
		-webkit-transform: translate3d(-100%, 0, 0);
		opacity: 0;
		transform: translate3d(-100%, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes fadeInLeft {
	0% {
		-webkit-transform: translate3d(-100%, 0, 0);
		opacity: 0;
		transform: translate3d(-100%, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.fadeInLeft {
	-webkit-animation-name: fadeInLeft;
	animation-name: fadeInLeft
}

@-webkit-keyframes fadeInLeftBig {
	0% {
		-webkit-transform: translate3d(-2000px, 0, 0);
		opacity: 0;
		transform: translate3d(-2000px, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes fadeInLeftBig {
	0% {
		-webkit-transform: translate3d(-2000px, 0, 0);
		opacity: 0;
		transform: translate3d(-2000px, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.fadeInLeftBig {
	-webkit-animation-name: fadeInLeftBig;
	animation-name: fadeInLeftBig
}

@-webkit-keyframes fadeInRight {
	0% {
		-webkit-transform: translate3d(100%, 0, 0);
		opacity: 0;
		transform: translate3d(100%, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes fadeInRight {
	0% {
		-webkit-transform: translate3d(100%, 0, 0);
		opacity: 0;
		transform: translate3d(100%, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.fadeInRight {
	-webkit-animation-name: fadeInRight;
	animation-name: fadeInRight
}

@-webkit-keyframes fadeInRightBig {
	0% {
		-webkit-transform: translate3d(2000px, 0, 0);
		opacity: 0;
		transform: translate3d(2000px, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes fadeInRightBig {
	0% {
		-webkit-transform: translate3d(2000px, 0, 0);
		opacity: 0;
		transform: translate3d(2000px, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.fadeInRightBig {
	-webkit-animation-name: fadeInRightBig;
	animation-name: fadeInRightBig
}

@-webkit-keyframes fadeInUp {
	0% {
		-webkit-transform: translate3d(0, 100%, 0);
		opacity: 0;
		transform: translate3d(0, 100%, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes fadeInUp {
	0% {
		-webkit-transform: translate3d(0, 100%, 0);
		opacity: 0;
		transform: translate3d(0, 100%, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp
}

@-webkit-keyframes fadeInUpBig {
	0% {
		-webkit-transform: translate3d(0, 2000px, 0);
		opacity: 0;
		transform: translate3d(0, 2000px, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes fadeInUpBig {
	0% {
		-webkit-transform: translate3d(0, 2000px, 0);
		opacity: 0;
		transform: translate3d(0, 2000px, 0)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.fadeInUpBig {
	-webkit-animation-name: fadeInUpBig;
	animation-name: fadeInUpBig
}

@-webkit-keyframes fadeOut {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

@keyframes fadeOut {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

.fadeOut {
	-webkit-animation-name: fadeOut;
	animation-name: fadeOut
}

@-webkit-keyframes fadeOutDown {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, 100%, 0);
		opacity: 0;
		transform: translate3d(0, 100%, 0)
	}
}

@keyframes fadeOutDown {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, 100%, 0);
		opacity: 0;
		transform: translate3d(0, 100%, 0)
	}
}

.fadeOutDown {
	-webkit-animation-name: fadeOutDown;
	animation-name: fadeOutDown
}

@-webkit-keyframes fadeOutDownBig {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, 2000px, 0);
		opacity: 0;
		transform: translate3d(0, 2000px, 0)
	}
}

@keyframes fadeOutDownBig {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, 2000px, 0);
		opacity: 0;
		transform: translate3d(0, 2000px, 0)
	}
}

.fadeOutDownBig {
	-webkit-animation-name: fadeOutDownBig;
	animation-name: fadeOutDownBig
}

@-webkit-keyframes fadeOutLeft {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(-100%, 0, 0);
		opacity: 0;
		transform: translate3d(-100%, 0, 0)
	}
}

@keyframes fadeOutLeft {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(-100%, 0, 0);
		opacity: 0;
		transform: translate3d(-100%, 0, 0)
	}
}

.fadeOutLeft {
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft
}

@-webkit-keyframes fadeOutLeftBig {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(-2000px, 0, 0);
		opacity: 0;
		transform: translate3d(-2000px, 0, 0)
	}
}

@keyframes fadeOutLeftBig {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(-2000px, 0, 0);
		opacity: 0;
		transform: translate3d(-2000px, 0, 0)
	}
}

.fadeOutLeftBig {
	-webkit-animation-name: fadeOutLeftBig;
	animation-name: fadeOutLeftBig
}

@-webkit-keyframes fadeOutRight {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0);
		opacity: 0;
		transform: translate3d(100%, 0, 0)
	}
}

@keyframes fadeOutRight {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0);
		opacity: 0;
		transform: translate3d(100%, 0, 0)
	}
}

.fadeOutRight {
	-webkit-animation-name: fadeOutRight;
	animation-name: fadeOutRight
}

@-webkit-keyframes fadeOutRightBig {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(2000px, 0, 0);
		opacity: 0;
		transform: translate3d(2000px, 0, 0)
	}
}

@keyframes fadeOutRightBig {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(2000px, 0, 0);
		opacity: 0;
		transform: translate3d(2000px, 0, 0)
	}
}

.fadeOutRightBig {
	-webkit-animation-name: fadeOutRightBig;
	animation-name: fadeOutRightBig
}

@-webkit-keyframes fadeOutUp {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, -100%, 0);
		opacity: 0;
		transform: translate3d(0, -100%, 0)
	}
}

@keyframes fadeOutUp {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, -100%, 0);
		opacity: 0;
		transform: translate3d(0, -100%, 0)
	}
}

.fadeOutUp {
	-webkit-animation-name: fadeOutUp;
	animation-name: fadeOutUp
}

@-webkit-keyframes fadeOutUpBig {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, -2000px, 0);
		opacity: 0;
		transform: translate3d(0, -2000px, 0)
	}
}

@keyframes fadeOutUpBig {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(0, -2000px, 0);
		opacity: 0;
		transform: translate3d(0, -2000px, 0)
	}
}

.fadeOutUpBig {
	-webkit-animation-name: fadeOutUpBig;
	animation-name: fadeOutUpBig
}

@-webkit-keyframes flip {
	0% {
		-webkit-animation-timing-function: ease-out;
		-webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
		animation-timing-function: ease-out;
		transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn)
	}
	40% {
		-webkit-animation-timing-function: ease-out;
		-webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
		animation-timing-function: ease-out;
		transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg)
	}
	50% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg)
	}
	80% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg)
	}
	to {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg)
	}
}

@keyframes flip {
	0% {
		-webkit-animation-timing-function: ease-out;
		-webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
		animation-timing-function: ease-out;
		transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn)
	}
	40% {
		-webkit-animation-timing-function: ease-out;
		-webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
		animation-timing-function: ease-out;
		transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg)
	}
	50% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg)
	}
	80% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg)
	}
	to {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg)
	}
}

.animated.flip {
	-webkit-animation-name: flip;
	-webkit-backface-visibility: visible;
	animation-name: flip;
	backface-visibility: visible
}

@-webkit-keyframes flipInX {
	0% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) rotateX(90deg);
		animation-timing-function: ease-in;
		opacity: 0;
		transform: perspective(400px) rotateX(90deg)
	}
	40% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) rotateX(-20deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) rotateX(-20deg)
	}
	60% {
		-webkit-transform: perspective(400px) rotateX(10deg);
		opacity: 1;
		transform: perspective(400px) rotateX(10deg)
	}
	80% {
		-webkit-transform: perspective(400px) rotateX(-5deg);
		transform: perspective(400px) rotateX(-5deg)
	}
	to {
		-webkit-transform: perspective(400px);
		transform: perspective(400px)
	}
}

@keyframes flipInX {
	0% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) rotateX(90deg);
		animation-timing-function: ease-in;
		opacity: 0;
		transform: perspective(400px) rotateX(90deg)
	}
	40% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) rotateX(-20deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) rotateX(-20deg)
	}
	60% {
		-webkit-transform: perspective(400px) rotateX(10deg);
		opacity: 1;
		transform: perspective(400px) rotateX(10deg)
	}
	80% {
		-webkit-transform: perspective(400px) rotateX(-5deg);
		transform: perspective(400px) rotateX(-5deg)
	}
	to {
		-webkit-transform: perspective(400px);
		transform: perspective(400px)
	}
}

.flipInX {
	-webkit-animation-name: flipInX;
	-webkit-backface-visibility: visible!important;
	animation-name: flipInX;
	backface-visibility: visible!important
}

@-webkit-keyframes flipInY {
	0% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) rotateY(90deg);
		animation-timing-function: ease-in;
		opacity: 0;
		transform: perspective(400px) rotateY(90deg)
	}
	40% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) rotateY(-20deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) rotateY(-20deg)
	}
	60% {
		-webkit-transform: perspective(400px) rotateY(10deg);
		opacity: 1;
		transform: perspective(400px) rotateY(10deg)
	}
	80% {
		-webkit-transform: perspective(400px) rotateY(-5deg);
		transform: perspective(400px) rotateY(-5deg)
	}
	to {
		-webkit-transform: perspective(400px);
		transform: perspective(400px)
	}
}

@keyframes flipInY {
	0% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) rotateY(90deg);
		animation-timing-function: ease-in;
		opacity: 0;
		transform: perspective(400px) rotateY(90deg)
	}
	40% {
		-webkit-animation-timing-function: ease-in;
		-webkit-transform: perspective(400px) rotateY(-20deg);
		animation-timing-function: ease-in;
		transform: perspective(400px) rotateY(-20deg)
	}
	60% {
		-webkit-transform: perspective(400px) rotateY(10deg);
		opacity: 1;
		transform: perspective(400px) rotateY(10deg)
	}
	80% {
		-webkit-transform: perspective(400px) rotateY(-5deg);
		transform: perspective(400px) rotateY(-5deg)
	}
	to {
		-webkit-transform: perspective(400px);
		transform: perspective(400px)
	}
}

.flipInY {
	-webkit-animation-name: flipInY;
	-webkit-backface-visibility: visible!important;
	animation-name: flipInY;
	backface-visibility: visible!important
}

@-webkit-keyframes flipOutX {
	0% {
		-webkit-transform: perspective(400px);
		transform: perspective(400px)
	}
	30% {
		-webkit-transform: perspective(400px) rotateX(-20deg);
		opacity: 1;
		transform: perspective(400px) rotateX(-20deg)
	}
	to {
		-webkit-transform: perspective(400px) rotateX(90deg);
		opacity: 0;
		transform: perspective(400px) rotateX(90deg)
	}
}

@keyframes flipOutX {
	0% {
		-webkit-transform: perspective(400px);
		transform: perspective(400px)
	}
	30% {
		-webkit-transform: perspective(400px) rotateX(-20deg);
		opacity: 1;
		transform: perspective(400px) rotateX(-20deg)
	}
	to {
		-webkit-transform: perspective(400px) rotateX(90deg);
		opacity: 0;
		transform: perspective(400px) rotateX(90deg)
	}
}

.flipOutX {
	-webkit-animation-duration: .75s;
	-webkit-animation-name: flipOutX;
	-webkit-backface-visibility: visible!important;
	animation-duration: .75s;
	animation-name: flipOutX;
	backface-visibility: visible!important
}

@-webkit-keyframes flipOutY {
	0% {
		-webkit-transform: perspective(400px);
		transform: perspective(400px)
	}
	30% {
		-webkit-transform: perspective(400px) rotateY(-15deg);
		opacity: 1;
		transform: perspective(400px) rotateY(-15deg)
	}
	to {
		-webkit-transform: perspective(400px) rotateY(90deg);
		opacity: 0;
		transform: perspective(400px) rotateY(90deg)
	}
}

@keyframes flipOutY {
	0% {
		-webkit-transform: perspective(400px);
		transform: perspective(400px)
	}
	30% {
		-webkit-transform: perspective(400px) rotateY(-15deg);
		opacity: 1;
		transform: perspective(400px) rotateY(-15deg)
	}
	to {
		-webkit-transform: perspective(400px) rotateY(90deg);
		opacity: 0;
		transform: perspective(400px) rotateY(90deg)
	}
}

.flipOutY {
	-webkit-animation-duration: .75s;
	-webkit-animation-name: flipOutY;
	-webkit-backface-visibility: visible!important;
	animation-duration: .75s;
	animation-name: flipOutY;
	backface-visibility: visible!important
}

@-webkit-keyframes lightSpeedIn {
	0% {
		-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
		opacity: 0;
		transform: translate3d(100%, 0, 0) skewX(-30deg)
	}
	60% {
		-webkit-transform: skewX(20deg);
		opacity: 1;
		transform: skewX(20deg)
	}
	80% {
		-webkit-transform: skewX(-5deg);
		transform: skewX(-5deg)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes lightSpeedIn {
	0% {
		-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
		opacity: 0;
		transform: translate3d(100%, 0, 0) skewX(-30deg)
	}
	60% {
		-webkit-transform: skewX(20deg);
		opacity: 1;
		transform: skewX(20deg)
	}
	80% {
		-webkit-transform: skewX(-5deg);
		transform: skewX(-5deg)
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.lightSpeedIn {
	-webkit-animation-name: lightSpeedIn;
	-webkit-animation-timing-function: ease-out;
	animation-name: lightSpeedIn;
	animation-timing-function: ease-out
}

@-webkit-keyframes lightSpeedOut {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
		opacity: 0;
		transform: translate3d(100%, 0, 0) skewX(30deg)
	}
}

@keyframes lightSpeedOut {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
		opacity: 0;
		transform: translate3d(100%, 0, 0) skewX(30deg)
	}
}

.lightSpeedOut {
	-webkit-animation-name: lightSpeedOut;
	-webkit-animation-timing-function: ease-in;
	animation-name: lightSpeedOut;
	animation-timing-function: ease-in
}

@-webkit-keyframes rotateIn {
	0% {
		-webkit-transform: rotate(-200deg);
		-webkit-transform-origin: center;
		opacity: 0;
		transform: rotate(-200deg);
		transform-origin: center
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: center;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: center
	}
}

@keyframes rotateIn {
	0% {
		-webkit-transform: rotate(-200deg);
		-webkit-transform-origin: center;
		opacity: 0;
		transform: rotate(-200deg);
		transform-origin: center
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: center;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: center
	}
}

.rotateIn {
	-webkit-animation-name: rotateIn;
	animation-name: rotateIn
}

@-webkit-keyframes rotateInDownLeft {
	0% {
		-webkit-transform: rotate(-45deg);
		-webkit-transform-origin: left bottom;
		opacity: 0;
		transform: rotate(-45deg);
		transform-origin: left bottom
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: left bottom;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: left bottom
	}
}

@keyframes rotateInDownLeft {
	0% {
		-webkit-transform: rotate(-45deg);
		-webkit-transform-origin: left bottom;
		opacity: 0;
		transform: rotate(-45deg);
		transform-origin: left bottom
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: left bottom;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: left bottom
	}
}

.rotateInDownLeft {
	-webkit-animation-name: rotateInDownLeft;
	animation-name: rotateInDownLeft
}

@-webkit-keyframes rotateInDownRight {
	0% {
		-webkit-transform: rotate(45deg);
		-webkit-transform-origin: right bottom;
		opacity: 0;
		transform: rotate(45deg);
		transform-origin: right bottom
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: right bottom;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: right bottom
	}
}

@keyframes rotateInDownRight {
	0% {
		-webkit-transform: rotate(45deg);
		-webkit-transform-origin: right bottom;
		opacity: 0;
		transform: rotate(45deg);
		transform-origin: right bottom
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: right bottom;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: right bottom
	}
}

.rotateInDownRight {
	-webkit-animation-name: rotateInDownRight;
	animation-name: rotateInDownRight
}

@-webkit-keyframes rotateInUpLeft {
	0% {
		-webkit-transform: rotate(45deg);
		-webkit-transform-origin: left bottom;
		opacity: 0;
		transform: rotate(45deg);
		transform-origin: left bottom
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: left bottom;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: left bottom
	}
}

@keyframes rotateInUpLeft {
	0% {
		-webkit-transform: rotate(45deg);
		-webkit-transform-origin: left bottom;
		opacity: 0;
		transform: rotate(45deg);
		transform-origin: left bottom
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: left bottom;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: left bottom
	}
}

.rotateInUpLeft {
	-webkit-animation-name: rotateInUpLeft;
	animation-name: rotateInUpLeft
}

@-webkit-keyframes rotateInUpRight {
	0% {
		-webkit-transform: rotate(-90deg);
		-webkit-transform-origin: right bottom;
		opacity: 0;
		transform: rotate(-90deg);
		transform-origin: right bottom
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: right bottom;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: right bottom
	}
}

@keyframes rotateInUpRight {
	0% {
		-webkit-transform: rotate(-90deg);
		-webkit-transform-origin: right bottom;
		opacity: 0;
		transform: rotate(-90deg);
		transform-origin: right bottom
	}
	to {
		-webkit-transform: translateZ(0);
		-webkit-transform-origin: right bottom;
		opacity: 1;
		transform: translateZ(0);
		transform-origin: right bottom
	}
}

.rotateInUpRight {
	-webkit-animation-name: rotateInUpRight;
	animation-name: rotateInUpRight
}

@-webkit-keyframes rotateOut {
	0% {
		-webkit-transform-origin: center;
		opacity: 1;
		transform-origin: center
	}
	to {
		-webkit-transform: rotate(200deg);
		-webkit-transform-origin: center;
		opacity: 0;
		transform: rotate(200deg);
		transform-origin: center
	}
}

@keyframes rotateOut {
	0% {
		-webkit-transform-origin: center;
		opacity: 1;
		transform-origin: center
	}
	to {
		-webkit-transform: rotate(200deg);
		-webkit-transform-origin: center;
		opacity: 0;
		transform: rotate(200deg);
		transform-origin: center
	}
}

.rotateOut {
	-webkit-animation-name: rotateOut;
	animation-name: rotateOut
}

@-webkit-keyframes rotateOutDownLeft {
	0% {
		-webkit-transform-origin: left bottom;
		opacity: 1;
		transform-origin: left bottom
	}
	to {
		-webkit-transform: rotate(45deg);
		-webkit-transform-origin: left bottom;
		opacity: 0;
		transform: rotate(45deg);
		transform-origin: left bottom
	}
}

@keyframes rotateOutDownLeft {
	0% {
		-webkit-transform-origin: left bottom;
		opacity: 1;
		transform-origin: left bottom
	}
	to {
		-webkit-transform: rotate(45deg);
		-webkit-transform-origin: left bottom;
		opacity: 0;
		transform: rotate(45deg);
		transform-origin: left bottom
	}
}

.rotateOutDownLeft {
	-webkit-animation-name: rotateOutDownLeft;
	animation-name: rotateOutDownLeft
}

@-webkit-keyframes rotateOutDownRight {
	0% {
		-webkit-transform-origin: right bottom;
		opacity: 1;
		transform-origin: right bottom
	}
	to {
		-webkit-transform: rotate(-45deg);
		-webkit-transform-origin: right bottom;
		opacity: 0;
		transform: rotate(-45deg);
		transform-origin: right bottom
	}
}

@keyframes rotateOutDownRight {
	0% {
		-webkit-transform-origin: right bottom;
		opacity: 1;
		transform-origin: right bottom
	}
	to {
		-webkit-transform: rotate(-45deg);
		-webkit-transform-origin: right bottom;
		opacity: 0;
		transform: rotate(-45deg);
		transform-origin: right bottom
	}
}

.rotateOutDownRight {
	-webkit-animation-name: rotateOutDownRight;
	animation-name: rotateOutDownRight
}

@-webkit-keyframes rotateOutUpLeft {
	0% {
		-webkit-transform-origin: left bottom;
		opacity: 1;
		transform-origin: left bottom
	}
	to {
		-webkit-transform: rotate(-45deg);
		-webkit-transform-origin: left bottom;
		opacity: 0;
		transform: rotate(-45deg);
		transform-origin: left bottom
	}
}

@keyframes rotateOutUpLeft {
	0% {
		-webkit-transform-origin: left bottom;
		opacity: 1;
		transform-origin: left bottom
	}
	to {
		-webkit-transform: rotate(-45deg);
		-webkit-transform-origin: left bottom;
		opacity: 0;
		transform: rotate(-45deg);
		transform-origin: left bottom
	}
}

.rotateOutUpLeft {
	-webkit-animation-name: rotateOutUpLeft;
	animation-name: rotateOutUpLeft
}

@-webkit-keyframes rotateOutUpRight {
	0% {
		-webkit-transform-origin: right bottom;
		opacity: 1;
		transform-origin: right bottom
	}
	to {
		-webkit-transform: rotate(90deg);
		-webkit-transform-origin: right bottom;
		opacity: 0;
		transform: rotate(90deg);
		transform-origin: right bottom
	}
}

@keyframes rotateOutUpRight {
	0% {
		-webkit-transform-origin: right bottom;
		opacity: 1;
		transform-origin: right bottom
	}
	to {
		-webkit-transform: rotate(90deg);
		-webkit-transform-origin: right bottom;
		opacity: 0;
		transform: rotate(90deg);
		transform-origin: right bottom
	}
}

.rotateOutUpRight {
	-webkit-animation-name: rotateOutUpRight;
	animation-name: rotateOutUpRight
}

@-webkit-keyframes hinge {
	0% {
		-webkit-animation-timing-function: ease-in-out;
		-webkit-transform-origin: top left;
		animation-timing-function: ease-in-out;
		transform-origin: top left
	}
	20%,
	60% {
		-webkit-animation-timing-function: ease-in-out;
		-webkit-transform: rotate(80deg);
		-webkit-transform-origin: top left;
		animation-timing-function: ease-in-out;
		transform: rotate(80deg);
		transform-origin: top left
	}
	40%,
	80% {
		-webkit-animation-timing-function: ease-in-out;
		-webkit-transform: rotate(60deg);
		-webkit-transform-origin: top left;
		animation-timing-function: ease-in-out;
		opacity: 1;
		transform: rotate(60deg);
		transform-origin: top left
	}
	to {
		-webkit-transform: translate3d(0, 700px, 0);
		opacity: 0;
		transform: translate3d(0, 700px, 0)
	}
}

@keyframes hinge {
	0% {
		-webkit-animation-timing-function: ease-in-out;
		-webkit-transform-origin: top left;
		animation-timing-function: ease-in-out;
		transform-origin: top left
	}
	20%,
	60% {
		-webkit-animation-timing-function: ease-in-out;
		-webkit-transform: rotate(80deg);
		-webkit-transform-origin: top left;
		animation-timing-function: ease-in-out;
		transform: rotate(80deg);
		transform-origin: top left
	}
	40%,
	80% {
		-webkit-animation-timing-function: ease-in-out;
		-webkit-transform: rotate(60deg);
		-webkit-transform-origin: top left;
		animation-timing-function: ease-in-out;
		opacity: 1;
		transform: rotate(60deg);
		transform-origin: top left
	}
	to {
		-webkit-transform: translate3d(0, 700px, 0);
		opacity: 0;
		transform: translate3d(0, 700px, 0)
	}
}

.hinge {
	-webkit-animation-duration: 2s;
	-webkit-animation-name: hinge;
	animation-duration: 2s;
	animation-name: hinge
}

@-webkit-keyframes jackInTheBox {
	0% {
		-webkit-transform: scale(.1) rotate(30deg);
		-webkit-transform-origin: center bottom;
		opacity: 0;
		transform: scale(.1) rotate(30deg);
		transform-origin: center bottom
	}
	50% {
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg)
	}
	70% {
		-webkit-transform: rotate(3deg);
		transform: rotate(3deg)
	}
	to {
		-webkit-transform: scale(1);
		opacity: 1;
		transform: scale(1)
	}
}

@keyframes jackInTheBox {
	0% {
		-webkit-transform: scale(.1) rotate(30deg);
		-webkit-transform-origin: center bottom;
		opacity: 0;
		transform: scale(.1) rotate(30deg);
		transform-origin: center bottom
	}
	50% {
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg)
	}
	70% {
		-webkit-transform: rotate(3deg);
		transform: rotate(3deg)
	}
	to {
		-webkit-transform: scale(1);
		opacity: 1;
		transform: scale(1)
	}
}

.jackInTheBox {
	-webkit-animation-name: jackInTheBox;
	animation-name: jackInTheBox
}

@-webkit-keyframes rollIn {
	0% {
		-webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
		opacity: 0;
		transform: translate3d(-100%, 0, 0) rotate(-120deg)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

@keyframes rollIn {
	0% {
		-webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg);
		opacity: 0;
		transform: translate3d(-100%, 0, 0) rotate(-120deg)
	}
	to {
		-webkit-transform: translateZ(0);
		opacity: 1;
		transform: translateZ(0)
	}
}

.rollIn {
	-webkit-animation-name: rollIn;
	animation-name: rollIn
}

@-webkit-keyframes rollOut {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
		opacity: 0;
		transform: translate3d(100%, 0, 0) rotate(120deg)
	}
}

@keyframes rollOut {
	0% {
		opacity: 1
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0) rotate(120deg);
		opacity: 0;
		transform: translate3d(100%, 0, 0) rotate(120deg)
	}
}

.rollOut {
	-webkit-animation-name: rollOut;
	animation-name: rollOut
}

@-webkit-keyframes zoomIn {
	0% {
		-webkit-transform: scale3d(.3, .3, .3);
		opacity: 0;
		transform: scale3d(.3, .3, .3)
	}
	50% {
		opacity: 1
	}
}

@keyframes zoomIn {
	0% {
		-webkit-transform: scale3d(.3, .3, .3);
		opacity: 0;
		transform: scale3d(.3, .3, .3)
	}
	50% {
		opacity: 1
	}
}

.zoomIn {
	-webkit-animation-name: zoomIn;
	animation-name: zoomIn
}

@-webkit-keyframes zoomInDown {
	0% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0)
	}
	60% {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0)
	}
}

@keyframes zoomInDown {
	0% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0)
	}
	60% {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0)
	}
}

.zoomInDown {
	-webkit-animation-name: zoomInDown;
	animation-name: zoomInDown
}

@-webkit-keyframes zoomInLeft {
	0% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0)
	}
	60% {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0)
	}
}

@keyframes zoomInLeft {
	0% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0)
	}
	60% {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0)
	}
}

.zoomInLeft {
	-webkit-animation-name: zoomInLeft;
	animation-name: zoomInLeft
}

@-webkit-keyframes zoomInRight {
	0% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0)
	}
	60% {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0)
	}
}

@keyframes zoomInRight {
	0% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0)
	}
	60% {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0)
	}
}

.zoomInRight {
	-webkit-animation-name: zoomInRight;
	animation-name: zoomInRight
}

@-webkit-keyframes zoomInUp {
	0% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0)
	}
	60% {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0)
	}
}

@keyframes zoomInUp {
	0% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0)
	}
	60% {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0)
	}
}

.zoomInUp {
	-webkit-animation-name: zoomInUp;
	animation-name: zoomInUp
}

@-webkit-keyframes zoomOut {
	0% {
		opacity: 1
	}
	50% {
		-webkit-transform: scale3d(.3, .3, .3);
		opacity: 0;
		transform: scale3d(.3, .3, .3)
	}
	to {
		opacity: 0
	}
}

@keyframes zoomOut {
	0% {
		opacity: 1
	}
	50% {
		-webkit-transform: scale3d(.3, .3, .3);
		opacity: 0;
		transform: scale3d(.3, .3, .3)
	}
	to {
		opacity: 0
	}
}

.zoomOut {
	-webkit-animation-name: zoomOut;
	animation-name: zoomOut
}

@-webkit-keyframes zoomOutDown {
	40% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0)
	}
	to {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
		-webkit-transform-origin: center bottom;
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
		transform-origin: center bottom
	}
}

@keyframes zoomOutDown {
	40% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0)
	}
	to {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
		-webkit-transform-origin: center bottom;
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
		transform-origin: center bottom
	}
}

.zoomOutDown {
	-webkit-animation-name: zoomOutDown;
	animation-name: zoomOutDown
}

@-webkit-keyframes zoomOutLeft {
	40% {
		-webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
	}
	to {
		-webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
		-webkit-transform-origin: left center;
		opacity: 0;
		transform: scale(.1) translate3d(-2000px, 0, 0);
		transform-origin: left center
	}
}

@keyframes zoomOutLeft {
	40% {
		-webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
	}
	to {
		-webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
		-webkit-transform-origin: left center;
		opacity: 0;
		transform: scale(.1) translate3d(-2000px, 0, 0);
		transform-origin: left center
	}
}

.zoomOutLeft {
	-webkit-animation-name: zoomOutLeft;
	animation-name: zoomOutLeft
}

@-webkit-keyframes zoomOutRight {
	40% {
		-webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
	}
	to {
		-webkit-transform: scale(.1) translate3d(2000px, 0, 0);
		-webkit-transform-origin: right center;
		opacity: 0;
		transform: scale(.1) translate3d(2000px, 0, 0);
		transform-origin: right center
	}
}

@keyframes zoomOutRight {
	40% {
		-webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
	}
	to {
		-webkit-transform: scale(.1) translate3d(2000px, 0, 0);
		-webkit-transform-origin: right center;
		opacity: 0;
		transform: scale(.1) translate3d(2000px, 0, 0);
		transform-origin: right center
	}
}

.zoomOutRight {
	-webkit-animation-name: zoomOutRight;
	animation-name: zoomOutRight
}

@-webkit-keyframes zoomOutUp {
	40% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0)
	}
	to {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
		-webkit-transform-origin: center bottom;
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
		transform-origin: center bottom
	}
}

@keyframes zoomOutUp {
	40% {
		-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
		animation-timing-function: cubic-bezier(.55, .055, .675, .19);
		opacity: 1;
		transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0)
	}
	to {
		-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
		-webkit-transform-origin: center bottom;
		animation-timing-function: cubic-bezier(.175, .885, .32, 1);
		opacity: 0;
		transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
		transform-origin: center bottom
	}
}

.zoomOutUp {
	-webkit-animation-name: zoomOutUp;
	animation-name: zoomOutUp
}

@-webkit-keyframes slideInDown {
	0% {
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
		visibility: visible
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes slideInDown {
	0% {
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
		visibility: visible
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.slideInDown {
	-webkit-animation-name: slideInDown;
	animation-name: slideInDown
}

@-webkit-keyframes slideInLeft {
	0% {
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
		visibility: visible
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes slideInLeft {
	0% {
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
		visibility: visible
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.slideInLeft {
	-webkit-animation-name: slideInLeft;
	animation-name: slideInLeft
}

@-webkit-keyframes slideInRight {
	0% {
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
		visibility: visible
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes slideInRight {
	0% {
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
		visibility: visible
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.slideInRight {
	-webkit-animation-name: slideInRight;
	animation-name: slideInRight
}

@-webkit-keyframes slideInUp {
	0% {
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
		visibility: visible
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes slideInUp {
	0% {
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
		visibility: visible
	}
	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.slideInUp {
	-webkit-animation-name: slideInUp;
	animation-name: slideInUp
}

@-webkit-keyframes slideOutDown {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
		visibility: hidden
	}
}

@keyframes slideOutDown {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
		visibility: hidden
	}
}

.slideOutDown {
	-webkit-animation-name: slideOutDown;
	animation-name: slideOutDown
}

@-webkit-keyframes slideOutLeft {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
		visibility: hidden
	}
}

@keyframes slideOutLeft {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
		visibility: hidden
	}
}

.slideOutLeft {
	-webkit-animation-name: slideOutLeft;
	animation-name: slideOutLeft
}

@-webkit-keyframes slideOutRight {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
		visibility: hidden
	}
}

@keyframes slideOutRight {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0);
		transform: translate3d(100%, 0, 0);
		visibility: hidden
	}
}

.slideOutRight {
	-webkit-animation-name: slideOutRight;
	animation-name: slideOutRight
}

@-webkit-keyframes slideOutUp {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
		visibility: hidden
	}
}

@keyframes slideOutUp {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
		visibility: hidden
	}
}

.slideOutUp {
	-webkit-animation-name: slideOutUp;
	animation-name: slideOutUp
}

.animated {
	-webkit-animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-duration: 1s;
	animation-fill-mode: both
}

.animated.infinite {
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}

.animated.delay-1s {
	-webkit-animation-delay: 1s;
	animation-delay: 1s
}

.animated.delay-2s {
	-webkit-animation-delay: 2s;
	animation-delay: 2s
}

.animated.delay-3s {
	-webkit-animation-delay: 3s;
	animation-delay: 3s
}

.animated.delay-4s {
	-webkit-animation-delay: 4s;
	animation-delay: 4s
}

.animated.delay-5s {
	-webkit-animation-delay: 5s;
	animation-delay: 5s
}

.animated.fast {
	-webkit-animation-duration: .8s;
	animation-duration: .8s
}

.animated.faster {
	-webkit-animation-duration: .5s;
	animation-duration: .5s
}

.animated.slow {
	-webkit-animation-duration: 2s;
	animation-duration: 2s
}

.animated.slower {
	-webkit-animation-duration: 3s;
	animation-duration: 3s
}

@media (prefers-reduced-motion) {
	.animated {
		-webkit-animation: unset!important;
		-webkit-transition: none!important;
		animation: unset!important;
		transition: none!important
	}
}

._divider {
  position: relative;
  border: none;
  margin: 0 0 30px;
  padding: 0;
  text-align: center;
  white-space: nowrap;
}
._divider > span {
  background: var(--silver-gradient);
  height: 7px;
  width: 7px;
  margin: auto;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
  display: block;
}

.product-media__thumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}

.product-media__thumbs-track{
  display:flex;
  gap:8px;
  overflow-x:auto;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  padding: 4px 2px;
}

.product-media__thumbs-track::-webkit-scrollbar { height: 6px; }

.thumb{
  border: 1px solid #ddd;
  background: transparent;
  padding: 0;
  flex: 0 0 auto;
  width: 72px;
  height: 72px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.thumb img{ max-width:100%; max-height:100%; display:block; }

.thumb.is-active{ border-color:#000; }

.thumb-nav{
  width: 34px;
  height: 34px;
  border: 1px solid #ddd;
  background: #fff;
  line-height: 1;
  color: black;
}

/* Container */
.floating-buttons {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Base button */
.fab {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
  transition: transform .2s ease, opacity .2s ease;
}

/* =====================================
   WHATSAPP FLOAT BUTTON
   ===================================== */

.contact-btn{
  position: fixed;
  right: 22px;
  bottom: 100px;
  width: 56px;
  height: 56px;
  z-index: 1000;
  transition: all .25s ease;
}

.contact-btn:hover{
  transform: translateY(-2px);
}

.contact-btn:hover > div {
  background: var(--gold);
  color: var(--black);
}

.contact-btn:hover::after {
    border-color: transparent var(--gold) transparent transparent;
}

.contact-btn > div {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--dark-2);
  border: 1px solid var(--gold);
  color: var(--gold);
  font-size: 20px;
  box-shadow: 0 6px 18px rgba(0,0,0,.4);
  z-index: 2;
  transition: all .25s ease;
  width: 100%;
  height: 100%;
  position: relative;
}

.contact-btn .fa {
    font-size: 18px;
}

.contact-btn::before {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 16px 30px 10px 0px;
  border-color: transparent var(--gold) transparent transparent;
  transform: rotate(323deg);
  position: absolute;
  left: -12px;
  bottom: -5px;
  z-index: 1;
}
.contact-btn::after {
    content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 16px 30px 10px 0px;
  border-color: transparent var(--dark-2) transparent transparent;
  transform: rotate(323deg);
  position: absolute;
  left: -9px;
  bottom: -3px;
  z-index: 3;
  transition: all .25s ease;
}

/* mini badge WA */
.wa-badge{
  position: absolute;
  bottom: -2px;
  right: -2px;

  font-size: 9px;
  font-weight: 700;
  letter-spacing: .5px;

  padding: 2px 5px;

  border-radius: 10px;

  background: #25D366; /* piccolo accento WA */
  color: #fff;

  line-height: 1;
  z-index: 4;
}


/* Scroll top */
.fab-top {
  background: #111;
  opacity: 0;
  pointer-events: none;
  transform: rotate(90deg);
  background: rgba(0,0,0,0);
  color: #fff;
  fill: #fff;
}

/* Scroll top visible */
.fab-top.visible {
  opacity: 1;
  pointer-events: auto;
}

.fab-top .fa {
  top: 0px;
  position: relative;
  left: -7px;
}
.fab-top:hover .fa {
  left: -14px;
}

/* Mobile tweak */
@media (max-width: 480px) {
  .floating-buttons {
    right: 14px;
    bottom: 14px;
  }
}

.modal-dialog {
  background: rgba(0, 0, 0, 0.4);
  border-radius: 12px;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(168, 168, 168, 0.3);
}


/* ================================================================
   MAX HI-FI — OVERRIDE v4  (selettori verificati sul DOM reale)
   ================================================================ */

/* ── VARIABILI ───────────────────────────────────────────────── */
:root {
  --g:     #c9a84c;   /* gold */
  --g1:    #e8c96a;   /* gold light */
  --g0:    #7a6428;   /* gold dim */
  --glow:  rgba(201,168,76,.15);
  --d1:    #0a0806;
  --d2:    #141008;
  --d3:    #1e1812;
  --d4:    #28221a;
  --d5:    #382e20;
  --t1:    #f0ece4;   /* text high */
  --t2:    #9a9080;   /* text mid */
  --t3:    #5a5040;   /* text low */
  --bd:    rgba(201,168,76,.14);
}

/* ── RESET BASE ──────────────────────────────────────────────── */
body {
  background-color: var(--d1);
  color: var(--t1);
}
a          { color: var(--t1); transition: color .2s; }
a:hover,
a:focus    { color: var(--g); text-decoration: none; }


/* Bottone ricerca e icone destra */
.circle_btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px; height: 34px;
  border: 1px solid var(--d4);
  border-radius: 50%;
  color: var(--t3);
  background: transparent;
  transition: all .2s;
}
.circle_btn:hover { border-color: var(--bd); color: var(--g); }
.circle_btn svg   { width: 15px; height: 15px; fill: currentColor; }
.circle_btn .fa   { font-size: 13px; }

.search-down {
  background: var(--d2);
  border: 1px solid var(--d4);
  border-top: 2px solid var(--g);
  box-shadow: 0 10px 30px rgba(0,0,0,.7);
  padding: 12px;
}
.mahardhi-search .form-control {
  background: var(--d3);
  border: 1px solid var(--d4);
  color: var(--t1);
  border-radius: 1px 0 0 1px;
}
.mahardhi-search .form-control::placeholder { color: var(--t3); }
.mahardhi-search .form-control:focus {
  border-color: var(--bd);
  box-shadow: none;
}
.mahardhi-search .btn-default {
  background: var(--d4);
  border: 1px solid var(--d4);
  color: var(--t3);
  border-radius: 0 1px 1px 0;
}
.mahardhi-search .btn-default:hover {
  background: var(--g);
  color: var(--d1);
}


/* ── BREADCRUMB ──────────────────────────────────────────────── */
/* DOM: .breadcrumb-back > .container > .breadcrumb-row > h2.page_title + ul.breadcrumb */
.breadcrumb-back {
  border-bottom: 1px solid var(--d3);
  font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--text-lo);
}
.breadcrumb-container {
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  padding: var(--s5) var(--s7) 0;
}
h2.page_title {
  font-family: 'Oswald', sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--t3);
  margin: 0 0 4px;
}
.breadcrumb {
  background: transparent;
  padding: 2px 0;
  margin: 0;
  border-radius: 0;
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.breadcrumb > li + li::before { color: var(--d5); content: "/ "; }
.breadcrumb a                  { color: var(--t3); }
.breadcrumb a:hover            { color: var(--g); }
.breadcrumb > .active          { color: var(--t2); }

/* ── SIDEBAR CATEGORIE ───────────────────────────────────────── */
/* DOM: .category-list > .box-category > h3.toggled.relative
        + ul#selectMe-desk > a.list-group-item (SONO TAG <a> NON <li>!) */
.category-list { padding-bottom: 10px; }
.box-category h3.toggled {
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--t3);
  border-bottom: 1px solid var(--d3);
  padding-bottom: 8px;
  margin: 0 0 6px;
  font-weight: 400;
}
/* Link categoria sidebar — nel DOM sono <a class="list-group-item"> dentro <ul> */
a.list-group-item {
  display: block;
  background: transparent;
  border: none;
  border-left: 2px solid transparent;
  border-radius: 0;
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--t2);
  padding: 7px 10px;
  transition: all .2s;
}
a.list-group-item:hover {
  color: var(--g);
  border-left-color: var(--g);
  padding-left: 14px;
  background: rgba(201,168,76,.03);
}
a.list-group-item.active,
a.list-group-item.active:hover {
  background: rgba(201,168,76,.06);
  border-left-color: var(--g);
  color: var(--g);
}

/* Sidebar box "In evidenza" */
/* DOM: .box.all-products.mt-80 > .box-heading > .box-content > .box-category > h3 */
.box.all-products { background: transparent; border: none; box-shadow: none; }
.box-heading       { background: transparent; border: none; }
.box-content       { background: transparent; }
.box.all-products .box-category h3 {
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--t3);
  border-bottom: 1px solid var(--d3);
  padding-bottom: 8px;
  margin-bottom: 8px;
  font-weight: 400;
}

/* Banner laterale */
.swiper-viewport { background: transparent; border: none; box-shadow: none; }

/* ── PRODUCT THUMB ───────────────────────────────────────────── */
/* DOM: .product-layout > .product-thumb.transition */
.product-thumb.transition,
.product-thumb {
  opacity: 1;
  transform: translateY(0px);
  transition: opacity 0.5s, transform 0.5s, box-shadow 0.3s, border-color 0.3s;
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-radius: 2px;
  overflow: hidden;
  transition: all .3s ease;
  position: relative;
  cursor: pointer;
}
.product-thumb.transition:hover,
.product-thumb:hover {
  border-color: var(--bd);
  box-shadow: 0 6px 28px rgba(0,0,0,.55);
}

.product-thumb .image img {
  transition: transform .5s;
}
.product-thumb:hover .image img {
  transform: scale(1.04);
}
.product-thumb .thumb-description {
  background: var(--d2);
  padding: 10px 12px;
}
.product-thumb .caption { padding: 0; background: transparent; }

.product-card__brand {
  font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--gold-dim);
  margin-bottom: var(--s1);
}

/* Titolo — h4 > a */
.product-thumb .caption h4 { margin: 0 0 6px; }
.thumb-description h4 { color: var(--text-hi) }
.product-thumb .caption h4 a {
  font-family: var(--font-display);
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--text-hi);
  line-height: 1.3;
  margin-bottom: var(--s3);
  text-wrap: nowrap;
  overflow: hidden;
  width: 100%;
  display: block;
  text-overflow: ellipsis;
}
.product-thumb .caption h4 a:hover { color: var(--g); }

/* Prezzo — p.price */
.product-thumb .caption p.price {
  font-family: var(--font-ui);
  font-size: 1.6rem;
  letter-spacing: 1px;
  color: var(--gold);
}
.product-thumb .caption .price-tax {
  font-family: 'Oswald', sans-serif;
  font-size: 8.5px;
  letter-spacing: 1px;
  color: var(--t3);
  display: block;
}

/* Descrizione (lista categoria) */
.product-thumb .caption p.description {
  font-size: 12px;
  color: var(--t3);
  line-height: 1.55;
  margin-top: 5px;
}
.product-grid .product-thumb .caption p.description {
    display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Stelle */
.product-thumb .rating .fa-star    { color: var(--g); }
.product-thumb .rating .fa-star-o  { color: var(--d5); }
.product-thumb .rating .fa-stack   { font-size: 10px; }

/* Badge esaurito */
.badge-sold-out {
  font-family: 'Oswald', sans-serif;
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t2);
  background: rgba(10,8,6,.85);
  border: 1px solid var(--d4);
  padding: 3px 8px;
  border-radius: 1px;
}

/* Button group (quickview, wishlist, compare) */
/* DOM: .button-group > button.btn-quickview, button[onclick*=wishlist], button[onclick*=compare] */
.product-thumb .button-group {
  background: var(--d1);
  border-top: 1px solid var(--d3);
  padding: 6px 8px;
  display: flex;
  gap: 4px;
  justify-content: space-evenly;
}
.product-thumb .button-group button {
  background: var(--d3);
  border: 1px solid var(--d4);
  color: var(--t3);
  border-radius: 1px;
  width: 32px; height: 32px;
  font-size: 11px;
  display: inline-flex;
  align-items: center; justify-content: center;
  transition: all .2s;
  padding: 0;
}
.product-thumb .button-group button:hover {

}

/* ============================================================
   SEZIONE FEATURED PRODUCTS
   ============================================================ */
.section {
  max-width: 1280px; margin: 0 auto;
  padding: var(--s9) var(--s7);
}

.section__header {
  display: flex; align-items: flex-end; justify-content: space-between;
  margin-bottom: var(--s7); gap: var(--s5);
}
.section__title {
  font-family: var(--font-display);
  font-size: clamp(2.6rem, 5vw, 4rem);
  font-weight: 600;
  line-height: 1.2;
  color: var(--text-hi);
  margin-bottom: 0;
  text-transform: none;
}
.section__title em { font-style: italic; color: var(--gold); }
.section__link {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--gold-dim);
  border-bottom: 1px solid var(--gold-dim); padding-bottom: 2px;
  transition: all .2s; white-space: nowrap;
}
.section__link:hover { color: var(--gold); border-color: var(--gold); }

/* ---- Section labels ---- */
.section-label {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--gold-dim);
  border-left: 2px solid var(--gold-dim); padding-left: var(--s3);
  margin-bottom: var(--s5);
}

/* ── HOMEPAGE — TAB PRODOTTI ─────────────────────────────────── */
/* DOM: .product-tab-block > .container > .main-tab.box > .product-tabs
        > .page-title.toggled > h3
        + #tabs._tabs > ul.nav.nav-tabs > li > a */
.main-tab.box      { background: transparent; border: none; box-shadow: none; }
.product-tabs      { background: transparent; }

.page-title.toggled h3,
.page-title h3 {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 600;
  color: var(--t1);
  text-transform: none;
  letter-spacing: 0;
}

#tabs._tabs .nav.nav-tabs,
._tabs .nav.nav-tabs {
  display: flex;
  margin-bottom: var(--s6);
}
#tabs._tabs .nav.nav-tabs > li > a,
._tabs .nav.nav-tabs > li > a {
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--t3);
  background: transparent;
  border-bottom: 1px solid var(--dark-3);
  padding: 8px 16px;
  border-radius: 0;
  transition: all .2s;
}
#tabs._tabs .nav.nav-tabs > li > a:hover,
._tabs .nav.nav-tabs > li > a:hover { color: var(--t2); }
#tabs._tabs .nav.nav-tabs > li > a.selected,
._tabs .nav.nav-tabs > li.active > a {
  color: var(--g);
  border-bottom-color: var(--g);
  background: transparent;
}
._tabs .nav.nav-tabs > li.active > a > span {
  color: var(--gold);
}

/* ── HOMEPAGE — BANNER GRIGLIA ───────────────────────────────── */
/* DOM: .home-grid-banner > .grid-banner > .grid-left + .grid-right */
.home-grid-banner { overflow: hidden; }
.grid-banner      { display: flex; gap: 3px; }
.grid-left        { flex: 3; display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
.grid-right       { flex: 1.3; }
.grid-right > img { width: 100%; height: 100%; object-fit: cover; display: block; }

.grid-tile { position: relative; overflow: hidden; }
.grid-tile > img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .5s ease;
}
.grid-tile:hover > img { transform: scale(1.04); }

/* .inner2 — tile promozionale */
/* DOM: .grid-tile > .inner2 > .promo-text-box > .promo-desc + h3.promo-title + a.btn.button */
.inner2 {
  background: linear-gradient(135deg, var(--d3) 0%, var(--d2) 100%);
  min-height: 200px;
  width: 100%; height: 100%;
  display: flex;
  align-items: center; justify-content: center;
  text-align: center;
  padding: 32px 20px;
  border: 1px solid var(--d4);
  position: relative; overflow: hidden;
  transition: border-color .3s;
}
.inner2::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--g);
  transform: scaleX(0); transform-origin: left;
  transition: transform .4s ease;
}
.inner2:hover { border-color: var(--bd); }
.inner2:hover::before { transform: scaleX(1); }

.inner2 .promo-text-box { position: relative; z-index: 1; }

.inner2 .promo-desc {
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--g);
  margin-bottom: 8px;
  display: block;
}
.inner2 h3.promo-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(1.3rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--t1);
  line-height: 1.15;
  margin: 0 0 18px;
  text-transform: none;
  letter-spacing: 0;
}
/* a.btn.button nel DOM */
.inner2 a.btn.button {
  background: var(--g);
  color: var(--d1);
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  font-weight: 600;
  border: none;
  border-radius: 1px;
  padding: 9px 22px;
  box-shadow: 0 4px 14px rgba(201,168,76,.18);
  display: inline-block;
  transition: all .25s;
}
.inner2 a.btn.button:hover {
  background: var(--g1);
  color: var(--d1);
  box-shadow: 0 6px 22px rgba(201,168,76,.32);
  transform: translateY(-1px);
}

/* ── HOMEPAGE — SERVIZI ──────────────────────────────────────── */
/* DOM: .container > .row > .service-boxes > .service-item.col-xs-3
        > .service > .service-icon > i.fa + .service-content > h4.promo-title + p.promo-desc */
.service-boxes {
  background: var(--d2);
  border-top: 1px solid var(--d3);
  border-bottom: 1px solid var(--d3);
  padding: 28px 0;
}
.service {
  background: var(--d1);
  border: 1px solid var(--d3);
  border-radius: 2px;
  padding: 20px 14px;
  text-align: center;
  position: relative; overflow: hidden;
  transition: border-color .3s;
}
.service::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--g);
  transform: scaleX(0); transform-origin: left;
  transition: transform .4s;
}
.service:hover { border-color: var(--bd); }
.service:hover::before { transform: scaleX(1); }

.service-icon .fa {
  font-size: 26px;
  color: var(--g);
  display: block;
  margin-bottom: 10px;
}
.service-content h4.promo-title {
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t1);
  margin: 6px 0 5px;
  font-weight: 500;
}
.service-content p.promo-desc {
  font-size: 12px;
  color: var(--t3);
  margin: 0;
  line-height: 1.5;
}

/* ── HOMEPAGE — BRANDS ───────────────────────────────────────── */
/* DOM: .carousel.swiper-viewport > .page-title.toggled > h3
        + ._divider > span + #carousel0 */
.carousel.swiper-viewport {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: var(--s8) var(--s7);
  max-width: 1280px;
  margin: 0 auto;
  border-top: 1px solid var(--d3);
}
._divider {
  display: flex;
  align-items: center; gap: 16px;
  margin: 12px 0 22px;
}
._divider > span {
  flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, var(--g0), transparent);
  display: block;
}
/* Immagini brand: grigio → leggere on hover */
.carousel .swiper-slide .text-center {
  border: none; padding: 10px; background: transparent;
}
.carousel .swiper-slide .text-center img {
  filter: brightness(0) invert(1) opacity(.18);
  max-height: 55px; width: auto; margin: 0 auto;
  transition: filter .3s;
}
.carousel .swiper-slide:hover .text-center img {
  filter: brightness(0) invert(1) opacity(.65);
}

.swiper-footer {
  margin-top: 2rem;
  display: flex;
  justify-content: end;
}

/* ── CATEGORIA — TOOLBAR ─────────────────────────────────────── */
/* DOM: .cat_info > .row > .col-md-2 (.btn-group #grid-view #list-view)
        + .col-sm-3 (#compare-total) + .col-sm-7 (cat-sort/cat-show) */
.cat_info {
  background: var(--d2);
  border: 1px solid var(--d3);
  border-radius: 2px;
  padding: 4px 12px;
  margin-bottom: 18px;
}
.cat_info > div {
  display: flex;
  align-items: center;
  padding: 0;
  justify-content: space-between;
}
.cat_info .text_sort,
.cat_info .text_limit {
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t3);
}

a#compare-total {
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t3);
}
a#compare-total:hover { color: var(--g); }

select#input-sort,
select#input-limit {
  background: var(--d3);
  border: 1px solid var(--d4);
  color: var(--text-mid);
  border-radius: 1px;
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 1px;
  height: 32px;
  padding: 4px 20px 4px 8px;
}
select#input-sort option,
select#input-limit option {
  background: var(--d2);
  color: var(--t1);
}

/* Paginazione — .pro_pagination > .pagination */
.pro_pagination {
    margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pro_pagination .pagination > li > a,
.pro_pagination .pagination > li > span {
  background: var(--d2);
  border: 1px solid var(--d3);
  color: var(--t2);
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 1px;
  border-radius: 1px;
  margin: 0 2px;
  min-width: 32px;
  text-align: center;
  transition: all .2s;
}
.pro_pagination .pagination > li > a:hover {
  background: var(--d3);
  border-color: var(--bd);
  color: var(--g);
}
.pro_pagination .pagination > .active > a,
.pro_pagination .pagination > .active > span {
  border-color: var(--g);
  color: var(--g);
}
.pro_pagination .pagination > .disabled > span {
  background: var(--d1);
  border-color: var(--d3);
  color: var(--t3);
}
.pro_pagination .text-right {
    font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t3);
}

/* ── PAGINA PRODOTTO ─────────────────────────────────────────── */
/* DOM: #product-product > .row > .col-sm-6 > h1, rating, hr,
        ul.list-unstyled > li > span.disc + a.disc1/span.disc1
        + ul.list-unstyled > li > h2
        + ul.nav.nav-tabs > li > a
        + .tab-content > .tab-pane#tab-description / #tab-inquiry
#product-product { background: transparent; }

#product-product h1 {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 700;
  color: var(--t1);
  line-height: 1.2;
  margin-bottom: 8px;
  text-transform: none;
  letter-spacing: 0;
}

#product-product .rating .fa-star   { color: var(--g); }
#product-product .rating .fa-star-o { color: var(--d5); }
#product-product .rating .fa-stack  { font-size: 11px; }

#product-product hr { border-color: var(--d3); margin: 12px 0; }

#product-product .list-unstyled li {
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--t2);
  padding: 3px 0;
  background: transparent;
  border: none;
}
span.disc       { color: var(--t3); margin-right: 6px; }
span.disc1      { color: var(--t1); }
a.disc1         { color: var(--g); }
a.disc1:hover   { color: var(--g1); }

#product-product .list-unstyled h2 {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 1.9rem;
  font-weight: 700;
  color: var(--g);
  margin: 0;
  line-height: 1;
}

#product-product .list-unstyled li:not(:has(h2)) {
  font-size: 9px;
  color: var(--t3);
  letter-spacing: 1px;
}

#product-product .nav.nav-tabs {
  border-bottom: 1px solid var(--d3);
  background: transparent;
  margin-bottom: 14px;
}
#product-product .nav.nav-tabs > li > a {
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t3);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 8px 14px;
  border-radius: 0;
  transition: all .2s;
}
#product-product .nav.nav-tabs > li > a:hover     { color: var(--t2); }
#product-product .nav.nav-tabs > li.active > a {
  color: var(--g);
  border-bottom-color: var(--g);
  background: transparent;
}

.tab-pane#tab-description {
  font-size: 14px;
  color: var(--t2);
  line-height: 1.7;
}

#form-inquiry .form-group .control-label {
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t3);
  display: block; margin-bottom: 4px;
}
#form-inquiry .form-control {
  background: var(--d3);
  border: 1px solid var(--d4);
  color: var(--t1);
  border-radius: 1px;
  font-size: 13px;
}
#form-inquiry .form-control:focus {
  border-color: var(--bd);
  box-shadow: none;
  background: var(--d2);
}
#form-inquiry .form-control::placeholder { color: var(--t3); }

#form-inquiry .buttons .btn.btn-primary,
#form-inquiry .btn-primary {
  background: var(--g);
  color: var(--d1);
  border: none;
  border-radius: 1px;
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
  font-weight: 600;
  padding: 10px 26px;
  box-shadow: 0 4px 14px rgba(201,168,76,.18);
  transition: all .25s;
}
#form-inquiry .buttons .btn.btn-primary:hover,
#form-inquiry .btn-primary:hover {
  background: var(--g1);
  color: var(--d1);
  box-shadow: 0 6px 22px rgba(201,168,76,.32);
  transform: translateY(-1px);
}

#product .btn-group .btn.btn-default {
  background: var(--d3);
  border: 1px solid var(--d4);
  color: var(--t2);
  border-radius: 1px;
  transition: all .2s;
}
#product .btn-group .btn.btn-default:hover {
  background: var(--g);
  border-color: var(--g);
  color: var(--d1);
}

.product-media__main {
  background: var(--d3);
  border: 1px solid var(--d3);
  border-radius: 2px;
  overflow: hidden;
}
.product-media__main a.js-product-modal,
.product-media__main a.thumbnail {
  display: block;
  border: none;
  padding: 0;
}
.product-media__main img { display: block; width: 100%; }

.product-media__thumbs {
  margin-top: 8px;
  display: flex; gap: 6px; align-items: center;
}
.product-media__thumbs-track {
  display: flex; gap: 6px;
  overflow: hidden; flex: 1;
}
button.thumb {
  background: var(--d3);
  border: 1px solid var(--d4);
  border-radius: 1px;
  padding: 2px;
  cursor: pointer;
  transition: border-color .2s;
  flex-shrink: 0;
}
button.thumb.is-active,
button.thumb:hover { border-color: var(--g); }
button.thumb img { width: 58px; height: 58px; object-fit: cover; display: block; }

button.thumb-nav {
  background: var(--d3);
  border: 1px solid var(--d4);
  color: var(--t2);
  width: 26px; height: 26px;
  border-radius: 50%;
  font-size: 16px; line-height: 1;
  cursor: pointer; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all .2s;
  padding: 0;
}
button.thumb-nav:hover {
  background: var(--g);
  border-color: var(--g);
  color: var(--d1);
}*/

/* ============================================================
   PRODUCT PAGE LAYOUT
   ============================================================ */
#product-page { background: var(--dark-1); }

.product-page-inner {
  max-width: 1280px; margin: 0 auto;
  padding: var(--s8) var(--s7);
  display: grid; grid-template-columns: 1fr 360px; gap: var(--s8);
}

/* Breadcrumb */
.breadcrumb {
  max-width: 1280px; margin: 0 auto;
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 2px;
  text-transform: uppercase; color: var(--text-lo);
  display: flex; align-items: center; gap: var(--s2);
}
.breadcrumb a { color: var(--text-lo); transition: color .2s; }
.breadcrumb a:hover { color: var(--gold); }
.breadcrumb__sep { color: var(--dark-4); }
.breadcrumb__current { color: var(--text-mid); }

/* Galleria */
.product-gallery { display: flex; flex-direction: column; gap: var(--s4); }
.product-gallery__main {
  background: var(--dark-2);
  border: 1px solid var(--dark-3); border-radius: 2px; overflow: hidden;
  display: flex; align-items: center; justify-content: center; position: relative;
}
.product-gallery__main-img {
  width: 100%; height: 100%; object-fit: cover;
  filter: brightness(.92) contrast(1.06);
}
/* Immagine simulata per preview */
.product-gallery__placeholder {
  width: 100%; height: 100%;
  background:
    radial-gradient(ellipse at 40% 35%, #3a3020 0%, #1a1810 50%, #0e0c08 100%);
  display: flex; align-items: center; justify-content: center;
}
.product-gallery__placeholder span {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--text-lo);
}

.product-gallery__thumbs {
  display: flex; gap: var(--s2);
}
.product-gallery__thumb {
  width: 72px;
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-radius: 1px;
  overflow: hidden;
  cursor: pointer;
  transition: border-color .2s;
  flex-shrink: 0;
}
.product-gallery__thumb:hover,
.product-gallery__thumb.active { border-color: var(--gold); }
.product-gallery__thumb-inner {
  width: 100%; height: 100%;
  background: radial-gradient(ellipse at 50% 40%, #2a2418 0%, #0e0c08 100%);
}

/* Info prodotto */
.product-info { display: flex; flex-direction: column; gap: var(--s5); }

.product-info__brand {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--gold-dim);
}
.product-info__brand a {
  color: var(--gold);
}
.product-info__name {
  font-family: var(--font-display); font-size: clamp(2.6rem, 4.5vw, 3.8rem);
  font-weight: 700; line-height: 1.2; color: var(--text-hi);margin: 0;
}
.product-info__meta {
  display: flex; flex-direction: column; gap: var(--s2);
  padding: var(--s4) 0; border-top: 1px solid var(--dark-3); border-bottom: 1px solid var(--dark-3);
}
.product-info__meta-row {
  display: flex; gap: var(--s3);
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase;
}
.product-info__meta-label { color: var(--text-lo); width: 120px; flex-shrink: 0; }
.product-info__meta-value { color: var(--text-mid); }
.product-info__meta-value.available { color: #5cb85c; }

.product-info__price-block {
  display: flex; flex-direction: column; gap: var(--s1);
}
.product-info__price {
  font-family: var(--font-display); font-size: 3.2rem; font-weight: 700;
  color: var(--gold); line-height: 1;
}
.product-info__price-tax {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 1px;
  color: var(--text-lo);
}

.product-info__desc {
  font-size: 14px; color: var(--text-mid); line-height: 1.8;
  border-left: 2px solid var(--dark-4); padding-left: var(--s4);
}

/* Inquiry form */
.inquiry-form {
  background: var(--dark-2); border: 1px solid var(--dark-3);
  border-radius: 2px; padding: var(--s6); display: flex; flex-direction: column; gap: var(--s4);
}
.inquiry-form__title {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--text-lo);
  padding-bottom: var(--s4); border-bottom: 1px solid var(--dark-3);
}
.form-group { display: flex; flex-direction: column; gap: var(--s2); margin: 0;}
.form-label {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 2px;
  text-transform: uppercase; color: var(--text-lo);
}
.form-control {
  background: var(--dark-1); border: 1px solid var(--dark-4);
  border-radius: 1px; padding: var(--s3) var(--s4);
  color: var(--text-hi); font-family: var(--font-body); font-size: 13px;
  transition: border-color .2s; outline: none; width: 100%;
}
.form-control:focus { border-color: var(--border); }
.form-control::placeholder { color: var(--text-lo); }
textarea.form-control { resize: vertical; min-height: 80px; }

.form-group.required .form-label {
  display: flex;
  gap: 10px;
  align-items: center;
}
.form-group.required .form-label::before {
  content: '';
  width: 5px;
  height: 5px;
  background: var(--text-lo);
  transform: rotate(45deg);
  display: block;
}

/* Sidebar product */
.product-sidebar { display: flex; flex-direction: column; gap: var(--s6); }

.sidebar-block {
  background: var(--dark-2); border: 1px solid var(--dark-3); border-radius: 2px;
  overflow: hidden;
}
.sidebar-block__title {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--text-lo);
  padding: var(--s4) var(--s5); border-bottom: 1px solid var(--dark-3);
  background: var(--dark-1);
}
.sidebar-cat-list { padding: var(--s3) 0; }
.sidebar-cat-item > a {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--s2) var(--s5);
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--text-mid); cursor: pointer; transition: all .2s;
  border-left: 2px solid transparent;
}
.sidebar-cat-item > a:hover { color: var(--gold); border-left-color: var(--gold); background: rgba(201,168,76,.03); }
.sidebar-cat-item__count { color: var(--text-lo); font-size: 9px; }

/* Related products mini */
.related-mini-card > a {
  display: flex; gap: var(--s3); padding: var(--s4) var(--s5);
  border-bottom: 1px solid var(--dark-3); cursor: pointer; transition: background .2s;
}
.related-mini-card:last-child > a { border-bottom: none; }
.related-mini-card > a:hover { background: rgba(201,168,76,.03); }
.related-mini-card__img {
  width: 56px; height: 56px; flex-shrink: 0;
  background: var(--dark-3); border-radius: 1px; overflow: hidden;
}
.related-mini-card__name {
  font-family: var(--font-display); font-size: 13px; color: var(--text-hi); line-height: 1.3;
}
.related-mini-card__price {
  font-family: var(--font-ui); font-size: 11px; letter-spacing: 1px; color: var(--gold);
  margin-top: 4px;
}

/* ── QUICKVIEW MODAL ─────────────────────────────────────────── */
/* DOM: #quickview-modal > .modal-dialog.modal-lg > .modal-content */
#quickview-modal .modal-content {
  background: var(--d2);
  border: 1px solid var(--d4);
  border-radius: 2px;
  box-shadow: 0 20px 60px rgba(0,0,0,.9);
}
#quickview-modal .modal-header {
  border-bottom: 1px solid var(--d3);
  background: var(--d1);
  padding: 12px 16px;
}
#quickview-modal h4.modal-title {
  font-family: 'Oswald', sans-serif;
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--t1);
}
#quickview-modal .close {
  color: var(--t3);
  opacity: 1;
  text-shadow: none;
  transition: color .2s;
}
#quickview-modal .close:hover { color: var(--g); }
.modal-backdrop { background: #000; }
.modal-backdrop.in { opacity: .85; }

/* ── FORM CONTROLS GLOBALI ───────────────────────────────────── */
.form-control {
  background: var(--d3);
  border: 1px solid var(--d4);
  color: var(--t1);
  border-radius: 1px;
  box-shadow: none;
  transition: border-color .2s;
}
.form-control:focus {
  border-color: var(--bd);
  box-shadow: none;
  background: var(--d2);
  outline: none;
}
.form-control::placeholder  { color: var(--t3); }
select.form-control option  { background: var(--d2); color: var(--t1); }

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: var(--dark-1);
  border-top: 1px solid var(--dark-3);
  margin-top: var(--s9);
}

.footer__top {
  max-width: 1280px; margin: 0 auto;
  padding: var(--s9) var(--s7) var(--s7);
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--s8);
}

.footer__brand { display: flex; flex-direction: column; gap: var(--s4); }
.footer__brand-name {
  font-family: var(--font-display); font-size: 2.6rem; font-weight: 700;
  letter-spacing: 3px; color: var(--text-hi);
}
.footer__brand-name em { font-style: normal; color: var(--gold); }
.footer__brand-desc { font-size: 13px; color: var(--text-lo); line-height: 1.7; max-width: 280px; }
.footer__contact { display: flex; flex-direction: column; gap: var(--s2); margin-top: var(--s3); }
.footer__contact-item {
  display: flex; align-items: center; gap: var(--s2);
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 1.5px;
  color: var(--text-lo); transition: color .2s;
}
.footer__contact-item:hover { color: var(--gold); }
.footer__contact-item svg { opacity: .4; flex-shrink: 0; }

.footer__col-title {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--text-hi);
  margin-bottom: var(--s5); padding-bottom: var(--s3);
  border-bottom: 1px solid var(--dark-3);
}
.footer__links { display: flex; flex-direction: column; gap: var(--s2); }
.footer__link {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--text-lo); transition: all .2s;
  display: flex; align-items: center; gap: var(--s2);
}
.footer__link::before { content: '—'; color: var(--dark-4); font-size: 8px; }
.footer__link:hover { color: var(--gold); padding-left: var(--s2); }
.footer__link:hover::before { color: var(--gold-dim); }

/* Newsletter */
.footer__newsletter { display: flex; flex-direction: column; gap: var(--s3); }
.footer__newsletter-input-wrap {
  display: flex; border: 1px solid var(--dark-4); border-radius: 1px; overflow: hidden;
  transition: border-color .2s;
}
.footer__newsletter-input-wrap:focus-within { border-color: var(--border); }
.footer__newsletter-input {
  background: var(--dark-2); border: none; outline: none;
  padding: var(--s3) var(--s4); color: var(--text-hi); font-size: 12px;
  font-family: var(--font-body); flex: 1;
}
.footer__newsletter-input::placeholder { color: var(--text-lo); }
.footer__newsletter-btn {
  background: var(--gold); color: var(--black); border: none; cursor: pointer;
  padding: var(--s3) var(--s5);
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 2px; text-transform: uppercase;
  font-weight: 600; transition: background .2s;
}
.footer__newsletter-btn:hover { background: var(--gold-light); }
.footer__newsletter-note {
  font-size: 11px; color: var(--text-lo); line-height: 1.5;
}

/* Footer bottom */
.footer__bottom {
  border-top: 1px solid var(--dark-3);
  padding: var(--s5) var(--s7);
  max-width: 1280px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--s5);
}
.footer__copy {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 2px;
  text-transform: uppercase; color: var(--text-lo);
}
.footer__copy em { font-style: normal; color: var(--gold-dim); }
.footer__bottom-links {
  display: flex; gap: var(--s5);
}
.footer__bottom-link {
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--text-lo); transition: color .2s;
}
.footer__bottom-link:hover { color: var(--gold); }

/* ============================================================
   PAGE SECTION DIVIDERS (preview only)
   ============================================================ */
.preview-section-marker {
  background: var(--dark-3);
  padding: var(--s2) var(--s7);
  font-family: var(--font-ui); font-size: 9px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--text-lo);
  display: flex; align-items: center; gap: var(--s3);
}
.preview-section-marker::before {
  content: ''; width: 8px; height: 8px;
  background: var(--gold-dim); transform: rotate(45deg);
}

/* Icone pagamento */
.payment-link img { opacity: .3; filter: grayscale(1) brightness(2); }

/* ── BOTTONI GLOBALI ─────────────────────────────────────────── */
.btn-primary {
  background: var(--g);
  color: var(--d1);
  border: none;
  border-radius: 1px;
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  transition: all .25s;
}
.btn-primary:hover, .btn-primary:focus {
  background: var(--g1);
  color: var(--d1);
  box-shadow: 0 4px 16px rgba(201,168,76,.25);
}
.btn-outline {
  background: transparent; color: var(--text-mid);
  border: 1px solid var(--dark-4);
}
.btn-outline:hover { border-color: var(--border);
  color: var(--text-hi);
  transform: translateY(0);
  background: rgba(0,0,0,0);
  box-shadow: unset;
}

/* ── FLOATING BUTTONS ────────────────────────────────────────── */
/* DOM: .floating-buttons > a.fab.fab-whatsapp + button#scrollTopBtn.fab.fab-top */
.floating-buttons {
  position: fixed;
  bottom: 24px; right: 20px;
  display: flex; flex-direction: column; gap: 10px;
  z-index: 9999;
}
.fab {
  width: 44px; height: 44px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all .25s;
  border: 1px solid var(--d4);
  box-shadow: 0 4px 14px rgba(0,0,0,.5);
}
.fab-whatsapp {
  background: #25d366;
  border-color: #25d366;
  color: #fff;
}
.fab-whatsapp:hover {
  background: #1fba59;
  transform: scale(1.08);
}
.fab-top {
  background: var(--d3);
  border-color: var(--d4);
  color: var(--t2);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s, transform .3s, background .2s;
}
.fab-top.visible {
  opacity: 1;
  pointer-events: all;
}
.fab-top:hover {
  background: var(--g);
  border-color: var(--g);
  color: var(--d1);
  transform: scale(1.08);
}
.fab-top svg { width: 16px; height: 16px; fill: currentColor; }
.fab-top .fa { font-size: 14px; }

/* =====================================
   SCROLL TO TOP BUTTON
   ===================================== */

.scrolltop-btn{
  position: fixed;
  right: 26px;
  bottom: 28px;

  width: 46px;
  height: 46px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius: 50%;

  background: var(--dark-2);
  border: 1px solid var(--gold);

  color: var(--gold);

  cursor: pointer;

  opacity: 0;
  transform: translateY(10px);

  transition: all .25s ease;

  z-index: 11999;
}

/* visibile */
.scrolltop-btn.visible{
  opacity: 1;
  transform: translateY(0);
}

.scrolltop-btn:hover{
  background: var(--gold);
  color: var(--black);
}


/* ── LOADER — FIRST VISIT (Pioneer CT-A7X) ───────────────────── */
/* DOM confermato: #first-loader.first-loader > .first-loader-inner > .player._checked
   > .central > .cassette > .pletina > .cassette-back
     > span.a, span.title_tape, span.hd90
     > .plate > .reel(6div), .tape, .reel(6div)
     > .screws(5div), .holes(4div)
   > .texto > h5, span, p
   > .controls > .controls_button x6 */

/* Overlay fullscreen */
.first-loader {
  --cream:       #f0e9d6;
  --amber:       #ffb347;
  --amber-glow:  rgba(255,160,40,.15);
  --vu-green:    #39ff14;
  --vu-yellow:   #ffee00;
  --vu-red:      #ff2200;
  --chrome-hi:   #f5f5f5;
  --chrome-lo:   #7a7570;
  --panel-dark:  #0e0c08;
}

.first-loader {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(ellipse 70% 70% at 50% 50%, #120e08 0%, #050402 100%);
  transition: opacity .6s ease;
}

/* ============================================================
   PREVIEW HEADER
   ============================================================ */
.preview-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 999999;
  background: linear-gradient(180deg, #1a1510 0%, #0f0d0a 100%);
  border-bottom: 1px solid #2d2820;
  padding: 12px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  box-shadow: 0 2px 20px rgba(0,0,0,.8);
}
.ph-brand {
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: #666;
}
.ph-brand em { color: var(--amber); font-style: normal; }
.ph-tabs { display: flex; gap: 4px; }
.tab-btn {
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 7px 16px;
  border: 1px solid #2a2520;
  background: #141210;
  color: #555;
  cursor: pointer;
  border-radius: 2px;
  transition: all .2s;
}
.tab-btn:hover { border-color: #4a4030; color: #999; }
.tab-btn.active { background: var(--amber); color: #000; border-color: var(--amber); font-weight: 600; }
.ph-hint { font-family: 'Oswald', sans-serif; font-size: 9px; letter-spacing: 2px; color: #333; text-transform: uppercase; }

/* ============================================================
   STAGE
   ============================================================ */
.preview-stage {
  margin-top: 57px;
  min-height: calc(100vh - 57px);
  position: relative;
  overflow: hidden;
  background: radial-gradient(ellipse 80% 60% at 50% 40%, #1a1208 0%, #060402 100%);
}
.preview-stage::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 50% 40% at 50% 50%, rgba(255,160,40,.03) 0%, transparent 70%);
  pointer-events: none; z-index: 0;
}

.loader-panel {
  position: absolute; inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.loader-panel.active { display: flex; }

/* ============================================================
   FIRST LOADER — DECK PLAYER PIONEER CT-A7X
   ============================================================ */
.first-loader {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(ellipse 70% 70% at 50% 50%, #120e08 0%, #050402 100%);
  transition: opacity .6s ease;
  z-index:99999;
}
.first-loader.hide { opacity: 0; pointer-events: none; }

/* Corpo deck */
.deck {
  width: min(560px, 94vw);
  background: linear-gradient(170deg, #282218 0%, #1a1510 40%, #141008 100%);
  border-radius: 6px 6px 4px 4px;
  border: 1px solid #3a3025;
  border-top-color: #4a4030;
  box-shadow:
    0 0 0 1px #0a0805,
    0 4px 8px rgba(0,0,0,.6),
    0 16px 50px rgba(0,0,0,.85),
    0 40px 100px rgba(0,0,0,.5),
    inset 0 1px 0 rgba(255,220,120,.07),
    inset 0 -1px 0 rgba(0,0,0,.5);
}
/* Fascia cromata superiore */
.deck::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg,
    #3a3025 0%, #6a5a40 15%, #8a7a58 30%,
    #c0a870 50%, #8a7a58 70%, #6a5a40 85%, #3a3025 100%);
  border-radius: 6px 6px 0 0;
}

/* ---- Top: brand + VU ---- */
.deck-top {
  padding: 12px 20px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(0,0,0,.5);
}
.deck-brand__make {
  font-family: 'Oswald', sans-serif;
  font-size: 9px; letter-spacing: 4px;
  color: #6a5a40; text-transform: uppercase;
}
.deck-brand__model {
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 300; letter-spacing: 3px;
  color: var(--chrome-hi); line-height: 1;
  text-shadow: 0 0 30px rgba(255,200,80,.12);
}
.deck-brand__type {
  font-family: 'Oswald', sans-serif;
  font-size: 7px; letter-spacing: 3px;
  color: #5a4a35; text-transform: uppercase; margin-top: 2px;
}

/* VU + LED */
.deck-right { display: flex; align-items: flex-start; gap: 14px; }
.deck-power-led {
  width: 8px; height: 8px; border-radius: 50%;
  background: #0a1a0a; border: 1px solid #050a05;
  box-shadow: inset 0 0 2px rgba(0,0,0,.8);
  margin-top: 5px; transition: all .3s;
}
.deck-power-led.on {
  background: var(--vu-green);
  box-shadow: 0 0 6px var(--vu-green), 0 0 14px rgba(57,255,20,.4), inset 0 0 3px rgba(255,255,255,.4);
}
.vu-meters { display: flex; gap: 8px; align-items: flex-end; }
.vu-meter { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.vu-meter__label {
  font-family: 'Oswald', sans-serif; font-size: 7px;
  letter-spacing: 1px; color: #4a3a25; margin-top: 3px;
}
.vu-bar { display: flex; flex-direction: column-reverse; gap: 1.5px; }
.vu-seg {
  width: 14px; height: 3px; border-radius: 1px;
  border: 1px solid #0a0806; transition: background .05s, box-shadow .05s;
}
.vu-seg.g   { background: #0a1a0a; }
.vu-seg.gy  { background: #131a05; }
.vu-seg.y   { background: #1a1500; }
.vu-seg.r   { background: #1a0500; }
.vu-seg.g.lit  { background: var(--vu-green); box-shadow: 0 0 4px var(--vu-green), 0 0 8px rgba(57,255,20,.4); }
.vu-seg.gy.lit { background: #a0e820; box-shadow: 0 0 4px #a0e820; }
.vu-seg.y.lit  { background: var(--vu-yellow); box-shadow: 0 0 4px var(--vu-yellow), 0 0 8px rgba(255,238,0,.3); }
.vu-seg.r.lit  { background: var(--vu-red); box-shadow: 0 0 4px var(--vu-red), 0 0 8px rgba(255,34,0,.3); }

/* ---- Finestra cassetta ---- */
.deck-window {
  margin: 0 20px;
  background: linear-gradient(180deg, #090704 0%, #060402 100%);
  border: 2px solid #0a0806;
  border-top: 2px solid #1a1510;
  border-radius: 2px;
  padding: 10px 12px;
  position: relative;
  box-shadow: inset 0 2px 10px rgba(0,0,0,.95), inset 0 0 30px rgba(0,0,0,.6);
  overflow: hidden;
}
/* Riflesso vetro */
.deck-window::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, rgba(255,255,255,.025) 0%, transparent 100%);
  pointer-events: none; z-index: 10;
}

/* ---- Cassetta dentro la finestra ---- */
.cassette-shell {
  width: 100%;
  aspect-ratio: 2.5 / 1.15;
  position: relative;
  border-radius: 6px 6px 10px 10px;
  background: linear-gradient(160deg, #4a4035 0%, #2e2820 50%, #1e1c14 100%);
  border: 1.5px solid #5a5040;
  border-bottom-color: #1a1510;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), inset 0 -2px 4px rgba(0,0,0,.5), 0 2px 8px rgba(0,0,0,.8);
}

/* Label blu */
.cassette-label {
  position: absolute;
  top: 7%; left: 4%; right: 4%; height: 42%;
  background: linear-gradient(135deg, #2a4e8c 0%, #1a3a7a 60%, #0f2a60 100%);
  border-radius: 3px 3px 0 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.cassette-label::before {
  content: '';
  position: absolute; inset: 0;
  background: repeating-linear-gradient(0deg,
    transparent 0, transparent 3px,
    rgba(255,255,255,.02) 3px, rgba(255,255,255,.02) 4px);
}
.cassette-label__side {
  position: absolute; top: 12%; left: 6%;
  font-family: 'Oswald', sans-serif;
  font-size: clamp(0.45rem, 2vw, 1.6rem); font-weight: 700;
  color: rgba(255,255,255,.65);
  background: rgba(255,255,255,.1); padding: 1px 5px; border-radius: 2px; letter-spacing: 1px;
}
.cassette-label__title {
  position: absolute; top: 38%; left: 6%; right: 6%;
  font-family: 'Patrick Hand', cursive;
  font-size: clamp(0.5rem, 1.8vw, 1.8rem);
  color: #ffe090; white-space: nowrap; overflow: hidden;
}
.cassette-label__type {
  position: absolute; bottom: 10%; right: 5%;
  font-family: 'Oswald', sans-serif;
  font-size: clamp(0.4rem, 1.3vw, 1.6rem);
  letter-spacing: 2px; color: rgba(255,255,255,.4); text-transform: uppercase;
}

/* Finestra bobine cassetta */
.cassette-reelwindow {
  position: absolute;
  bottom: 10%; left: 6%; right: 6%; height: 40%;
  background: linear-gradient(180deg, #0a0804 0%, #060402 100%);
  border-radius: 3px 3px 7px 7px;
  border: 1.5px solid rgba(0,0,0,.8);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 8%;
}
.cassette-reelwindow::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 50%; height: 28%;
  background: linear-gradient(90deg, rgba(255,255,255,.03), transparent);
  z-index: 5;
}
.cassette-tape-line {
  position: absolute; bottom: 14%;
  left: 26%; right: 26%;
  height: 2px; background: rgba(160,90,50,.5); z-index: 2;
}

/* Bobine */
.c-reel { width: 32%; aspect-ratio: 1; position: relative; z-index: 3; }
.c-reel__outer {
  width: 100%; height: 100%; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #6a5a40 0%, #3a2e1e 40%, #1a1408 100%);
  border: 1.5px solid #5a4a30;
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.08), inset 0 -1px 3px rgba(0,0,0,.8), 0 1px 4px rgba(0,0,0,.8);
}
.c-reel__hub {
  width: 36%; height: 36%; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #8a7a58 0%, #3a3020 60%, #1a1508 100%);
  border: 1px solid #4a3a20;
}
.c-reel__outer::before, .c-reel__outer::after {
  content: '';
  position: absolute;
  width: 58%; height: 1.5px;
  background: linear-gradient(90deg, transparent, rgba(150,120,70,.4), transparent);
}
.c-reel__outer::before { transform: rotate(0deg); }
.c-reel__outer::after  { transform: rotate(60deg); }
.c-reel__hub::after {
  content: '';
  position: absolute;
  top: 50%; left: -90%;
  width: 280%; height: 1.5px;
  background: linear-gradient(90deg, transparent, rgba(150,120,70,.35), transparent);
  transform: translateY(-50%) rotate(120deg); transform-origin: center;
}

/* Viti cassetta */
.c-screw {
  position: absolute; width: 7px; height: 7px;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #777 0%, #333 70%);
  border: 1px solid #1a1a1a;
}
.c-screw::before {
  content: '+'; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); font-size: 5px; color: #555; line-height: 1;
}
.c-screw.tl { top: 4px;    left: 6px; }
.c-screw.tr { top: 4px;    right: 6px; }
.c-screw.bl { bottom: 3px; left: 6px; }
.c-screw.br { bottom: 3px; right: 6px; }

/* Fori guida */
.c-holes {
  position: absolute; bottom: 4%; left: 50%; transform: translateX(-50%);
  display: flex; gap: 30%; width: 50%; justify-content: center;
}
.c-hole {
  width: 7px; height: 7px; border-radius: 50%;
  background: #060402; border: 1px solid #1e1810;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.9);
}

/* Strip modello */
.deck-model-strip {
  padding: 5px 20px 3px;
  display: flex; justify-content: center; gap: 10px; align-items: center;
}
.deck-model-strip span {
  font-family: 'Oswald', sans-serif; font-size: 7.5px;
  letter-spacing: 2.5px; color: rgba(255,200,80,.2); text-transform: uppercase;
}
.deck-model-strip span.dim { color: rgba(255,255,255,.08); }

/* ---- Tasti controllo ---- */
.controls {
  margin: 0 20px;
  padding: 8px 10px 10px;
  display: flex; gap: 5px;
  background: linear-gradient(180deg, #151008 0%, #0e0c08 100%);
  border: 1px solid #0a0806;
  border-top: 1px solid #1a1510;
  border-radius: 0 0 2px 2px;
  position: relative;
}
.controls::before {
  content: '';
  position: absolute; bottom: 0; left: 10%; right: 10%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,160,40,.1), transparent);
}

.controls_button {
  flex: 1;
  aspect-ratio: 1.15 / 1;
  border-radius: 3px;
  border: 1px solid transparent;
  background:
    radial-gradient(at 25% 20%, rgba(255,255,255,.06), transparent) 0 0 / 100% 100% padding-box,
    linear-gradient(170deg, #353020 0%, #1e1a14 40%, #141008 100%) border-box;
  outline: 1px solid #080604;
  color: rgba(255,210,100,.45);
  position: relative;
  cursor: pointer;
  transition: all .08s;
  box-shadow:
    0 2px 4px rgba(0,0,0,.7), 0 4px 10px rgba(0,0,0,.5),
    inset 0 1px 0 rgba(255,255,255,.05), inset 0 -1px 0 rgba(0,0,0,.5);
  transform: perspective(100px) translateZ(2px);
}
.controls_button.pressed {
  transform: perspective(100px) translateZ(-1px);
  box-shadow: 0 0 1px rgba(0,0,0,.7), inset 0 2px 4px rgba(0,0,0,.6);
}

.controls_button::before {
  content: attr(data-value);
  position: absolute; bottom: 4px; left: 0; right: 0;
  text-align: center;
  font-family: 'Oswald', sans-serif;
  font-size: clamp(5px, 1.1vw, 7.5px);
  letter-spacing: 1px; text-transform: uppercase;
  color: rgba(255,200,80,.25);
}
.controls_button::after {
  content: '';
  position: absolute;
  top: 34%; left: 50%;
  transform: translate(-50%, -50%);
}
.controls_button._rec::after {
  width: clamp(8px,1.8vw,13px); height: clamp(8px,1.8vw,13px);
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #ff7070, #cc0000);
  box-shadow: 0 0 4px rgba(255,50,50,.35);
}
.controls_button._rew::after {
  width: clamp(10px,2vw,15px); height: clamp(8px,1.6vw,11px);
  background: currentcolor;
  clip-path: polygon(0 50%, 50% 0, 50% 45%, 100% 0, 100% 100%, 50% 55%, 50% 100%);
}
.controls_button._play::after {
  width: 0; height: 0; border-style: solid;
  border-width: clamp(5px,1.3vw,8px) 0 clamp(5px,1.3vw,8px) clamp(8px,1.8vw,13px);
  border-color: transparent transparent transparent currentcolor;
  background: none;
}
.controls_button._ffwd::after {
  width: clamp(10px,2vw,15px); height: clamp(8px,1.6vw,11px);
  background: currentcolor;
  clip-path: polygon(100% 50%, 50% 0, 50% 45%, 0 0, 0 100%, 50% 55%, 50% 100%);
}
.controls_button._stop::after {
  width: clamp(8px,1.8vw,13px); height: clamp(8px,1.8vw,13px);
  background: currentcolor; border-radius: 1px;
}
.controls_button._pause::after {
  width: clamp(8px,1.6vw,12px); height: clamp(8px,1.6vw,12px);
  background: linear-gradient(90deg, currentcolor 33%, transparent 33% 67%, currentcolor 67%);
}

/* Play attivo */
.player-playing .controls_button._play {
  background:
    radial-gradient(at 25% 20%, rgba(255,200,80,.1), transparent) 0 0 / 100% 100% padding-box,
    linear-gradient(170deg, #2a2218 0%, #1a1610 100%) border-box;
  color: var(--amber);
  box-shadow: 0 0 8px rgba(255,160,40,.25), inset 0 2px 4px rgba(0,0,0,.6);
  transform: perspective(100px) translateZ(-1px);
}
.player-playing .c-reel__outer {
  animation: reel-spin 2.5s linear infinite;
}
.player-playing .c-reel:last-child .c-reel__outer {
  animation-duration: 2.9s;
}

/* Piedini */
.deck-feet {
  margin: 4px 20px 0;
  display: flex; justify-content: space-between; padding: 0 24px;
}
.deck-foot {
  width: 28px; height: 5px;
  background: linear-gradient(180deg, #1a1510 0%, #0a0806 100%);
  border: 1px solid #080604; border-top: none;
  border-radius: 0 0 3px 3px;
  box-shadow: 0 2px 4px rgba(0,0,0,.5);
}

/* ============================================================
   PAGE LOADER — COMPACT CASSETTE
   ============================================================ */
.page-loader{
    display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0,0,0,.8);
  z-index: 10000;
  transition: width .3s ease;
}
.page-loader {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(ellipse 60% 60% at 50% 50%, #0f0c08 0%, #050402 100%);
  transition: opacity .3s ease;
}
.page-loader.hide { opacity: 0; pointer-events: none; }

.compact-cassette {
  width: min(340px, 88vw);
  filter: drop-shadow(0 8px 30px rgba(0,0,0,.9)) drop-shadow(0 2px 8px rgba(0,0,0,.7));
}

.cc-body {
  width: 100%;
  aspect-ratio: 2.5 / 1.5;
  position: relative;
  border-radius: 6px 6px 14px 14px;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.04) 0%, transparent 50%),
    linear-gradient(160deg, #2e2820 0%, #181410 50%, #0e0b08 100%);
  border: 1.5px solid #3a3025;
  border-bottom-color: #151008;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), inset 0 -2px 6px rgba(0,0,0,.6), 0 2px 0 #0a0806;
}

/* Label beige/oro */
.cc-label {
  position: absolute;
  top: 6%; left: 4%; right: 4%; height: 40%;
  background: linear-gradient(135deg, #d0b878 0%, #c0a060 30%, #e0c888 60%, #c8b070 100%);
  border-radius: 3px;
  border: 1px solid rgba(0,0,0,.2);
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 3px rgba(0,0,0,.4);
}
.cc-label::before {
  content: '';
  position: absolute; inset: 0;
  background:
    repeating-linear-gradient(90deg, transparent 0, transparent 9px, rgba(0,0,0,.015) 9px, rgba(0,0,0,.015) 10px),
    repeating-linear-gradient(0deg,  transparent 0, transparent 5px, rgba(0,0,0,.01) 5px, rgba(0,0,0,.01) 6px);
}
.cc-label__brand {
  position: absolute; top: 11%; left: 5%;
  font-family: 'Oswald', sans-serif;
  font-size: clamp(0.5rem, 2.2vw, 0.85rem); font-weight: 600;
  letter-spacing: 3px; color: #1a1208; text-transform: uppercase;
}
.cc-label__title {
  position: absolute; top: 46%; left: 5%; right: 5%;
  font-family: 'Patrick Hand', cursive;
  font-size: clamp(0.44rem, 1.7vw, 0.72rem); color: #3a2a10;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cc-label__type {
  position: absolute; bottom: 10%; right: 4%;
  font-family: 'Oswald', sans-serif;
  font-size: clamp(0.38rem, 1.3vw, 0.58rem);
  letter-spacing: 2px; color: rgba(30,20,5,.55); text-transform: uppercase;
}
.cc-label__side {
  position: absolute; top: 9%; right: 5%;
  width: clamp(13px, 3.5vw, 22px); height: clamp(13px, 3.5vw, 22px);
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #3a6abf, #0a2a7a);
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,.2);
}
.cc-label__side span {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(0.38rem, 1.2vw, 0.58rem); font-weight: 700; color: #fff; letter-spacing: 0;
}

/* Finestra bobine CC */
.cc-window {
  position: absolute;
  bottom: 12%; left: 5%; right: 5%; height: 38%;
  background: linear-gradient(180deg, #080604 0%, #050402 100%);
  border-radius: 3px 3px 8px 8px;
  border: 2px solid #0a0806;
  overflow: visible;
  display: flex; align-items: center; justify-content: space-between; padding: 0 7%;
}
.cc-window::before {
  content: '';
  position: absolute; top: 0; left: 5%; right: 55%; height: 28%;
  background: linear-gradient(90deg, rgba(255,255,255,.04), transparent);
  border-radius: 2px; z-index: 5; pointer-events: none;
}
.cc-tape-arch {
  position: absolute; bottom: 0; left: 20%; right: 20%; height: 40%;
  border: 2px solid rgba(120,70,30,.4); border-top: none; border-radius: 0 0 5px 5px; z-index: 2;
}

/* Bobine CC */
.cc-reel { width: 32%; aspect-ratio: 1; position: relative; z-index: 3; flex-shrink: 0; }
.cc-reel__ring {
  width: 100%; height: 100%; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #5a4a30 0%, #2a2018 45%, #100e08 100%);
  border: 1.5px solid #3a2e1a;
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.07), inset 0 -1px 3px rgba(0,0,0,.8), 0 1px 4px rgba(0,0,0,.8);
}
.cc-reel__center {
  width: 34%; height: 34%; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #8a7a58 0%, #2a2015 70%);
  border: 1px solid #4a3a20; position: relative;
}
.cc-reel__ring::before, .cc-reel__ring::after {
  content: '';
  position: absolute;
  width: 54%; height: 1.5px;
  background: linear-gradient(90deg, transparent 0%, rgba(120,90,40,.45) 30%, rgba(120,90,40,.45) 70%, transparent 100%);
}
.cc-reel__ring::before { transform: rotate(0deg); }
.cc-reel__ring::after  { transform: rotate(60deg); }
.cc-reel__center::after {
  content: '';
  position: absolute; top: 50%; left: -80%; width: 260%; height: 1.5px;
  background: linear-gradient(90deg, transparent, rgba(120,90,40,.4), transparent);
  transform: translateY(-50%) rotate(120deg); transform-origin: center;
}

/* Animazione bobine CC */
.cc-reel__ring { animation: reel-spin 1.8s linear infinite; }
.cc-reel:last-child .cc-reel__ring { animation-duration: 2.3s; animation-direction: reverse; }

/* Viti CC */
.cc-screw {
  position: absolute; width: 8px; height: 8px; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #666 0%, #222 70%);
  border: 1px solid #111;
}
.cc-screw::before {
  content: '×'; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%); font-size: 5px; color: #444; line-height: 1;
}
.cc-screw.tl { top: 4px;    left: 6px; }
.cc-screw.tr { top: 4px;    right: 6px; }
.cc-screw.bl { bottom: 6px; left: 6px; }
.cc-screw.br { bottom: 6px; right: 6px; }
.cc-screw.tc { top: 4px;    left: 50%; transform: translateX(-50%); }

/* Fori guida nastro CC */
.cc-guides {
  position: absolute; bottom: 5%; left: 50%; transform: translateX(-50%);
  display: flex; gap: 30%; width: 42%; justify-content: center;
}
.cc-guide {
  width: 9px; height: 9px; border-radius: 50%;
  background: #050402; border: 1.5px solid #1a1510;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.9);
}

/* Linguette */
.cc-notches {
  position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 60%; height: 11%;
  display: flex; justify-content: space-between; align-items: flex-end;
}
.cc-notch {
  width: 18%; height: 100%;
  background: linear-gradient(180deg, #1a1510 0%, #0a0806 100%);
  border: 1px solid #0a0806; border-top: 1px solid #2a2018;
  border-radius: 0 0 2px 2px;
}

/* Caption con dots */
.cc-caption {
  text-align: center; margin-top: 22px;
  display: flex; flex-direction: column; gap: 4px; align-items: center;
}
.cc-caption__loading {
  font-family: 'Oswald', sans-serif; font-size: 9px; letter-spacing: 4px;
  color: rgba(255,200,80,.3); text-transform: uppercase;
  display: flex; align-items: center; gap: 8px;
}
.cc-caption__dots span {
  display: inline-block; width: 3px; height: 3px; border-radius: 50%;
  background: rgba(255,200,80,.4);
  animation: dot-blink 1.4s ease-in-out infinite;
}
.cc-caption__dots span:nth-child(2) { animation-delay: .22s; }
.cc-caption__dots span:nth-child(3) { animation-delay: .44s; }

/* ============================================================
   KEYFRAMES
   ============================================================ */
@keyframes reel-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes dot-blink {
  0%, 100% { opacity: .2; transform: scale(1); }
  50%       { opacity: 1;  transform: scale(1.5); }
}

/* ============================================================
   PREVIEW BADGE & PLAY TOGGLE
   ============================================================ */
.preview-badge {
  position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);
  background: rgba(10,8,5,.8); border: 1px solid rgba(255,200,80,.1);
  backdrop-filter: blur(8px); border-radius: 2px;
  padding: 6px 16px;
  font-family: 'Oswald', sans-serif; font-size: 8px; letter-spacing: 2.5px;
  color: rgba(255,200,80,.2); text-transform: uppercase;
  pointer-events: none; white-space: nowrap; z-index: 100;
}
.play-toggle {
  position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%);
  z-index: 100001;
  background: rgba(20,15,8,.85); border: 1px solid rgba(255,200,80,.2);
  color: rgba(255,200,80,.5); font-family: 'Oswald', sans-serif;
  font-size: 9px; letter-spacing: 2.5px; text-transform: uppercase;
  padding: 7px 18px; border-radius: 2px; cursor: pointer; transition: all .2s; white-space: nowrap;
}
.play-toggle:hover { background: rgba(30,22,10,.95); color: var(--amber); border-color: rgba(255,200,80,.4); }

/* RESPONSIVE */
@media (max-width: 480px) {
  .deck-window { margin: 0 12px; }
  .controls { margin: 0 12px; }
  .deck-feet { margin: 4px 12px 0; }
  .deck-top { padding: 10px 14px 8px; }
}


/* ================================================================
   RESPONSIVE — MEDIA QUERIES CONSOLIDATE
   (tutte le query del tema in un unico blocco, ordinate per breakpoint)
   ================================================================ */

@media (min-width: 1601px) {
.container {
        width: 1560px;
    }
}

@media (min-width: 1441px) {
#column-left,
    #column-right {
        width: 20%;
    }
    #content.col-sm-9{
        width: 80%;
    }
    #content.col-sm-6{
        width: 60%;
    }

.col-lg-2:nth-child(6n+1),
    .col-lg-3:nth-child(4n+1),
    .col-lg-4:nth-child(3n+1),
    .col-lg-6:nth-child(2n+1){
        clear: left;
    }
}

@media (min-width: 992px) {

#menu .dropdown-menu.navcol-menu.item-column .dropdown-submenu.sub-menu-item > a {
        font-weight: 600;
    }
    #menu .dropdown-inner a {
        display: block;
        padding: 5px 15px;
        font-size: 16px;
        font-weight: 400;
        text-transform: capitalize;
        min-width: 180px;
        text-align: left;

    }
    #menu ul li.hidden_menu .dropdown-inner .dropdown-menu {
        display: none;
    }
    #menu .dropdown-menu,
    #menu .hidden_menu.menu_drop .dropdown-inner{
        display: block;
        top: 50px;
        left: 0px;
        min-width: 180px;
        z-index: 999;
        text-align: left;
        right: auto;
        padding: 10px 0;
    }
    #menu .dropdown-menu,
    #menu .hidden_menu.menu_drop .dropdown-inner,
    #menu .column-1 .dropdown-inner .dropdown-submenu ul.sub-menu{
        position: absolute;
        top: 125px;
        padding: 10px 0;
        visibility: hidden;
        background: var(--primary-color);
        border: none;
        border-top: 2px solid var(--primary-hover-color);
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        opacity: 0;
        -khtml-opacity: 0;
        -webkit-opacity: 0;
        -moz-opacity: 0;
        filter: alpha(opacity=0);
        transform-origin: 15% 15% 0;
        -webkit-transition: all 0.5s ease 0s;
        -moz-transition: all 0.5s ease 0s;
        -o-transition: all 0.5s ease 0s;
        transition: all 0.5s ease 0s;
        filter: alpha(opacity=0);
        transform-origin: center top 0;
        box-shadow: 0 1px 5px rgba(0,0,0,0.11);
        -moz-box-shadow: 0 1px 5px rgba(0,0,0,0.11);
        -webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.11);
    }
    #menu .dropdown:hover .dropdown-menu,
    #menu ul li.hidden_menu.menu_drop:hover .dropdown-inner,
    #menu .column-1 .dropdown-inner .dropdown-submenu:hover ul.sub-menu{
        display: block;
        top: 100%;
        visibility: visible;
        opacity: 1;
        -khtml-opacity: 1;
        -webkit-opacity: 1;
        -moz-opacity: 1;
        visibility: visible;
        filter: alpha(opacity=100);
    }
    #menu .column-1 .dropdown-inner .dropdown-submenu ul.sub-menu {
        left: 100%;
        top: 100%;
    }
    #menu .column-1 .dropdown-inner .dropdown-submenu:hover ul.sub-menu {
        top: 0px;
    }
    #menu ul.nav .item-column {
        padding: 10px;
    }
    #menu .dropdown-menu.navcol-menu.item-column .dropdown-submenu.sub-menu-item > a {
        border-bottom: 1px solid var(--border-color);

        font-size: 16px;
        font-weight: 400;
        margin: 0 10px 5px;
        padding: 5px 0 5px 0;
    }
    #menu ul.nav .item-column ul.list-unstyled li a {
        padding-left: 0;
        padding-right: 0;
        margin: 0 10px;
    }

.product-block.blog-block img {
        transition: all 1.2s ease-in-out 0s;
        -moz-transition: all 1.2s ease-in-out 0s;
        -webkit-transition: all 1.2s ease-in-out 0s;
        -ms-transition: all 1.2s ease-in-out 0s;
        -o-transition: all 1.2s ease-in-out 0s;
    }
    .product-block.blog-block:hover img {
        transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        -o-transform: scale(1.5);
        -webkit-transform: scale(1.5);
    }

.testimonial-content {
        position: absolute;
        left: 30px;
        right: 30px;
        bottom: 30px;
        top: 30px;
        display: flex;
        align-items: center;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all .4s ease-in-out 0s;
        -moz-transition: all .4s ease-in-out 0s;
        -ms-transition: all .4s ease-in-out 0s;
        -o-transition: all .4s ease-in-out 0s;
        transition: all .4s ease-in-out 0s;
        background: rgba(255, 255, 255, 0.8);
        text-align: center;
        padding: 30px 32px 60px;
        transform: translateY(0%);
        -moz-transform: translateY(0%);
        -webkit-transform: translateY(0%);
    }
    .testimonial-inner:hover .testimonial-content {
        opacity: 1;
        visibility: visible;
        -webkit-transition: all .4s ease-in-out 0s;
        -moz-transition: all .4s ease-in-out 0s;
        -ms-transition: all .4s ease-in-out 0s;
        -o-transition: all .4s ease-in-out 0s;
        transition: all .4s ease-in-out 0s;
        transform: translateY(0%);
        -moz-transform: translateY(0%);
        -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
        -o-transform: translateY(0%);
    }
}

@media (min-width: 768px) {
.newsletter-popup .modal-dialog {
        width: 100%;
    }

.product-img {
        position: sticky;
        top: 10px;
    }
}

@media (min-width: 681px) {
.product-list .product-thumb .image {
        float: left;
        margin-right: 30px;
    }
}

@media (max-width: 1600px) and (min-width: 1441px) {
.container {
        width: 1400px;
    }
}

@media (min-width: 1441px) and (max-width: 1600px) {
#column-left .product-thumb > .image,
    #column-right .product-thumb > .image{
        margin-right: 10px;
    }
    #column-left .product-thumb > .thumb-description,
    #column-right .product-thumb > .thumb-description {
        float: left;
        /*width: 59.3%;*/
    }
}

@media (min-width: 1200px) and (max-width: 1440px) {
.product-grid.col-lg-3{
        width: 33.3333%;
    }
    .product-grid.col-lg-4{
        width: 50%;
    }

#column-left .product-thumb > .image,
    #column-right .product-thumb > .image {
        width: 75px;
        margin-right: 10px;
    }

.col-lg-2:nth-child(6n+1),
    .col-lg-3:nth-child(3n+1),
    .col-lg-4:nth-child(2n+1),
    .col-lg-6:nth-child(2n+1){
        clear: left;
    }
}

@media (min-width: 992px) and (max-width: 1440px) {
.testimonial-content {
        left: 15px;
        right: 15px;
        bottom: 15px;
        top: 15px;
    }
    .testimonial-inner .testimonial-author {
        left: 15px;
        right: 15px;
        bottom: 15px;
        font-size: 20px;
        line-height: 20px;
        padding: 15px 10px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
#column-left .product-thumb > .image,
    #column-right .product-thumb > .image{
        margin-right: 5px;
        width: 70px;
    }
    #column-left .product-thumb > .thumb-description,
    #column-right .product-thumb > .thumb-description {
        /*width: 57.9%;*/
    }

.col-md-2:nth-child(6n+1),
    .col-md-3:nth-child(4n+1),
    .col-md-4:nth-child(3n+1),
    .col-md-6:nth-child(2n+1) {
        clear: left;
    }
}

@media (max-width: 991px) and (min-width: 600px) {
/* Mahardhi */
    #content, #column-left, #column-right {
        width: 100%;
    }
}

@media (min-width: 541px) and (max-width: 991px) {
.col-sm-2:nth-child(6n+1),
    .col-sm-3:nth-child(4n+1),
    .col-sm-4:nth-child(3n+1),
    .col-sm-6:nth-child(2n+1) {
        clear: left;
    }
}

@media (max-width: 768px) {
    .section {
      padding: var(--s7) 9px;
    }
    .promo-banner__inner {
        grid-template-columns: 1fr;
    }
    .promo-banner, .features {
        margin: 0 -15px;
    }
    .features__inner {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    .product-layout {
          width: 50%;
        }
}

@media (max-width: 540px) and (min-width: 320px) {
.box :not(.owl-carousel) .col-xs-4,
    .product-layout.product-grid{
        width: 100%;
    }
    .col-xs-2:nth-child(6n+1),
    .col-xs-3:nth-child(4n+1),
    .col-xs-4:nth-child(2n+1),
    .col-xs-6:nth-child(2n+1) {
        clear: left;
    }
}

@media (max-width: 1600px) {
.testimonial-author-text {
        margin: 0 0 15px;
    }
    .testimonial-content {
        padding: 20px;
    }

#additional-carousel{
        width: calc(100% - 28%);
    }
}

@media (max-width: 1440px) {
.testimonial-content {
        padding: 15px;
    }
    .testimonial-author-text {
        font-size: 20px;
        margin: 0 0 10px;
    }

.service .promo-title {
        font-size: 16px;
    }
    .service .promo-desc {
        font-size: 14px;
    }

.breadcrumb-back {
        padding: 180px 0 10px;
    }

#additional-carousel {
        width: calc(100% - 15%);
    }
    #additional-carousel .owl-nav .owl-next {
        right: -10px;
    }
    #additional-carousel .owl-nav .owl-prev {
        left: -10px;
    }
    .propage-tab{
        margin-top: 50px;
    }

.mt-110{
        margin-top: 80px;
    }
    .mt-80{
        margin-top: 50px;
    }
    .mt-50{
        margin-top: 20px;
    }
}

@media (max-width: 1199px) {
#logo img {
        width: 140px;
    }

#menu .nav > li > a {
        padding: 30px 10px;
    }

.inner2 .promo-title {
        font-size: 30px;
        line-height: 30px;
    }

.blog-block h4, h3.article-page-title {
        font-size: 20px;
    }

.footer-top {
        padding: 46px 0 50PX;
    }
    .position-footer-left .social-media {
        margin: 10px 0 0;
    }
    .social-media a + a {
        margin: 0 0 0 3px;
    }

.service-icon {
        font-size: 40px;
    }

.breadcrumb-back {
        padding: 190px 0 70px;
    }

.filter_box,
    #column-left .block_box,
    #column-right .block_box,
    .category-list #selectMe-desk,
    .account-content .list-unstyled,
    .sidebar .list-unstyled {
        padding: 20px 15px;
    }
    #column-left .product-layout + .product-layout .product-thumb,
    #column-right .product-layout + .product-layout .product-thumb {
        margin: 20px 0 0 0;
    }
    #column-left h3,
    #column-right h3,
    #column-left .box-content h3,
    #column-right .box-content h3{
        padding: 10px 15px;
    }
    #column-left .product-thumb .rating,
    #column-right .product-thumb .rating{
        margin: 8px 0 0 0;
    }

.cat-pagination-right .cat-show {
        padding-left: 0;
    }
    #list-view.btn-default,
    #grid-view.btn-default {
        height: 34px;
        width: 34px;
    }
    #list-view.btn-default i,
    #grid-view.btn-default i {
        font-size: 16px;
    }
    #grid-view.btn-default {
        margin: 0 5px 0 0;
    }
    #compare-total.btn.btn-link{
        padding: 8px 0;
    }
    .cat-pagination-right > div{
        padding: 0;
    }
    #compare-total.btn.btn-link{
        font-size: 14px;
    }
    .text_limit, .text_sort{
        font-size: 14px;
    }
    .cat_info{
        padding: 10px 15px;
    }

.pro_pagination{
        padding: 10px 0
    }

.rating .product-rating {
        width: 100%;
        margin: 0 0 20px 0;
    }
    #product .btn-groups{
        margin: 10px 0 0;
        display: block;
    }
    #additional-carousel .image-additional a,
    #quick-carousel .image-additional a {
        margin: 0 5px;
    }
    #product-page .tab-content {
        padding: 20px;
    }
}

@media (max-width: 991px) {
.header__nav {
  flex: 0 0 20px;
}
a.scrollToTop {
        right: 15px;
        bottom: 15px;
    }

.quickview-wrapper{
        width: 90%;
    }

.newsletter-content-innner h3 {
        font-size: 30px;
    }
    .newsletter-content-innner p {
        font-size: 16px;
        margin: 20px 0;
    }
    .newsletter-content-innner .newsletter_usr_popup_email {
        height: 34px;
    }
    #frmnewsletterpopup button {
        padding: 7px 20px;
    }

.header-top {
        padding: 10px 0;
    }
    .header-right i {
        font-size: 18px;
    }
    #cart > .btn:before {
        font-size: 18px;
        padding: 0;
    }
    #cart-total {
        right: -7px;
    }
    .header-links > div + div {
        margin: 0 0 0 20px;
    }

#menu{
        margin: 0 0 0 20px;
    }
    #topCategoryList {
        background: var(--secondary-color);
        display: block!important;
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        max-width: 350px;
        z-index: 999;
        margin: 0;
        -webkit-transform: translate(-400px,0);
        -moz-transform: translate(-400px,0);
        -ms-transform: translate(-400px,0);
        -o-transform: translate(-400px,0);
        transform: translate(-400px,0);
        -moz-transition-property: -moz-transform;
        -o-transition-property: -o-transform;
        -webkit-transition-property: -webkit-transform;
        transition-property: transform;
        -moz-transition-duration: .5s;
        -o-transition-duration: .5s;
        -webkit-transition-duration: .5s;
        transition-duration: .5s;
        overflow: auto;
    }
    #topCategoryList.box-menu {
        -webkit-transform: translate(0,0);
        -moz-transform: translate(0,0);
        -ms-transform: translate(0,0);
        -o-transform: translate(0,0);
        transform: translate(0,0);
    }
    .menu-close {


        padding: 12px 15px;
        font-weight: 600;
        font-size: 16px;
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
    }
    .menu-close i{
        line-height: 20px;
        font-size: 12px;
    }
    #menu li i{
        font-size: 14px;
    }
    #menu .btn-navbar.open-menu:after {
        top: 0;
        left: 0;
        content: "";
        width: 100%;
        display: block;
        position: fixed;
        height: 100%;
        background: rgba(0,0,0,.5);
        z-index: 99;
        transition: opacity 0.2s cubic-bezier(0,0,.3,1);
        transition-delay: 0.1s;
    }
    #menu .btn-navbar span:before,
    #menu .btn-navbar span:after {
        content: "";
        position: absolute;
        width: 100%;
        height: 1px;
        background: var(--text-hi);
        left: 0;
        transition: all 0.5s ease 0s;
        -moz-transition: all 0.5s ease 0s;
        -webkit-transition: all 0.5s ease 0s;
        -o-transition: all 0.5s ease 0s;
    }
    #menu .btn-navbar span:after {
        top: 6px;
    }
    #menu .btn-navbar span:before {
        top: -6px;
    }
    #menu .btn-navbar span {
        position: absolute;
        width: 20px;
        height: 1px;
        background: var(--text-hi);
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        text-align: center;
    }
    #menu .nav > li > a,
    #menu #topCategoryList .dropdown-inner a {
        color: var(--primary-color);
        font-weight: 400;
        padding: 6px 30px 6px 15px;
        display: block;
        font-size: 14px;
        text-transform: capitalize;
    }
    #menu .nav > li > a,
    #menu #topCategoryList .menu_drop > .dropdown-inner > li > a {
        font-size: 14px;
    }
    #menu #topCategoryList ul {
        float: none;
        display: block;
        text-align: left;
        margin: 0;
        background: transparent;
    }
    #menu #topCategoryList ul.category-list {
        margin-bottom: 10px;
    }
    #menu .dropdown-inner,
    #navCategory .dropdown-inner {
        display: block;
    }
    #topCategoryList .dropdown.menulist .dropdown-menu .dropdown-inner {
        display: block;
        padding: 0 10px;
    }
    #topCategoryList .dropdown.menulist .dropdown-menu {
        position: relative;
        float: none;
        background-color: transparent;
        border: none;
        box-shadow: none;
        display: none;
        padding: 0;
    }
    #menu #topCategoryList .dropdown-inner .dropdown-submenu ul.sub-menu {
        display: none;
        position: unset;
        border: none;
        padding: 0 10px;
    }
    #topCategoryList li .toggle-menu {
        position: absolute;
        right: 0;
        top: 0;
        padding: 9px 10px;
        color: var(--primary-color);
    }
    #topCategoryList .dropdown-submenu > .fa {
        display: none;
    }
    #topCategoryList ul li {
        float: none;
    }
    #topCategoryList #more_cat {
        display: none;
    }
    #menu .btn-navbar {
        display: block;
        margin: 0;
        border: none;
        background: rgba(0, 0, 0, 0);
    }
    .category-list .menu-item.dropdown .dropdown-menu {
        position: relative;
        box-shadow: none;
        width: 100%;
        border: none;
        padding: 0 15px;
        float: none;
    }
    #menu #topCategoryList > ul {
        margin: 0 0 10px;
    }

.inner2 .button {
        padding: 7px 20px;
    }

#cart .dropdown-menu li p .btn,
    .btn-default,
    .btn-primary,
    .btn-info,
    .btn-danger{
        padding: 7px 20px;
    }

.page-title h3{
        font-size: 30px;
        line-height: 30px;
        margin: 0 0 22px;
    }
    ._tabs .nav-tabs>li> a{
        padding: 0 20px;
        font-size: 16px;
    }
    ._tabs .nav-tabs{
        margin: 0 0 15px;
    }
    .product-thumb {
        margin-bottom: 20px;
    }
    .brand .col-sm-12,
    .category-layout,
    .product-layout,
    #category-blogs .blog-layout {
        padding: 0 5px;
    }
    .brand .row,
    .category-featured .row,
    .box .row,
    .mblog .box-content > .row,
    .testimonial-block .row {
        margin: 0 -5px;
    }
    .product-thumb .product-title a,
    .product-thumb .price {
        font-size: 16px;
    }
    .product-thumb .price-old {
        font-size: 14px;
    }
    .product-list .product-thumb .description {
        margin: 8px 0 0;
    }

    .product-thumb .button-group button{
        height: 35px;
        width: 35px;
        font-size: 14px;
        border-radius: 5px;
    }
    .product-thumb .addcart {
        position: unset;
        opacity: 1;
        bottom: auto;
        margin-top: 3px;
    }
    .product-list .product-thumb .button-group button + button {
        margin: 0 0 0 5px;
    }

.slideshow .swiper-pagination {
        display: block;
        bottom: 0;
    }
    .slideshow .swiper-pager {
        display: none;
    }
    .swiper-viewport .swiper-pager > div,
    .owl-carousel.owl-theme .owl-nav div {
        margin: 0 5px;
    }

.brand .swiper-slide > div {
        padding: 20px 0;
    }

.blog-info .image {
        margin: 0;
    }
    h3.article-page-title {
        margin: 7px 0 0;
    }
    .blog-block {
        margin-bottom: 20px;
    }
    .block-date {
        font-size: 14px;
    }
    .block-day {
        font-size: 30px;
        line-height: 24px;
        display: inline-block;
        vertical-align: middle;
        margin: 0;
    }
    .block-month {
        display: inline-block;
        vertical-align: middle;
        margin: 0 0 0 5px;
    }
    .link_info {
        padding: 10px 0 0;
    }
    .article-container .page-title {
        margin-bottom: 15px;
    }
    .article-container .leave-hedding {
        padding: 10px 15px;
        font-size: 14px;
    }
    .blog-block .zoom-post a::before {
        height: 30px;
        width: 30px;
        line-height: 30px;
    }
    .blog-block .caption {
        padding: 10px 10px 15px;
        margin: 0;
    }
    .blog-text {
        font-size: 14px;
        margin: 7px 0;
    }
    #post_comment {
        padding: 15px 15px 1px;
    }
    .comment_cust {
        padding: 15px;
    }
    .singblog-description .blog-text {
        margin: 8px 0 0;
    }
    .zoom-post,
    .blog-block:hover .zoom-post {
        opacity: 1;
        right: 10px;
        top: 10px;
    }
    .article-container .singblog-description {
        padding: 15px;
    }

.testimonial-block .row-items {
        padding: 0 5px;
    }
    .testimonial-block .row {
        margin: 0 -5px;
    }
    .row-items {
        margin-bottom: 20px;
    }
    .testimonial-content {
        padding: 10px 10px;
        background: var(--secondary-color);
        text-align: center;
    }
    .testimonial-text {
        line-height: 24px;
    }

.newsletter-form.block-content {
        text-align: center;
    }
    .title-text h4 {
        font-size: 16px;
        margin: 0 0 10px;
    }
    .subscribe-form #newsletter_usr_email {
        height: 34px;
        padding: 5px 10px;
        text-align: center;
        width: 60%;
        margin: auto;
    }
    .subscribe-btn {
        padding: 7px 20px;
        margin-top: 15px;
    }

footer .footer-top {
        display: block;
        padding: 10px 0;
    }
    .position-footer-left, footer .footer-content {
        margin: 0;
    }
    .footer_aboutus img {
        width: 100px;
    }
    .footer-desc {
        margin: 8px 0 10px;
    }
    .social-media .list-unstyled {
        display: block!important;
        text-align: center;
    }
    .footer_bottom {
        padding: 15px 0;
    }
    footer h5,
    footer h4,
    footer .position-footer-left h5 {
        margin: 0 0 10px;
        font-size: 16px;
    }
    .footer-top .col-sm-2,
    .footer-top .col-sm-3,
    .footer-top .col-sm-4{
        width: 100%;
        float: unset;
        margin: 10px 0;
        border: none;
    }
    footer .col-sm-2 a,
    footer .col-sm-3 a {
        padding: 4px 0;
    }
    .social-media {
        margin: 0 0 20px;
    }
    footer .footer_bottom p {
        font-size: 14px;
        margin: 0 0 13px;
    }
    .social-media a i {
        height: 30px;
        width: 30px;
        line-height: 30px;
    }

.service-item{
        padding: 0 5px;
    }
    .service-box .row{
        margin: 0 -5px;
    }
    .service-item {
        width: 50%;
    }
    .service {
        display: flex;
        align-items: center;
        text-align: left;
    }
    .service-item:nth-child(3),
    .service-item:nth-child(4) {
        margin-top: 20px;
    }
    .service-item:nth-child(3) {
        clear: left;
    }
    .service-icon {
        margin: 0 15px 0 0;
    }
    .service .promo-title {
        font-size: 14px;
        margin: 0 0 5px;
    }
    .service .promo-desc {
        font-size: 12px;
        line-height: 16px;
    }

.breadcrumb-back{
        padding: 30px 0;
        margin: 0 0 20px 0;
    }
    .breadcrumb {
        font-size: 16px;
    }
    .page_title {
        margin: 0 0 5px 0;
    }

#column-left .product-thumb > .thumb-description,
    #column-right .product-thumb > .thumb-description{
     /*   width: 62.8%;*/
    }
    .toggled .toggle-open {
        position: absolute;
        right: 0;
    }
    #selectMe-desk {
        display: none;
    }
    #column-left .swiper-viewport,
    #column-right .swiper-viewport {
        display: none;
    }
    #column-left > div:first-child,
    #column-right > div:first-child{
        margin: 20px 0 0;
    }
    #column-left > div,
    #column-right > div{
        margin: 10px 0 0;
    }
    #column-left .toggled .toggle-open,
    #column-right .toggled .toggle-open{
        right: 15px;
    }
    #column-left h3,
    #column-right h3,
    #column-left .box-content h3,
    #column-right .box-content h3{
        font-size: 14px;
        padding: 8px 15px;
    }

.refine-search {
        margin: 0 0 10px;
    }
    .cat-name li a {
        font-size: 12px;
        padding: 4px 10px;
    }
    .cat_info {
        margin: 0 0 20px;
    }
    .cat-description p {
        margin: 0 0 13px;
    }
    .product-list .product-thumb .image{
        margin-right: 20px;
    }

.pro_pagination .text-left,
    .pro_pagination .text-right{
        width: 100%;
        float: unset;
        text-align: center;
        clear: both;
    }
    .pro_pagination .text-right {
        padding-top: 10px;
    }
    .pro_pagination .text-left{
        line-height: 20px;
    }
    .pagination>li>a,
    .pagination>li>span{
        width: 30px;
        height: 30px;
        line-height: 30px;
    }

.related-products-block{
        padding-top: 30px;
    }
    .propage-tab{
        margin-top: 20px;
    }
    .right_info h1,
    .quick-product-right h1 {
        font-size: 18px;
        margin: 0 0 8px;
    }
    .rating .product-rating{
        margin: 0 0 10px 0;
    }
    hr {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .pro_price {
        font-size: 18px;
    }
    #product .product-btn-quantity{
        display: block;
    }
    .product-btn-quantity .minus-plus{
        margin: 0 0 10px 0;
    }
    #product-page .tab-content {
        padding: 20px;
    }
    #product-page .nav-tabs>li> a{
        font-size: 14px;
        padding: 10px 0;
    }
    #product-page .nav-tabs li {
        margin: 0 15px;
    }
    #product .minus-plus > * {
        height: 34px;
        width: 34px;
    }
    .pro_wish i,
    .pro_comper i {
        font-size: 16px;
    }

.contact-left{
        margin-bottom: 30px;
    }

#accordion.panel-group .panel-default>.panel-heading{
        padding: 10px;
    }

.mt-110{
        margin-top: 55px;
    }
    .mt-80{
        margin-top: 30px;
    }
    .mt-50 {
        margin-top: 10px;
    }
    .mt-30{
        margin-top: 15px;
    }
    .category-row {
        margin: 0 -5px;
    }
    .form-group {
        margin-bottom: 10px;
    }
    .form-control{
        height: 34px;
    }

.header__actions {
        display: none;
    }
  .grid-banner {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
.newsletter-popup .modal-dialog {
        max-width: 90%;
    }

.service-icon {
        margin: 0 10px 0 0;
    }

.breadcrumb-back{
        padding: 20px 0;
    }

.cat-pagination-right{
        text-align: left;
        margin: 5px 0 0;
        padding: 0;
    }

.product-img {
        width: 480px;
        margin: 0 auto;
    }
    #additional-carousel{
        margin-bottom: 15px;
    }

.cms-block{
        margin-bottom: 15px;
    }

.table-responsive>.table-bordered>tbody>tr>td:first-child,
    .table-responsive>.table-bordered>tbody>tr>th:first-child,
    .table-responsive>.table-bordered>tfoot>tr>td:first-child,
    .table-responsive>.table-bordered>tfoot>tr>th:first-child,
    .table-responsive>.table-bordered>thead>tr>td:first-child,
    .table-responsive>.table-bordered>thead>tr>th:first-child {
        border-left: 1px solid #ddd;
    }
    .table-responsive>.table-bordered>tbody>tr>td:last-child,
    .table-responsive>.table-bordered>tbody>tr>th:last-child,
    .table-responsive>.table-bordered>tfoot>tr>td:last-child,
    .table-responsive>.table-bordered>tfoot>tr>th:last-child,
    .table-responsive>.table-bordered>thead>tr>td:last-child,
    .table-responsive>.table-bordered>thead>tr>th:last-child{
        border-left: 0;
    }

#column-left,
    #column-right {
    }
    .mt-110,
    .mt-80{
        margin-top: 20px;
    }
    .mt-50 {
        margin-top: 0;
    }
}

@media (max-width: 680px) {
.product-list .product-thumb .image img{
        width: auto;
        margin: 0;
    }
    .special-image{
        width: auto;
        margin-right: 10px;
    }
    .product-list .product-thumb .product-title a{
        margin: 0 0 10px;
    }
    .product-list .product-thumb .thumb-description .rating{
        margin: 10px 0 0;
    }

.product-list .product-thumb .image{
        display: inline-block;
        margin: 0;
    }
    .product-list .product-thumb .caption {
        padding: 7px 0 0;
    }
}

@media (max-width: 575px) {
.inner2 .promo-title {
        font-size: 24px;
        line-height: 24px;
        margin: 10px 0 15px;
    }
    .inner2 .promo-desc {
        font-size: 16px;
    }

.subscribe-form #newsletter_usr_email {
        width: 100%;
    }
    .news-description {
        font-size: 14px;
        line-height: 22px;
    }

.grid-left {
  }
}

@media (max-width: 540px) {
.newsletter-content-innner {
        width: 70%;
    }
    .newsletter-btn-close.close {
        top: 0;
        right: 0;
    }

#logo img {
        width: 110px;
    }

.comment-text {
        padding: 10px;
    }
    .comment_cust .comment-desc {
        padding-left: 70px;
    }

.product-img {
        width: auto;
    }
    #quick-carousel {
        padding: 0 20px;
    }
    #quick-carousel .owl-nav .owl-prev{
        left: 10px;
    }
    #quick-carousel .owl-nav .owl-next{
        right: 10px;
    }
}

@media (max-width: 480px) {
.newsletter-content-innner {
        width: 100%;
    }
    .newsletter-content {
        padding: 30px;
    }

.header-links > div + div {
        margin: 0 0 0 15px;
    }

#menu{
        margin: 0 0 0 15px;
    }
    #topCategoryList {
        max-width: 280px;
    }

.inner2 .promo-title {
        font-size: 20px;
        line-height: 20px;
    }
    .inner2 .promo-desc {
        font-size: 14px;
    }
    .inner2 .button {
        padding: 5px 15px;
        line-height: 16px;
    }

.page-title h3 {
        font-size: 24px;
        line-height: 24px;
        margin: 0px 0 15px;
    }
    ._tabs .nav-tabs>li> a {
        padding: 0 15px;
        font-size: 14px;
    }

.brand .swiper-slide > div {
        padding: 15px 0;
    }

.article-container .singblog-description {
        padding: 15px;
    }
    .singblog-description .blog-text {
        margin: 5px 0 0;
    }

.service {
        display: block;
        text-align: center;
    }
    .service-icon {
        margin: 0 0 10px 0;
    }
    .service .promo-title {
        font-size: 12px;
        margin: 0 0 3px;
    }
    .service .promo-desc {
        font-size: 10px;
        line-height: 14px;
    }

.cat-pagination-right > * {
        display: inline-block;
        vertical-align: top;
        width: 100%;
    }
    .cat-pagination-right .cat-show{
        padding: 5px 0 0 0;
    }
    .cat-pagination-right{
        display: block;
        text-align: left;
    }
    #compare-total.btn.btn-link{
        font-size: 13px;
    }

#product-page .nav-tabs>li> a{
        font-size: 12px;
        padding: 8px 0;
    }
    #product-page .nav-tabs li {
        margin: 0 5px;
    }
    #product-page .tab-content {
        padding: 15px;
    }
    .related-products-block {
        padding-top: 20px;
    }
}

@media (max-width: 425px) {
#cart .dropdown-menu {
        right: -40px;
    }
    .search-down {
        right: -105px;
    }
}

@media (max-width: 375px) {
.inner2 .promo-title {
        font-size: 16px;
        margin: 4px 0 10px;
    }
    .inner2 .promo-desc {
        font-size: 12px;
    }
    .inner2 .button {
        padding: 3px 10px;
    }
}

@media (max-width: 319px) {
.category-featured :not(.owl-carousel) .category-layout,
    .box :not(.owl-carousel) .col-xs-4,
    .product-layout.product-grid.col-xs-4{
        width: 100%;
    }
}

/* ── MOBILE MENU — ripristino ───────────────────────────────── */
@media (max-width: 991px) {
    #topCategoryList {
        background: var(--d2);
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        max-width: 350px;
        z-index: 9999;
        margin: 0;
        transform: translate(-400px, 0);
        transition: transform .5s;
        overflow: auto;
    }
    #topCategoryList.box-menu {
        transform: translate(0, 0);
    }
    .menu-close {
        background: var(--d3);
        color: var(--t1);
        padding: 12px 15px;
        font-size: 14px;
        font-weight: 600;
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
        border-bottom: 1px solid var(--d4);
    }
    .menu-close i {
        line-height: 20px;
        font-size: 12px;
    }
    #menu .nav > li > a,
    #menu #topCategoryList .dropdown-inner a {
        color: var(--t1);
        padding: 8px 30px 8px 15px;
        display: block;
        font-size: 13px;
        font-family: 'Oswald', sans-serif;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        border-bottom: 1px solid var(--d3);
    }
    #menu .nav > li > a:hover,
    #menu #topCategoryList .dropdown-inner a:hover {
        color: var(--g);
        background: transparent;
    }
    #menu #topCategoryList ul {
        float: none;
        display: block;
        text-align: left;
        margin: 0;
        background: transparent;
    }
    #topCategoryList .dropdown.menulist .dropdown-menu {
        position: relative;
        float: none;
        background: transparent;
        border: none;
        box-shadow: none;
        display: none;
        padding: 0;
    }
    #topCategoryList .dropdown.menulist .dropdown-menu .dropdown-inner {
        display: block;
        padding: 0 10px;
    }
    #topCategoryList ul li { float: none; }
    #topCategoryList li .toggle-menu {
        position: absolute;
        right: 0; top: 0;
        padding: 9px 10px;
        color: var(--t2);
    }
    #menu .btn-navbar.open-menu::after {
        content: "";
        position: fixed;
        top: 0; left: 0;
        width: 100%; height: 100%;
        background: rgba(0,0,0,.6);
        z-index: 99;
    }
}

@media (min-width: 1200px) {
    .section {
        max-width: 1280px;
        margin: 0 auto;
        padding: var(--s9) var(--s7);
        width: 100%;
      }
}

.privacy-modal {
    display: none;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0,0,0,0.85);
    z-index: 99999 !important;
    align-items: center;
    justify-content: center;
    overflow-y: auto;
}

.privacy-modal.show {
    display: flex !important;
}

.privacy-modal-content {
    background: #1a1a1a;
    border: 1px solid rgba(192,192,192,0.3);
    border-radius: 8px;
    padding: 2rem;
    max-width: 800px;
    width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
    margin: auto;
    color: #C0C0C0;
}