<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div class="banner slider">
<div id="demo" class="carousel slide" data-ride="carousel" data-interval="false">
<ul class="carousel-indicators">
<li data-target="#demo" data-slide-to="0" class="active"></li>
<li data-target="#demo" data-slide-to="1"></li>
<li data-target="#demo" data-slide-to="2"></li>
</ul>
<div class="carousel-caption">
<div class="col-md-6">
<div class="row">
<div class="col-md-12 d-none d-md-block ">
<h1>Support</h1>
<h1>Children Education</h1>
<p>helps us </p>
</div>
</div>
</div>
</div>
<div class="carousel-inner d-none d-md-block ">
<div class="carousel-item active">
<img src="https://helpocharity.artureanec.com/img/xintro-footer.jpg.pagespeed.ic.DGbwLI9hvo.webp">
</div>
<div class="carousel-item">
<img src="https://m4x8j2y2.stackpathcdn.com/wp-content/uploads/2020/03/volunteer-2-1536x844.png">
</div>
<div class="carousel-item">
