@font-face {
    font-family: 'Bariol';
    src: url('/fonts/Bariol/bariol_regular-webfont.eot');
    src: url('/fonts/Bariol/bariol_regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/Bariol/bariol_regular-webfont.woff2') format('woff2'),
    url('/fonts/Bariol/bariol_regular-webfont.woff') format('woff'),
    url('/fonts/Bariol/bariol_regular-webfont.ttf') format('truetype'),
    url('./fonts/Bariol/bariol_regular-webfont.svg#bariol_regularregular') format('svg');
    font-weight: 400;
    font-style: normal;
  }

  @font-face {
      font-family: 'Bariol';
      src: url('/fonts/Bariol/bariol_bold-webfont.eot');
      src: url('/fonts/Bariol/bariol_bold-webfont.eot?#iefix') format('embedded-opentype'),
           url('/fonts/Bariol/bariol_bold-webfont.woff2') format('woff2'),
           url('/fonts/Bariol/bariol_bold-webfont.woff') format('woff'),
           url('/fonts/Bariol/bariol_bold-webfont.ttf') format('truetype'),
           url('/fonts/Bariol/bariol_bold-webfont.svg#bariol_boldbold') format('svg');
      font-weight: 700;
      font-style: normal;
  }

  @font-face {
      font-family: 'Bariol';
      src: url('/fonts/Bariol/bariol_light-webfont.eot');
      src: url('/fonts/Bariol/bariol_light-webfont.eot?#iefix') format('embedded-opentype'),
           url('/fonts/Bariol/bariol_light-webfont.woff2') format('woff2'),
           url('/fonts/Bariol/bariol_light-webfont.woff') format('woff'),
           url('/fonts/Bariol/bariol_light-webfont.ttf') format('truetype'),
           url('/fonts/Bariol/bariol_light-webfont.svg#bariol_lightlight') format('svg');
      font-weight: 300;
      font-style: italic;

  }