@font-face {
  font-family: 'Witkac-design-icons';
  src:  url('../webfonts/Witkac-design-icons.eot?83u2i2');
  src:  url('../webfonts/Witkac-design-icons.eot?83u2i2#iefix') format('embedded-opentype'),
    url('../webfonts/Witkac-design-icons.ttf?83u2i2') format('truetype'),
    url('../webfonts/Witkac-design-icons.woff?83u2i2') format('woff'),
    url('../webfonts/Witkac-design-icons.svg?83u2i2#Witkac-design-icons') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="wdi-"], [class*=" wdi-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'Witkac-design-icons' !important;
  speak: none;
  font-style: normal;
  font-variant: normal;
  text-transform: none;
  text-align: left;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  display: inline-block; /* So we can set its width */
  white-space: pre;      /* Turn newlines into actual newlines */
  line-height: 0;        /* Overlap icons vertically */
  padding: 0.5em 0;      /* Compensate for zero line height */
  width: 1em;            /* Compensate for negative letter spacing */
  overflow: hidden;      /* Remove rest of the actual word, leaving the first letter */

  font-weight: 300;      /* Weight for third layer */
}

/* DOC */

.wdi-doc:before {
  content: "\e900" "\a" "\e901" "\a" "\e902";
  color: rgb(66, 133, 244);
}
.wdi-doc:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-doc:after {
  content: "\e903" "\a" "\e904" "\a" "\e905";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-doc-flat:before {
  content: "\e906";
}
.wdi-doc-outline:before {
  content: "\e907";
}

/* JPG */

.wdi-jpg:before {
  content: "\e908" "\a" "\e909" "\a" "\e90a";
  color: rgb(146, 52, 165);
}
.wdi-jpg:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-jpg:after {
  content: "\e90b" "\a" "\e90c" "\a" "\e90d";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-jpg-flat:before {
  content: "\e90e";
}
.wdi-jpg-outline:before {
  content: "\e90f";
}

/* PDF */

.wdi-pdf:before {
  content: "\e910" "\a" "\e911" "\a" "\e912";
  color: rgb(241, 86, 66);
}
.wdi-pdf:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-pdf:after {
  content: "\e913" "\a" "\e914" "\a" "\e915";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-pdf-flat:before {
  content: "\e916";
}
.wdi-pdf-outline:before {
  content: "\e917";
}


/* PNG */

.wdi-png:before {
  content: "\e918" "\a" "\e919" "\a" "\e91a";
  color: rgb(146, 52, 165);
}
.wdi-png:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-png:after {
  content: "\e91b" "\a" "\e91c" "\a" "\e91d";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-png-flat:before {
  content: "\e91e";
}
.wdi-png-outline:before {
  content: "\e91f";
}

/* PPT */

.wdi-ppt:before {
  content: "\e920" "\a" "\e921" "\a" "\e922";
  color: rgb(242, 153, 0);
}
.wdi-ppt:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-ppt:after {
  content: "\e923" "\a" "\e924" "\a" "\e925";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-ppt-flat:before {
  content: "\e926";
}
.wdi-ppt-outline:before {
  content: "\e927";
}

/* SVG */

.wdi-svg:before {
  content: "\e928" "\a" "\e929" "\a" "\e92a";
  color: rgb(146, 52, 165);
}
.wdi-svg:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-svg:after {
  content: "\e92b" "\a" "\e92c" "\a" "\e92d";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-svg-flat:before {
  content: "\e92e";
}
.wdi-svg-outline:before {
  content: "\e92f";
}

/* TXT */

.wdi-txt:before {
  content: "\e930" "\a" "\e931" "\a" "\e932";
  color: rgb(91, 108, 117);
}
.wdi-txt:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-txt:after {
  content: "\e933" "\a" "\e934" "\a" "\e935";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-txt-flat:before {
  content: "\e936";
}
.wdi-txt-outline:before {
  content: "\e937";
}

/* XLS */

.wdi-xls:before {
  content: "\e938" "\a" "\e939" "\a" "\e93a";
  color: rgb(52, 168, 83);
}
.wdi-xls:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-xls:after {
  content: "\e93b" "\a" "\e93c" "\a" "\e93d";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-xls-flat:before {
  content: "\e93e";
}
.wdi-xls-outline:before {
  content: "\e93f";
}

/* xml */

.wdi-xml:before {
  content: "\e940" "\a" "\e941" "\a" "\e942";
  color: rgb(66, 133, 244);
}
.wdi-xml:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-xml:after {
  content: "\e943" "\a" "\e944" "\a" "\e945";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-xml-flat:before {
  content: "\e946";
}
.wdi-xml-outline:before {
  content: "\e947";
}

/* zip */

.wdi-zip:before {
  content: "\e948" "\a" "\e949" "\a" "\e94a";
  color: rgb(242, 153, 0);
}
.wdi-zip:first-letter {
  color: rgb(226, 229, 231);
}
.wdi-zip:after {
  content: "\e94b" "\a" "\e94c" "\a" "\e94d";
  margin-left: -0.900390625em;
  color: rgb(255, 255, 255);
}

.wdi-zip-flat:before {
  content: "\e94e";
}
.wdi-zip-outline:before {
  content: "\e94f";
}
