@font-face {
  font-display: swap;
  font-family: "Overpass-Regular";
  src: local("Overpass-Regular"),
    url("./_fonts/Overpass-Regular.ttf") format("truetype");
  font-weight: normal;
}
@font-face {
  font-display: swap;
  font-family: "Overpass-Bold";
  src: local("Overpass-Bold"),
    url("./_fonts/Overpass-Bold.ttf.ttf") format("truetype");
  font-weight: bold;
}
@font-face {
  font-display: swap;
  font-family: "Overpass-ExtraBold";
  src: local("Overpass-ExtraBold"),
    url("./_fonts/Overpass-ExtraBold.ttf") format("truetype");
  font-weight: 800;
}
@font-face {
  font-display: swap;
  font-family: "Overpass-Thin";
  src: local("Overpass-Thin"),
    url("./_fonts/Overpass-Thin.ttf") format("truetype");
  font-weight: 300;
}
@font-face {
  font-display: swap;
  font-family: "VoltaModernText-55";
  src: local("VoltaModernText-55"),
    url("./_fonts/VoltaModernText-55.ttf") format("truetype");
  font-weight: 300;
}
@font-face {
  font-display: swap;
  font-family: 'Volta Modern Display Web';
  src: url('./_fonts/VoltaModernDisplay-55Roman-Web.eot');
  src: url('./_fonts/VoltaModernDisplay-55Roman-Web.eot?#iefix') format('embedded-opentype'),
       url('./_fonts/VoltaModernDisplay-55Roman-Web.woff2') format('woff2'),
       url('./_fonts/VoltaModernDisplay-55Roman-Web.woff') format('woff'),
       url('./_fonts/VoltaModernDisplay-55Roman-Web.ttf') format('truetype');
  font-weight:  500;
  font-style:   normal;
  font-stretch: normal;
}
@font-face {
  font-display: swap;
  font-family: 'Volta Modern Display Web';
  src: url('./_fonts/VoltaModernDisplay-65Medium-Web.eot');
  src: url('./_fonts/VoltaModernDisplay-65Medium-Web.eot?#iefix') format('embedded-opentype'),
       url('./_fonts/VoltaModernDisplay-65Medium-Web.woff2') format('woff2'),
       url('./_fonts/VoltaModernDisplay-65Medium-Web.woff') format('woff'),
       url('./_fonts/VoltaModernDisplay-65Medium-Web.ttf') format('truetype');
  font-weight:  600;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-display: swap;
  font-family: "Avenir Next LT Pro regular";
  src: local("Avenir Next LT Pro regular"),
    url("./_fonts/avenir-next-lt-pro-regular.ttf") format("truetype");
  font-weight: normal;
}
@font-face {
  font-display: swap;
  font-family: "Avenir Next LT Pro bold";
  src: local("Avenir Next LT Pro bold"),
    url("./_fonts/avenir-next-lt-pro-bold.ttf") format("truetype");
  font-weight: bold;
}
@font-face {
  font-display: swap;
  font-family: "Avenir Next LT Pro italic";
  src: local("Avenir Next LT Pro italic"),
    url("./_fonts/avenir-next-lt-pro-italic.ttf") format("truetype");
  font-weight: normal;
}
@font-face {
  font-display: swap;
  font-family: "Avenir Next LT Pro thin";
  src: local("Avenir Next LT Pro thin"),
    url("./_fonts/avenir-next-lt-pro-thin.ttf") format("truetype");
  font-weight: 300;
}

@font-face {
  font-display: swap;
  font-family: 'LemonMilkBold';
  font-weight: 700;
  src: url('./_fonts/LemonMilkBold-gx2B3.otf') format('otf')
}

@font-face {
  font-display: swap;
  font-family: 'LemonBold';
  src: url('./_fonts/LemonMilkBold-gx2B3.otf') format('otf');
}

@font-face {
  font-display: swap;
  font-family: "MyriadPro";
  src: url("./_fonts/MyriadPro-Regular.otf");
}

@font-face {
  font-display: swap;
  font-family: 'MyriadPro';
  src: url("./_fonts/MyriadPro-Light.otf");
  font-weight: 300;
}

@font-face {
  font-display: swap;
  font-family: "MyriadPro";
  src: url("./_fonts/MyriadPro-Semibold.otf");
  font-weight: bold;
}

@font-face {
  font-display: swap;
  font-family: "ExpletusSans";
  src: url("./_fonts/ExpletusSans-Regular.ttf");
}

@font-face {
  font-display: swap;
  font-family: 'ExpletusSans';
  src: url("./_fonts/ExpletusSans-Medium.ttf");
  font-weight: 500;
}

@font-face {
  font-display: swap;
  font-family: "ExpletusSans";
  src: url("./_fonts/ExpletusSans-Bold.ttf");
  font-weight: bold;
}

@font-face {
  font-display: swap;
  font-family: "Ginger";
  src: url("./_fonts/Ginger-Regular.otf");
}

@font-face {
  font-display: swap;
  font-family: 'Ginger';
  src: url("./_fonts/Ginger-Light.otf");
  font-weight: 300;
}

@font-face {
  font-display: swap;
  font-family: "Ginger";
  src: url("./_fonts/Ginger-Bold.otf");
  font-weight: bold;
}

@font-face {
  font-display: swap;
  font-family: 'Ginger Display Web';
  src: url('./_fonts/Ginger-Regular-F37-Web.eot');
  src: url('./_fonts/Ginger-Regular-F37-Web.eot?#iefix') format('embedded-opentype'),
       url('./_fonts/Ginger-Regular-F37-Web.woff2') format('woff2'),
       url('./_fonts/Ginger-Regular-F37-Web.woff') format('woff'),
       url('./_fonts/Ginger-Regular-F37-Web.ttf') format('truetype');
  font-weight:  normal;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-display: swap;
  font-family: 'Ginger Display Web';
  src: url('./_fonts/Ginger-Light-F37-Web.eot');
  src: url('./_fonts/Ginger-Light-F37-Web.eot?#iefix') format('embedded-opentype'),
       url('./_fonts/Ginger-Light-F37-Web.woff2') format('woff2'),
       url('./_fonts/Ginger-Light-F37-Web.woff') format('woff'),
       url('./_fonts/Ginger-Light-F37-Web.ttf') format('truetype');
  font-weight:  300;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-display: swap;
  font-family: 'Ginger Display Web';
  src: url('./_fonts/Ginger-Bold-F37-Web.eot');
  src: url('./_fonts/Ginger-Bold-F37-Web.eot?#iefix') format('embedded-opentype'),
       url('./_fonts/Ginger-Bold-F37-Web.woff2') format('woff2'),
       url('./_fonts/Ginger-Bold-F37-Web.woff') format('woff'),
       url('./_fonts/Ginger-Bold-F37-Web.ttf') format('truetype');
  font-weight: bold;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-display: swap;
  font-family: "VUITY Archia";
  src: url("./_fonts/VUITYArchia-Regular.otf");
}

@font-face {
  font-display: swap;
  font-family: 'VUITY Archia';
  src: url("./_fonts/VUITYArchia-Light.otf");
  font-weight: 300;
}

@font-face {
  font-display: swap;
  font-family: "VUITY Archia";
  src: url("./_fonts/VUITYArchia-Bold.otf");
  font-weight: bold;
}

@font-face {
  font-display: swap;
  font-family: 'ExpletusSans';
  src: url("./_fonts/VUITYArchia-Medium.otf");
  font-weight: 500;
}

@font-face {
  font-display: swap;
  font-family: 'CanvaSansDisplay-Bold';
  src: url("./_fonts/CanvaSansDisplay-Bold.otf");
  font-weight: bold;
}

@font-face {
  font-display: swap;
  font-family: 'CanvaSansDisplay-Medium';
  src: url("./_fonts/CanvaSansDisplay-Medium.otf");
  font-weight: 500;
}

@font-face {
  font-display: swap;
  font-family: 'CanvaSansDisplay-Regular';
  src: url("./_fonts/CanvaSansDisplay-Regular.otf");
  font-weight: normal;
}


.tag {
    color: rgba(152, 152, 152, 0.88);
    font-weight: bold;
    padding: 0.06em 0.22em 0.07em;
    border-radius: 2px;
}

.my-tag {
   background-color: rgba(108, 75, 38, 0.85);
   color: rgba(241, 201, 69, 0.85);
   font-weight: bold;
   padding: 0.06em 0.22em 0.07em;
   border-radius: 2px;
}

.remaining-reactions {
    display: flex;
    width: 0;
    transition: all .5s ease-in-out;
}

.outline-none {
    outline: none;
}

.addcalendar-square {
  border-radius: 5px !important;
  font-size: 12px !important;
  padding: 10px 16px 10px 16px !important;
  height: 40px;
  width: fit-content;
  min-width: 262px;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 960px) {
  .addcalendar-square {
    min-width: 232px;
  }
}

.addcalendar {
  border-radius: 999px !important;
  font-size: 12px !important;
  padding: 10px 16px 10px 16px !important;
  height: 40px;
  width: fit-content;
  min-width: 262px;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 960px) {
  .addcalendar {
    min-width: 232px;
  }
}

.MuiInput-root {
    margin-top: 0px !important;
}

.tabs-border {
    border-bottom-width: 2px !important;
}

.right-col-tab-list {
  text-align: left;
}

@-webkit-keyframes blink {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}

@keyframes blink {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}

.blink {
    animation: blink linear .5s 2 forwards;
}

.stream-overlay-animation-enter {
  opacity: 0;
}
.stream-overlay-animation-enter-active {
  opacity: 1;
  transition: opacity 300ms ease-in;
}

.stream-overlay-animation-exit {
  opacity: 1;
}
.stream-overlay-animation-exit-active {
  opacity: 0;
  transition: opacity 300ms ease-in;
}

.stream-overlay-products-animation-enter {
  opacity: 0;
}
.stream-overlay-products-animation-enter-active {
  opacity: 1;
  transition: opacity 300ms ease-in;
}

.stream-overlay-products-animation-exit {
  opacity: 0;
}
.stream-overlay-products-animation-exit-active {
  opacity: 0;
  transition: opacity 300ms ease-in;
}

.scroll-indicator-enter {
  opacity: 0;
}
.scroll-indicator-enter-active {
  opacity: 1;
  transition: opacity 700ms ease-in;
}

.scroll-indicator-exit {
  opacity: 1;
}
.scroll-indicator-exit-active {
  opacity: 0;
  transition: opacity 700ms ease-in;
}

/* ripple */
.ripple {
    position: relative;
    /* overflow: hidden; */
  }
  .ripple .rippleContainer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
  .ripple .rippleContainer span {
    transform: scale(0);
    border-radius: 100%;
    position: fixed;
    opacity: 0.4;
    background-color: #ffffff;
    animation: ripple 850ms;
    z-index: 3;
  }

  @keyframes ripple {
    to {
      opacity: 0;
      transform: scale(1);
    }
  }

.tabs-ul {
  display: flex;
  justify-content: space-between;
}

.tabs-stream {
  padding-bottom: 5px !important;
}

.overflow-x-scroll {
  overflow-x: scroll;
}

.hide-scroll {
  -ms-overflow-style: none; /* Internet Explorer 10+ */
  scrollbar-width: none; /* Firefox */
}

.hide-scroll::-webkit-scrollbar {
  width: 0px; /* Remove scrollbar space */
  background: transparent; /* Optional: just make scrollbar invisible */
}

.tabs-ul .tabs-li {
  width: 100%;
}

.hide-tabs-bg {
  background-color: unset !important;
}

.display-none {
  display: none;
}

[class*="AdjustAudio"] > div {
  align-items: center;
}