[class*='omnicon-'] {
  --oc-primary-color: #6B08A0; /* purple */
  --oc-secondary-color: #F0DCFF; /* light purple */
  --oc-primary-opacity: 1;
  --oc-secondary-opacity: 1;
}
@font-face {
    font-family: 'Omnicons HD';
    src: url('../fonts/omnicon-handdrawn.eot');
    src: url('../fonts/omnicon-handdrawn.eot?#iefix') format('embedded-opentype'),
         url('../fonts/omnicon-handdrawn.woff') format('woff'),
         url('../fonts/omnicon-handdrawn.ttf') format('truetype'),
         url('../fonts/omnicon-handdrawn.svg#omnicon') format('svg');
    font-weight: normal;
    font-style: normal;
}
[class*='omnicon-hd-']:before{
   display: inline-block;
   font-family: 'Omnicons HD';
   font-style: normal;
   font-weight: normal;
   line-height: 1;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}

@font-face {
    font-family: 'Omnicons SK';
    src: url('../fonts/omnicon-skinny.eot');
    src: url('../fonts/omnicon-skinny.eot?#iefix') format('embedded-opentype'),
         url('../fonts/omnicon-skinny.woff') format('woff'),
         url('../fonts/omnicon-skinny.ttf') format('truetype'),
         url('../fonts/omnicon-skinny.svg#omnicon') format('svg');
    font-weight: normal;
    font-style: normal;
}
[class*='omnicon-sk-']:before{
    display: inline-block;
   font-family: 'Omnicons SK';
   font-style: normal;
   font-weight: normal;
   line-height: 1;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}

@font-face {
  font-family: "Omnicons Duotone";
  src: url("../fonts/omnicon-duotone.eot");
  src: url("../fonts/omnicon-duotone.eot?#iefix") format("embedded-opentype"), url("../fonts/omnicon-duotone.woff") format("woff"), url("../fonts/omnicon-duotone.ttf") format("truetype"), url("../fonts/omnicon-duotone.svg#Duotone") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class*=omnicon-dt-] :after,
[class*=omnicon-dt-] :before,
[class*=omnicon-dt-]:before,
[class*=omnicon-dt-]:after {
  display: inline-block;
  font-family: "Omnicons Duotone";
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class*=omnicon-dt-] {
  display: inline-block !important;
  position: relative;
}
[class*=omnicon-dt-]:before {
  position: relative;
  z-index: 5;
}
[class*=omnicon-dt-]:after {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 3;
  opacity: var(--oc-secondary-opacity, inherit);
}
[class*=omnicon-dt-] i {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 1;
}

[class*=omnicon-dt-]:before {
  position: relative;
  z-index: 20;
}

[class*=omnicon-dt-] i {
  display: inline-block !important;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
[class*=omnicon-dt-] i:before, [class*=omnicon-dt-] i:after {
  display: inline-block !important;
  position: absolute;
  width: 100%;
  height: 100%;
}
[class*=omnicon-dt-] i:before {
  z-index: 2;
  color: var(--oc-primary-color, inherit);
  opacity: var(--oc-primary-opacity, inherit);
}
[class*=omnicon-dt-] i:after {
  z-index: 3;
  color: var(--oc-secondary-color, inherit);
}

/*=== FONT_TYPE ===*/
.omnicon-hd-airplane:before{content:'\0041';}
.omnicon-hd-boat:before{content:'\0042';}
.omnicon-hd-car:before{content:'\0043';}
.omnicon-hd-computer:before{content:'\0044';}
.omnicon-hd-credit-card:before{content:'\0045';}
.omnicon-hd-cruise-ship:before{content:'\0046';}
.omnicon-hd-document:before{content:'\0047';}
.omnicon-hd-gift:before{content:'\0048';}
.omnicon-hd-graduation-cap:before{content:'\0049';}
.omnicon-hd-group-of-people:before{content:'\004a';}
.omnicon-hd-house:before{content:'\004b';}
.omnicon-hd-lightbulb:before{content:'\004c';}
.omnicon-hd-location:before{content:'\004d';}
.omnicon-hd-megaphone:before{content:'\004e';}
.omnicon-hd-mobile:before{content:'\004f';}
.omnicon-hd-money:before{content:'\0050';}
.omnicon-hd-motorcyle:before{content:'\0051';}
.omnicon-hd-percentage:before{content:'\0052';}
.omnicon-hd-rv:before{content:'\0053';}
.omnicon-hd-wedding:before{content:'\0054';}

/*=== FONT_TYPE ===*/
.omnicon-sk-airplane:before{content:'\0041';}
.omnicon-sk-boat:before{content:'\0042';}
.omnicon-sk-car:before{content:'\0043';}
.omnicon-sk-computer:before{content:'\0044';}
.omnicon-sk-credit-card:before{content:'\0045';}
.omnicon-sk-cruise-ship:before{content:'\0046';}
.omnicon-sk-document:before{content:'\0047';}
.omnicon-sk-gift:before{content:'\0048';}
.omnicon-sk-graduation-cap:before{content:'\0049';}
.omnicon-sk-group-of-people:before{content:'\004a';}
.omnicon-sk-house:before{content:'\004b';}
.omnicon-sk-lightbulb:before{content:'\004c';}
.omnicon-sk-location:before{content:'\004d';}
.omnicon-sk-megaphone:before{content:'\004e';}
.omnicon-sk-mobile:before{content:'\004f';}
.omnicon-sk-money:before{content:'\0050';}
.omnicon-sk-motorcycle:before{content:'\0051';}
.omnicon-sk-percentage:before{content:'\0052';}
.omnicon-sk-rv:before{content:'\0053';}
.omnicon-sk-wedding:before{content:'\0054';}

/*=== FONT_TYPE ===*/
[class*="omnicon-dt"] {
  
}
.omnicon-dt-airplane:before {
  content: "A";
}
.omnicon-dt-airplane:after {
  content: "B";
  top: 12.2%;
  left: 11%;
  font-size: 89%;
  color: var(--oc-primary-color, inherit);
  
}
.omnicon-dt-airplane i {
  top: 0;
  left: 0;
}
.omnicon-dt-airplane i:before {
  top: 11.3%;
  left: 0;
  font-size: 98%;
  content: "C";
  color: var(--oc-secondary-color, inherit);
  
}

.omnicon-dt-boat:before {
  content: "D";
}
.omnicon-dt-boat:after {
  top: 12%;
  left: 10%;
  font-size: 77%;
  content: "E";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-boat i:before {
  top: 9.2%;
  left: 1%;
  font-size: 98%;
  content: "F";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-car:before {
  content: "G";
}
.omnicon-dt-car:after {
  top: 9.5%;
  left: 0;
  content: "H";
  color: var(--oc-primary-color, inherit);
  
}
.omnicon-dt-car i:before {
  top: 13.5%;
  left: 6.5%;
  font-size: 87.5%;
  z-index: 10;
  content: "I";
  color: var(--oc-secondary-color, inherit);
  
}

.omnicon-dt-credit-card:before {
  content: "M";
}
.omnicon-dt-credit-card:after {
  top: 7%;
  left: 0;
  font-size: 82%;
  content: "N";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-credit-card i:before {
  top: 23%;
  left: 18.5%;
  font-size: 81%;
  z-index: 10;
  content: "O";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-house:before {
  content: "Y";
}
.omnicon-dt-house:after {
  top: 8.5%;
  left: -1%;
  font-size: 100%;
  content: "Z";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-house i:before {
  top: 19%;
  left: 15%;
  font-size: 77%;
  z-index: 10;
  content: "a";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-computer:before {
  content: "J";
}
.omnicon-dt-computer:after {
  top: 8.5%;
  left: 0.2%;
  font-size: 100%;
  content: "K";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-computer i:before {
  top: 27%;
  left: -0.2%;
  font-size: 100%;
  z-index: 10;
  content: "L";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-mobile:before {
  content: "k";
}
.omnicon-dt-mobile:after {
  top: 11%;
  left: -1.5%;
  font-size: 96%;
  content: "l";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-mobile i:before {
  top: 13%;
  left: -8%;
  font-size: 90%;
  z-index: 10;
  content: "m";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-money:before {
  content: "n";
}
.omnicon-dt-money:after {
  top: 8.5%;
  left: -1%;
  font-size: 100.5%;
  z-index: 10;
  content: "o";
  color: var(--oc-primary-color, inherit);
}
.omnicon-dt-money i {
  z-index: 10;
}
.omnicon-dt-money i:before {
  top: 22.5%;
  left: 5.5%;
  font-size: 88.2%;
  content: "p";
  color: var(--oc-secondary-color, inherit);
  
}

.omnicon-dt-gift:before {
  content: "S";
}
.omnicon-dt-gift:after {
  top: 8.5%;
  left: 0;
  font-size: 100%;
  content: "T";
  color: var(--oc-primary-color, inherit);
  
}
.omnicon-dt-gift i {
  z-index: 10;
}
.omnicon-dt-gift i:before {
  top: 25.5%;
  left: 9%;
  font-size: 82%;
  content: "U";
  color: var(--oc-secondary-color, inherit);
  
}

.omnicon-dt-rv:before {
  content: "q";
}
.omnicon-dt-rv:after {
  top: 8.75%;
  left: 0.35%;
  font-size: 99.35%;
  content: "r";
  color: var(--oc-primary-color, inherit);
  
}
.omnicon-dt-rv i {
  z-index: 10;
}
.omnicon-dt-rv i:before {
  top: 8.66%;
  left: 0;
  font-size: 88%;
  content: "s";
  color: var(--oc-secondary-color, inherit);
  
}

.omnicon-dt-graduation-cap:before {
  content: "V";
}
.omnicon-dt-graduation-cap:after {
  top: 6.75%;
  left: 0.35%;
  font-size: 98.45%;
  content: "W";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-graduation-cap i {
  z-index: 10;
}
.omnicon-dt-graduation-cap i:before {
  top: 17.85%;
  left: 2.85%;
  font-size: 78%;
  content: "X";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-document:before {
  content: "P";
}
.omnicon-dt-document:after {
  top: 11.45%;
  left: 1.4%;
  font-size: 95.55%;
  content: "Q";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-document i {
  z-index: 10;
}
.omnicon-dt-document i:before {
  top: 8.85%;
  left: 3.85%;
  font-size: 92%;
  content: "R";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-lightbulb:before {
  content: "b";
}
.omnicon-dt-lightbulb:after {
  top: 9%;
  left: 0.5%;
  font-size: 99%;
  content: "c";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-lightbulb i {
  z-index: 10;
}
.omnicon-dt-lightbulb i:before {
  top: 4%;
  left: -4%;
  font-size: 106%;
  content: "d";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-location:before {
  content: "e";
}
.omnicon-dt-location:after {
  top: 14.5%;
  left: 5.5%;
  font-size: 97%;
  content: "f";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-location i {
  z-index: 10;
}
.omnicon-dt-location i:before {
  top: 12.5%;
  left: 2%;
  font-size: 84.5%;
  content: "g";
  color: var(--oc-primary-color, inherit);
  
}

.omnicon-dt-megaphone:before {
  content: "h";
}
.omnicon-dt-megaphone:after {
  top: 17%;
  left: 16.5%;
  font-size: 72%;
  content: "i";
  color: var(--oc-secondary-color, inherit);
  
}
.omnicon-dt-megaphone i {
  z-index: 10;
}
.omnicon-dt-megaphone i:before {
  top: 26.25%;
  left: -5%;
  font-size: 61%;
  content: "j";
  color: var(--oc-primary-color, inherit);
  
}