Separate Sliders for Mobile and Desktop Ascend

Instead of just adding this in the shortcode box:

[kadence_slider_pro id="2"]

You can add like this:

<div class="my-desktop-slider">[kadence_slider_pro id="2"]</div>
<div class="my-mobile-slider">[kadence_slider_pro id="3"]</div>

 
This is assuming id=”3″ is the mobile for 2 you would just change that to whatever it needs to be.
 
Then you would add this CSS in your theme options custom CSS:

.my-mobile-slider {
display:none;
}
@media (max-width: 768px) {
.my-desktop-slider {
display:none;
}
.my-mobile-slider {
display:block;
}
}