/* ==========================================================
   1. Font-Face Definition
========================================================== */
@font-face {
  font-family: 'ppl-icons';
  src:  url('fonts/ppl-icons.eot');
  src:  url('fonts/ppl-icons.eot#iefix') format('embedded-opentype'),
        url('fonts/ppl-icons.ttf') format('truetype'),
        url('fonts/ppl-icons.woff') format('woff'),
        url('fonts/ppl-icons.svg#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

/* ==========================================================
   2. Global Icon Utility Classes
========================================================== */
[class^="icon-"], [class*=" icon-"],
[class^="icon-after-"], [class*=" icon-after-"] {
  font-family: 'ppl-icons' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ==========================================================
   3. Specific Icon Mapping
========================================================== */
.icon-close:before {content: "\e900";}
.icon-expand:before {content: "\e901";}
.icon-menu:before {content: "\e902";}
.icon-minimize:before {content: "\e903";}
.icon-next-arrow:before {content: "\e904";}
.icon-prev-arrow:before {content: "\e905";}