  @media only screen and (max-width: 1366px){ 
/*
    .footprint{background-size: 1366px; padding: 49px 0 99px 0; }*/
    .utility-blu { height: 210px}
    .big-dot-pulse {
        margin-top: 5.9em;
        margin-left: 19.5%;
    }
    .small-dot-pulse {
        margin-top: 22px;
        margin-left: 19%;
    }
    .small-dot-pulse1 {
        margin-top: 22px;
        margin-left: 19%;
    }
    .medium-dot-pulse {
        margin-left: 38%;
        margin-top: 5%;
    }
     .medium-dot-pulse1 {
        margin-left: 48%;
        margin-top: 10%;
    }
    .cn-orng{
      height: 214px;
    }
    .krnatka-dot-pulse {
        margin-left: 38%;
    margin-top: 150px;
    }
    .utility-blu{
     height: 214px;
    }
    .cn-orng{
      height: 214px;
    }
    .small-dot-pulse {
        margin-left: 19%;
    }
    .small-dot-pulse1 {
        margin-left: 19%;
    }
    .krnatka-dot-pulse {
      display: block;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: rgb(253, 177, 36);
      box-shadow: 0 0 0 rgb(0 0 0 / 65%);
      animation: pulse 3s infinite;
      margin-top: 94px;
      position: relative;
      margin-left: 17%;
      margin-top: 23%;
    }
    
  }
  @media only screen and (max-width: 1280px){
 /*   .footprint{background-size: 1280px;}*/
    .big-dot-pulse {
        margin-top: 5.4em;
        margin-left: 25.5%;
    }
    .small-dot-pulse {
        margin-top: 11px;
        margin-left: 23%;
    }
     .small-dot-pulse1 {
        margin-top: 11px;
        margin-left: 23%;
    }
    .medium-dot-pulse {
        margin-left: 38%;
        margin-top: 5%;
    }
    .medium-dot-pulse {
        margin-left: 48%;
        margin-top: 15%;
    }
  .krnatka-dot-pulse {  
    margin-top: 142px;
    left: 17%;

}
}



  .footprint {

   /* background: rgb(246,246,246);*/

    background-image: url(../img/map1.png);

  /*  padding: 49px 0 200px 0;*/
height: 700px;
    background-repeat: no-repeat;
    width: 363px;

     background-size: 100%; 
/*
    background-position: top center;

    

    overflow: hidden;

    position: relative;*/

  /*  max-width: 1920px;margin: 0 auto;*/

}





.footprint-box{

  width: 414px;

  height: 273px;

  background: #0072bcbf 0% 0% no-repeat padding-box;

  color: #fff;

  /*padding: 23px;*/

  margin-top: 112px;

  text-align: left;

}



.footprint-box p{

  font-size: 18px;

  font-family: 'Open Sans';

  font-weight: 400;

}

.footprint-box h3{

  font-size: 36px;

  font-family: 'Montserrat';

  font-weight: 400;

}

.footprint-box h3 b{

   position:relative;

   left: 12%;

   font-family: 'Montserrat';

   text-align: left;

}



.footprint-box h3 .mw1{

left: 11%;

}



.footprint-box h3 .mw2 {

    left: 9%;

}



.footprint-box p::after{

    content: "";

    display: block;

    width: 100%;

    background-color: #e1e1e1ab;

    height: 2px;

   margin: 25px 0;

}





.big-dot-pulse {

       display: block;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 rgb(0 0 0 / 65%);
    animation: pulse .8s ease infinite;
    margin-top: 10em;
    position: absolute;
    left: -12px;
    /* margin-left: 23%; */
    top: 122%;

}



.medium-dot-pulse {

       display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 rgb(0 0 0 / 65%);
    animation: pulse .8s ease infinite;
    margin-top: 4em;
    position: absolute;
    left: -27px;
    /* top: 62%; */
    bottom: -248px;
}

.medium-dot-pulse1 {

       display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 rgb(0 0 0 / 65%);
    animation: pulse .8s ease infinite;
    margin-top: 4em;
    position: absolute;
  left: -117px;
    /* top: 62%; */
    bottom: -268px;
}
.small-dot-pulse {
display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 rgb(0 0 0 / 65%);
    animation: pulse .8s ease infinite;
    margin-top: 1.8em;
    position: absolute;
    left: 9px;
    bottom: -93%;

}

.small-dot-pulse1 {
display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 rgb(0 0 0 / 65%);
    animation: pulse .8s ease infinite;
    margin-top: 1.8em;
    position: absolute;
    left: 0px;
    bottom: -93%;

}


@-webkit-keyframes pulse {

  0% {

    -webkit-box-shadow: 0 0 0 0 #2783c1;

  }

 20% {

    -webkit-box-shadow: 0 0 0 6px #2784c1c4;

}

50% {

  -webkit-box-shadow: 0 0 0 7px #2784c1c4;

}

  70% {

      -webkit-box-shadow: 0 0 0 4px #2784c1c4;

  }

  100% {

      -webkit-box-shadow: 0 0 0 0 #2784c1c4;

  }

}

@keyframes pulse {

  0% {

    -moz-box-shadow: 0 0 0 0 #2783c154;

    box-shadow: 0 0 0 0 #2783c154;

  }

  20% {

    -moz-box-shadow: 0 0 0 6px #2783c154;

    box-shadow: 0 0 0 6px #2783c154;

  }

  50% {

    -moz-box-shadow: 0 0 0 7px #2783c154;

    box-shadow: 0 0 0 7px #2783c154;

  }

  70% {

      -moz-box-shadow: 0 0 0 4px #2783c154;

      box-shadow: 0 0 0 4px #2783c154;

  }

  100% {

      -moz-box-shadow: 0 0 0 0 #2783c154;

      box-shadow: 0 0 0 0 #2783c154;

  }

}




.footprint-box {

    width: 279px;

    height: 214px;

    color: #fff;

    margin-top: 47px;

    text-align: left;

    margin-left: -7%;

}

/*.footprint-orng {

  width: 279px;

  height: 214px;

  background-color: #fdb124;

  color: #fff;

  padding: 0px;

  margin-top: 0px;

  text-align: left;

  margin-left: -7%;

}*/

.footprint-box p {

    font-size: 13px;

   color: #fff;

}

.footprint-box h3 {

    font-size: 22px;

}




@media(max-width: 1280px){

 

.footprint{

  padding: 49px 0 128px 0;

}

}






/*
.footprint {

  background-image: url(../images/Mask-Group1.png);

  padding: 20px 0 60px;

  background-repeat: no-repeat;

  background-size: 100%;

  background-position: top center;

  height: 60vh;

}


}*/





.item-holder {

    opacity: 0;

    visibility: hidden;

    position: absolute;

    bottom: 140px;

    left: calc(50% - 50px);

    z-index: 999;

    transition: all 300ms linear 0ms;

}

.blinking-dots a{

   color:#000;

}

.inner-holder {

    width: 330px;

    max-width: 100%;

    height:auto;

    background-color: #fff;

    color: #000;

    padding: 22px 30px;

    position: relative;

    box-shadow: 0px 5px 83px 0px rgb(9 29 62 / 15%);

    border-radius: 10px;

}

.inner-holder:after {

    content: "";

    bottom: -10px;

    left: 38px;

    position: absolute;

    display: block;

    border-top: 0px solid transparent;

    border-bottom: 10px solid transparent;

    border-right: 12px solid #fff;

}

.big-dot-pulse:hover .item-holder, .medium-dot-pulse:hover .item-holder,  .medium-dot-pulse1:hover .item-holder, .small-dot-pulse:hover .item-holder, .small-dot-pulse1:hover .item-holder, .krnatka-dot-pulse:hover .item-holder {

    visibility: visible;

    opacity: 1;

    bottom:40px;

    clip: inherit;

}

.inner-holder h3{

   font-size:18px;

}

.inner-holder h3 b{

position: relative;

    left: 12%;

    font-family: 'Montserrat';

    text-align: left;

   }



  .utility-blu{

    background-color: #0072bcd4;

    padding:23px;

    height: 273px;

  }

  .cn-orng{

    background-color: #fdb124;

    padding:23px;

    height: 273px;

  }

  .krnatka-dot-pulse {

    display: block;

    width: 8px;

    height: 8px;

    border-radius: 50%;

    background: rgb(253, 177, 36);

    box-shadow: 0 0 0 rgb(0 0 0 / 65%);

    animation: pulse 3s infinite;

    margin-top: 94px;

    position: relative;

    left: -48px;

    margin-left: 20%;

  }

  

  .specification-text{

    position: absolute;

    right: 30px;

    bottom:30px;

  }

  .specification-text li{

    display: block;

    margin-bottom:5px;

    font-size:12px;

    position: relative;

    padding-left:15px;

  }

  .specification-text li:first-child::before{

    position: absolute;

    left: 0;

    content:"";

    background-color:#fdb124;

    width:8px;

    height: 8px;

    top:5px;

  }

  .specification-text li:last-child::before{

    position: absolute;

    left: 0;

    content:"";

    background-color:#0072bcd4;

    width:8px;

    height: 8px;

    top:5px;

  }


