

.cls1 {
  isolation: isolate;
}

.cls2, .cls5 {
  fill: #b3cbd7;
}

.cls2, .cls3, .cls4, .cls5, .cls6, .cls7 {
  stroke: #fff;
}

.cls3, .cls4 {
  fill: #d4dade;
}

.cls4, .cls5 {
  stroke-width :0.4px;
}


.cls6 {
  fill: #d9d08e;
}

.cls65, .cls7 {
  fill: #fff;
}

.cls177, .cls8, .cls9 {
  fill: none;
  stroke-miterlimit: 10;
}

.cls8 {
  stroke: #123e87;
  stroke-width: 0.6px;
}

.cls177, .cls9 {
  stroke: #231f20;
}

.cls9 {
  stroke-width :0.3px;
}


.cls10, .cls11, .cls12, .cls13, .cls14, .cls15, .cls16, .cls17, .cls18, .cls19, .cls20, .cls21, .cls22, .cls23, .cls24, .cls25, .cls26, .cls27, .cls28, .cls29, .cls30, .cls31, .cls32, .cls33, .cls34, .cls35, .cls36, .cls37, .cls38, .cls39, .cls40, .cls41, .cls73 {
  opacity: 0.75;
  mix-blend-mode: multiply;
}

.cls10 {
  fill: url(#linear-gradient);
}

.cls11 {
  fill: url(#linear-gradient-2);
}

.cls12 {
  fill: url(#New_Gradient_Swatch_1);
}

.cls13 {
  fill: url(#New_Gradient_Swatch_1-2);
}

.cls14 {
  fill: url(#New_Gradient_Swatch_1-3);
}

.cls15 {
  fill: url(#linear-gradient-3);
}

.cls16 {
  fill: url(#linear-gradient-4);
}

.cls17 {
  fill: url(#linear-gradient-5);
}

.cls18 {
  fill: url(#linear-gradient-6);
}

.cls19 {
  fill: url(#linear-gradient-7);
}

.cls20 {
  fill: url(#linear-gradient-8);
}

.cls21 {
  fill: url(#New_Gradient_Swatch_1-4);
}

.cls22 {
  fill: url(#linear-gradient-9);
}

.cls23 {
  fill: url(#linear-gradient-10);
}

.cls24 {
  fill: url(#linear-gradient-11);
}

.cls25 {
  fill: url(#linear-gradient-12);
}

.cls26 {
  fill: url(#linear-gradient-13);
}

.cls27 {
  fill: url(#linear-gradient-14);
}

.cls28 {
  fill: url(#linear-gradient-15);
}

.cls29 {
  fill: url(#linear-gradient-16);
}

.cls30 {
  fill: url(#linear-gradient-17);
}

.cls31 {
  fill: url(#linear-gradient-18);
}

.cls32 {
  fill: url(#linear-gradient-19);
}

.cls33 {
  fill: url(#linear-gradient-20);
}

.cls34 {
  fill: url(#linear-gradient-21);
}

.cls35 {
  fill: url(#linear-gradient-22);
}

.cls36 {
  fill: url(#linear-gradient-23);
}

.cls37 {
  fill: url(#linear-gradient-24);
}

.cls38 {
  fill: url(#linear-gradient-25);
}

.cls39 {
  fill: url(#linear-gradient-26);
}

.cls40 {
  fill: url(#linear-gradient-27);
}

.cls41 {
  fill: url(#linear-gradient-28);
}

.cls42 {
  fill: #3f9ab4;
}

.cls43 {
  fill: #231f20;
}

.cls44 {
  fill: #6cbde8;
}

.cls45 {
  fill: #007889;
}

.cls46 {
  fill: #094e80;
}

.cls47 {
  fill: #2d9ece;
}

.cls48 {
  fill: #146dac;
}

.cls49 {
  fill: #5680b9;
}

.cls50 {
  fill: #2fade1;
}

.cls51 {
  fill: #98cee8;
}

.cls52 {
  fill: #e83d80;
}

.cls53 {
  fill: #b12b4e;
}

.cls54 {
  fill: #e50873;
}

.cls55 {
  fill: #62323b;
}

.cls56 {
  fill: #9d4c52;
}

.cls57 {
  fill: #e5c0c3;
}

.cls58 {
  fill: #8f094c;
}

.cls59 {
  fill: #63313b;
}

.cls60 {
  fill: #ae777f;
}

.cls61 {
  fill: #c42c66;
}

.cls62 {
  fill: #7f003f;
}

.cls63 {
  fill: #d3dbe0;
}

.cls64 {
  fill: #bbc7cd;
}

.cls66 {
  fill: #949fa5;
}

.cls67 {
  fill: #646f76;
}

.cls68 {
  fill: #4e585f;
}

.cls69 {
  fill: #414a50;
}

.cls70 {
  fill: #333b41;
}

.cls71 {
  fill: #848f95;
}

.cls72 {
  fill: #626d74;
}

.cls73 {
  fill: url(#New_Gradient_Swatch_1-5);
}

.cls74 {
  fill: #003e16;
}

.cls75 {
  fill: #639f74;
}

.cls76 {
  fill: #21693d;
}

.cls77 {
  fill: #1a4c2f;
}

.cls78 {
  fill: #005527;
}

.cls79 {
  fill: #e70c6e;
}

.cls80 {
  fill: #5d2a30;
}

.cls81 {
  fill: #800039;
}

.cls82 {
  fill: #a80050;
}

.cls83 {
  fill: #5e0021;
}

.cls84 {
  fill: #b05f9f;
}

.cls85 {
  fill: #74306d;
}

.cls86 {
  fill: #8f3580;
}

.cls87 {
  fill: #41063c;
}

.cls88 {
  fill: #c175aa;
}

.cls89 {
  fill: #be609d;
}

.cls90 {
  fill: #e781af;
}

.cls91 {
  fill: #bb365a;
}

.cls92 {
  fill: #e498be;
}

.cls93 {
  fill: #eb698b;
}

.cls94 {
  fill: #d35780;
}

.cls95 {
  fill: #94283c;
}

.cls96 {
  fill: #ca446e;
}

.cls97 {
  fill: #80393f;
}

.cls98 {
  fill: #bd365e;
}

.cls99 {
  fill: #e280a2;
}

.cls100 {
  fill: #803c49;
}

.cls101 {
  fill: #b6365a;
}

.cls102 {
  fill: #e65a87;
}

.cls103 {
  fill: #e13b80;
}

.cls104 {
  fill: #6c3642;
}

.cls105 {
  fill: #7c3842;
}

.cls106 {
  fill: #e1bdd6;
}

.cls107 {
  fill: #ee87a5;
}

.cls108 {
  fill: #e5608a;
}

.cls109 {
  fill: #636f53;
}

.cls110 {
  fill: #7e8d64;
}

.cls111 {
  fill: #8fad6f;
}

.cls112 {
  fill: #56644b;
}

.cls113 {
  fill: #414e3a;
}

.cls114 {
  fill: #1f3522;
}

.cls115 {
  fill: #92a972;
}

.cls116 {
  fill: #1e6cad;
}

.cls117 {
  fill: #8094c0;
}

.cls118 {
  fill: #1863a8;
}

.cls119 {
  fill: #2a4c99;
}

.cls120 {
  fill: #5380be;
}

.cls121 {
  fill: #3a3b5a;
}

.cls122 {
  fill: #158cc9;
}

.cls123 {
  fill: #3c7cb8;
}

.cls124 {
  fill: #7885be;
}

.cls125 {
  fill: #81c9d9;
}

.cls126 {
  fill: #5f5788;
}

.cls127 {
  fill: #353589;
}

.cls128 {
  fill: #9ac1d9;
}

.cls129 {
  fill: #95a1ce;
}

.cls130 {
  fill: #1665a9;
}

.cls131 {
  fill: #4a4c70;
}

.cls132 {
  fill: #74c6c9;
}

.cls133 {
  fill: #0074b3;
}

.cls134 {
  fill: #3ab1d5;
}

.cls135 {
  fill: #00a5d2;
}

.cls136 {
  fill: #008dbc;
}

.cls137 {
  fill: #466f9a;
}

.cls138 {
  fill: #446;
}

.cls139 {
  fill: #005888;
}

.cls140 {
  fill: #51c0d2;
}

.cls141 {
  fill: #36a3a8;
}

.cls142 {
  fill: #1c2428;
}

.cls143 {
  fill: #4e4f7c;
}

.cls144 {
  fill: #7cc3de;
}

.cls145 {
  fill: #1c807f;
}

.cls146 {
  fill: #4abaab;
}

.cls147 {
  fill: #44a99c;
}

.cls148 {
  fill: #00a1a9;
}

.cls149 {
  fill: #1b807e;
}

.cls150 {
  fill: #03635f;
}

.cls151 {
  fill: #56bfc4;
}

.cls152 {
  fill: #289690;
}

.cls153 {
  fill: #113833;
}

.cls154, .cls158, .cls159, .cls163, .cls165, .cls166, .cls172, .cls173 {
  font-size :10.8px;
  font-family: PFRegalTextPro-RegularA, PFRegalTextPro RegularA;
}

.cls154, .cls160 {
  letter-spacing: 0.05em;
}

.cls155 {
  letter-spacing: 0.04em;
}

.cls156, .cls158 {
  letter-spacing: 0.05em;
}

.cls157, .cls165 {
  letter-spacing: 0.06em;
}

.cls159 {
  letter-spacing: 0.02em;
}

.cls161 {
  letter-spacing: 0.05em;
}

.cls162, .cls166 {
  letter-spacing: -0.02em;
}

.cls163, .cls171 {
  letter-spacing: 0.05em;
}

.cls164 {
  letter-spacing: 0.05em;
}

.cls167 {
  letter-spacing: 0.07em;
}

.cls168 {
  letter-spacing: 0.05em;
}

.cls169 {
  letter-spacing: 0.07em;
}

.cls170 {
  letter-spacing: 0.05em;
}

.cls172 {
  letter-spacing: 0.05em;
}

.cls173 {
  letter-spacing: 0.03em;
}

.cls174 {
  letter-spacing: 0.01em;
}

.cls175 {
  letter-spacing: 0.05em;
}

.cls176 {
  letter-spacing: 0.05em;
}

.cls178 {
  fill: #556e6d;
}

.cls179 {
  fill: #394d4d;
}

.cls180 {
  fill: #12ae80;
}

.Wrapper {
  cursor: pointer;
  width: 2700px;
  height: 900px;
}

coutry() {
  font-size: 12px;
  font-family: arial, sans-serif;
  position: absolute;
}

handle() {
  position: absolute;
  width: 50px;
  height: 50px;
}

.text1 {
  coutry();
  top: 344px;
  left: 1619px;

  &--handle {
    handle();
    top: 329px;
    left: 1569px;
  }
}

.text1a {
  &--handle {
    handle();
    top: 629px;
    left: 1372px;
  }
}

.text1b {
  &--handle {
    handle();
    top: 766px;
    left: 984px;
  }
}

.text1c {
  &--handle {
    handle();
    top: 476px;
    left: 724px;
  }
}

.text2 {
  coutry();
  top: 544px;
  left: 726px;

  &--handle {
    handle();
    top: 474px;
    left: 726px;
  }
}

.text3 {
  coutry();
  top: 675px;
  left: 915px;

  &--handle {
    handle();
    top: 657px;
    left: 987px;
  }
}

.text3a {
  &--handle {
    handle();
    top: 707px;
    left: 987px;
  }
}

.text3b {
  &--handle {
    handle();
    top: 600px;
    left: 987px;
  }
}

.text4 {
  coutry();
  top: 704px;
  left: 1332px;

  &--handle {
    handle();
    top: 628px;
    left: 1325px;
  }
}

.text5 {
  coutry();
  top: 816px;
  left: 1460px;

  &--handle {
    handle();
    top: 833px;
    left: 1477px;
  }
}

.text5a {
  &--handle {
    handle();
    top: 883px;
    left: 1477px;
  }
}

.text5b {
  &--handle {
    handle();
    top: 933px;
    left: 1477px;
  }
}

.text6 {
  coutry();
  top: 756px;
  left: 1511px;

  &--handle {
    handle();
    top: 736px;
    left: 1602px;
  }
}

.text6b {
  &--handle {
    handle();
    top: 736px;
    left: 1707px;
  }
}

.text6c {
  &--handle {
    handle();
    top: 736px;
    left: 1658px;
  }
}

.text7 {
  coutry();
  top: 644px;
  left: 1538px;

  &--handle {
    handle();
    top: 627px;
    left: 1600px;
  }
}

.text7a {
  &--handle {
    handle();
    top: 627px;
    left: 1650px;
  }
}

.text8 {
  coutry();
  top: 296px;
  left: 1695px;

  &--handle {
    handle();
    top: 280px;
    left: 1783px;
  }
}

.text8a {
  &--handle {
    handle();
    top: 280px;
    left: 1843px;
  }
}

.text9 {
  coutry();
  top: 343px;
  left: 1754px;

  &--handle {
    handle();
    top: 357px;
    left: 1741px;
  }
}

.text10 {
  coutry();
  top: 453px;
  left: 1752px;

  &--handle {
    handle();
    top: 439px;
    left: 1791px;
  }
}

.text11 {
  coutry();
  top: 577px;
  left: 1762px;

  &--handle {
    handle();
    top: 593px;
    left: 1775px;
  }
}

.text11a {
  &--handle {
    handle();
    top: 593px;
    left: 1835px;
  }
}

.text12 {
  coutry();
  top: 538px;
  left: 1915px;

  &--handle {
    handle();
    top: 523px;
    left: 2008px;
  }
}

.text13 {
  coutry();
  top: 394px;
  left: 1928px;

  &--handle {
    handle();
    top: 377px;
    left: 1980px;
  }
}

.text13a {
  &--handle {
    handle();
    top: 377px;
    left: 2080px;
  }
}

.text13b {
  &--handle {
    handle();
    top: 377px;
    left: 2130px;
  }
}

.text14 {
  coutry();
  top: 466px;
  left: 2039px;

  &--handle {
    handle();
    top: 451px;
    left: 2102px;
  }
}

.text14a {
  &--handle {
    handle();
    top: 381px;
    left: 2031px;
  }
}

.text14b {
  &--handle {
    handle();
    top: 451px;
    left: 2162px;
  }
}

.text15 {
  coutry();
  top: 792px;
  left: 2145px;

  &--handle {
    handle();
    top: 777px;
    left: 2082px;
  }
}

.text15a {
  &--handle {
    handle();
    top: 777px;
    left: 2022px;
  }
}

.text16 {
  coutry();
  top: 145px;
  left: 1677px;

  &--handle {
    handle();
    top: 126px;
    left: 1776px;
  }
}

svg {
  pointer-events: none;
}



.tooltip {
  position: relative;
  width: 280px;
  min-height: 70px;
  opacity: 0;
  background: #EEE8C1;
  transform: translate(-110%, -100px);
  transition: opacity .4s;
  padding: 8px;
  box-sizing: border-box;
  z-index: 10;

  &Show {
    opacity: .9;
  }

  &Flip {
    transform: translate(25%, -100px);

    & .tooltipArrow {
      position: absolute;
      background: #EEE8C1;
      left: 45px;
      top: -75px;
      box-shadow: 0 0 6px -3px;
      z-index: -1;

      &:after {
        top: 100%;
        left: -48%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-color: rgba(136,183,213,0);
        border-bottom-color: #eee8c1;
        border-width: 75px;
        transform: rotate(327deg);
        margin-left: -30px;
      }

    }
  }

  &Title {
    color: #0000B2;
    display: inline-block;
    border-bottom: 1px solid #ccc;
    margin-bottom: 8px;
  }

  &Arrow {
    position: absolute;
    background: #EEE8C1;
    right: 45px;
    top: -75px;
    box-shadow: 0 0 6px -3px;
    z-index: -1;

    &:after {
      top: 100%;
      left: 50%;
      border: solid transparent;
      content: " ";
      height: 0;
      width: 0;
      position: absolute;
      pointer-events: none;
      border-color: rgba(136,183,213,0);
      border-bottom-color: #eee8c1;
      border-width: 75px;
      -webkit-transform: rotate(20deg);
      transform: rotate(32deg);
      margin-left: -30px;
    }

  }
}

.Drag {
  color: #000;
  width: 2700px;
  height: 1000px;
}

.Wrap {
  width: 3500px;
  height: 1400px;
  left: -1200px;
  top: -400px;
  position: absolute;
}

.tooltipClose {
  display: none;
}

@media only screen  and (min-device-width : 320px)  and (max-device-width : 568px) and (orientation:portrait){
  .Wrap {
    left: 0;
    top: 0;
    margin-top: 45vh;
    width: 100vw;
    height: 1022px;
    //height: 2500px;
    overflow-x: scroll;
    //overflow-y: scroll;
    transform: scale(2);
  }


  .Wrapper {
    cursor: pointer;
    width: 2700px;
    height: 1750px;
  }

  .tooltip {
    position: fixed;
    width: 80vw;
    height: auto;
    overflow-y: auto;
    left: 10vw;
    top: 10vh;
    -webkit-transform: none;
    transform: none;
    padding: 5vw;
    font-size: 6vw;
    line-height: 5vh;
    background: #fff;
    box-shadow: 0px 2vh 40px 0px #999;
    max-height: 90vh;
    text-align: center;

    &Arrow {
      display: none;
    }

    &Title {
      position: relative;
      border-bottom: 2px solid #ccc;
      border-top: 2px solid #ccc;
      display: block;
      text-align: center;
      padding: 3vh 0;
      color: #222;
      width: 60vw;
      margin: -25px auto 4vh;
      font-size: 6vw;
    }

    &Close {
      position: absolute;
      right: -7vw;
      display: block;
      top: 3vh;

      & svg {
        width: 4vw;
        height: 4vw;
      }
    }
  }


  .Wrapper {
    & svg {
      //height: 1800px;
    }
  }

}

