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

[class^="kpl"], [class*=" kpl"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'kplicon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.kpllogoline:before {
  content: "\e903";
}
.kplplc:before {
  content: "\e902";
}
.kpllogosimple:before {
  content: "\e901";
}
.kplengineering:before {
  content: "\e923";
}
.kplplanning:before {
  content: "\e924";
}
.kplmech:before {
  content: "\e900";
}
.kplrobot:before {
  content: "\e907";
}
.kpl3dprint:before {
  content: "\e904";
}


i {
  -moz-transition: color 0.2s ease-in-out;
  -webkit-transition: color 0.2s ease-in-out;
  -ms-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
  text-decoration: none; }
  i:hover {
    text-decoration: none;
    color: #003f70;
     }

i .kplplanning .left{
		font-size:700px;
		color:rgba(0, 0, 0, 0.02);
		position:absolute;
		margin-right:400px	  
}

a {
  -moz-transition: color 0.2s ease-in-out;
  -webkit-transition: color 0.2s ease-in-out;
  -ms-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
  text-decoration: none;
  color: #6c757d }
  a:hover {
    text-decoration: none;
    color: #003f70;
     }