html, body {
    margin: 0; padding: 0;
}

#banner {
    width: 300px;
    height: 250px;
    cursor: pointer;
    position: absolute;
    overflow: hidden;
}

#banner
.section-container {
    background: #fff;
}

.ff-img {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 300px;
    height: 250px;
    opacity: 0;
}

#f2_phone {
    transform-origin: 68px 62px 0;
    z-index: 5;
}

.border { background: #acacac; position: absolute; z-index: 10;}
.border.top, .border.bottom, .border.left { left: 0; }
.border.top, .border.bottom, .border.right { right: 0; }
.border.left, .border.right, .border.top { top: 0; }
.border.left, .border.right, .border.bottom { bottom: 0; }
.border.top, .border.bottom { height: 1px; }
.border.left, .border.right { width: 1px; }

.showing {
    opacity: 1;
}

.btn {
    background-color: #003778;
    -webkit-transition: background-color 0.4s, border 0.4s;
    transition: background-color 0.4s, border 0.4s;
    cursor: pointer;
    border: 2px solid #003778;
    border-radius: 30px;
    position: absolute;
    top: 169.5px;
    left: 173px;
    width: 68.5px;
    height: 21px;
    opacity: 0;
}

#cta {
    transition: filter .3s;
    will-change: transform;
}
#banner:hover #cta {
    filter: hue-rotate(-31deg) saturate(2.9) brightness(1.1);
}