@font-face {
    font-family: 'AvenirLight';
    src: url('../fonts/avenir-light.eot');
    src: url('../fonts/avenir-light.eot') format('embedded-opentype'),
         url('../fonts/avenir-light.woff') format('woff'),
         url('../fonts/avenir-light.ttf') format('truetype'),
         url('../fonts/avenir-light.svg#AvenirLight') format('svg');
}
@font-face {
    font-family: 'AvenirRoman';
    src: url('../fonts/avenir-roman.eot');
    src: url('../fonts/avenir-roman.eot') format('embedded-opentype'),
         url('../fonts/avenir-roman.woff') format('woff'),
         url('../fonts/avenir-roman.ttf') format('truetype'),
         url('../fonts/avenir-roman.svg#AvenirRoman') format('svg');
}
@font-face {
    font-family: 'AvenirBook';
    src: url('../fonts/avenir-book.eot');
    src: url('../fonts/avenir-book.eot') format('embedded-opentype'),
         url('../fonts/avenir-book.woff') format('woff'),
         url('../fonts/avenir-book.ttf') format('truetype'),
         url('../fonts/avenir-book.svg#AvenirBook') format('svg');
}
@font-face {
    font-family: 'avenirregular';
    src: url('../fonts/avenir-medium.eot');
    src: url('../fonts/avenir-medium.eot') format('embedded-opentype'),
         url('../fonts/avenir-medium.woff2') format('woff2'),
         url('../fonts/avenir-medium.woff') format('woff'),
         url('../fonts/avenir-medium.ttf') format('truetype');
         url('../fonts/avenir-medium.svg#avenirregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: "gt";
  src:url("../fonts/gt.eot");
  src:url("../fonts/gt.eot?#iefix") format("embedded-opentype"),
    url("../fonts/gt.woff") format("woff"),
    url("../fonts/gt.ttf") format("truetype"),
    url("../fonts/gt.svg#gt") format("svg");
  font-weight: normal;
  font-style: normal;

}

[data-icon]:before,
.modalServices span:before,
.servicesContent button span:before {
    font-family: "gt" !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: block;
}

[class^="icon-"]:before,
[class*=" icon-"]:before,
.modalServices span:before,
.servicesContent button span:before {
    font-family: "gt" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 150px;
}
.modalServices:hover span:before,
.modalServices.active span:before,
.servicesContent button:hover span:before { color: #90be3e }

.modalServices span.icon1:before,
.icon-alkalmazas-fejlesztes:before,
.servicesContent button span.icon1:before {
    content: "a";
}
.modalServices span.icon2:before,
.icon-sajat-szoftver:before,
.servicesContent button span.icon2:before {
    content: "b";
}
.modalServices span.icon3:before,
.icon-rendszer-uzemeltetes:before,
.servicesContent button span.icon3:before  {
  content: "c";
}
.modalServices span.icon4:before,
.icon-szerviz:before,
.servicesContent button span.icon4:before  {
  content: "d";
}
.modalServices span.icon5:before,
.icon-web-grafika:before,
.servicesContent button span.icon5:before  {
  content: "e";
}
.modalServices span.icon6:before,
.icon-kereskedelem:before,
.servicesContent button span.icon6:before  {
  content: "f";
}
.modalServices span.icon7:before,
.modalServices.active span.icon1:before,
.icon-alkalmazas-fejlesztes-hover:before,
.servicesContent button:hover span.icon1:before  {
  content: "g";
}
.icon-sajat-szoftver-hover:before,
.modalServices.active span.icon2:before,
.servicesContent button:hover span.icon2:before {
  content: "h";
}
.icon-rendszer-uzemeltetes-hover:before,
.modalServices.active span.icon3:before,
.servicesContent button:hover span.icon3:before {
  content: "i";
}
.icon-szerviz-hover:before,
.modalServices.active span.icon4:before,
.servicesContent button:hover span.icon4:before {
  content: "j";
}
.icon-web-grafika-hover:before,
.modalServices.active span.icon5:before,
.servicesContent button:hover span.icon5:before {
  content: "k";
}
.icon-kereskedelem-hover:before,
.modalServices.active span.icon6:before,
.servicesContent button:hover span.icon6:before {
  content: "l";
}