#s1-1 {
    position: absolute;
    top: 50%;
    left: 40%;
}

#s1-2 {
    position: absolute;
    top: 60%;
    left: 80%;
}

#s1-3 {
    position: absolute;
    top: 40%;
    left: 20%;
}



#s2-1 {
    position: absolute;
    top: 60%;
    left: 10%;
}

#s2-2 {
    position: absolute;
    top: 50%;
    left: 60%;
}

#s2-3 {
    position: absolute;
    top: calc(30% + 320px);
    left: calc(60% + 200px);
}

#s2-4 {
    position: absolute;
    top: 70%;
    left: 40%;
}

#s2-5 {
    position: absolute;
    top: 40%;
    left: 20%;
}

#s2-6 {
    position: absolute;
    top: calc(30% - 200px);
    left: calc(20% + 200px);
}

#s2-7 {
    position: absolute;
    top: calc(40% - 200px);
    left: calc(20% + 700px);
}

#s2-8 {
    position: absolute;
    top: 10%;
    left: -25%
}




#s3-1 {
    position: absolute;
    top: 60%;
    left: 60%;
}

#s3-2 {
    position: absolute;
    top: 30%;
    left: 40%;
}

#s3-3 {
    position: absolute;
    top: calc(30% - 200px);
    left: calc(40% + 500px);
}

#s3-4 {
    position: absolute;
   top: calc(60% - 60px);
    left: calc(70% - 200px);
}

#s3-5 {
    position: absolute;
    top: 60%;
    left: 10%;
}

#s3-6 {
    position: absolute;
    top: 40%;
    left: -10%;
}

#s3-7 {
    position: absolute;
    top: 20%;
    left: -15%;
}

#s3-8 {
    position: absolute;
    top: 60%;
    left: 10%;
}

#s3-9 {
    position: absolute;
    top: -40%;
    left: 80%;
}

#s3-10 {
    position: absolute;
    top: 60%;
    left: 10%;
}



.map0 {
   background-image: url(/img/maps/smartreply/0.svg) !important;
}

.map1 {
   background-image: url(/img/maps/smartreply/1.svg) !important;
}


.map2 {
   background-image: url(/img/maps/smartreply/2.svg) !important;
}


.map3 {
   background-image: url(/img/maps/smartreply/3.svg) !important;
}


.map4 {
   background-image: url(/img/maps/smartreply/4.svg) !important;
}