Old Template to New

I have one major sticking point in converting the templates. Every page of my site today uses a slider. it's hard coded on every page and has to be changed manually.

This is the code (with different image per page):
<!-- FULL SCREEN PHOTO
============================================= -->
<section id="slider" class="slider-element slider-parallax swiper_wrapper full-screen clearfix">
<div class="slider-parallax-inner">
<div class="swiper-container swiper-parent">
<div class="swiper-wrapper">
<div class="swiper-slide dark" >
<div class="clearfix">

							<div class="vertical-middle dark center">
								<div class="nobottommargin center">
									<h1>Main H1 Heading</h1>
									<span class="d-none d-md-block slider-sub-heading">Sub Heading</span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- END FULL SCREEN PHOTO
	============================================= -->

I want to be able to switch stylesheets for the website to the new one - without having to manually change this on 300+ pages first. So I tried adding the old slider css to the custom.css but that didn't work. Is there ANY POSSIBLE WAY TO GET THE OLD SLIDER CODE TO WORK with the new template without having to manually change them all to the new <!-- Page Title
============================================= --> Parallax I plan on using going forward. This is a massive expense and downtime for me so I'd really rather be able to move the sliders over to the new code over time and not all at once. Thanks.

/* ----------------------------------------------------------------
Slider - Brought in from old Style sheet (this did not work)
-----------------------------------------------------------------*/

.slider-element {
position: relative;
width: 100%;
overflow: hidden;
}

.slider-parallax { position: relative; }

.slider-parallax,
.slider-parallax .swiper-container {
visibility: visible;
-webkit-backface-visibility: hidden;
}

.slider-parallax .slider-parallax-inner {
position: fixed;
width: 100%;
height: 100%;
}

.device-touch .slider-parallax .slider-parallax-inner { position: relative; }

body:not(.side-header) .slider-parallax .slider-parallax-inner { left: 0; }

body:not(.stretched) .slider-parallax .slider-parallax-inner { left: auto; }

#header.transparent-header + .slider-parallax .slider-parallax-inner { top: 0; }

.slider-parallax .slider-parallax-inner,
.slider-parallax .slider-caption {
will-change: transform;
-webkit-transform: translate3d(0,0,0);
-webkit-transition: transform 0s linear;
-webkit-backface-visibility: hidden;
}

Awful. It just makes it so so so much harder, longer and more expensive. And there is no one who can work WITH me to help.

Is there any easy "search and replace" from the old code that will make it work with the new code? Can any pieces of the above code be automated by search and replace to work with the new theme?