@keyframes hover {
    0% { transform: translateY(0) }
    50% { transform: translateY(15px) }
    100% { transform: translateY(0) }
}

@keyframes hover-shadow {
    0% { filter: blur(0.9rem) }
    50% { filter: blur(0.3rem) }
    100% { filter: blur(0.9rem); }
}

#iphone-mockup-amex-app {
    animation: hover 3s infinite;
}

@media only screen and (max-width: 400px) {
    .btn {
        max-width: 100% !important;
    }
}

#shadow {
    display: inline-block;
    width: 45%;
    height: 16px;
    background-color: #b5b5b5;
    border-radius: 50%;
    transform: scaleX(1.5);
    filter: blur(0.3rem);
    animation: hover-shadow 3s infinite;
    margin: 50px 0 0 120px;
}

.screen-frame {
    background-position: center 45px;
    background-size: 90%;
    background-repeat: no-repeat;
    border-radius: 65px;
}
.screen-frame .header-mask {
    position: absolute;
    width: 89%;
    height: 28px;
    top: 17px;
    left: 50%;
    transform: translateX(-50%);
    border-top-left-radius: 42px;
    border-top-right-radius: 42px;
    background-image: url("/website-assets/images/mobile-app/apple-iphone13-frame.png");
    background-color: #fff;
    background-size: 113%;
    background-position: center -17px;

}
.screen-frame img {
    width: 100%;
}