@font-face {
  font-family: 'Pangram Sans';
  font-style: normal;
  font-weight: 100;
  src: local(''), url('/fonts/PPPangramSans-ExtraLight.otf') format('opentype');
}

@font-face {
  font-family: 'Pangram Sans';
  font-style: normal;
  font-weight: 300;
  src: local(''), url('/fonts/PPPangramSans-Light.otf') format('opentype');
}

@font-face {
  font-family: 'Pangram';
  font-style: normal;
  font-weight: 400;
  src: local(''), url('/fonts/PPPangramSans-Regular.otf') format('opentype');
}

@font-face {
  font-family: 'Pangram Sans';
  font-style: normal;
  font-weight: 500;
  src: local(''), url('/fonts/PPPangramSans-Medium.otf') format('opentype');
}

@font-face {
  font-family: 'Pangram Sans';
  font-style: normal;
  font-weight: 600;
  src: local(''), url('/fonts/PPPangramSans-Semibold.otf') format('opentype');
}

@font-face {
  font-family: 'Pangram Sans';
  font-style: normal;
  font-weight: 700;
  src: local(''), url('/fonts/PPPangramSans-Bold.otf') format('opentype');
}

@font-face {
  font-family: 'Pangram Sans';
  font-style: normal;
  font-weight: 800;
  src: local(''), url('/fonts/PPPangramSans-ExtraBold.otf') format('opentype');
}

@font-face {
  font-family: 'Pangram Sans';
  font-style: normal;
  font-weight: 900;
  src: local(''), url('/fonts/PPPangramSans-Black.otf') format('opentype');
}

/* Icomoon */

@font-face {
    font-family: 'icomoon';
    src:
      url('/fonts/icomoon.ttf?3xz5qx') format('truetype'),
      url('/fonts/icomoon.woff?3xz5qx') format('woff'),
      url('/fonts/icomoon.svg?3xz5qx#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
  }
  
  [class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
  
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  .icon-cart:before {
    content: "\e902";
  }

  .icon-instagram:before {
    content: "\e917";
  }
  .icon-rounded-close:before {
    content: "\e941";
  }
  .icon-social-ok:before {
    content: "\e943";
  }
  .icon-telegram:before {
    content: "\e944";
  }
  .icon-union:before {
    content: "\e945";
  }
  .icon-upload:before {
    content: "\e946";
  }
  .icon-whatsapp:before {
    content: "\e947";
  }
  
  
  .icon-delivery:before {
    content: '';
    display: block;
    width: 87px;
    height: 87px;
    background-image: url(/img/icons/favorite3.png);
    background-size: contain;
    background-repeat: no-repeat;
  }

  .icon-10:before {
    content: '';
    display: block;
    width: 87px;
    height: 87px;
    background-image: url(/img/favorite2.png);
    background-size: contain;
    background-repeat: no-repeat;
  }

  .icon-croissant::before {
    content: '';
    display: block;
    width: 87px;
    height: 87px;
    background-image: url(/img/icons/favorite1.png);
    background-size: contain;
    background-repeat: no-repeat;
  }

  .icon-glove::before {
    content: '';
    display: block;
    width: 87px;
    height: 87px;
    background-image: url(/img/icons/favorite4.png);
    background-size: contain;
    background-repeat: no-repeat;
  }

  .icon-search::before {
    content: '';
    display: block;
    width: 19px;
    height: 19px;
    background-image: url(/img/icons/search.svg);
    background-size: contain;
    background-repeat: no-repeat;
  }

  .icon-close::before {
    content: '';
    display: block;
    width: 19px;
    height: 19px;
    background-image: url(/img/icons/close.svg);
    background-size: contain;
    background-repeat: no-repeat;
  }

  .icon-vk::before {
    content: '';
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    background-image: url(/img/icons/vk.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }

  .icon-play::before {
      content: '';
      display: block;
      width: 55px;
      height: 55px;
      background-image: url(/img/icons/play-btn.svg);
      background-size: contain;
      background-repeat: no-repeat;
  }

  
  .icon-pause::before {
      content: '';
      display: block;
      width: 55px;
      height: 55px;
      background-image: url(/img/icons/pause-button.svg);
      background-size: 60%;
      background-repeat: no-repeat;
      background-position: center;
      border-radius: 100%;
      background-color: rgba(255, 145, 0 , 0.8);
  }

  .icon-arrow-down::before {
      content: '';
      display: block;
      width: 8px;
      height: 12px;
      background-image: url(/img/icons/arrow-right.svg);
      background-size: contain;
      background-repeat: no-repeat;
  }
  