.highlight-wrapper {
    position: relative;
    width: 100%;
    clear: both;
}
.highlight-wrapper::after {
    content: " ";
    display: block;
    clear: both;
    overflow: hidden;
}
.highlight-wrap {
    background: #fff;
    padding: 20px;
    position: relative;
    z-index: 2;
    width: 50%;
}
.highlight-content {
    border: 2px solid rgba(20, 66, 76, .4);
    padding: 50px 40px;
}
.highlight-wrapper figure {
    width: 65%;
    position: relative;
    margin: -15% -10% 0 0;
    opacity: 0;
    float: right;
}
.highlight-wrapper.inview figure {
    animation: figureflyright 2s forwards;
}
.highlight-wrapper figure img {
    width: 100%;
    height: auto;
}
@keyframes figureflyright {
    from {
        margin: -15% -10% -10% 0;
        opacity: 0;
    }  
    to {
        margin: -25% 0 0 0;
        opacity: 1;
    }
}

/* RESPONSIVE */
    @media all and (max-width: 1200px) {
        @keyframes figureflyright {
            to {
                margin: -35% 0 0 0;
                opacity: 1;
            }
        }
    }
    @media all and (max-width: 1100px) {
        .highlight-wrap {
            width: 65%;
        }
    }
    @media all and (max-width: 1000px) {
        .highlight-wrap {
            width: 100%;
        }
        .highlight-wrapper figure {
            width: 100%;
        }
        @keyframes figureflyright {
            to {
                margin: 50px 0 0 0;
                opacity: 1;
            }
        }
    }