

.highlight-spot
{
    position: absolute;

    display: block;

    width:1%;
    height: 1%;
}

.highlight-spot { color:white; background-color: rgba(146, 156, 0,0.5);  padding: 2% 2%; border-radius: 100%; }
.highlight-spot:hover { background-color: rgba(146, 156, 0,0.5); padding: 3% 3%; border-radius: 100%; cursor: pointer; animation: fadein .5s; animation: pulse 3s infinite; }

@keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes fadeout {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes pulse {
  from { box-shadow: 0 0 0 0px rgba(146, 156, 0); }
  to { box-shadow: 0 0 0 15px rgba(0, 0, 0, 0); }
}
.center-y{
    top: 48%;
    transform: translateY(-50%);
}
.center-x{
    left: 0;
    right: 55%;
    margin: 0 auto;
}
.center-y1{
    top: 57%;
    transform: translateY(-50%);
}
.center-x1{
    left:0;
    right: 20%;
    margin: 0 auto;
}
.center-y2{
    top: 76%;
    transform: translateY(-50%);
}
.center-x2{
    left: -3%;
    right: 0%;
    margin: 0 auto;
}
.center-y3{
    top: 54%;
    transform: translateY(-50%);
}
.center-x3{
    left: 44%;
    right: 0;
    margin: 0 auto;
}
.center-y4{
    top: 16%;
    transform: translateY(-50%);
}
.center-x4{
    left: 44%;
    right: 0;
    margin: 0 auto;
}
.center-y5{
    top: 1%;
    transform: translateY(-50%);
}
.center-x5{
    left: 14%;
    right: 0;
    margin: 0 auto;
}
@-webkit-keyframes pulsate
{
    0%
    {
        -webkit-transform: scale(.1, .1); opacity: .0;
    }
    50%
    {
        opacity: .5;
    }
    100%
    {
        -webkit-transform: scale(1.2, 1.2); opacity: .0;
    }
}