/* DESKTOP */



/* Variables */



:root {

  --main-color: #fc0;

  --alt-color: #1b3854;

  --alt-color-lighter: #233952;

  --light-bg-color: #f6f6f6;



  --grid-max-width: 80%;

  --grid-smaller-max-width: 50%;



  --vertical-padding-l: 70px;

  --vertical-padding-m: 30px;

  --vertical-padding-s: 15px;



  --horizontal-padding-l: 70px;

  --horizontal-padding-m: 30px;

  --horizontal-padding-s: 15px;



  --vertical-margin-l: 70px;

  --vertical-margin-m: 30px;

  --vertical-margin-s: 15px;



  --h-font-family: "Roboto", sans-serif;

  --h-font-size-l: 70px;

  --h-font-size-m: 32px;

  --h-font-size-s: 20px;

  --h-font-weight: 400;



  --body-font-family: "Hind";

  --body-font-size: 17px;



  --font-color-light: #fff;

  --font-color-dark: #000;



  --button-padding: 15px 40px;

  --button-border-radius: 5px;

  --button-font-size: 20px;

  --button-font-weight: 400;

  --button-font-family: "Amaranth";



  --default-overlay: rgba(0, 0, 0, 0.5);



  --base-flex-gap: 10px;

  --default-col-gap: 30px;

  --big-col-gap: 120px;



  --blurb-icon-width: 32px;

}



/* -- DEFAULTS -- */



p {

  display: block;

  margin-block-start: unset;

  margin-block-end: unset;

  margin-inline-start: 0px;

  margin-inline-end: 0px;

  line-height: 1.1em;

  margin-bottom: 0px;

}



a {

  text-decoration: unset;

}



h1,

h2,

h3,

h4,

h5,

h6 {

  line-height: 1.1em;

  margin-block-start: unset;

  margin-block-end: unset;

}



/* -- SECTIONS AND CONTAINERS -- */



body {

  margin: 0px;

}



.flex-container {

  display: flex;

  position: relative;

}



.flex-col {

  display: flex;

  flex-direction: column;

  width: 100%;

  position: relative;

}



.flex-row {

  display: flex;

  flex-direction: row;

  position: relative;

}



/* -- SINGLE ELEMENTS GENERIC -- */



/* Headers */



.default-text {

  font-size: var(--body-font-size);

}



.header {

  font-family: var(--h-font-family);

  font-size: 50px;

  font-weight: 700;

  text-transform: uppercase;

}



.header-l {

  font-size: 30px;

}



.header-m {

  font-size: 25px;

}



.header-s {

  font-size: var(--h-font-size-s);

}



/* Buttons */



.v0-button {

  padding: var(--button-padding);

  border-radius: var(--button-border-radius);

  font-size: var(--button-font-size);

  font-family: var(--button-font-family);

  align-items: center;

  cursor: pointer;

  line-height: 1.1em;

  font-weight: 900;

  text-transform: uppercase;

}



.v0-button-inline {

  display: inline-block;

}



.v0-button1 {

  background: var(--alt-color);

  color: white;

  text-transform: uppercase;

}



.v0-button1:hover {

  background: black;

  color: #fff;

}



.v0-button2 {

  background: var(--main-color);

  color: var(--alt-color);

}



.v0-button2:hover {

  background: var(--alt-color);

  color: white;

}



/* Background overlay */



.bg-overlay {

  height: 100%;

  width: 100%;

  background-color: var(--default-overlay);

  position: absolute;

  top: 0;

  left: 0;

  z-index: 1;

}



/* Background element for zoomy effects */



.bg-container {

  height: 100%;

  width: 100%;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

}



/* -- SPECIFIC ELEMENTS --*/



.v0-card-square {

  aspect-ratio: 1 / 1;

}



.v0-simple-gallery-img {

  object-fit: contain;

  max-height: 100px;

}



.menu-container {

  background: var(--alt-color);

  padding-top: var(--vertical-padding-s);

  padding-bottom: var(--vertical-padding-s);

}



.card {

  background-color: white;

}



.card-img {

  max-height: 90px;

  object-fit: contain;

}



.parallax-section {

  height: 60vh;



  background-attachment: fixed;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

}



.image-fullheight {

  background-size: cover;

  background-repeat: no-repeat;

  background-position: center;

  height: 100%;

}



.big-yellow-text {

  color: var(--main-color);

  font-weight: 700;

  font-size: 66px;

  line-height: 1em;

}



.big-yellow-text-blurb {

  color: var(--main-color);

  font-weight: 700;

  font-size: 36px;

  line-height: 1em;

}



.big-text {

  font-weight: 700;

  font-size: 46px;

  line-height: 1em;

}



.min-h-200 {

  min-height: 200px;

}



.min-h-300 {

  min-height: 300px;

}



.min-h-500 {

  min-height: 500px;

}



.l-blurb {

  align-items: center;

}



.l-blurb-top {

  align-items: flex-start;

}



.l-blurb-top .l-blurb-text {

  padding-top: 5px;

}



.l-blurb-top .l-blurb-text.font-heavy {

  margin-bottom: 5px;

}



.l-blurb-text {

  margin-left: 15px;

}



.blurb-text-col {}



.blurb-icon {

  min-width: var(--blurb-icon-width);

}



.blurb-icon-col {

  width: auto;

  margin-right: 20px;

  height: 100%;

}



.cross-svg {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}



.visual-portfolio-carousel .vp-portfolio__items-style-default .vp-portfolio__item-img img {

  object-fit: contain;

}



.vp-portfolio__item-img::before,

.vp-portfolio__item-img::after {

  background: transparent !important;

}



.accordion {

  transition: 0.4s ease-in-out;

}



.accordion-panel {

  display: none;

  padding: 15px;

  background-color: var(--light-bg-color);

}



/* -- General utility boot-like -- */



.active {

  background-color: var(--main-color);

}



.h-font {

  font-family: var(--h-font-family);

}



.body-font {

  font-family: var(--body-font-family);

}



.pw-10 {

  max-width: 10%;

}



.pw-15 {

  max-width: 15%;

}



.pw-2 {

  max-width: 20%;

}



.pw-25 {

  max-width: 25%;

}



.pw-3 {

  max-width: 30%;

}



.pw-4 {

  max-width: 40%;

}



.pw-45 {

  max-width: 45%;

}



.pw-5 {

  max-width: 50%;

}



.pw-6 {

  max-width: 60%;

}



.pw-7 {

  max-width: 70%;

}



.w-100 {

  width: 100%;

}



.z-ind-2 {

  z-index: 2;

}



.font-heavy {

  font-weight: 600;

}



.font-uppercase {

  text-transform: uppercase;

}



.font-white {

  color: white;

}



.font-maincolor {

  color: var(--main-color);

}



.font-altcolor {

  color: var(--alt-color);

}



.font-light {

  color: var(--font-color-light);

}



.font-dark {

  color: var(--font-color-dark);

}



.text-center {

  text-align: center;

}



.text-right {

  text-align: right;

}



.m-v-l {

  margin-top: var(--vertical-margin-l);

  margin-bottom: var(--vertical-margin-l);

}



.m-v-m {

  margin-top: var(--vertical-margin-m);

  margin-bottom: var(--vertical-margin-m);

}



.m-v-s {

  margin-top: var(--vertical-margin-s);

  margin-bottom: var(--vertical-margin-s);

}



.m-t-auto {

  margin-top: auto;

}



.m-b-auto {

  margin-bottom: auto;

}



.m-b-l {

  margin-bottom: var(--vertical-margin-l);

}



.m-b-m {

  margin-bottom: var(--vertical-margin-m);

}



.m-b-s {

  margin-bottom: var(--vertical-margin-s);

}



.m-t-l {

  margin-top: var(--vertical-margin-l);

}



.m-t-m {

  margin-top: var(--vertical-margin-m);

}



.m-t-s {

  margin-top: var(--vertical-margin-s);

}



.m-b-l {

  margin-bottom: var(--vertical-margin-l);

}



.m-b-m {

  margin-bottom: var(--vertical-margin-m);

}



.m-b-s {

  margin-bottom: var(--vertical-margin-s);

}



.m-b-0 {

  margin-bottom: 0;

}



.p-v-l {

  padding-top: var(--vertical-padding-l);

  padding-bottom: var(--vertical-padding-l);

}



.p-v-m {

  padding-top: var(--vertical-padding-m);

  padding-bottom: var(--vertical-padding-m);

}



.p-v-s {

  padding-top: var(--vertical-padding-s);

  padding-bottom: var(--vertical-padding-s);

}



.p-ho-l {

  padding-left: var(--horizontal-padding-l);

  padding-right: var(--horizontal-padding-l);

}



.p-ho-m {

  padding-left: var(--horizontal-padding-m);

  padding-right: var(--horizontal-padding-m);

}



.p-ho-s {

  padding-left: var(--horizontal-padding-s);

  padding-right: var(--horizontal-padding-s);

}



.p-t-m {

  padding-top: var(--vertical-padding-m);

}



.p-0 {

  padding: 0;

}



.m-ho-auto {

  margin-left: auto;

  margin-right: auto;

}



.m-v-auto {

  margin-top: auto;

  margin-bottom: auto;

}



.grid-width {

  max-width: var(--grid-max-width);

  width: 100%;

}



.smaller-grid {

  max-width: var(--grid-smaller-max-width);

  width: 100%;

}



.flex-gap {

  gap: var(--base-flex-gap);

}



.column-gap {

  column-gap: var(--default-col-gap);

}



.column-gap-l {

  column-gap: var(--big-col-gap);

}



.justify-center {

  justify-content: center;

}



.fullheight {

  height: 100%;

}



.width-auto {

  width: auto;

}



.bg-light {

  background-color: var(--light-bg-color);

}



.bg-main {

  background-color: var(--main-color);

}



.flex-align-center {

  align-items: center;

}



.flex-justify-space-between {

  justify-content: space-between;

}



.flex-justify-flex-end {

  justify-content: flex-end;

}



.ratio-1-1 {

  aspect-ratio: 1 / 1;

}



/* Edit di Woocommerce */



#masthead>.col-full,

#masthead .storefront-primary-navigation {

  max-width: var(--grid-max-width) !important;

  margin: 0 auto !important;

}



.storefront-primary-navigation .col-full {

  max-width: 100% !important;

}



.col-full {

  max-width: 100% !important;

  padding: 0 !important;

}



@media (min-width: 768px) {

  .col-full {

    max-width: 100% !important;

    padding: 0 !important;

  }

}



.site-header {

  margin-bottom: 0px !important;

}



/*Fibosearch generico */

.dgwt-wcas-search-input {

  border: 2px solid black !important;

  border-radius: 0 !important;

}



/* Rimozione margini e padding stupidi messi a caso dal tema */

/* Logo link */



.custom-logo-link {

  margin-bottom: 0px !important;

}



/* Cart */



.v0-cart-col .cart-contents {

  padding: 0px !important;

}



/* Primary Navigation */



.v0-navigation-row {

  border-top: 3px solid var(--main-color);

}



.v0-navigation-row .menu {

  text-align: center !important;

}



.v0-navigation-row .menu li>a {

  font-size: 18px;

  font-weight: 700;

  text-transform: uppercase;

}



.v0-navigation-row .main-navigation .nav-menu a {

  padding-top: var(--vertical-padding-s) !important;

  padding-bottom: var(--vertical-padding-s) !important;

  padding-left: var(--horizontal-padding-m) !important;

  padding-right: var(--horizontal-padding-m) !important;

}



.v0-site-header .cart-contents {

  text-align: right;

}



.v0-site-header .cart-contents .count {

  margin-right: 5px;

}



.mobile-only-block,

.mobile-only-flex {

  display: none;

}



/* Generici starbottle */



.starb-header {

  font-family: "Roboto", sans-serif;

  font-weight: 600;

  line-height: 1.3em;

}



/* Pagina account */



.woocommerce-button.download_pdf_action {

  margin-left: 10px !important;

}



.woocommerce-button.certificate-download-button {

  margin-right: 10px !important;

  cursor: pointer;

}

.woocommerce-button.button.view {
  width: fit-content !important;
}



/* Pagina i miei messaggi */



.message-section {

  border: 1px solid white;

  border-radius: 20px;

  z-index: 0;

}



.starb-message-label {

  font-weight: 900;

  margin-right: 10px;

}



.message-section .background-overlay {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  opacity: 0.04;

  z-index: -1;

  background-repeat: no-repeat;

  background-position: right top;

}



.message-data-row {

  padding-bottom: 5px;

}



.starb-message-details-row {

  margin-top: 15px;

}



.starb-message-download {

  margin-left: 5px;

}



.starb-message-animation-panel {

  border: 1px solid white;

  border-radius: 15px;

  background-color: rgba(0, 0, 0, 0.2);

}



/* Griglia flex */



.v0-products {

  flex-wrap: wrap;

}



.v0-product-card {

  padding: 2%;

  flex-grow: 1;

  flex-basis: 23%;



  display: flex;

  /* so child elements can use flexbox stuff too! */

  align-items: center;

  max-width: 23%;

}



.v0-product-image img {

  max-width: 100%;

}



.v0-product-info {

  display: flex;

  flex-direction: column;

  align-items: center;

  /*padding: var(--vertical-padding-m); */

  height: 100%;

}



.v0-card-product-brand-name {

  color: var(--main-color);

  font-weight: 900;

}



.v0-card-product-name {

  font-weight: 900;

  font-family: Helvetica, Arial, Lucida, sans-serif;

  text-transform: uppercase;

  font-size: 18px;

  text-align: center;

}



.v0-card-product-price {

  font-size: 18px;

}



.v0-card-product-desc {

  text-align: center;

}



.v0-pagination a {}



.v0-seppia-grid .v0-product-image img {

  min-height: 250px;

  object-fit: cover;

  max-height: 350px;

}



.v0-card-categories {

  text-align: center;

}



@media only screen and (max-width: 720px) {

  .v0-product-card {

    flex-grow: 1;

    flex-basis: 100%;

    max-width: 100%;

  }

}



/* MOBILE */



@media only screen and (max-width: 720px) {

  /* Variables */



  :root {

    --grid-max-width: 90%;

    --grid-smaller-max-width: 100%;



    --vertical-padding-l: 70px;

    --vertical-padding-m: 30px;

    --vertical-padding-s: 15px;



    --horizontal-padding-l: 70px;

    --horizontal-padding-m: 30px;

    --horizontal-padding-s: 15px;



    --vertical-margin-l: 70px;

    --vertical-margin-m: 30px;

    --vertical-margin-s: 15px;



    --h-font-family: "Roboto", sans-serif;

    --h-font-size-l: 32px;

    --h-font-size-m: 28px;

    --h-font-weight: 600;



    --p-font-family: "Roboto Condensed", sans-serif;

    --p-font-size: 17px;



    --font-color-light: #fff;

    --font-color-dark: #000;



    --button-padding: 15px 40px;

    --button-border-radius: 5px;

    --button-font-size: 20px;

    --button-font-weight: 400;

    --button-font-family: "Roboto Condensed", sans-serif;



    --default-overlay: rgba(0, 0, 0, 0.5);



    --base-flex-gap: 10px;

    --default-col-gap: 18px;

    --big-col-gap: 40px;



    --blurb-icon-width: 32px;

  }



  /* -- DEFAULTS -- */



  /* -- SECTIONS AND CONTAINERS -- */



  .col-full {

    margin-left: 0 !important;

    margin-right: 0 !important;

  }



  .flex-col {

    display: flex;

    flex-direction: column;

    width: 100%;

    position: relative;

  }



  .flex-row {

    display: flex;

    flex-direction: column;

    position: relative;

    width: 100%;

  }



  .mob-flex-row {

    flex-direction: row;

  }



  /* -- SINGLE ELEMENTS GENERIC -- */



  /* Headers */



  /* Buttons */



  /* Background overlay */



  /* -- SPECIFIC ELEMENTS --*/



  .main-header-section {

    padding: 15px 0px 15px 0px;

  }



  /* -- ID SPECIFIC -- */



  #landing-footer .flex-row {

    column-gap: 20px;

  }



  /* -- GLOBAL PROPERTIES OVERRIDES -- */



  .mob-align-center {

    align-items: center;

  }



  .mob-text-center {

    text-align: center;

  }



  .mob-w-100 {

    max-width: 100%;

  }



  .mob-order-1 {

    order: 1;

  }



  .mob-order-2 {

    order: 2;

  }



  .mob-order-3 {

    order: 3;

  }



  .mob-m-0 {

    margin: 0;

  }



  .mob-pw-5 {

    max-width: 50%;

  }



  /* Conditional display classes */



  .mob-display-none {

    display: none;

  }



  .mobile-only-block {

    display: block;

  }



  .mobile-only-flex {

    display: flex;

  }



  /* Gap adjustments */



  .column-gap {

    row-gap: var(--default-col-gap);

  }



  .column-gap-l {

    row-gap: var(--big-col-gap);

  }



  /* Pagina i miei messaggi */



  .starb-message-download {

    margin-left: 5px;

  }

}



.page-id-3776 {

  font-family: "Roboto Mono";

}



.page-id-3776 .elementor-5435 .elementor-element.elementor-element-af19c25 {

  font-family: "Roboto";

}



.page-id-3776 p,

.page-id-3776 em {

  font-family: "Roboto Mono";

}



/* order */

.woocommerce-order-received .elementor-heading-title.elementor-size-default {

  margin-top: 5rem;

}



.woocommerce-thankyou-order-received {

  font-size: 20px;

}



.woocommerce-order-received .woocommerce-order-details,

.woocommerce-order-received .woocommerce-customer-details {

  padding: 2rem;

  border: 2px solid #fff;

  border-radius: 20px;

}



.woocommerce-order-received ul.wc-item-meta {

  margin: 1.5rem;

}



.woocommerce-order-received ul.wc-item-meta li,

.woocommerce-order-received ul.wc-item-meta p {

  line-height: 29px;

}



.woocommerce .woocommerce-customer-details .woocommerce-customer-details--email,

.woocommerce .woocommerce-customer-details .woocommerce-customer-details--phone {

  padding-left: 1.5em;

  line-height: 23px;

}



form[name="info_order"] {

  margin: 2rem 0;

}



.woocommerce-table__line-item.order_item ul {

  margin: 1rem 0;

  margin-bottom: 1rem !important;

}



.woocommerce-table__line-item.order_item ul li p {

  line-height: 20px;

}



.woocommerce-table__line-item.order_item ul li {

  line-height: 20px;

}



.tr.cart_item td dl.variation dt {

  line-height: 20px;

}



.tr.cart_item td dl.variation dt p {

  line-height: 20px;

}



.woocommerce td.product-name dl.variation p {

  line-height: 22px;

}





.variation-Audio,

.variation-Video,

.variation-Immagine,

.variation-Testo {

  display: none !important;

}



dl.variation p,

dl.variation dt {

  line-height: 22px;

}



#nf-form-title-6 {

  display: none;

}


/* CSS Modifiche pag checkout */
.seppia-checkout-box {
  color: black;
  background-color: white;
  padding: 16px 30px;
  border-radius: 2px;
  margin-bottom: 24px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.v0-check-register-button {
  background-color: #c36;
  color: white !important;
  padding: 10px 20px;
  border: 2px solid #c36;
  border-radius: 250px;
  margin-top: 15px;
}

.v0-check-register-button:hover {
  color: white !important;
  background-color: black;
  border-color: black;
}

.checkout-box-col1 {
  display: flex;
  flex-direction: column;
  padding-right: 15px;
}

.checkout-box-col2 {
  display: flex;
  flex-direction: column;
  justify-content: right;
}

.extra-register-text {
  color: black;
  background-color: white;
  padding: 16px 30px;
  border-radius: 2px;
  display: flex;
  flex-direction: column;
  margin-top: 16px;
  text-transform: uppercase;
  font-weight: 900;
}

.extra-register-text-disclaim {
  color: white;
  font-size: 12px;
  text-transform: none;
  font-weight: 300;
}


/* Popup promo black friday */

.promo-popup-after-add.popup-wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 9999;
  display: flex;
  flex-direction: column;
}

#v0-popup-close {
  font-size: 2.5vw;
  position: absolute;
  top: 1.5vw;
  right: 1.5vw;
  color: white;
  cursor: pointer;
  z-index: 10;
}

.promo-popup-after-add .inner-popup {
  padding: 4vw;
  margin: auto;
  max-width: 50vw;
  position: relative;
}

.promo-popup-after-add .v0-popup-title {
  font-size: 3vw;
  line-height: 1em;
  text-align: center;
  color: white;
  z-index: 10;
  position: relative;
}

.v0-popup-bg {
  border-radius: 16px;
  border: 2px solid white;
  background: url('https://starbottle.space/wp-content/uploads/2024/09/starbottle-landing-sfondo-testata.webp');
  background-size: cover;
  background-position: center;
}

.v0-popup-bg-overlay {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
}

.glassmorph-bg {
  border-radius: 16px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

@media only screen and (max-width: 720px) {

  .promo-popup-after-add .inner-popup {
    padding: 8vw;
    max-width: 80vw;
  }

  .promo-popup-after-add .v0-popup-title {
    font-size: 8vw;
  }

  #v0-popup-close {
    font-size: 6vw;
    top: 2vw;
    right: 4vw;
    z-index: 9999999;
  }

  *:nth-child(2) {
    table-layout: fixed;
  }

  td.woocommerce-orders-table__cell-order-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

}