@charset "UTF-8";

@font-face {
  font-family: 'Material Icons';
  src: url('../web_fonts/MaterialIcons-Regular.eot');
  src: local('Material Icons'),
       local('MaterialIcons-Regular'),
       url('../web_fonts/MaterialIcons-Regular.woff2') format('woff2'),
       url('../web_fonts/MaterialIcons-Regular.woff') format('woff'),
       url('../web_fonts/MaterialIcons-Regular.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
}

/*
@font-face {
  font-family: 'Ionicons';
  src: url('../web_fonts/ionicons.eot');
  src: url('../web_fonts/ionicons.eot#iefix') format('embedded-opentype'),
    url('../web_fonts/ionicons.woff2') format('woff2'),
    url('../web_fonts/ionicons.woff') format('woff'),
    url('../web_fonts/ionicons.ttf') format('truetype'),
    url('../web_fonts/ionicons.svg#Ionicons') format('svg');
  font-weight: normal;
  font-style: normal
}
*/

.icon.mate,
.icon.ion {
  position: relative;
}

.icon.mate:before,
.icon.mate:after,
.icon.ion:before,
.icon.ion:after {
  font-weight: normal !important;
  font-style: normal !important;
  display: inline-block !important;
  line-height: 1 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  font-variant: normal !important;
  word-wrap: normal !important;
  white-space: nowrap !important;
  direction: ltr !important;
  speak: none !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: optimizeLegibility !important;
  -moz-osx-font-smoothing: grayscale !important;
  font-feature-settings: 'liga' !important;

  font-size: 20px;
  color: #333;
  position: absolute;
  top: 50%;
  margin-top: -20px;
}

.icon.mate:before,
.icon.mate:after {
  font-family: 'Material Icons' !important;
}
.icon.ion:before,
.icon.ion:after {
  font-family: 'Ionicons' !important;
}