.WhereAmI {

    position: absolute;
    left: 0;
    right: 500px;
    top: 200px;
    bottom: 0;

    margin: auto;

    width: 518px;
    height: 545px;

    background-image: url(../HelloJums/hELLOjUMS.png);

    animation-name: jumsMove;
    animation-duration: 10s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.WhereAmI {animation-direction: alternate-reverse;}
@keyframes jumsMove {
  0% {opacity: 0.4;}
  30% {opacity: 0.8;}
  70% {opacity: 0.6;}
  100% {opacity: 0.6;}
}

@media only screen and (max-width: 1300px) {

    .WhereAmI {

    position: absolute;
    left: 0;
    right: 300px;
    top: 90px;
    bottom: 0;

    margin: auto;

    width: 318px;
    height: 335px;

    background-image: url(../HelloJums/hELLOjUMS1300.png);
}

}

@media only screen and (max-width: 700px) {

    .WhereAmI {

    position: absolute;
    left: 0;
    right: 160px;
    top: 50px;
    bottom: 0;

    margin: auto;

    image-rendering: pixelated;

    width: 188px;
    height: 199px;

    background-image: url(../HelloJums/hELLOjUMS800.png);
}

}

@media only screen and (max-width: 400px) {

    .WhereAmI {

    position: absolute;
    left: 0;
    right: 100px;
    top: 20px;
    bottom: 0;

    margin: auto;

    image-rendering: pixelated;
    
    width: 150px;
    height: 159px;

    background-image: url(../HelloJums/hELLOjUMS400.png);
}

}