.map-item {
      fill: #EAF5FB;
	  cursor: pointer;
      
  }
  .stcount {
    font-family: Inter,sans-serif !important;
		font-weight: 800;
    font-size: 32;    
    fill: #77B5FF;
  }
	.st12{
		font-family: Inter,sans-serif !important;
		font-weight: 400;
	}
	.st14 {
    	font-family: Inter,sans-serif !important;
    	font-weight: 700;
	}
	.st4.active {
      fill: #6168fc;
      transition: all 0.5s ease-out;
  }
  .st7.active {
      fill: #6168fc;
      transition: all 0.5s ease-out;
  }
	.st10.active {
      fill: #6168fc;
      transition: all 0.5s ease-out;
  }
	.st9.active {
      fill: #6168fc;
      transition: all 0.5s ease-out;
  }
	.st11.active {
      fill: #6168fc;
      transition: all 0.5s ease-out;
  }
	.st11{
		cursor: pointer;
	}
  
  .popup_item {
      background-color: #122B38;
      text-align: start;
      padding: 18px 0 20px 20px;
      max-width: 240px;
      width: 100%;
      border-radius: 18px;
      display: none;
      position: absolute;
      top: 125%;
      left:40%
      
  }
  
  .active-info {
      display: block;
  }
  
  .popup_title {
      font-size: 18px;
      color: #fff;
  }
  .map-container {
    position: relative;
	  margin-left: auto;
	  margin-right: auto;
  }
  
  .popup_title::before {
      content: "•";
      font-weight: bold;
      color: #fff;
      margin-right: 12px;
  }
  
  .popup_text {
      color: #94AEBC;
      font-size: 16px;
      margin-bottom: 12px;
  }

  .city_title {
    color: #D9DCE3;
    font-size: 18px;
    position: absolute;

  }

  .city_title::before {
    content: url(https://sk-trust.kz/wp-content/uploads/2022/07/ellips.svg);
    margin-right: 9px;
  }

  .popup_title::before {
    content: url(https://sk-trust.kz/wp-content/uploads/2022/07/el_white.png);
    margin-right: 9px;
    
  }
  .years {
    border: none;
  }

  .years::after {
    content: url(https://sk-trust.kz/wp-content/uploads/2022/07/arrow.svg);
    margin-left: 9px;
  }
  @media (max-width:785px) {
    .city_title {
      display: none;
    }
    .svg {
      max-width: 700px;
      width: 100%;
    }
  }

@media (min-width:786px) {

.map-container {
  width: 750px;
}
	.map-container text{
		text-transform: uppercase;
	}
	.map-container text tspan{
		text-transform: uppercase;
	}
.svg {
  width:700px;
}
.city_title {
  font-size: 12px;
}
  .petropavlovsk {
  top: 28%;
  left: 53%;
}
.pavlodar {
  top: 32%;
  left: 68%;
}
.usti-kamenogorsk {
  top: 42%;
  left: 82%;
}
.semey {
  top: 38%;
  left: 79%;
}

.nursultan {
  top: 35%;
  left: 55%;
}
.akmola {
  top: 35%;
  left: 55%;
}
.karaganda {
  top: 42%;
  left: 59%;
}
.almati {
  top: 64%;
  left: 73%;
}
.almati2 {
  top: 64%;
  left: 73%;
}
.kizilorda {
  top: 59%;
  left: 39%;
}
.atirau {
  top: 46%;
  left: 10%;
}
.konstanay {
  top: 32%;
  left: 43%;
}
.jezkazgan {
  top: 51%;
  left: 49%;
}
.taldikorgan {
  top: 59%;
  left:79%;
}
.shimkent {
  top: 70%;
  left: 54%;
}
.turkestan {
  top: 70%;
  left: 54%;
}
.aktau {
  top: 60%;
  left: 16%;
}
.uralsk {
  top: 37%;
  left: 13%;
}
.aktobe {
  top: 45%;
  left: 27%;
}
.taraz {
  top: 64%;
  left: 60%;
}
.ulytau{
	top: 52%;
    left: 62%;
}
.abai{
	top: 39%;
    left: 79%;
}
.jetisu{
	top: 61%;
    left: 79%;
}
.jambil{
	top: 66%;
    left: 63%;
}
.mangistau{
    top: 66%;
    left: 21%;
}
.vko{
	top: 43%;
    left: 88%;
}
.zko{
	top: 38%;
    left: 11%;
}
.sko{
	top: 12%;
    left: 50%;
}

}
@media (min-width:950px) {

.map-container {
  width: 920px;
}
.svg {
  width:900px;
}
.city_title {
  font-size: 18px;
}
  .petropavlovsk {
  top: 19%;
  left: 55%;
}
.pavlodar {
  top: 25%;
  left: 71%;
}
.usti-kamenogorsk {
  top: 40%;
  left: 86%;
}
.semey {
  top: 34%;
  left: 81%;
}

.nursultan {
  top: 29%;
  left: 57%;
}
.karaganda {
  top: 39%;
  left: 62%;
}
.almati {
  top: 70%;
  left: 75%;
}
.kizilorda {
  top: 66%;
  left: 41%;
}
.atirau {
  top: 46%;
  left: 10%;
}
.konstanay {
  top: 26%;
  left: 43%;
}
.jezkazgan {
  top: 53%;
  left: 52%;
}
.taldikorgan {
  top: 63%;
  left:79%;
}
.shimkent {
  top: 79%;
  left: 54%;
}
.usti-kamenogorsk {
  top: 35%;
  left: 89%;
}
.aktau {
  top: 65%;
  left: 13%;
}
.uralsk {
  top: 34%;
  left: 13%;
}
.aktobe {
  top: 42%;
  left: 27%;
}
.taraz {
  top: 69%;
  left: 62%;
}

}
  @media (min-width:1100px) {

.map-container {
  width: 1000px;
}
.svg {
  width:980px;
}
  .petropavlovsk {
  top: 13%;
  left: 55%;
}
.pavlodar {
  top: 25%;
  left: 71%;
}
.usti-kamenogorsk {
  top: 41%;
  left: 87%;
}
.semey {
  top: 34%;
  left: 81%;
}

.nursultan {
  top: 29%;
  left: 57%;
}
.karaganda {
  top: 39%;
  left: 62%;
}
.almati {
  top: 70%;
  left: 75%;
}
.kizilorda {
  top: 66%;
  left: 41%;
}
.atirau {
  top: 46%;
  left: 10%;
}
.konstanay {
  top: 26%;
  left: 43%;
}
.jezkazgan {
  top: 53%;
  left: 52%;
}
.taldikorgan {
  top: 63%;
  left:79%;
}
.shimkent {
  top: 79%;
  left: 54%;
}
.usti-kamenogorsk {
  top: 35%;
  left: 89%;
}
.aktau {
  top: 65%;
  left: 13%;
}
.uralsk {
  top: 29%;
  left: 15%;
}
.aktobe {
  top: 42%;
  left: 27%;
}
.taraz {
  top: 69%;
  left: 62%;
}

}
  @media (min-width:1250px) {

  .map-container {
    width: 1200px;
  }
  .svg {
    width: 1200px;
  }
    .petropavlovsk {
    top: 13%;
    left: 55%;
    }
    .pavlodar {
        top: 19%;
        left: 72%;
    }
    .usti-kamenogorsk {
        top: 33%;
        left: 86%;
    }
    .semey {
        top: 31%;
        left: 82%;
    }
    
    .nursultan {
        top: 24%;
        left: 57%;
    }
    .karaganda {
        top: 38%;
        left: 64%;
    }
    .almati {
        top: 75%;
        left: 76%;
    }
    .kizilorda {
        top: 66%;
        left: 41%;
    }
    .atirau {
        top: 46%;
        left: 10%;
    }
    .konstanay {
        top: 23%;
        left: 43%;
    }
    .jezkazgan {
        top: 53%;
        left: 52%;
    }
    .taldikorgan {
        top: 68%;
        left: 83%;
    }
    .shimkent {
        top: 87%;
        left: 55%;
    }
    .usti-kamenogorsk {
        top: 35%;
        left: 89%;
    }
    .aktau {
        top: 68%;
        left: 13%;
    }
    .uralsk {
        top: 29%;
        left: 15%;
    }
    .aktobe {
        top: 37%;
        left: 31%;
    }
    .taraz {
        top: 74%;
        left: 63%;
    }

}