.work-section .s-content {
    width: 100%;
    padding: 0 5%;
    padding: 0px 0 120px;
    max-width: none;
    margin: 0 auto;
    overflow: hidden;
}
div#mapWrapper1, div#mapWrapper {
    position: relative;
    height: calc(100vh);
    overflow: hidden;
    background: #3f68a5;
}
.map-wrap-inner {
    position: relative;
    height: calc(100vh);
    overflow: hidden;
    width: 1140px;
    margin: 0 auto;
}
.map-content {
    width: 100%;
    float: right;
    height: 100px;
    padding: 50px 100px;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
    transition: all .5s linear;
    overflow: hidden;
}
.active-13 .map-content {
    height: 100vh;
}
.map-content h2, .map-content p {
    margin: 0;
    position: absolute;
    transition: all .5s ease-in-out;
    color: #FFF;
    transform: translateY(20px) scale(.3);
    width: calc(100% - 200px);
    left: 100px;
    text-align: center;
    line-height: 45px;
    font-size: 30px;
    top: 40px;
}
.map-content h2.active {
    opacity: 1;
}
.work-with:before {
    border-color: #fbf4e7 transparent transparent transparent;
}
.whitebg-10 {
    background: #fbf4e7;
}
.map-img img {
    position: absolute;
    width: 100%;
    height: 100%;
    display: inherit;
    float: right;
    top: 0px;
    left: 0;
    opacity: 0;
    -webkit-transition: all .5s linear;
    -o-transition: all .5s linear;
    transition: all .5s linear;
    object-fit: cover;
    object-position: center center;
}
.map-wrap img.step-7 {
    height: 100%;
    object-fit: unset;
    width: auto;
    left: 50%;
    opacity: 1;
    -webkit-transition: all 2.5s ease-out;
    -o-transition: all 2.5s ease-out;
    transition: all 2.5s ease-out;
}
.map-img .icon-1 {
    left: 77px;
    width: 26px;
    top: 115px;
}
.map-img .icon-2 {
    top: 161px;
    left: 95px;
    width: 16px;
}
.map-img .icon-3 {
    top: 183px;
    left: 83px;
    width: 12px;
}
.map-img .icon-4 {
    top: 205px;
    left: 84px;
    width: 8px;
}
.map-img .icon-5 {
    top: 197px;
    left: 105px;
    width: 15px;
}
.map-img .icon-6 {
    top: 184px;
    left: 153px;
    width: 9px;
}
.map-img .icon-7 {
    top: 178px;
    left: 174px;
    width: 28px;
}
.map-img .icon-8 {
    top: 261px;
    left: 331px;
    width: 28px;
}
.map-img .icon-9 {
    top: 275px;
    left: 274px;
    width: 28px;
}
.map-img .icon-10 {
    top: 207px;
    left: 321px;
    width: 14px;
}
.map-img .icon-11 {
    top: 207px;
    left: 321px;
    width: 14px;
}
.map-img .icon-12 {
    left: 52px;
    width: 11px;
    top: 153px;
}
.map-img .icon-13 {
    left: 69px;
    width: 9px;
    top: 177px;
}
.map-img .icon-14 {
    left: 131px;
    width: 12px;
    top: 192px;
}
.map-img .icon-15 {
    left: 131px;
    width: 12px;
    top: 167px;
}
.map-img .icon-16 {
    left: 120px;
    width: 26px;
    top: 125px;
}
.map-img .icon-17 {
    left: 185px;
    width: 26px;
    top: 130px;
}
.map-img .icon-18 {
    left: 253px;
    width: 26px;
    top: 233px;
}
.map-img .icon-19 {
    left: 294px;
    width: 14px;
    top: 184px;
}
.map-img .icon-20 {
    left: 323px;
    width: 14px;
    top: 229px;
}
.map-img .icon-21 {
    left: 408px;
    width: 12px;
    top: 186px;
}
.map-img .icon-22 {
    top: 341px;
    left: 303px;
    width: 16px;
}
.map-img img.step-8 {
    opacity: 1;
    background: #3f68a5;
    transition: all .5s ease-in;
    -webkit-transition: all .5s ease-in;
    -o-transition: all .5s ease-in;
    width: auto;
    opacity: 1;
    background: #3f68a5;
    left: 50%;
    transform: translateX(-50%);
}
.map-img img.step-7 {
    transform: translate(-50%, -50%) scale(1);
    top: 50%;
}
.map-wrap h2.step-8 {
    top: 50%;
}
.africa-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
}
.africa-wrap {
    height: 63.863%;
    width: auto;
    position: relative;
    float: left;
    min-width: auto;
    zoom: 1;
}
.map-wrap .africa-wrap img {
    transform: translate(0, 0);
    top: 0;
    left: 0;
    position: absolute;
    height: 100%;
    width: auto;
}
.map-wrap .africa-wrap .step-6 {
    opacity: 0;
    -webkit-transition: transition: all 1s linear;
    -o-transition: transition: all 1s linear;
    transition: all 1s linear;
    /*transition-delay: 2.5s;*/
}
.map-wrap .africa-wrap .step-6.black-line {
    opacity: .3;
}
@-webkit-keyframes mymove {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes mymove {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
.map-wrap.active-13 .africa-wrap .step-6 {
    opacity: 0;
    animation-play-state: paused;
}
.map-wrap .africa-wrap img.step-7 {
    position: relative;
}
.second-map {
    opacity: 1;
    background: #0E3A58;
    width: 100%;
    height: 100%;
    position: absolute;
    transition: all 1.5s ease-in-out, opacity 1s ease-in-out;
    -webkit-transition: all 1.5s ease-in-out, opacity 1s ease-in-out;
    -o-transition: all 1.5s ease-in-out, opacity 1s ease-in-out;
    left: 50%;
    transform: translateX(-50%) scale(1);
    overflow: hidden;
}
.active-13 .second-map {
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
}
.map-wrap img.pins {
    width: 19px;
    height: auto;
    transform: translate3d(-10px, -80px, 180px) scale(1.5);
}
.map-wrap img.pin-1 {
    top: 73px;
    left: 78px;
}
.map-wrap img.pin-2 {
    top: 112px;
    left: 45px;
}
.map-wrap img.pin-3 {
    top: 112px;
    left: 112px;
}
.map-wrap img.pin-4 {
    top: 130px;
    left: 122px;
}
.map-wrap img.pin-5 {
    top: 141px;
    left: 79px;
}
.map-wrap img.pin-6 {
    top: 141px;
    left: 145px;
}
.map-wrap img.pin-7 {
    top: 141px;
    left: 187px;
}
.map-wrap img.pin-8 {
    top: 96px;
    left: 187px;
}
.map-wrap img.pin-9 {
    top: 159px;
    left: 302px;
}
.map-wrap img.pin-10 {
    top: 213px;
    left: 255px;
}
.map-wrap img.pin-11 {
    top: 288px;
    left: 275px;
}
.map-wrap img.pin-12 {
    top: 312px;
    left: 302px;
}
.map-wrap img.pin-13 {
    top: 160px;
    left: 411px;
}
.map-wrap img.pin-14 {
    top: 191px;
    left: 315px;
}
.map-wrap img.pin-15 {
    top: 191px;
    left: 315px;
}
.map-wrap img.pin-16 {
    top: 191px;
    left: 348px;
}
.map-wrap img.pin-17 {
    top: 247px;
    left: 335px;
}
.map-wrap.active-5 img.pin-1, .map-wrap.active-5 img.pin-2, .map-wrap.active-5 img.pin-3, .map-wrap.active-5 img.pin-13, .map-wrap.active-5 img.pin-14, .map-wrap.active-5 img.pin-12 {
    transition-delay: 1s;
}
.map-wrap.active-5 img.pin-4, .map-wrap.active-5 img.pin-5, .map-wrap.active-5 img.pin-6, .map-wrap.active-5 img.pin-15, .map-wrap.active-5 img.pin-16, .map-wrap.active-5 img.pin-17 {
    transition-delay: 1.1s;
}
.map-img .step-1 {
    transform: translateY(-80px);
    transition: all .5s cubic-bezier(0.68, -0.55, 0.88, 1.58);
    -webkit-transition: all .5s cubic-bezier(0.68, -0.55, 0.88, 1.58);
    -o-transition: all .5s cubic-bezier(0.68, -0.55, 0.88, 1.58);
}
.map-wrap.active-1 .step-1 {
    transition-delay: .5s;
}
.map-wrap.active-1 .icon-1, .map-wrap.active-1 .icon-2, .map-wrap.active-1 .icon-22, .map-wrap.active-1 .icon-21, .map-wrap.active-1 .icon-3, .map-wrap.active-1 .icon-20 {
    transition-delay: .6s;
}
.map-wrap.active-1 .icon-4, .map-wrap.active-1 .icon-5, .map-wrap.active-1 .icon-6, .map-wrap.active-1 .icon-19, .map-wrap.active-1 .icon-18, .map-wrap.active-1 .icon-17 {
    transition-delay: .7s;
}
.map-img {
    position: absolute;
    height: calc(100% - 74px);
    width: 100%;
    right: 0;
    overflow: hidden;
    top: 0;
    float: right;
    top: 74px;
    transform: translateY(0%);
    transition: all .5s linear;
    -webkit-transition: translateY(0%);
    -o-transition: translateY(0%);
    background: #0E3A58;
}
.map-content.skrollable-before {
    top: 0;
    right: 0;
}
.map-img.skrollable-before {
    top: 0;
    right: 0;
}
.map-content.skrollable-between {
    top: 0;
    right: 0;
    position: fixed;
}
.map-img.skrollable-between {
    top: 0;
    right: 0;
    position: fixed;
}
.map-content.skrollable-after {
    bottom: 0;
    right: 0;
    top: auto;
}
.map-img.skrollable-after img {
    top: auto;
    bottom: calc(50% - 240px);
}
.map-img.skrollable-after {
    bottom: 0;
    right: 0;
    top: auto !important;
    position: absolute;
}
.map-img.skrollable-after {
    bottom: 0;
    right: 0;
    top: auto;
}
/* eight */

.map-wrap.active-13 h2 {
    opacity: 0;
}
.map-wrap.active-13 h2.step-8 {
    opacity: 1;
    display: block;
    transform: translateY(-50%) scale(1);
}
.map-wrap.active-13 .second-map {
    opacity: 0;
    transform: translateX(-50%) scale(.72);
}
/* seven */

.map-wrap.active-1 .white-line, .map-wrap.active-5 .white-line, .map-wrap.active-13 .white-line {
    transition-delay: 0s;
    opacity: 0;
}
.map-wrap.active-12 h2.step-8 {
    opacity: 0;
    transform: translateY(200px) scale(0);
    top: 40px;
    transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
}
h2.step-7 {
    top: 50%;
}
.map-wrap.active-12 .map-content {
    height: 100vh;
}
.map-wrap.active-12 h2.step-7 {
    opacity: 1;
    display: block;
    transform: translateY(-50%) scale(1);
}
.map-wrap.active-10 h2.step-6, .map-wrap.active-11 h2.step-7 {
    opacity: 1;
    display: block;
    transform: translateY(0%) scale(1);
    top: 40px;
}
.map-wrap.active-13 img.step-7 {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1);
}
.map-wrap.active-13 .map-img>img.step-7 {
    opacity: 1;
}
.map-wrap.active-13 img.step-7 {}
.map-wrap.active-12 img.step-7, .map-wrap img.step-7 {
    opacity: 1;
    display: block;
    transform: translate(-50%, -50%) scale(1);
}
.map-wrap img.step-7.map-left {
    transform: translate(-45%, -50%) scale(.8);
}
.map-wrap img.step-7.map-right {
    transform: translate(-35%, -50%) scale(.8);
}
.map-wrap.active-13 img.step-7.map-left {
    transform: translate(-50%, -50%) scale(1);
}
.map-wrap.active-13 img.step-7.map-right {
    transform: translate(-50%, -50%) scale(1);
}
.map-wrap.active-13 .africa-wrap img.step-7 {}
.map-wrap .africa-wrap img.step-7 {
    transform: translate(0, 0) scale(1);
}
.map-wrap.active-12 img.step-8 {
    opacity: 0;
}
.map-wrap.active-1 .africa-wrap .step-6, .map-wrap.active-5 .africa-wrap .step-6, .map-wrap.active-4 .africa-wrap .step-6, .map-wrap.active-6 .africa-wrap .step-6, .map-wrap.active-8 .africa-wrap .step-6, .map-wrap.active-9 .africa-wrap .step-6 {
    opacity: 0;
}
.map-wrap.active-1 .africa-wrap .step-6.black-line, .map-wrap.active-5 .africa-wrap .step-6.black-line, .map-wrap.active-3 .africa-wrap .step-6.black-line, .map-wrap.active-4 .africa-wrap .step-6.black-line, .map-wrap.active-6 .africa-wrap .step-6.black-line, .map-wrap.active-8 .africa-wrap .step-6.black-line, .map-wrap.active-9 .africa-wrap .step-6.black-line {
    opacity: .3;
}
.map-wrap.active-1 .africa-wrap img.step-new, .map-wrap.active-5 .africa-wrap img.step-new, .map-wrap.active-3 .africa-wrap img.step-new, .map-wrap.active-4 .africa-wrap img.step-new, .map-wrap.active-6 .africa-wrap img.step-new, .map-wrap.active-8 .africa-wrap img.step-new, .map-wrap.active-9 .africa-wrap img.step-new {
    opacity: .4;
}
/* six */

.map-wrap.active-9 h2.step-7 {
    opacity: 0;
    transform: translateY(-200px) scale(1.5);
    top: 40px;
}
.map-wrap.active-1 h2, .map-wrap.active-5 h2, .map-wrap.active-3 h2, .map-wrap.active-4 h2, .map-wrap.active-6 h2, .map-wrap.active-5 h2, .map-wrap.active-8 h2, .map-wrap.active-7 h2, .map-wrap.active-9 h2, .map-wrap.active-10 h2, .map-wrap.active-11 h2, .map-wrap.active-12 h2 {
    opacity: 0;
}
.map-wrap.active-8 h2.step-6, .map-wrap.active-9 h2.step-8 {
    transform: translateY(-200px) scale(1.5);
    opacity: 0;
}
.map-wrap.active-9 h2.step-6 {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}
.map-wrap.active-9 img.ma {
    top: -10px;
}
.map-wrap.active-9 img.pins {
    transition: all .5s cubic-bezier(0.68, -0.55, 0.88, 1.58);
    transition-delay: .9s;
}
.map-wrap.active-13 .africa-wrap .step-6 {
    opacity: 0;
    transition-delay: 0s;
}
.map-wrap.active-11 .africa-wrap .step-6, .map-wrap.active-12 .africa-wrap .step-6 {
    opacity: .4;
}
.map-wrap.active-11 .africa-wrap .black-line, .map-wrap.active-12 .africa-wrap .black-line {
    opacity: .3;
}
.active-1.map-wrap .africa-wrap .step-6.white-line, .active-5.map-wrap .africa-wrap .step-6.white-line, .active-4.map-wrap .africa-wrap .step-6.white-line, .active-6.map-wrap .africa-wrap .step-6.white-line, .active-8.map-wrap .africa-wrap .step-6.white-line, .active-9.map-wrap .africa-wrap .step-6.white-line, .active-12.map-wrap .africa-wrap .step-6.white-line {
    animation: mymove 2s ease-in-out 0s infinite alternate;
}
.active-12.map-wrap .africa-wrap .step-6.white-line {
    animation: none;
    opacity: 0;
}
/* five */

.map-wrap img.step-3, .map-wrap img.step-4, .map-wrap img.step-5 {
    transition: all .5s cubic-bezier(0.68, -0.55, 0.88, 1.58);
    transition: all 1s ease-in-out;
    transform: translate3d(-10px, -80px, 180px) scale(1.5);
}
.map-wrap.active-8 h2.step-5, .map-wrap.active-7 h2.step-5, .map-wrap.active-6 h2.step-5, .map-wrap.active-5 h2.step-5, .map-wrap.active-4 h2.step-5, .map-wrap.active-3 h2.step-5 {
    opacity: 1;
    transform: translate(0, 0) scale(1);
}
.map-wrap.active-7 h2.step-5.agri-icn {
    /*top: 40vh;*/
    /*animation: move 1s 0;
animation-fill-mode: forwards;
animation-timing-function: linear;*/
    transition: all 1s ease 0s;
    opacity: 0;
}
@keyframes move {
    0% {
        top: 100px;
    }
    10% {
        transform: rotate(50deg);
    }
    20% {
        transform: rotate(90deg);
    }
    30% {
        transform: rotate(135deg);
    }
    40% {
        transform: rotate(180deg);
    }
    50% {
        transform: rotate(225deg);
    }
    60% {
        transform: rotate(270deg);
    }
    70% {
        transform: rotate(300deg);
    }
    80% {
        transform: rotate(320deg);
    }
    90% {
        transform: rotate(330deg);
    }
    94% {
        top: 40vh;
        opacity: 1;
        transform: rotate(340deg);
    }
    100% {
        top: 40vh;
        opacity: 0;
    }
}
.leaf {
    background: url("../img/work/Agriculture_icon.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    display: block;
    position: absolute;
    opacity: 0;
    transition: all 1s ease-out 0s !important;
}
.leaf.big {
    width: 18px;
    height: 18px;
}
.leaf.medium {
    width: 12px;
    height: 12px;
}
.leaf.small {
    width: 10px;
    height: 10px;
}
/*.active-8 .leaf1,
.active-8 .leaf2,
.active-8 .leaf3,
.active-8 .leaf4,
.active-8 .leaf5,
.active-8 .leaf6,
.active-8 .leaf7,
.active-8 .leaf8,
.active-8 .leaf9,
.active-8 .leaf10,
.active-8 .leaf11,
.active-8 .leaf12,
.active-8 .leaf13,
.active-8 .leaf14,
.active-8 .leaf15,
.active-8 .leaf16,
.active-8 .leaf17,
.active-8 .leaf18,
.active-8 .leaf19
{
left: 48%;
top: 41%;
}*/

.active-9 .leaf1, .active-9 .leaf2, .active-9 .leaf3, .active-9 .leaf4, .active-9 .leaf5, .active-9 .leaf6, .active-9 .leaf7, .active-9 .leaf8, .active-9 .leaf9, .active-9 .leaf10, .active-9 .leaf11, .active-9 .leaf12, .active-9 .leaf13, .active-9 .leaf14, .active-9 .leaf15, .active-9 .leaf16, .active-9 .leaf17, .active-9 .leaf18, .active-9 .leaf19 {
    left: 48%;
    /*top: 41%;*/
    top: 0%;
}
.active-8 .leaf1, .active-7 .leaf1, .active-6 .leaf1, .active-5 .leaf1, .active-4 .leaf1, .active-3 .leaf1, .active-5 .leaf1, .active-1 .leaf1 {
    left: 8%;
    top: 23%;
}
.active-8 .leaf2, .active-7 .leaf2, .active-6 .leaf2, .active-5 .leaf2, .active-4 .leaf2, .active-3 .leaf2, .active-5 .leaf2, .active-1 .leaf2 {
    top: 24%;
    left: 21%;
}
.active-8 .leaf3, .active-7 .leaf3, .active-6 .leaf3, .active-5 .leaf3, .active-4 .leaf3, .active-3 .leaf3, .active-5 .leaf3, .active-1 .leaf3 {
    left: 37%;
    top: 27%;
}
.active-8 .leaf4, .active-7 .leaf4, .active-6 .leaf4, .active-5 .leaf4, .active-4 .leaf4, .active-3 .leaf4, .active-5 .leaf4, .active-1 .leaf4 {
    top: 38.5%;
    left: 34.2%;
}
.active-8 .leaf5, .active-7 .leaf5, .active-6 .leaf5, .active-5 .leaf5, .active-4 .leaf5, .active-3 .leaf5, .active-5 .leaf5, .active-1 .leaf5 {
    left: 67.2%;
    top: 40%;
}
.active-8 .leaf6, .active-7 .leaf6, .active-6 .leaf6, .active-5 .leaf6, .active-4 .leaf6, .active-3 .leaf6, .active-5 .leaf6, .active-1 .leaf6 {
    top: 54%;
    left: 58%;
}
.active-8 .leaf7, .active-7 .leaf7, .active-6 .leaf7, .active-5 .leaf7, .active-4 .leaf7, .active-3 .leaf7, .active-5 .leaf7, .active-1 .leaf7 {
    top: 60%;
    left: 75%;
}
.active-8 .leaf8, .active-7 .leaf8, .active-6 .leaf8, .active-5 .leaf8, .active-4 .leaf8, .active-3 .leaf8, .active-5 .leaf8, .active-1 .leaf8 {
    left: 67%;
    top: 77%;
}
.active-8 .leaf9, .active-7 .leaf9, .active-6 .leaf9, .active-5 .leaf9, .active-4 .leaf9, .active-3 .leaf9, .active-5 .leaf9, .active-1 .leaf9 {
    left: 61%;
    top: 70%;
}
.active-8 .leaf10, .active-7 .leaf10, .active-6 .leaf10, .active-5 .leaf10, .active-4 .leaf10, .active-3 .leaf10, .active-5 .leaf10, .active-1 .leaf10 {
    left: 79.2%;
    top: 48%;
}
.active-8 .leaf11, .active-7 .leaf11, .active-6 .leaf11, .active-5 .leaf11, .active-4 .leaf11, .active-3 .leaf11, .active-5 .leaf11, .active-1 .leaf11 {
    top: 30%;
    left: 2%;
}
.active-8 .leaf12, .active-7 .leaf12, .active-6 .leaf12, .active-5 .leaf12, .active-4 .leaf12, .active-3 .leaf12, .active-5 .leaf12, .active-1 .leaf12 {
    left: 7%;
    top: 35.2%;
}
.active-8 .leaf13, .active-7 .leaf13, .active-6 .leaf13, .active-5 .leaf13, .active-4 .leaf13, .active-3 .leaf13, .active-5 .leaf13, .active-1 .leaf13 {
    left: 22.5%;
    top: 33%;
}
.active-8 .leaf14, .active-7 .leaf14, .active-6 .leaf14, .active-5 .leaf14, .active-4 .leaf14, .active-3 .leaf14, .active-5 .leaf14, .active-1 .leaf14 {
    left: 28%;
    top: 36%;
}
.active-8 .leaf15, .active-7 .leaf15, .active-6 .leaf15, .active-5 .leaf15, .active-4 .leaf15, .active-3 .leaf15, .active-5 .leaf15, .active-1 .leaf15 {
    top: 42%;
    left: 12%;
}
.active-8 .leaf16, .active-7 .leaf16, .active-6 .leaf16, .active-5 .leaf16, .active-4 .leaf16, .active-3 .leaf16, .active-5 .leaf16, .active-1 .leaf16 {
    left: 73%;
    top: 68%;
}
.active-8 .leaf17, .active-7 .leaf17, .active-6 .leaf17, .active-5 .leaf17, .active-4 .leaf17, .active-3 .leaf17, .active-5 .leaf17, .active-1 .leaf17 {
    left: 72%;
    top: 48%;
}
.active-8 .leaf18, .active-7 .leaf18, .active-6 .leaf18, .active-5 .leaf18, .active-4 .leaf18, .active-3 .leaf18, .active-5 .leaf18, .active-1 .leaf18 {
    left: 68%;
    top: 52%;
}
.active-8 .leaf19, .active-7 .leaf19, .active-6 .leaf19, .active-5 .leaf19, .active-4 .leaf19, .active-3 .leaf19, .active-5 .leaf19, .active-1 .leaf19 {
    left: 68%;
    top: 55%;
}
.map-wrap.active-8 .leaf, .map-wrap.active-7 .leaf, .map-wrap.active-6 .leaf, .map-wrap.active-5 .leaf, .map-wrap.active-4 .leaf, .map-wrap.active-3 .leaf, .map-wrap.active-5 .leaf, .map-wrap.active-1 .leaf {
    opacity: 1;
}
.active-8 .leaf1, .active-8 .leaf2, .active-8 .leaf3, .active-8 .leaf4, .active-8 .leaf5, .active-8 .leaf6, .active-8 .leaf7, .active-8 .leaf8, .active-8 .leaf9, .active-8 .leaf10, .active-8 .leaf11, .active-8 .leaf12, .active-8 .leaf13, .active-8 .leaf14, .active-8 .leaf15, .active-8 .leaf16, .active-8 .leaf17, .active-8 .leaf18, .active-8 .leaf19 {
    transition: all 0.8s ease-out 0.2s !important;
}
.map-wrap.active-1 img.step-5, .map-wrap.active-5 img.step-5, .map-wrap.active-4 img.step-5, .map-wrap.active-6 img.step-5, .map-wrap.active-7 img.step-5, .map-wrap.active-8 img.step-5 {
    opacity: 0;
    transition: all .5s cubic-bezier(0.68, -0.55, 0.88, 1.58);
    transition: all 1s ease-in-out;
    transform: translate3d(0, 0, 0) scale(1);
    z-index: 1;
}
.map-wrap.active-6 .step-5.agri-icn, .map-wrap.active-5 .step-5.agri-icn, .map-wrap.active-4 .step-5.agri-icn, .map-wrap.active-3 .step-5.agri-icn, .map-wrap.active-5 img.step-5 {
    opacity: 0;
}
.map-wrap.active-8 .step-5.agri-energy-icn, .map-wrap.active-7 .step-5.agri-energy-icn, .map-wrap.active-6 img.step-4 {
    opacity: 0;
}
.map-wrap.active-8 h2.step-5.user-icn,
/*.map-wrap.active-7 h2.step-5.user-icn,*/

.map-wrap.active-6 h2.step-5.user-icn, .map-wrap.active-5 h2.step-5.user-icn, .map-wrap.active-5 .step-5.agri-energy-icn, .map-wrap.active-4 .step-5.agri-energy-icn, .map-wrap.active-3 .step-5.agri-energy-icn {
    opacity: 0;
}
/*.active-8 .leaf1,
.active-8 .leaf2,
.active-8 .leaf3,
.active-8 .leaf4,
.active-8 .leaf5,
.active-8 .leaf6,
.active-8 .leaf7,
.active-8 .leaf8,
.active-8 .leaf9,
.active-8 .leaf10,
.active-8 .leaf11,
.active-8 .leaf12,
.active-8 .leaf13,
.active-8 .leaf14,
.active-8 .leaf15,
.active-8 .leaf16,
.active-8 .leaf17,
.active-8 .leaf18,
.active-8 .leaf19
{
left: 48%;
top: 0%;
}*/

.map-wrap h2.step-5.user-icn {
    position: absolute;
    top: 80px;
}
.map-wrap.active-5 h2.step-5.agri-energy-icn {
    /*top: 40vh;*/
    /*animation: move1 3s 1;
animation-fill-mode: forwards;
animation-timing-function: linear;
opacity:1;*/
    transition: all 1s ease 0s;
    opacity: 0;
}
@keyframes move1 {
    0% {
        top: 100px;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
    94% {
        top: 40vh;
        opacity: 1;
        transform: rotate(340deg);
        -webkit-transform: scale(.5);
        -ms-transform: scale(.5);
        transform: scale(.5);
    }
    100% {
        top: 40vh;
        opacity: 0;
    }
}
.step-5.agri-energy-icn {
    position: absolute;
    top: 80px;
}
.energy-icn {
    background: url("../img/work/energy.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    display: block;
    position: absolute;
    opacity: 0;
}
.energy-icn.big {
    width: 16px;
    height: 16px;
}
.energy-icn.medium {
    width: 10px;
    height: 10px;
}
.energy1 {
    left: 11%;
    top: 19%;
}
.energy2 {
    left: 80%;
    top: 38%;
}
.energy3 {
    top: 38%;
    left: 22%;
}
.energy4 {
    left: 40%;
    top: 36%;
}
.energy5 {
    top: 47%;
    left: 73%;
}
.energy6 {
    left: 82%;
    top: 51%;
}
.energy7 {
    left: 70%;
    top: 65%;
}
.energy8 {
    left: 79%;
    top: 62%;
}
.energy9 {
    top: 52%;
    left: 70%;
}
.active-7 .energy-icn, .active-6 .energy-icn, .active-5 .energy-icn, .active-4 .energy-icn, .active-3 .energy-icn, .active-5 .energy-icn, .active-1 .energy-icn {
    opacity: 1;
}
.active-8 .energy1, .active-8 .energy2, .active-8 .energy3, .active-8 .energy4, .active-8 .energy5, .active-8 .energy6, .active-8 .energy7, .active-8 .energy8, .active-8 .energy9 {
    left: 48%;
    /*top: 41%;*/
    top: 0%;
    transition: all 1s ease-out 0s !important;
}
.active-7 .energy1, .active-7 .energy2, .active-7 .energy3, .active-7 .energy4, .active-7 .energy5, .active-7 .energy6, .active-7 .energy7, .active-7 .energy8, .active-7 .energy9 {
    transition: all 0.8s ease-out 0.2s !important;
}
.map-wrap h2.step-5.user-icn {
    position: absolute;
    top: 80px;
    margin-left: 218px;
}
.map-wrap.active-3 h2.step-5.user-icn {
    /*top: 40vh;
	margin-left:218px;
animation: move2 3s 1;
animation-fill-mode: forwards;
animation-timing-function: linear;*/
    transition: all 1s ease 0s;
    opacity: 0;
}
.map-wrap.active-3 h2.step-5.user-icn {
    /*margin-left:0!important;*/
}
@keyframes move2 {
    0% {
        top: 80px;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        margin-left: 218px;
    }
    94% {
        margin-left: 0;
        top: 40vh;
        opacity: 1;
        transform: rotate(340deg);
        -webkit-transform: scale(.7);
        -ms-transform: scale(.7);
        transform: scale(.7);
    }
    100% {
        margin-left: 0 top: 40vh;
        opacity: 0;
    }
}
strong.comma {
    font-size: 26px;
    color: #fff;
}
.and-text {
    font-weight: 500!important;
}
.users.big {
    width: 15px;
    height: 15px;
}
.users.medium {
    width: 11px;
    height: 11px;
}
.users {
    background: url("../img/work/user.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    display: block;
    position: absolute;
    opacity: 0;
}
.users1 {
    left: 96px;
    top: 107px;
}
.users2 {
    left: 124px;
    top: 144px;
}
.users3 {
    left: 323px;
    top: 168px;
}
.users4 {
    left: 197px;
    top: 228px;
}
.users5 {
    left: 342px;
    top: 313px;
}
.users6 {
    left: 215px;
    top: 383px;
}
.users7 {
    left: 16px;
    top: 126px;
}
.users8 {
    left: 72px;
    top: 142px;
}
.users9 {
    top: 172px;
    left: 81px;
}
.users10 {
    top: 214px;
    left: 291px;
}
.users11 {
    top: 248px;
    left: 268px;
}
.users12 {
    top: 288px;
    left: 250px;
}
.users13 {
    top: 310px;
    left: 258px;
}
.users14 {
    top: 299px;
    left: 281px;
}
.users15 {
    top: 157px;
    left: 355px;
}
/***per****/

.users1 {
    left: 27%;
    top: 26%;
}
.users2 {
    left: 34%;
    top: 35%;
}
.users3 {
    left: 84%;
    top: 40%;
}
.users4 {
    left: 52%;
    top: 54%;
}
.users5 {
    left: 91%;
    top: 76%;
}
.users6 {
    left: 59%;
    top: 93%;
}
.users7 {
    left: 5%;
    top: 29%;
}
.users8 {
    left: 22%;
    top: 34%;
}
.users9 {
    top: 42%;
    left: 23%;
}
.users10 {
    top: 46%;
    left: 72%;
}
.users11 {
    top: 50%;
    left: 77%;
}
.users12 {
    top: 59%;
    left: 72%;
}
.users13 {
    top: 74%;
    left: 69%;
}
.users14 {
    top: 69%;
    left: 67%;
}
.users15 {
    top: 37%;
    left: 97%;
}
/**** per end****/

/*.active-4 .users1,
.active-4 .users2,
.active-4 .users3,
.active-4 .users4,
.active-4 .users5,
.active-4 .users6,
.active-4 .users7,
.active-4 .users8,
.active-4 .users9,
.active-4 .users10,
.active-4 .users11,
.active-4 .users12,
.active-4 .users13

{
transition: all 1s ease-out 7.5s !important;

}
*/

.active-7 .users1, .active-7 .users2, .active-7 .users3, .active-7 .users4, .active-7 .users5, .active-7 .users6, .active-7 .users7, .active-7 .users8, .active-7 .users9, .active-7 .users10, .active-7 .users11, .active-7 .users12, .active-7 .users13, .active-7 .users14, .active-7 .users15 {
    left: 99%;
    top: 0%;
}
.active-3 .users1, .active-3 .users2, .active-3 .users3, .active-3 .users4, .active-3 .users5, .active-3 .users6, .active-3 .users7, .active-3 .users8, .active-3 .users9, .active-3 .users10, .active-3 .users11, .active-3 .users12, .active-3 .users13, .active-3 .users14, .active-3 .users15 {
    transition: all 1s ease-out 0s !important;
}
.map-wrap.active-7 .users {
    transition: all 1s ease-out 0s !important;
}
.map-wrap.active-6 .users {
    transition: all 0.6s ease-out 0.2s !important;
}
.map-wrap.active-6 .users, .map-wrap.active-5 .users, .map-wrap.active-4 .users, .map-wrap.active-3 .users, .map-wrap.active-5 .users, .map-wrap.active-1 .users {
    opacity: 1;
}
.map-wrap.active-6 .leaf, .map-wrap.active-5 .leaf, .map-wrap.active-4 .leaf, .map-wrap.active-3 .leaf, .map-wrap.active-5 .leaf, .map-wrap.active-1 .leaf, .map-wrap.active-4 .energy-icn, .map-wrap.active-3 .energy-icn, .map-wrap.active-5 .energy-icn, .map-wrap.active-1 .energy-icn, .map-wrap.active-5 .users, .map-wrap.active-1 .users {
    transition: none;
    opacity: 1;
}
.map-wrap.active-1 img.step-4, .map-wrap.active-5 img.step-4, .map-wrap.active-4 img.step-4 {
    opacity: 0;
    transition: all .5s cubic-bezier(0.68, -0.55, 0.88, 1.58);
    transition: all 1s ease-in-out;
    transform: translate3d(0, 0, 0) scale(1);
    z-index: 1;
}
.map-wrap.active-1 img.step-3, .map-wrap.active-5 img.step-3, .map-wrap.active-4 img.step-3 {
    opacity: 0;
    transition: all .5s cubic-bezier(0.68, -0.55, 0.88, 1.58);
    transition: all 1s ease-in-out;
    transform: translate3d(0, 0, 0) scale(1);
    z-index: 1;
}
.map-wrap.active-4 img.delay, .map-wrap.active-6 img.delay, .map-wrap.active-8 img.delay {
    transition-delay: .2s;
}
.off-grid, .agri, .youth {
    display: none;
    transition: all .5s linear;
}
.map-wrap.active-1 .agriculture, .map-wrap.active-5 .agriculture, .map-wrap.active-3 .agriculture, .map-wrap.active-4 .agriculture, .map-wrap.active-6 .agriculture, .map-wrap.active-8 .agriculture {
    opacity: 1;
    visibility: visible;
}
.map-wrap.active-1 .agri, .map-wrap.active-5 .agri, .map-wrap.active-3 .agri, .map-wrap.active-4 .agri, .map-wrap.active-5 .agri, .map-wrap.active-6 .agri, .map-wrap.active-8 .agri {
    display: inline;
}
.map-wrap.active-8 .agri, .map-wrap.active-7 .agri {
    display: inline;
}
.map-wrap.active-1 .energy, .map-wrap.active-5 .energy, .map-wrap.active-4 .energy, .map-wrap.active-7 .energy {
    opacity: 1;
    visibility: visible;
}
.map-wrap.active-1 .off-grid, .map-wrap.active-5 .off-grid, .map-wrap.active-3 .off-grid, .map-wrap.active-4 .off-grid, .map-wrap.active-5 .off-grid, .map-wrap.active-7 .off-grid, .map-wrap.active-6 .off-grid {
    display: inline;
}
.map-wrap.active-1 .youth-led, .map-wrap.active-5 .youth-led, .map-wrap.active-4 .youth-led {
    opacity: 1;
    visibility: visible;
}
.map-wrap.active-1 .youth, .map-wrap.active-5 .youth, .map-wrap.active-3 .youth, .map-wrap.active-4 .youth, .map-wrap.active-5 .youth, .map-wrap.active-6 .youth {
    display: inline;
}
.map-wrap.active-10 .step-6 span, .map-wrap.active-9 .step-6 span {
    font-size: 40px;
    /*font-weight: 600;*/
    color: #50c9d0;
}
.map-wrap .thirty, .map-wrap.active-6 .youth, .map-wrap.active-7 .off-grid,
/*.map-wrap.active-5 .off-grid,*/

/*.map-wrap.active-7 .agri,*/

.map-wrap.active-8 .agri {
    font-size: 40px;
    color: #42c3fd;
}
.map-wrap span.country-name a {
    color: #FFF;
}
.map-wrap span.country-name a:hover {
    color: #42c3fd;
    text-decoration: none;
}
.map-wrap span.country-name.nolink a:hover {
    cursor: default;
    color: #FFF;
}
.map-wrap span.country-name.nolink a {
    cursor: default;
    color: #FFF;
}
.map-wrap.active-1 span.country-name a, .map-wrap.active-4 span.country-name a, .map-wrap.active-5 span.country-name a, .map-wrap.active-6 span.country-name a, .map-wrap.active-7 span.country-name a, .map-wrap.active-8 span.country-name a, .map-wrap.active-9 span.country-name a {
    color: #42c3fd;
    transition-delay: 0s;
}
.map-wrap.active-1 span.country-name a:hover, .map-wrap.active-5 span.country-name a:hover {
    color: #FFF;
}
.map-wrap.active-4 span.country-name {}
.map-wrap.active-1 span.country-name.nolink a, .map-wrap.active-5 span.country-name.nolink a {
    cursor: default;
    color: #FFF;
}
/* two */

.map-wrap.active-4 h2.step-5, .map-wrap.active-5 h2.step-5 {
    transform: translateY(-200px) scale(1.5);
    opacity: 0;
}
.map-wrap.active-4 h2.step-2, .map-wrap.active-1 h2.step-2, .map-wrap.active-5 h2.step-2 {
    opacity: 1;
    transform: translateY(0) scale(1);
}
.map-wrap.active-1 .country-name.no-programs, .map-wrap.active-5 .country-name.no-programs {
    opacity: 1;
    visibility: visible;
}
.map-wrap h2.step-1 {
    transform: translateY(0) scale(1);
    top: 50%;
    height: 0;
    overflow: hidden;
}
.map-wrap h2.step-1 {
    opacity: 0;
    transform: translateY(-50%) scale(1);
    height: auto;
    position: fixed;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 24px;
    color: #FFF;
    z-index: 10;
}
.map-wrap.single-step-map h2.step-1 {
    padding: 0 100px;
    font-size: 20px;
    max-width: 1070px;
    right: 0;
    margin: auto;
    line-height: 26px;
}
.map-wrap.active-9 h2.step-1 {
    transition-delay: 3.3s;
}
.map-wrap.active-9 h2.step-1, .map-wrap.active-8 h2.step-1, .map-wrap.active-7 h2.step-1, .map-wrap.active-6 h2.step-1, .map-wrap.active-5 h2.step-1, .map-wrap.active-4 h2.step-1, .map-wrap.active-3 h2.step-1, .map-wrap.active-5 h2.step-1, .map-wrap.active-1 h2.step-1 {
    opacity: 1;
}
h2.step-1 a {
    display: inline-block;
    padding: 10px 36px;
    background: rgba(0, 0, 0, 0.53);
    color: #FFF;
    border-radius: 0;
    text-decoration: none;
    font-size: 18px;
    text-transform: uppercase;
}
h2.step-1 a:hover {
    background: rgba(255, 255, 255, 0.72);
    color: #000;
}
/*** 30/11/18 ***/

.map-img .map-left, .map-img .map-right {
    transform-origin: 0 0 !important;
    z-index: -2;
    transition: all 5s ease-out 0s, opacity 0.5s ease-out 0.3s !important;
}
.active-13 .map-img .map-left, .active-13 .map-img .map-right {
    transition: all .5s ease-out 0s, opacity 0.5s ease-out 0.3s !important;
}
.map-img .map-left {
    transform-origin: left bottom !important;
}
/*.active-5 .map-img .map-right,
 .active-6 .map-img .map-right,
 .active-9 .map-img .map-right{
 opacity:0;
 transform: translate(100%,-50%) scale(0);
 left:0;
 transition: all 1.5s ease 0s , opacity 0.5s ease 0s !important;
 }

 .active-5 .map-img .map-left,
 .active-6 .map-img .map-left,
 .active-9 .map-img .map-left{
 opacity:0;
 transform: translate(-100%,-50%) scale(0);
 left:0;
 transition: all 1.5s ease 0s , opacity 0.5s ease 0s !important;
 }*/

.pageContent .map-img img.cloud-img {
    -ms-transform: translate(-50%, -50%) scale(0);
    -moz-transform: translate(-50%, -50%) scale(0);
    -webkit-transform: translate(-50%, -50%) scale(0);
    transform-origin: center center !important;
    /*transition: all ease 0.3s!important;*/
    -ms-animation-name: cloudlarge;
    -webkit-animation-name: cloudlarge;
    -moz-animation-name: cloudlarge;
    animation-name: cloudlarge;
    -ms-animation-duration: 40s;
    -webkit-animation-duration: 40s;
    -moz-animation-duration: 40s;
    animation-duration: 40s;
    /*width:0;*/
    -ms-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -ms-animation-timing-function: ease;
    -webkit-animation-timing-function: ease;
    -moz-animation-timing-function: ease;
    animation-timing-function: ease;
    /*animation-direction: alternate;*/
}
@-webkit-keyframes cloudlarge {
    0% {
        transform: translate(-50%, -50%) scale(0);
        opacity: 0;
    }
    50% {
        transform: translate(-50%, -50%) scale(0.8);
        opacity: 0.5;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.6);
        opacity: 0;
    }
}
@keyframes cloudlarge {
    0% {
        transform: translate(-50%, -50%) scale(0);
        opacity: 0;
    }
    50% {
        transform: translate(-50%, -50%) scale(0.8);
        opacity: 0.5;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.6);
        opacity: 0;
    }
}
.pageContent .map-img .step-8+img.cloud-img {
    transform: translate(-50%, -50%) scale(0.8);
    animation: none;
}
.cloud-img-animated {
    position: absolute;
    top: 10%;
    -ms-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -ms-perspective: 1000;
    -moz-perspective: 1000;
    -webkit-perspective: 1000;
    perspective: 1000;
    -ms-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    opacity: 0.4 !important;
    display: none;
    left: -100px;
    /*transform: none !important;*/
    /* transform: translateX(-50%); */
    transform: translateY(-50%);
    z-index: -1;
    /*background-color: #FFF;*/
    /*animation-play-state:paused;*/
    /*-ms-animation-name: cloud2none;
	-moz-animation-name: cloud2none;
	-webkit-animation-name: cloud2none;
	animation-name: cloud2none;

	-ms-animation-duration: 60s;
	-moz-animation-duration: 60s;
	-webkit-animation-duration: 60s;
	animation-duration: 60s;

	-ms-animation-iteration-count: infinite;
	-moz-animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;

	-ms-animation-timing-function: linear;
	-moz-animation-timing-function: linear;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;

	-ms-animation-direction: normal;
	-moz-animation-direction: normal;
	-webkit-animation-direction: normal;
	animation-direction: normal;*/
}
/*body {
  -webkit-transform: translate3d(0, 0, 0);
}*/

.map-wrap:not(.active-13) .cloud-img-animated {
    display: block!important;
    -ms-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -ms-perspective: 1000;
    -moz-perspective: 1000;
    -webkit-perspective: 1000;
    perspective: 1000;
    -ms-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -ms-animation-name: cloud;
    -moz-animation-name: cloud;
    -webkit-animation-name: cloud;
    animation-name: cloud;
    -ms-animation-duration: 60s;
    -moz-animation-duration: 60s;
    -webkit-animation-duration: 60s;
    animation-duration: 60s;
    -ms-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -ms-animation-direction: normal;
    -moz-animation-direction: normal;
    -webkit-animation-direction: normal;
    animation-direction: normal;
    /*animation-play-state:running;*/
}
.cloud-img-animated.cloud1 {
    animation-duration: 50s;
    top: 35%;
    height: auto !important;
    width: auto !important;
    left: auto;
    right: 0;
}
.map-wrap:not(.active-13) .cloud-img-animated.cloud1 {
    -ms-animation-name: cloud2;
    -moz-animation-name: cloud2;
    -webkit-animation-name: cloud2;
    animation-name: cloud2;
}
.cloud-img-animated.cloud2 {
    animation-duration: 90s;
    top: 45%;
    height: auto !important;
    width: auto !important;
    left: auto;
    right: 0;
}
.cloud-img-animated.cloud3 {
    top: 60%;
    height: auto !important;
    width: auto !important;
    animation-duration: 120s;
    left: auto;
    right: 100px;
}
.cloud-img-animated.cloud4 {
    top: 60%;
    height: auto !important;
    width: auto !important;
    display: none;
    animation-duration: 90s;
    animation-name: cloud2;
}
.cloud-img-animated.cloud5 {
    top: 50%;
    height: auto !important;
    width: auto !important;
    animation-duration: 160s;
    display: none;
    /*animation-timing-function:cubic-bezier(0.1, 0.7, 1.0, 0.1);*/
}
.cloud-img-animated.cloud6 {
    top: 65%;
    height: auto !important;
    width: auto !important;
    animation-duration: 140s;
    /*animation-timing-function:cubic-bezier(0.1, 0.7, 1.0, 0.1);*/
}
@-webkit-keyframes cloud {
    0% {
        transform: translateX(0px);
        opacity: 0;
    }
    50% {
        transform: translateX(300px);
        opacity: .25;
    }
    100% {
        transform: translateX(0px);
        opacity: 0;
    }
}
@keyframes cloud {
    0% {
        transform: translate(-50%, -50%) scale(0.8);
        opacity: 0;
    }
    50% {
        transform: translate(0%, -50%) scale(0.8);
        opacity: 0.5;
    }
    100% {
        transform: translate(50%, -50%) scale(1.6);
        opacity: 0;
    }
}
@-webkit-keyframes cloud2 {
    0% {
        transform: translate(50%, -50%) scale(0.8);
        opacity: 0;
    }
    50% {
        transform: translate(0%, -50%) scale(0.8);
        opacity: 0.5;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.6);
        opacity: 0;
    }
}
@keyframes cloud2 {
    0% {
        transform: translate(50%, -50%) scale(0.8);
        opacity: 0;
    }
    50% {
        transform: translate(0%, -50%) scale(0.8);
        opacity: 0.5;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.6);
        opacity: 0;
    }
}
@-webkit-keyframes cloud2none {
    0% {
        transform: translate(0%, 0%) scale(0);
        opacity: 0;
    }
    50% {
        transform: translate(0%, 0%) scale(0);
        opacity: 0;
    }
    100% {
        transform: translate(0%, 0%) scale(0);
        opacity: 0;
    }
}
@keyframes cloud2none {
    0% {
        transform: translate(0%, 0%) scale(0);
        opacity: 0;
    }
    50% {
        transform: translate(0%, 0%) scale(0);
        opacity: 0;
    }
    100% {
        transform: translate(0%, 0%) scale(0);
        opacity: 0;
    }
}
/*alfin*/

/*.map-wrap.active-12 .africa-wrap img.step-new,*/

.map-wrap.active-10 .africa-wrap img.step-new, .map-wrap.active-9 .africa-wrap img.step-new, .map-wrap.active-8 .africa-wrap img.step-new, .map-wrap.active-7 .africa-wrap img.step-new, .map-wrap.active-6 .africa-wrap img.step-new, .map-wrap.active-5 .africa-wrap img.step-new, .map-wrap.active-4 .africa-wrap img.step-new, .map-wrap.active-3 .africa-wrap img.step-new, .map-wrap.active-5 .africa-wrap img.step-new, .map-wrap.active-1 .africa-wrap img.step-new {
    opacity: 1 !important;
    transform: scale(1.1);
}
.step-6.white-line {
    display: none!important;
}
.map-wrap .africa-wrap .step-6.black-line {
    display: none!important;
}
.step-5.agri-icn {
    position: absolute;
    top: 80px;
}
/*.step-5.agri-icn img
{
transform: rotate(45deg);
}*/

.agri-energy-icn img, .agri-icn img {
    width: 40px;
}
.user-icn img {
    width: 50px;
}
.step-5.agri-icn img {
    transform: rotate(0);
    margin-top: 15px;
}
.agri-energy-icn img, .user-icn img {
    margin-top: 15px;
}
.map-content {
    overflow: visible;
}
/*alfin*/

.user-icn, .agri-energy-icn, .agri-icn {
    display: none!important;
}
.loader1 {
    background: transparent !important;
}
/***************************************************/

.active-5 .africa-wrap img.step-new {
    transition: none !important;
}
.map-wrap.active-4 .africa-wrap img.step-6, .map-wrap.active-3 .africa-wrap img.step-6 {
    opacity: .4;
}
.map-wrap.active-4 .africa-wrap img.step-new, .map-wrap.active-3 .africa-wrap img.step-new {
    opacity: 0 !important;
    transform: none;
}
.map-wrap.active-4 span.country-name, .map-wrap.active-3 span.country-name {
    transform: scale(0);
    opacity: 0;
}
.map-wrap.active-4 .users, .map-wrap.active-3 .users, .map-wrap.active-4 .leaf, .map-wrap.active-3 .leaf, .map-wrap.active-4 .energy-icn, .map-wrap.active-3 .energy-icn, .map-wrap.active-4 span.country-border, .map-wrap.active-3 span.country-border {
    opacity: 0;
}
.map-wrap.active-4 .pin, .map-wrap.active-3 .pin {
    width: 20px;
    height: 32px;
    transition: all .4s cubic-bezier(0.09, 0.51, 1, 1.24);
    transition-delay: .5s;
    z-index: 1000;
    opacity: 1;
    transform: translate3d(00px, 0px, 00px) scale(1);
}
.map-wrap.single-step-map .pin {
    width: 24px;
    height: 22px;
}
.map-wrap.active-4 .pin-active, .map-wrap.active-3 .pin-active {
    z-index: 1001;
    transition: none;
    transform: none;
}
/*body .map-wrap.active-4 .pin.pin-active,
body .map-wrap.active-3 .pin.pin-active{
	transition-delay: 0s !important;
	z-index: 1010 !important;
}*/

.act-pin.map-wrap.single-step-map.active-4 .pin, .act-pin.map-wrap.active-11 .pin {
    transition: none !important;
}
.map-wrap.active-4 .pin-niger, .map-wrap.active-3 .pin-niger {
    left: 36%;
    bottom: 68%;
}
.map-wrap.active-4 .pin-mali, .map-wrap.active-3 .pin-mali {
    bottom: 75%;
    left: 21%;
}
.map-wrap.active-4 .pin-mauritania, .map-wrap.active-3 .pin-mauritania {
    top: 21%;
    transition-delay: .6s;
}
.map-wrap.active-4 .pin-senegal, .map-wrap.active-3 .pin-senegal {
    top: 26%;
    right: 95%;
    transition-delay: .4s;
}
.map-wrap.active-4 .pin-guinea, .map-wrap.active-3 .pin-guinea {
    top: 31%;
    right: 89%;
    transition-delay: .6s;
}
.map-wrap.active-4 .pin-burkina, .map-wrap.active-3 .pin-burkina {
    top: 29.2%;
    transition-delay: .4s;
}
.map-wrap.active-4 .pin-liberia, .map-wrap.active-3 .pin-liberia {
    top: 37.2%;
    transition-delay: .6s;
}
.map-wrap.active-4 .pin-burundi, .map-wrap.active-3 .pin-burundi {
    right: 29.8%;
    top: 54.3%;
    width: 10px;
    height: 16px;
    transition-delay: .6s;
}
.map-wrap.active-4 .pin-zambia, .map-wrap.active-3 .pin-zambia {
    left: 61.8%;
    bottom: 27.5%;
}
.map-wrap.active-4 .pin-zimbabwe, .map-wrap.active-3 .pin-zimbabwe {
    left: 66.8%;
    bottom: 21.5%;
}
.map-wrap.active-4 .pin-malawi, .map-wrap.active-3 .pin-malawi {
    right: 24%;
    top: 66%;
    width: 15px;
    height: 24px;
    transition-delay: .6s;
}
.map-wrap.active-4 .pin-tanzania, .map-wrap.active-3 .pin-tanzania {
    bottom: 34%;
    left: 78%;
}
.map-wrap.active-4 .pin-rwanda, .map-wrap.active-3 .pin-rwanda {
    width: 10px;
    left: 67.5%;
    height: 16px;
    top: 51.5%;
    transition-delay: .4s;
}
.map-wrap.active-4 .pin-benin, .map-wrap.active-3 .pin-benin {
    left: 26.8%;
    top: 35.2%;
    transition-delay: .6s;
}
.map-wrap.active-4 .pin-kenya, .map-wrap.active-3 .pin-kenya {
    top: 49%;
    left: 81%;
}
.map-wrap.active-4 .pin-uganda, .map-wrap.active-3 .pin-uganda {
    right: 25.8%;
    bottom: 49%;
}
.map-wrap.active-4 .pin-somalia, .map-wrap.active-3 .pin-somalia {
    top: 33%;
    left: 92.6%;
    transition-delay: .6s;
}
.map-wrap.active-4 .pin-south-sudan, .map-wrap.active-3 .pin-south-sudan {
    right: 30.8%;
    bottom: 58%;
}
.map-wrap.active-4 .pin-mauritania, .map-wrap.active-3 .pin-mauritania {
    right: 89%;
}
.map-wrap.active-4 .pin-burkina, .map-wrap.active-3 .pin-burkina {
    left: 20.8%;
}
.map-wrap.active-4 .pin-liberia, .map-wrap.active-3 .pin-liberia {
    left: 9.8%;
}
.map-wrap.active-4 .pin-benin, .map-wrap.active-3 .pin-benin {
    width: 15px;
    height: 24px;
}
.map-wrap h2.step-1.act-4 {
    opacity: 0;
}
.map-wrap.active-4 h2.step-1:not(.act-4), .map-wrap.active-3 h2.step-1:not(.act-4), .map-wrap.active-3 h2.step-5 {
    opacity: 0;
}
.map-wrap.active-4 h2.step-1.act-4, .map-wrap.active-3 h2.step-1.act-4 {
    opacity: 1;
}
.map-wrap h2.step-2.act-4-hd {
    opacity: 0;
}
.map-wrap.active-4 h2.step-2:not(.act-4-hd), .map-wrap.active-3 h2.step-2:not(.act-4-hd) {
    opacity: 0;
}
.map-wrap.active-4 h2.step-2.act-4-hd, .map-wrap.active-3 h2.step-2.act-4-hd {
    opacity: 1;
    transform: translateY(0) scale(1);
}
/***************************************************/

/********************map country listing***************************/

.map-country-list-top {
    padding-top: 15px;
}
.map-country-list-top ul, .map-country-list-bottom ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}
.map-country-list-top ul li, .map-country-list-bottom ul li {
    display: inline-block;
    margin: 0 4px;
}
.map-country-list-top a, .map-country-list-bottom a {
    font-size: 12px;
    color: #fff;
    line-height: 20px;
    display: inline-block;
}
.map-country-list-top a span, .map-country-list-bottom a span {
    color: #18c8ff;
    font-weight: 700;
}
.pageContent.active .map-country-list-top a, .pageContent.active .map-country-list-bottom a, .pageContent.active .map-list-tablet a {
    display: flex;
}
.map-country-list-top a span, .map-country-list-bottom a span, .map-list-tablet a span {
    margin-right: 5px;
}
.map-list-tablet a span {
    font-weight: 600;
}
.component-small-desc {
    color: #fff;
}
.map-mob-coutry {
    text-align: center;
}
.map-mob-coutry img {
    max-width: 80%;
}
.how-we-work .map-country-list-top a span, .how-we-work .map-country-list-bottom a span {
    color: #4d4d4d;
}
.how-we-work .map-country-list-top a, .how-we-work .map-country-list-bottom a {
    color: #000;
}
/********************map country listing***************************/

/*******map new ****************/

/*img.img-without-num{
	display:none!important;
}*/

.mobile-anim .map-component-inner {
    overflow: hidden;
    /*display: block !important;*/
    position: absolute;
    top: 0;
    padding: 48px 15px 30px 15px;
}
.map-mob-coutry img {
    max-width: none;
    max-height: 226px;
}
@media screen and (max-height:550px) {
    .map-mob-coutry img {
        max-width: none;
        max-height: 150px;
    }
    .map-country-list-top {
        padding-top: 0;
    }
    .map-country-list-top a, .map-country-list-bottom a {
        line-height: 18px;
    }
    .mobile-anim .map-component-inner {
        padding: 40px 10px 15px 10px;
    }
}
/*.map-mob-coutry img:not(.img-without-num){
	 display:none!important;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	margin: 0 auto;
}*/

/*************** map end ******************/

@media screen and (max-width:1500px) {
    .map-content h2, .map-content p {
        font-size: 26px;
    }
}
@media screen and (max-width:1400px) {
    .map-content h2, .map-content p {
        font-size: 23px;
    }
    .map-wrap .thirty, .map-wrap.active-3 .youth, .map-wrap.active-4 .youth, .map-wrap.active-6 .off-grid, .map-wrap.active-5 .off-grid, .map-wrap.active-8 .agri {
        font-size: 30px;
    }
}
@media screen and (min-width: 767px) and (max-width: 1024px) {
    .map-country-list-top a, .map-country-list-bottom a {
        font-size: 16px;
    }
}
/* Map New */

.map-wrap.active-2 h2.step-8 {
    opacity: 1;
    transform: translateY(000px) scale(1);
    top: 120px;
    transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    font-size: 60px;
}
.map-wrap.active-2 h2.step-1 {
    opacity: 1;
    display: block;
    transform: translateY(-50%) scale(1);
}
.map-wrap.active-1 h2.step-7 {
    opacity: 1;
    display: block;
    transform: translateY(-50%) scale(1);
    top: 125px;
    font-size: 20px;
}
.map-wrap.active-1 h2.step-7 span {
    color: #42c3fd;
    font-size: 28px;
}
.map-wrap.active-2 h2.step-7 {
    opacity: 0;
}
.map-wrap.active-2 .africa-wrap .step-6 {
    opacity: .4;
}
.map-wrap.active-1 h2.step-1 {
    transition-delay: 0s;
    opacity: 0;
    display: none;
}
.map-content h2.step-2 {
    bottom: 20px;
    top: auto;
    opacity: 0;
    position: fixed;
    font-size: 20px;
    color: #c0a265;
}
.active-1 .map-content h2.step-2 {}