.theme-projects-world-map {
  width: 100%;
  display: -webkit-box;
  display: flex;
  position: relative;
  margin-top: 5rem; }
  @media screen and (max-width: 768px) {
    .theme-projects-world-map {
      margin-top: -2rem; } }
  .cssmask .theme-projects-world-map:before {
    content: '';
    padding-bottom: 45%;
    pointer-events: none;
    flex-basis: 100%;
    width: 100%;
    margin-right: -100%;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#e6e6e6), color-stop(40%, transparent), color-stop(60%, transparent), to(#e6e6e6)), -webkit-gradient(linear, left top, right top, from(#e6e6e6), color-stop(40%, #ffffff), color-stop(60%, #ffffff), to(#e6e6e6));
    background-image: linear-gradient(to bottom, #e6e6e6, transparent 40%, transparent 60%, #e6e6e6), linear-gradient(to right, #e6e6e6, #ffffff 40%, #ffffff 60%, #e6e6e6);
    -webkit-mask-image: url(../images/world-map.svg);
    mask-image: url(../images/world-map.svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: 50% 50%;
    mask-position: 50% 50%;
    z-index: 0; }
    @media screen and (max-width: 768px) {
      .cssmask .theme-projects-world-map:before {
        -webkit-mask-image: none;
        mask-image: none; } }
  .no-cssmask .theme-projects-world-map:before {
    content: '';
    padding-bottom: 45%;
    pointer-events: none;
    flex-basis: 100%;
    width: 100%;
    margin-right: -100%;
    background-image: url(../images/world-map-nocssmask.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50% 50%;
    z-index: 0; }
    @media screen and (max-width: 768px) {
      .no-cssmask .theme-projects-world-map:before {
        background-image: none; } }
  .theme-projects-world-map-markers {
    width: 100%;
    position: relative; }
  .theme-projects-world-map-marker {
    width: 22%;
    position: absolute;
    -webkit-transform: translate(-50%, -70%);
    transform: translate(-50%, -70%);
    display: -webkit-box;
    display: flex;
    -webkit-box-align: start;
    align-items: flex-start;
    cursor: pointer;
    pointer-events: visiblePainted; }
    @media screen and (max-width: 768px) {
      .theme-projects-world-map-marker {
        -webkit-transform: translate(0);
        transform: translate(0);
        width: 100%;
        top: auto !important;
        left: auto !important;
        position: static; } }
    .theme-projects-world-map-marker.global {
      width: 12.5%;
      -webkit-box-align: stretch;
      align-items: stretch; }
      @media screen and (max-width: 768px) {
        .theme-projects-world-map-marker.global {
          display: none; } }
    .cssmask .theme-projects-world-map-marker.global .theme-projects-world-map-marker-marker {
      -webkit-mask-image: url(../images/countries.svg);
      mask-image: url(../images/countries.svg);
      -webkit-mask-repeat: no-repeat;
      mask-repeat: no-repeat; }
    .no-cssmask .theme-projects-world-map-marker.global .theme-projects-world-map-marker-marker {
      background-image: url(../images/countries.svg);
      background-repeat: no-repeat; }
    .no-cssmask .theme-projects-world-map-marker.global:hover .theme-projects-world-map-marker-marker {
      background-image: url(../images/countries-ffb400.svg) !important; }
    .theme-projects-world-map-marker.global .theme-projects-world-map-marker-region {
      border-radius: 50%; }
    .theme-projects-world-map-marker.global .theme-projects-world-map-marker-region-content {
      width: 75%;
      color: black; }
    .theme-projects-world-map-marker.global .theme-projects-world-map-marker-name {
      font-size: 2.4rem;
      margin-top: 4rem; }
    .theme-projects-world-map-marker.global .theme-projects-world-map-marker-count {
      font-size: 5rem;
      margin-top: 0rem; }
    .theme-projects-world-map-marker-marker {
      color: inherit;
      -webkit-box-flex: 1;
      flex-grow: 1;
      flex-shrink: 0;
      flex-basis: 100%;
      padding-bottom: 100%;
      pointer-events: none;
      flex-basis: 100%;
      width: 100%;
      margin-right: -100%;
      z-index: -1;
      display: -webkit-box;
      display: flex;
      -webkit-box-align: center;
      align-items: center;
      color: inherit; }
      @media screen and (max-width: 768px) {
        .theme-projects-world-map-marker-marker {
          padding-bottom: 40px;
          margin-top: 10px; } }
      .cssmask .theme-projects-world-map-marker-marker {
        -webkit-mask-image: url(../images/map-marker.svg);
        mask-image: url(../images/map-marker.svg);
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        mask-size: contain;
        -webkit-mask-position: 50% 50%;
        mask-position: 50% 50%;
        background-image: none !important;
        background-color: currentColor;
        -webkit-transition: background-color .3s linear;
        transition: background-color .3s linear; }
        @media screen and (max-width: 768px) {
          .cssmask .theme-projects-world-map-marker-marker {
            -webkit-mask-position: left;
            mask-position: left; } }
      .no-cssmask .theme-projects-world-map-marker-marker {
        background-repeat: no-repeat;
        background-size: contain;
        background-position: 50% 50%; }
        @media screen and (max-width: 768px) {
          .no-cssmask .theme-projects-world-map-marker-marker {
            background-position: left; } }
    .theme-projects-world-map-marker:hover {
      z-index: 2000 !important; }
    .cssmask .theme-projects-world-map-marker:hover .theme-projects-world-map-marker-marker {
      background-color: #ffb400; }
      @media screen and (max-width: 768px) {
        .cssmask .theme-projects-world-map-marker:hover .theme-projects-world-map-marker-marker {
          background-color: transparent; } }
    .no-cssmask .theme-projects-world-map-marker:hover .theme-projects-world-map-marker-marker {
      background-image: url(../images/map-marker-ffb400.svg) !important; }
    .theme-projects-world-map-marker:hover .theme-projects-world-map-marker-region {
      color: #000000; }
    .theme-projects-world-map-marker-region {
      -webkit-transition: color .3s linear;
      transition: color .3s linear;
      color: #ffffff;
      display: -webkit-box;
      display: flex;
      -webkit-box-flex: 1;
      flex: 1 1 100%;
      -webkit-box-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      align-items: center; }
      @media screen and (max-width: 768px) {
        .theme-projects-world-map-marker-region {
          padding: 15px 0;
          border-bottom: solid 1px #cccccc; } }
      .theme-projects-world-map-marker-region:before {
        content: '';
        padding-bottom: 50%; }
        @media screen and (max-width: 768px) {
          .theme-projects-world-map-marker-region:before {
            padding-bottom: 0; } }
      .theme-projects-world-map-marker-region-content {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        width: 35%; }
        @media screen and (max-width: 768px) {
          .theme-projects-world-map-marker-region-content {
            width: 100%; } }
        .theme-projects-world-map-marker-region-content a {
          color: inherit;
          text-decoration: none; }
          @media screen and (max-width: 768px) {
            .theme-projects-world-map-marker-region-content a {
              color: #000000; } }
    .theme-projects-world-map-marker-name {
      text-align: center;
      font-size: 1.2rem; }
      @media screen and (max-width: 768px) {
        .theme-projects-world-map-marker-name {
          display: inline-block;
          font-size: 1.6rem;
          margin-right: 10px; }
          .theme-projects-world-map-marker-name:before {
            content: "";
            display: inline-block;
            background: red;
            width: 40px; } }
    .theme-projects-world-map-marker-count {
      margin-top: 0.5rem;
      text-align: center;
      font-size: 2.5rem; }
      @media screen and (max-width: 768px) {
        .theme-projects-world-map-marker-count {
          display: inline-block;
          font-size: 1.6rem;
          color: #636363; } }