/*
Flaticon icon font: Flaticon
Creation date: 02/02/2020 11:30
*/

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

@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: "Flaticon";
    src: url("../fonts/Flaticon.svg#Flaticon") format("svg");
  }
}

/* Remove the font glyph rendering */
[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {
  content: none;
}

/* PNG-based icons */
.flaticon-checklist,
.flaticon-audit,
.flaticon-checklist-1 {
  display: block !important;
  width: 60px !important;
  height: 60px !important;
  margin: 0 auto !important;
  overflow: visible !important;
  background-color: #45524F;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
      margin-bottom: 30px;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  transition: background-color 0.3s ease;
}





.service-icon {
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 auto;
     margin-bottom: 30px;
  color: #45524F;
  transition: color 0.3s ease;
}

.service-icon svg {
  width: 100%;
  height: 100%;
}

.service-icon:hover {
  color: #0E4B45;
}