I am using the Swiper slider, and am having issues changing the opacity of the h2 text and p text/caption. They are currently very "dim" and see through. I need them to a) change the color from light grey to white, and b) change the opacity so that they are less see-through, and easier to read against the background photo.
The code:
<section id="slider" class="slider-element slider-parallax swiper_wrapper full-screen clearfix">
<div class="swiper-container swiper-parent">
<div class="swiper-wrapper">
<div class="swiper-slide dark" style="background-image: url('images/slider/swiper/1.jpg');">
<div class="container clearfix">
<div class="slider-caption slider-caption-right text-right">
<h2 data-animate="fadeInUp">Our Wonderful Heading</h2>
<p class="d-none d-sm-block" data-animate="fadeInUp" data-delay="200">The text that we need to be less opaque is here.</p>
[Learn More](#)
</div>
</div>
</div>
</div>
<div class="slider-arrow-left"><i class="icon-angle-left"></i></div>
<div class="slider-arrow-right"><i class="icon-angle-right"></i></div>
<div class="slide-number"><div class="slide-number-current"></div><span>/</span><div class="slide-number-total"></div></div>
</div>
</section>When I view the page using developer tools, I see that the code is displaying as:
<div class="slider-caption slider-caption-right text-right" style="transform: translateY(-6px); opacity: 0.493844; top: 210px;">
<h2 data-animate="fadeInUp" class="fadeInUp animated">35 Years and Counting</h2>
<p class="d-none d-sm-block fadeInUp animated" data-animate="fadeInUp" data-delay="200">The Right Part ... Fast!</p>
Learn More
</div>
So the opacity: 0.493844 is my issue, but I can't figure out where to change it. Can you point me in the right direction?
Thank you.
