Problem with ms-thumb-frame-selected class in Master Slider

Seems you are simply overwriting #masterslider .ms-thumb-frame-selected with each loop. So in the end only the last iteration will take effect.

You maybe need to add the post ID as class somewhere as well and then target #masterslider .ms-thumb-frame-selected .post-<?php echo $post->ID; ?> { } in your CSS.

Adjust your markup inside The Loop to print the post ID as class on the same element/<div> you are targeting with #masterslider .ms-thumb-frame-selected. So that in the end you can use #masterslider .ms-thumb-frame-selected.my-post-id-class-<?php echo $post->ID; ?>.

So asuming your markup inside The Loop was:

<div id="masterslider">
    <div class=".ms-thumb-frame-selected">
        <!-- ... -->
    </div>
</div>

Now make it:

<div id="masterslider">
    <div class="ms-thumb-frame-selected post-<?php echo $post->ID; ?>">
        <!-- ... -->
    </div>
</div>

And your CSS should be:

#masterslider .ms-thumb-frame-selected.post-<?php echo $post->ID; ?> {
    background: linear-gradient( rgba(0, 0, 0, .8), rgba(0, 0, 0, .8)), url("<?php echo $url; ?>") no-repeat ;
    background-position: 100 0;
    background-size: cover;
    opacity: .8;
    transition: background .5s;
}