/* rubik-bubbles-regular - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Rubik Bubbles';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/rubik-bubbles-v3-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
/* rubik-regular - arabic_cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/rubik-v28-arabic_cyrillic_cyrillic-ext_latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* rubik-italic - arabic_cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Rubik';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/rubik-v28-arabic_cyrillic_cyrillic-ext_latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* rubik-700 - arabic_cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/rubik-v28-arabic_cyrillic_cyrillic-ext_latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

  

/* rubik-one */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Rubik One';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/RubikOne-Regular.woff') format('woff'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }

@media (min-width: 640px) {
  .dostava-icons {
    display: none!important;
  }
}


body#landing-page, body#landing-page #languageMenu {
    font-family: 'Rubik', sans-serif;
    animation: backgroundCycle 60s cubic-bezier(0.17, 0.67, 0.83, 0.67) infinite;
    transition: background-color 1s ease-in-out;
    /* color: #A6BF7E;  */
 
  }
  
  @keyframes backgroundCycle {
    0% {
      background-color: #A6BF7E;
      color: #A6BF7E;
    }
    33% {
      background-color: #FFCB1A;
      color: #FFCB1A;
    }
    66% {
      background-color: #4CB2E1;
      color: #4CB2E1;
    }
    100% {
      background-color: #A6BF7E;
      color: #A6BF7E;
    }
  }



@keyframes gleovoFade {
  0%, 45%   { opacity: 1; }
  50%, 95%  { opacity: 0; }
  100%      { opacity: 1; }
}

@keyframes izvolteFade {
  0%, 45%   { opacity: 0; }
  50%, 95%  { opacity: 1; }
  100%      { opacity: 0; }
}

.gleovo-logo {
  animation: gleovoFade 5s ease-in-out infinite;
}

.izvolte-logo {
  animation: izvolteFade 5s ease-in-out infinite;
}



#main-wrapper {
    min-height: 100vh;
    /* max-width: 360px; */
    margin: 0 auto;
}
  
h1, h2, h3, h4, h5, h6 {
    font-family: 'Rubik Bubbles', cursive;
    color: white;
  }

p {
    color: white;
}

.dostava-icons {
    color: white;
}
.dostava-title {
    font-family: 'Rubik Bubbles';
    line-height: 0;         
    letter-spacing: -1px;     
    font-weight: 400; 
  }
  
.subtitle {
    font-family: 'Rubik One';
    font-weight: 400;        
    text-align: center;
  }

.dostava-button {
   font-family: 'Rubik One';
   text-transform: capitalize;

}

@layer utilities {
  p[data-speaker="M"] {
    font-weight: 500; 
    font-style: italic;

 }
  p[data-speaker="D"] {
    font-weight: 600; 

  }
}

@layer utilities {
  .fade-white-edges::before,
  .fade-white-edges::after {
    content: "";
    position: fixed;
    left: 0;
    width: 100%;
    height: 100px;
    z-index: 10;
    pointer-events: none;
  }

  .fade-white-edges::before {
    top: 0;
    background: linear-gradient(to bottom, white 0%, transparent 100%);
  }

  .fade-white-edges::after {
    bottom: 0;
    background: linear-gradient(to top, white 0%, transparent 100%);
  }
  .text-shadow {
    /* text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); */
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.75);
    font-size: 18px;
  }
  .text-shadow-white {
    text-shadow: 0 0 4px white, 0 0 10px white;
  }

}

#main-wrapper {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

#landing-page {
      background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
}

.ru {
  font-family: 'Rubik', sans-serif;
  font-weight: bold;
}


.dostava-header {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 40px!important;
  padding-right: 40px!important;
  padding-top: 30px!important;
}

#languageMenu  {
  max-width: 640px;
  margin: 0 auto;
  height: fit-content;
  box-shadow: 0px 4px 4px 0px #00000040;
}


#languageMenu a {
  font-weight: 700;
  line-height: 30px;
  letter-spacing: 0;
  text-align: center;
  text-decoration: none;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: 1px;      
  text-underline-offset: 1px;             
}

.underline-dotted {
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: 1px;
  text-decoration-skip-ink: none;
}

#links a {
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: 1px;
  text-decoration-skip-ink: none;
}



/* @layer utilities {
  .fade-white-edges::before,
  .fade-white-edges::after {
    content: "";
    position: fixed;
    left: 0;
    width: 100%;
    height: 100px;
    z-index: 10;
    pointer-events: none;
    border-radius: 2rem;
  }

  .fade-white-edges::before {
    top: 0;
    background: linear-gradient(to bottom, white 0%, transparent 100%);
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
  }

  .fade-white-edges::after {
    bottom: 0;
    background: linear-gradient(to top, white 0%, transparent 100%);
    border-bottom-left-radius: 2rem;
    border-bottom-right-radius: 2rem;
  }
} */