/*
  	Flaticon icon font: Flaticon
  	Creation date: 26/02/2021 19:03
  	*/

@font-face {
  font-family: "Flaticon";
  src: url("../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");
  font-weight: normal;
  font-style: normal;
}

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

[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {   
  font-family: Flaticon;
        font-size: 20px;
font-style: normal;
margin-left: 0;
}

.flaticon-garden:before { content: "\f100"; }
.flaticon-trees:before { content: "\f101"; }
.flaticon-dumbbell:before { content: "\f102"; }
.flaticon-couch:before { content: "\f103"; }
.flaticon-sports:before { content: "\f104"; }
.flaticon-cheers:before { content: "\f105"; }
.flaticon-park:before { content: "\f106"; }
.flaticon-basketball-court:before { content: "\f107"; }
.flaticon-basketball:before { content: "\f108"; }
.flaticon-scythe:before { content: "\f109"; }
.flaticon-agriculture:before { content: "\f10a"; }
.flaticon-solar-panel:before { content: "\f10b"; }
.flaticon-water:before { content: "\f10c"; }
.flaticon-electric-car:before { content: "\f10d"; }
.flaticon-waiting-room:before { content: "\f10e"; }
.flaticon-books:before { content: "\f10f"; }
.flaticon-theater:before { content: "\f110"; }
.flaticon-cinema:before { content: "\f111"; }
.flaticon-amphitheatre:before { content: "\f112"; }
.flaticon-chess:before { content: "\f113"; }
.flaticon-butterfly:before { content: "\f114"; }
.flaticon-swimming-pool:before { content: "\f115"; }
.flaticon-running:before { content: "\f116"; }
.flaticon-roller-skate:before { content: "\f117"; }
.flaticon-tennis-racket:before { content: "\f118"; }
.flaticon-university:before { content: "\f119"; }
.flaticon-retail:before { content: "\f11a"; }
.flaticon-shopping-cart:before { content: "\f11b"; }
.flaticon-skyscrapper:before { content: "\f11c"; }
.flaticon-condominium:before { content: "\f11d"; }
.flaticon-condominium-1:before { content: "\f11e"; }
.flaticon-transportation:before { content: "\f11f"; }
.flaticon-house:before { content: "\f120"; }
.flaticon-house-1:before { content: "\f121"; }
.flaticon-lotus-position:before { content: "\f122"; }
.flaticon-plant:before { content: "\f123"; }
.flaticon-planet-earth:before { content: "\f124"; }
.flaticon-outdoor-cafe:before { content: "\f125"; }
.flaticon-chair:before { content: "\f126"; }
.flaticon-terrace:before { content: "\f127"; }
.flaticon-gamepad:before { content: "\f128"; }
.flaticon-game-controller:before { content: "\f129"; }
.flaticon-shower:before { content: "\f12a"; }
.flaticon-home:before { content: "\f12b"; }
.flaticon-bedroom:before { content: "\f12c"; }
.flaticon-hot:before { content: "\f12d"; }
.flaticon-sauna:before { content: "\f12e"; }
.flaticon-parking:before { content: "\f12f"; }
.flaticon-parking-1:before { content: "\f130"; }
.flaticon-conference:before { content: "\f131"; }
.flaticon-doors:before { content: "\f132"; }
.flaticon-door:before { content: "\f133"; }
.flaticon-air-conditioner:before { content: "\f134"; }
.flaticon-draws:before { content: "\f135"; }
.flaticon-paint:before { content: "\f136"; }
.flaticon-paint-roller:before { content: "\f137"; }
.flaticon-window:before { content: "\f138"; }
.flaticon-windows:before { content: "\f139"; }
.flaticon-jacuzzi:before { content: "\f13a"; }
.flaticon-jacuzzi-1:before { content: "\f13b"; }
.flaticon-bin:before { content: "\f13c"; }
.flaticon-recycle-bin:before { content: "\f13d"; }
.flaticon-recycling-bin:before { content: "\f13e"; }
.flaticon-table-tennis:before { content: "\f13f"; }
.flaticon-extinguisher:before { content: "\f140"; }
.flaticon-extinguisher-1:before { content: "\f141"; }
.flaticon-hot-spring:before { content: "\f142"; }
.flaticon-lotus:before { content: "\f143"; }
.flaticon-home-1:before { content: "\f144"; }
.flaticon-home-2:before { content: "\f145"; }
.flaticon-location:before { content: "\f146"; }
.flaticon-blueprint:before { content: "\f147"; }
.flaticon-pin:before { content: "\f148"; }
.flaticon-pin-1:before { content: "\f149"; }
.flaticon-bed:before { content: "\f14a"; }
.flaticon-shower-1:before { content: "\f14b"; }
.flaticon-hand-sanitizer:before { content: "\f14c"; }
.flaticon-hygienic:before { content: "\f14d"; }
.flaticon-inbox:before { content: "\f14e"; }
.flaticon-rupee-indian:before { content: "\f14f"; }
.flaticon-rupee:before { content: "\f150"; }
.flaticon-rupee-1:before { content: "\f151"; }
.flaticon-tick:before { content: "\f152"; }
.flaticon-tick-1:before { content: "\f153"; }
.flaticon-car:before { content: "\f154"; }
.flaticon-coffee:before { content: "\f155"; }
.flaticon-coffee-cup:before { content: "\f156"; }
.flaticon-pizza:before { content: "\f157"; }
.flaticon-cutlery:before { content: "\f158"; }
.flaticon-train:before { content: "\f159"; }
.flaticon-train-1:before { content: "\f15a"; }
.flaticon-mall:before { content: "\f15b"; }
.flaticon-mall-1:before { content: "\f15c"; }
.flaticon-shopping-cart-1:before { content: "\f15d"; }
.flaticon-school:before { content: "\f15e"; }
.flaticon-woodland:before { content: "\f15f"; }
.flaticon-plane:before { content: "\f160"; }
.flaticon-plane-1:before { content: "\f161"; }
.flaticon-highway:before { content: "\f162"; }
.flaticon-bank:before { content: "\f163"; }
.flaticon-atm-machine:before { content: "\f164"; }
.flaticon-home-security:before { content: "\f165"; }
.flaticon-shield:before { content: "\f166"; }
.flaticon-panorama:before { content: "\f167"; }
.flaticon-panoramic-view:before { content: "\f168"; }
.flaticon-virtual-reality:before { content: "\f169"; }
.flaticon-lamps:before { content: "\f16a"; }
.flaticon-lamp-design-with-curls:before { content: "\f16b"; }
.flaticon-living-room:before { content: "\f16c"; }
.flaticon-fraternity:before { content: "\f16d"; }
.flaticon-barbell:before { content: "\f16e"; }
.flaticon-exercise:before { content: "\f16f"; }
.flaticon-ping-pong:before { content: "\f170"; }
.flaticon-bicycle:before { content: "\f171"; }
.flaticon-toys:before { content: "\f172"; }
.flaticon-grandfather:before { content: "\f173"; }
.flaticon-senior:before { content: "\f174"; }
.flaticon-confetti:before { content: "\f175"; }
.flaticon-drink:before { content: "\f176"; }
.flaticon-meditation:before { content: "\f177"; }
.flaticon-tyre:before { content: "\f178"; }
.flaticon-tyre-1:before { content: "\f179"; }
.flaticon-car-1:before { content: "\f17a"; }
.flaticon-hospital:before { content: "\f17b"; }
.flaticon-fire-truck:before { content: "\f17c"; }
.flaticon-om:before { content: "\f17d"; }
.flaticon-dance:before { content: "\f17e"; }
.flaticon-ballet:before { content: "\f17f"; }
.flaticon-waterpark:before { content: "\f180"; }
.flaticon-canvas:before { content: "\f181"; }
.flaticon-education:before { content: "\f182"; }
.flaticon-playing-cards:before { content: "\f183"; }
.flaticon-snooker:before { content: "\f184"; }
.flaticon-climbing:before { content: "\f185"; }
.flaticon-cricket:before { content: "\f186"; }
.flaticon-laptop:before { content: "\f187"; }
.flaticon-secure-shield:before { content: "\f188"; }
.flaticon-shield-1:before { content: "\f189"; }
.flaticon-video-door-phone:before { content: "\f18a"; }
.flaticon-lobby:before { content: "\f18b"; }
.flaticon-elevator:before { content: "\f18c"; }
.flaticon-deck-chair:before { content: "\f18d"; }
.flaticon-deck-chair-1:before { content: "\f18e"; }
.flaticon-bbq-grill:before { content: "\f18f"; }
.flaticon-grill:before { content: "\f190"; }
.flaticon-key:before { content: "\f191"; }
.flaticon-key-1:before { content: "\f192"; }
.flaticon-key-2:before { content: "\f193"; }
.flaticon-exercise-1:before { content: "\f194"; }
.flaticon-yoga-position:before { content: "\f195"; }
.flaticon-toddler:before { content: "\f196"; }
.flaticon-butterflies:before { content: "\f197"; }
.flaticon-grass:before { content: "\f198"; }
.flaticon-swimming-pool-1:before { content: "\f199"; }
.flaticon-water-slide:before { content: "\f19a"; }
.flaticon-gazebo:before { content: "\f19b"; }
.flaticon-footprint:before { content: "\f19c"; }
.flaticon-footprint-1:before { content: "\f19d"; }
.flaticon-gardening:before { content: "\f19e"; }
.flaticon-building:before { content: "\f19f"; }
.flaticon-watering-can:before { content: "\f1a0"; }
.flaticon-park-1:before { content: "\f1a1"; }
.flaticon-bench:before { content: "\f1a2"; }
.flaticon-park-2:before { content: "\f1a3"; }
.flaticon-castle:before { content: "\f1a4"; }
.flaticon-beer-mug:before { content: "\f1a5"; }
.flaticon-consulting:before { content: "\f1a6"; }
.flaticon-bonfire:before { content: "\f1a7"; }
.flaticon-bonfire-1:before { content: "\f1a8"; }
.flaticon-bonfire-2:before { content: "\f1a9"; }
.flaticon-road-map:before { content: "\f1aa"; }
.flaticon-road:before { content: "\f1ab"; }
.flaticon-choice:before { content: "\f1ac"; }
.flaticon-family:before { content: "\f1ad"; }
.flaticon-family-1:before { content: "\f1ae"; }
.flaticon-family-2:before { content: "\f1af"; }
.flaticon-trophy:before { content: "\f1b0"; }
.flaticon-architect:before { content: "\f1b1"; }
.flaticon-toilet:before { content: "\f1b2"; }
.flaticon-toilet-1:before { content: "\f1b3"; }
.flaticon-palm-tree:before { content: "\f1b4"; }
.flaticon-shower-2:before { content: "\f1b5"; }
.flaticon-shower-3:before { content: "\f1b6"; }
.flaticon-ranking:before { content: "\f1b7"; }
.flaticon-cutlery-1:before { content: "\f1b8"; }
.flaticon-kitchen:before { content: "\f1b9"; }
.flaticon-microwave:before { content: "\f1ba"; }
.flaticon-kitchen-1:before { content: "\f1bb"; }
.flaticon-tray:before { content: "\f1bc"; }
.flaticon-bake:before { content: "\f1bd"; }
.flaticon-mixer:before { content: "\f1be"; }
.flaticon-hand:before { content: "\f1bf"; }
.flaticon-handshake:before { content: "\f1c0"; }
.flaticon-conversation:before { content: "\f1c1"; }
.flaticon-home-3:before { content: "\f1c2"; }
.flaticon-bar-chart:before { content: "\f1c3"; }
.flaticon-loupe:before { content: "\f1c4"; }
.flaticon-support:before { content: "\f1c5"; }
.flaticon-resume:before { content: "\f1c6"; }
.flaticon-clock:before { content: "\f1c7"; }
.flaticon-antique-balcony:before { content: "\f1c8"; }
.flaticon-balcony:before { content: "\f1c9"; }
.flaticon-soccer-ball-variant:before { content: "\f1ca"; }
.flaticon-football:before { content: "\f1cb"; }
.flaticon-pond:before { content: "\f1cc"; }
.flaticon-lake:before { content: "\f1cd"; }
.flaticon-youth:before { content: "\f1ce"; }
.flaticon-swimming-pool-2:before { content: "\f1cf"; }
.flaticon-swimming-pool-3:before { content: "\f1d0"; }
.flaticon-fountain:before { content: "\f1d1"; }
.flaticon-fountain-1:before { content: "\f1d2"; }
.flaticon-swing:before { content: "\f1d3"; }
.flaticon-bamboo:before { content: "\f1d4"; }
.flaticon-graduated:before { content: "\f1d5"; }
.flaticon-diploma:before { content: "\f1d6"; }
.flaticon-plumbing:before { content: "\f1d7"; }
.flaticon-tribune:before { content: "\f1d8"; }
.flaticon-basin:before { content: "\f1d9"; }
.flaticon-conference-1:before { content: "\f1da"; }
.flaticon-lobby-1:before { content: "\f1db"; }
.flaticon-cctv:before { content: "\f1dc"; }
.flaticon-cctv-camera:before { content: "\f1dd"; }
.flaticon-electric:before { content: "\f1de"; }
.flaticon-plug:before { content: "\f1df"; }
.flaticon-fire-extinguisher:before { content: "\f1e0"; }
.flaticon-earthquake:before { content: "\f1e1"; }
.flaticon-bus-stop:before { content: "\f1e2"; }
.flaticon-squash:before { content: "\f1e3"; }
.flaticon-relax:before { content: "\f1e4"; }
.flaticon-bridge:before { content: "\f1e5"; }
.flaticon-golf:before { content: "\f1e6"; }
.flaticon-certificate:before { content: "\f1e7"; }
.flaticon-crane:before { content: "\f1e8"; }
.flaticon-architect-1:before { content: "\f1e9"; }
.flaticon-dice:before { content: "\f1ea"; }
.flaticon-carrom:before { content: "\f1eb"; }
.flaticon-foosball:before { content: "\f1ec"; }
.flaticon-wall:before { content: "\f1ed"; }
.flaticon-plan:before { content: "\f1ee"; }
.flaticon-interior-design:before { content: "\f1ef"; }
.flaticon-facebook-app-symbol:before { content: "\f1f0"; }
.flaticon-twitter:before { content: "\f1f1"; }
.flaticon-instagram:before { content: "\f1f2"; }
.flaticon-linkedin:before { content: "\f1f3"; }
.flaticon-left-quote:before { content: "\f1f4"; }
.flaticon-right-arrows:before { content: "\f1f5"; }
.flaticon-more:before { content: "\f1f6"; }
.flaticon-add:before { content: "\f1f7"; }
.flaticon-car-wash:before { content: "\f1f8"; }
.flaticon-guide-dog:before { content: "\f1f9"; }
.flaticon-down-arrow:before { content: "\f1fa"; }
.flaticon-left-arrow:before { content: "\f1fb"; }
.flaticon-youtube:before { content: "\f1fc"; }
.flaticon-flickr:before { content: "\f1fd"; }



/*  icon hover effect*/
    .hi-icon-wrap {
        text-align: center;
        margin: 0 auto;
        padding: 2em 0 3em;
    }

    .hi-icon {
        display: inline-block;
        font-size: 0px;
        cursor: pointer;
        margin: 15px 30px;
        width: 90px;
        height: 90px;
        border-radius: 50%;
        text-align: center;
        position: relative;
        z-index: 1;
        color: #fff;
    }

    .hi-icon:after {
        pointer-events: none;
        position: absolute;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        content: '';
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
    }

    .hi-icon:before {
        speak: none;
        font-size: 48px;
        line-height: 90px;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        display: block;
        -webkit-font-smoothing: antialiased;
    }

    /* Effect 1 */
    .hi-icon-effect-1 .hi-icon {
        background: rgba(255,255,255,0.1);
        -webkit-transition: background 0.2s, color 0.2s;
        -moz-transition: background 0.2s, color 0.2s;
        transition: background 0.2s, color 0.2s;
    }

    .hi-icon-effect-1 .hi-icon:after {
        top: -7px;
        left: -7px;
        padding: 7px;
        box-shadow: 0 0 0 4px #efaa74;
        -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
        -webkit-transform: scale(.8);
        -moz-transition: -moz-transform 0.2s, opacity 0.2s;
        -moz-transform: scale(.8);
        -ms-transform: scale(.8);
        transition: transform 0.2s, opacity 0.2s;
        transform: scale(.8);
        opacity: 0;
    }

    /* Effect 1a */
    .hi-icon-effect-1a .hi-icon:hover {
        background: rgba(255,255,255,1);
        color: #41ab6b;
    }

    .hi-icon-effect-1a .hi-icon:hover:after {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }

    /* Effect 1b */
    .hi-icon-effect-1b .hi-icon:hover {
        background: rgba(255,255,255,1);
        color: #41ab6b;
    }

    .hi-icon-effect-1b .hi-icon:after {
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -ms-transform: scale(1.2);
        transform: scale(1.2);
    }

    .hi-icon-effect-1b .hi-icon:hover:after {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }

    /* Effect 2 */
    .hi-icon-effect-2 .hi-icon {
        color: #eea303;
        box-shadow: 0 0 0 3px #fff;
        -webkit-transition: color 0.3s;
        -moz-transition: color 0.3s;
        transition: color 0.3s;
    }

    .hi-icon-effect-2 .hi-icon:after {
        top: -2px;
        left: -2px;
        padding: 2px;
        z-index: -1;
        background: #fff;
        -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
        -moz-transition: -moz-transform 0.2s, opacity 0.2s;
        transition: transform 0.2s, opacity 0.2s;
    }

    /* Effect 2a */
    .hi-icon-effect-2a .hi-icon:hover {
        color: #eea303;
    }

    .hi-icon-effect-2a .hi-icon:hover:after {
        -webkit-transform: scale(0.85);
        -moz-transform: scale(0.85);
        -ms-transform: scale(0.85);
        transform: scale(0.85);
    }

    /* Effect 2b */
    .hi-icon-effect-2b .hi-icon:hover:after {
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -ms-transform: scale(0);
        transform: scale(0);
        opacity: 0;
        -webkit-transition: -webkit-transform 0.4s, opacity 0.2s;
        -moz-transition: -moz-transform 0.4s, opacity 0.2s;
        transition: transform 0.4s, opacity 0.2s;
    }

    .hi-icon-effect-2b .hi-icon:hover {
        color: #fff;
    }

    /* Effect 3 */
    .hi-icon-effect-3 .hi-icon {
        box-shadow: 0 0 0 4px #fff;
        -webkit-transition: color 0.3s;
        -moz-transition: color 0.3s;
        transition: color 0.3s;
    }

    .hi-icon-effect-3 .hi-icon:after {
        top: -2px;
        left: -2px;
        padding: 2px;
        z-index: -1;
        background: #fff;
        -webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
        -moz-transition: -moz-transform 0.2s, opacity 0.3s;
        transition: transform 0.2s, opacity 0.3s;
    }

    /* Effect 3a */
    .hi-icon-effect-3a .hi-icon {
        color: #f06060;
    }

    .hi-icon-effect-3a .hi-icon:hover {
        color: #fff;
    }

    .hi-icon-effect-3a .hi-icon:hover:after {
        -webkit-transform: scale(1.3);
        -moz-transform: scale(1.3);
        -ms-transform: scale(1.3);
        transform: scale(1.3);
        opacity: 0;
    }

    /* Effect 3b */
    .hi-icon-effect-3b .hi-icon {
        color: #fff;
    }

    .hi-icon-effect-3b .hi-icon:hover {
        color: #f06060;
    }

    .hi-icon-effect-3b .hi-icon:after {
        -webkit-transform: scale(1.3);
        -moz-transform: scale(1.3);
        -ms-transform: scale(1.3);
        transform: scale(1.3);
        opacity: 0;
    }

    .hi-icon-effect-3b .hi-icon:hover:after {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }

    /* Effect 4 */
    .hi-icon-effect-4 .hi-icon {
        width: 92px;
        height: 92px;
        box-shadow: 0 0 0 4px rgba(255,255,255,1);
    }

    .hi-icon-effect-4a .hi-icon {
        -webkit-transition: box-shadow 0.2s;
        -moz-transition: box-shadow 0.2s;
        transition: box-shadow 0.2s;
    }

    .hi-icon-effect-4 .hi-icon:before {
        line-height: 92px;
    }

    .hi-icon-effect-4 .hi-icon:after {
        top: -4px;
        left: -4px;
        padding: 0;
        z-index: 10;
        border: 4px dashed #fff;
    }

    .hi-icon-effect-4 .hi-icon:hover {
        box-shadow: 0 0 0 0 rgba(255,255,255,0);
        color: #fff;
    }

    /* Effect 4b */
    .hi-icon-effect-4b .hi-icon:hover {
        -webkit-transition: box-shadow 0.2s;
        -moz-transition: box-shadow 0.2s;
        transition: box-shadow 0.2s;
    }

    .hi-icon-effect-4b .hi-icon:hover:after {
        -webkit-animation: spinAround 9s linear infinite;
        -moz-animation: spinAround 9s linear infinite;
        animation: spinAround 9s linear infinite;
    }

    @-webkit-keyframes spinAround {
        from {
            -webkit-transform: rotate(0deg)
        }
        to {
            -webkit-transform: rotate(360deg);
        }
    }
    @-moz-keyframes spinAround {
        from {
            -moz-transform: rotate(0deg)
        }
        to {
            -moz-transform: rotate(360deg);
        }
    }
    @keyframes spinAround {
        from {
            transform: rotate(0deg)
        }
        to {
            transform: rotate(360deg);
        }
    }

    /* Effect 5 */
    .hi-icon-effect-5 .hi-icon {
        box-shadow: 0 0 0 4px rgba(255,255,255,1);
        overflow: hidden;
        -webkit-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
        -moz-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
        transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    }

    .hi-icon-effect-5 .hi-icon:after {
        display: none;
    }

    .hi-icon-effect-5 .hi-icon:hover {
        background: rgba(255,255,255,1);
        color: #702fa8;
        box-shadow: 0 0 0 8px rgba(255,255,255,0.3);
    }

    .hi-icon-effect-5a .hi-icon:hover:before {
        -webkit-animation: toRightFromLeft 0.3s forwards;
        -moz-animation: toRightFromLeft 0.3s forwards;
        animation: toRightFromLeft 0.3s forwards;
    }

    @-webkit-keyframes toRightFromLeft {
        49% {
            -webkit-transform: translate(100%);
        }
        50% {
            opacity: 0;
            -webkit-transform: translate(-100%);
        }
        51% {
            opacity: 1;
        }
    }
    @-moz-keyframes toRightFromLeft {
        49% {
            -moz-transform: translate(100%);
        }
        50% {
            opacity: 0;
            -moz-transform: translate(-100%);
        }
        51% {
            opacity: 1;
        }
    }
    @keyframes toRightFromLeft {
        49% {
            transform: translate(100%);
        }
        50% {
            opacity: 0;
            transform: translate(-100%);
        }
        51% {
            opacity: 1;
        }
    }

    .hi-icon-effect-5b .hi-icon:hover:before {
        -webkit-animation: toLeftFromRight 0.3s forwards;
        -moz-animation: toLeftFromRight 0.3s forwards;
        animation: toLeftFromRight 0.3s forwards;
    }

    @-webkit-keyframes toLeftFromRight {
        49% {
            -webkit-transform: translate(-100%);
        }
        50% {
            opacity: 0;
            -webkit-transform: translate(100%);
        }
        51% {
            opacity: 1;
        }
    }
    @-moz-keyframes toLeftFromRight {
        49% {
            -moz-transform: translate(-100%);
        }
        50% {
            opacity: 0;
            -moz-transform: translate(100%);
        }
        51% {
            opacity: 1;
        }
    }
    @keyframes toLeftFromRight {
        49% {
            transform: translate(-100%);
        }
        50% {
            opacity: 0;
            transform: translate(100%);
        }
        51% {
            opacity: 1;
        }
    }

    .hi-icon-effect-5c .hi-icon:hover:before {
        -webkit-animation: toTopFromBottom 0.3s forwards;
        -moz-animation: toTopFromBottom 0.3s forwards;
        animation: toTopFromBottom 0.3s forwards;
    }

    @-webkit-keyframes toTopFromBottom {
        49% {
            -webkit-transform: translateY(-100%);
        }
        50% {
            opacity: 0;
            -webkit-transform: translateY(100%);
        }
        51% {
            opacity: 1;
        }
    }
    @-moz-keyframes toTopFromBottom {
        49% {
            -moz-transform: translateY(-100%);
        }
        50% {
            opacity: 0;
            -moz-transform: translateY(100%);
        }
        51% {
            opacity: 1;
        }
    }
    @keyframes toTopFromBottom {
        49% {
            transform: translateY(-100%);
        }
        50% {
            opacity: 0;
            transform: translateY(100%);
        }
        51% {
            opacity: 1;
        }
    }

    .hi-icon-effect-5d .hi-icon:hover:before {
        -webkit-animation: toBottomFromTop 0.3s forwards;
        -moz-animation: toBottomFromTop 0.3s forwards;
        animation: toBottomFromTop 0.3s forwards;
    }

    @-webkit-keyframes toBottomFromTop {
        49% {
            -webkit-transform: translateY(100%);
        }
        50% {
            opacity: 0;
            -webkit-transform: translateY(-100%);
        }
        51% {
            opacity: 1;
        }
    }
    @-moz-keyframes toBottomFromTop {
        49% {
            -moz-transform: translateY(100%);
        }
        50% {
            opacity: 0;
            -moz-transform: translateY(-100%);
        }
        51% {
            opacity: 1;
        }
    }
    @keyframes toBottomFromTop {
        49% {
            transform: translateY(100%);
        }
        50% {
            opacity: 0;
            transform: translateY(-100%);
        }
        51% {
            opacity: 1;
        }
    }

    /* Effect 6 */
    .hi-icon-effect-6 .hi-icon {
        box-shadow: 0 0 0 4px rgba(255,255,255,1);
        -webkit-transition: background 0.2s, color 0.2s;
        -moz-transition: background 0.2s, color 0.2s;
        transition: background 0.2s, color 0.2s;
    }

    .hi-icon-effect-6 .hi-icon:hover {
        background: rgba(255,255,255,1);
        color: #64bb5d;
    }

    .hi-icon-effect-6 .hi-icon:hover:before {
        -webkit-animation: spinAround 2s linear infinite;
        -moz-animation: spinAround 2s linear infinite;
        animation: spinAround 2s linear infinite;
    }

    /* Effect 7 */
    .hi-icon-effect-7 .hi-icon {
        box-shadow: 0 0 0 4px rgba(255,255,255,1);
        -webkit-transition: background 0.2s, color 0.2s;
        -moz-transition: background 0.2s, color 0.2s;
        transition: background 0.2s, color 0.2s;
    }

    .hi-icon-effect-7 .hi-icon:hover {
        color: #fff;
    }

    .hi-icon-effect-7 .hi-icon:after {
        top: -8px;
        left: -8px;
        padding: 8px;
        z-index: -1;
        opacity: 0;
    }

    /* Effect 7a */
    .hi-icon-effect-7a .hi-icon:after {
        box-shadow: 0 0 0 rgba(255,255,255,1);
        -webkit-transition: opacity 0.2s, box-shadow 0.2s;
        -moz-transition: opacity 0.2s, box-shadow 0.2s;
        transition: opacity 0.2s, box-shadow 0.2s;
    }

    .hi-icon-effect-7a .hi-icon:hover:after {
        opacity: 1;
        box-shadow: 3px 3px 0 rgba(255,255,255,1);
    }

    .hi-icon-effect-7a .hi-icon:before {
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        transform: scale(0.8);
        opacity: 0.7;
        -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
        -moz-transition: -moz-transform 0.2s, opacity 0.2s;
        transition: transform 0.2s, opacity 0.2s;
    }

    .hi-icon-effect-7a .hi-icon:hover:before {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }

    /* Effect 7b */
    .hi-icon-effect-7b .hi-icon:after {
        box-shadow: 3px 3px rgba(255,255,255,1);
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        transform: rotate(-90deg);
        -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
        -moz-transition: opacity 0.2s, -moz-transform 0.2s;
        transition: opacity 0.2s, transform 0.2s;
    }

    .hi-icon-effect-7b .hi-icon:hover:after {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    .hi-icon-effect-7b .hi-icon:before {
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        transform: scale(0.8);
        opacity: 0.7;
        -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
        -moz-transition: -moz-transform 0.2s, opacity 0.2s;
        transition: transform 0.2s, opacity 0.2s;
    }

    .hi-icon-effect-7b .hi-icon:hover:before {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }

    /* Effect 8 */
    .hi-icon-effect-8 .hi-icon {
        background: rgba(255,255,255,0.1);
        -webkit-transition: -webkit-transform ease-out 0.1s, background 0.2s;
        -moz-transition: -moz-transform ease-out 0.1s, background 0.2s;
        transition: transform ease-out 0.1s, background 0.2s;
    }

    .hi-icon-effect-8 .hi-icon:after {
        top: 0;
        left: 0;
        padding: 0;
        z-index: -1;
        box-shadow: 0 0 0 2px rgba(255,255,255,0.1);
        opacity: 0;
        -webkit-transform: scale(0.9);
        -moz-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }

    .hi-icon-effect-8 .hi-icon:hover {
        background: rgba(255,255,255,0.05);
        -webkit-transform: scale(0.93);
        -moz-transform: scale(0.93);
        -ms-transform: scale(0.93);
        transform: scale(0.93);
        color: #fff;
    }

    .hi-icon-effect-8 .hi-icon:hover:after {
        -webkit-animation: sonarEffect 1.3s ease-out 75ms;
        -moz-animation: sonarEffect 1.3s ease-out 75ms;
        animation: sonarEffect 1.3s ease-out 75ms;
    }

    @-webkit-keyframes sonarEffect {
        0% {
            opacity: 0.3;
        }
        40% {
            opacity: 0.5;
            box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #3851bc, 0 0 0 10px rgba(255,255,255,0.5);
        }
        100% {
            box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #3851bc, 0 0 0 10px rgba(255,255,255,0.5);
            -webkit-transform: scale(1.5);
            opacity: 0;
        }
    }
    @-moz-keyframes sonarEffect {
        0% {
            opacity: 0.3;
        }
        40% {
            opacity: 0.5;
            box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #3851bc, 0 0 0 10px rgba(255,255,255,0.5);
        }
        100% {
            box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #3851bc, 0 0 0 10px rgba(255,255,255,0.5);
            -moz-transform: scale(1.5);
            opacity: 0;
        }
    }
    @keyframes sonarEffect {
        0% {
            opacity: 0.3;
        }
        40% {
            opacity: 0.5;
            box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #3851bc, 0 0 0 10px rgba(255,255,255,0.5);
        }
        100% {
            box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #3851bc, 0 0 0 10px rgba(255,255,255,0.5);
            transform: scale(1.5);
            opacity: 0;
        }
    }

    /* Effect 9 */
    .hi-icon-effect-9 .hi-icon {
        -webkit-transition: box-shadow 0.2s;
        -moz-transition: box-shadow 0.2s;
        transition: box-shadow 0.2s;
    }

    .hi-icon-effect-9 .hi-icon:after {
        top: 0;
        left: 0;
        padding: 0;
        box-shadow: 0 0 0 3px #fff;
        -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
        -moz-transition: -moz-transform 0.2s, opacity 0.2s;
        transition: transform 0.2s, opacity 0.2s;
    }

    /* Effect 9a */
    .hi-icon-effect-9a .hi-icon:hover:after {
        -webkit-transform: scale(0.85);
        -moz-transform: scale(0.85);
        -ms-transform: scale(0.85);
        transform: scale(0.85);
        opacity: 0.5;
    }

    .hi-icon-effect-9a .hi-icon:hover {
        box-shadow: 0 0 0 10px rgba(255,255,255,1);
        color: #fff;
    }

    /* Effect 9b */
    .hi-icon-effect-9b .hi-icon:hover:after {
        -webkit-transform: scale(0.85);
        -moz-transform: scale(0.85);
        -ms-transform: scale(0.85);
        transform: scale(0.85);
    }

    .hi-icon-effect-9b .hi-icon:hover {
        box-shadow: 0 0 0 10px rgba(255,255,255,0.4);
        color: #fff;
    }