Promotion banner under slide

TtanersenNov 6, 2021

When I scroll down the page, the background of the slide goes over the banner.

1-How can I make the background of the banner white without breaking the design?

2-I want to leave 10px space between the slide and the banner. Is it possible?

Banner Code:

<section id="content">
<div class="container clearfix">

<div class="row col-mb-50">

<div class="col-12">
<div class="promo shadow-sm p-4 p-md-5 border rounded-5">
<div class="row align-items-center">
<div class="col-12 col-lg">
<h3>*Hayra Vesile Olan,<br><span>Hayrı Yapan Gibidir.</span> (Hadis-i Şerif)</h3>
</div>
<div class="col-12 col-lg-auto mt-4 mt-lg-0">

Bağış Yap
</div>
</div>
</div>
</div>
</section>

Slayt Code: 
<section id="slider" class="slider-element slider-parallax swiper_wrapper min-vh-40 min-vh-md-75 include-header" data-autoplay="6000" data-speed="1200" data-loop="true" data-grab="false">
<div class="slider-inner">

		&lt;div class="swiper-container swiper-parent"&gt;
			&lt;div class="swiper-wrapper"&gt;
				&lt;div class="swiper-slide dark"&gt;
					&lt;div class="container"&gt;
						&lt;div class="slider-caption" style="margin-top: -50px;"&gt;
							&lt;div class="emphasis-title mb-0"&gt;
								&lt;h2 class="bottommargin fw-bold" style="max-width: 600px; color: #ffff; font-size: 40px; font-family: 'Montserrat'; line-height: 1.2;"&gt;Bir Talebe&lt;br /&gt;&lt;span style="color: #c29e61;"&gt;Bir İnsan..&lt;/span&gt;&lt;/h2&gt;
								&lt;p class="lead topmargin-sm d-none d-md-block" style="max-width: 600px; font-family: 'Poppins'; color: #ffffff; font-size: 18px;"&gt;Siz de bağış ve desteklerinizle, ilim yolundaki bu yolda hayra vesile olabilirsiniz.&lt;/p&gt;
								&lt;p class="lead topmargin-sm d-none d-md-block" style="max-width: 600px; font-family: 'Poppins'; color: #ffffff; font-size: 18px;"&gt;HEMEN İNCELE →&lt;/p&gt;
								&lt;div&gt;
								&lt;br&gt;
								&lt;/div&gt; 

							&lt;/div&gt;
						&lt;/div&gt;
					&lt;/div&gt;
					
					&lt;div class="slide-number font-primary"&gt;1&lt;/div&gt;
					&lt;div class="swiper-slide-bg" style="background: #009971 url('bisensei/img/slayt/slayt1-maarif-dernegi.jpg') no-repeat center right; background-size: auto 100%;"&gt;&lt;/div&gt;
					&lt;/div&gt;
				&lt;div class="swiper-slide"&gt;
					&lt;div class="container"&gt;
						&lt;div class="slider-caption" style="margin-top: -50px;"&gt;
							&lt;div class="emphasis-title mb-0"&gt;
								&lt;h2 class="bottommargin fw-bold" style="max-width: 600px; color: #ffff; font-size: 40px; font-family: 'Montserrat'; line-height: 1.2;"&gt;Bir Talebe&lt;br /&gt;&lt;span style="color: #c29e61;"&gt;Bir İnsan...&lt;/span&gt;&lt;/h2&gt;
								&lt;p class="lead topmargin-sm d-none d-md-block" style="max-width: 600px; font-family: 'Poppins'; color: #ffffff; font-size: 18px;"&gt;Bir talebenin eğitim ve yetişme ihtiyaçlarını üstlenerek, bir alim, bir hafız yetişmesine vesile olabilirsiniz.&lt;/p&gt;
								&lt;p class="lead topmargin-sm d-none d-md-block" style="max-width: 600px; font-family: 'Poppins'; color: #ffffff; font-size: 18px;"&gt;HEMEN İNCELE →&lt;/p&gt;
								&lt;div&gt;
								&lt;br&gt;
								&lt;/div&gt; 

							&lt;/div&gt;
						&lt;/div&gt;
					&lt;/div&gt;
					&lt;div class="slide-number font-primary"&gt;2&lt;/div&gt;
					&lt;div class="swiper-slide-bg" style="background: #009971 url('bisensei/img/slayt/slayt2-maarif-dernegi.jpg') no-repeat center right; background-size: auto 100%;"&gt;&lt;/div&gt;
					&lt;/div&gt;
				&lt;div class="swiper-slide"&gt;
					&lt;div class="container"&gt;
						&lt;div class="slider-caption" style="margin-top: -50px;"&gt;
							&lt;div class="emphasis-title mb-0"&gt;
								&lt;h2 class="bottommargin fw-bold" style="max-width: 600px; color: #009971; font-size: 40px; font-family: 'Montserrat'; line-height: 1.2;"&gt;Bir Talebe&lt;br /&gt;&lt;span style="color: #c29e61;"&gt;Bir İnsan..&lt;/span&gt;&lt;/h2&gt;
								&lt;p class="lead topmargin-sm d-none d-md-block" style="max-width: 600px; font-family: 'Poppins'; color: #09972; font-size: 18px;"&gt;Bir talebenin eğitim ve yetişme ihtiyaçlarını üstlenerek, bir alim, bir hafız yetişmesine vesile olabilirsiniz.&lt;/p&gt;
								&lt;p class="lead topmargin-sm d-none d-md-block" style="max-width: 600px; font-family: 'Poppins'; color: #000000; font-size: 18px;"&gt;HEMEN İNCELE →&lt;/p&gt;
								&lt;div&gt;
								&lt;br&gt;
								&lt;/div&gt; 

							&lt;/div&gt;
						&lt;/div&gt;
					&lt;/div&gt;
					&lt;div class="slide-number font-primary"&gt;3&lt;/div&gt;
					&lt;div class="swiper-slide-bg" style="background: #ffffff url('bisensei/img/slayt/slayt3-maarif-dernegi.jpg') no-repeat center right; background-size: auto 100%;"&gt;&lt;/div&gt;
				&lt;/div&gt;
				&lt;/div&gt;
			&lt;div class="slider-arrow-left"&gt;&lt;i class="icon-line-arrow-left"&gt;&lt;/i&gt;&lt;/div&gt;
			&lt;div class="slider-arrow-right"&gt;&lt;i class="icon-line-arrow-right"&gt;&lt;/i&gt;&lt;/div&gt;
		&lt;/div&gt;
	&lt;/section&gt;&lt;!-- #Slayt son --&gt;

TtanersenNov 6, 2021

Screenshot

SSemicolon WebSTAFFNov 6, 2021

Hello,

Can you please provide us with a Live URL so that we can check out the exact issue and provide you with more assistance on this. Thanks for your Patience.

Additionally:

To make the Banner White, simply add the .bg-white Class to the .promo Element.
Removing the .slider-parallax Class from the .slider-element DIV should fix this issue.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

TtanersenNov 7, 2021

Thank u, perfect support