<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="row">
<div class="clearfix m10"></div>
<!-- SLIDER START-->
<div id="Container_Carousel">
<div class="rows">
   <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" >
      <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
          <div class="carousel-inner">
            <div class="item active">
             <img src="images/1.jpg" alt="First Slide">
            </div>
            <div class="item">
             <img src="images/2.jpg" alt="Second Slide">
            </div>
            <div class="item">
              <img src="images/3.jpg" alt="Third Slide">
            </div>            
             <div class="item">
             <img src="images/4.jpg" alt="Fourth Slide">
            </div>
             <div class="item">
             <img src="images/5.jpg" alt="Fifth Slider">
            </div>
          </div>
          <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-circle-arrow-left"></span>
          </a>
          <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
            <span class="glyphicon glyphicon-circle-arrow-right"></span>
          </a>
    </div>

   </div>
</div>
</div>
<!-- SLIDER END-->
</div>
#Container_Carousel .rows .col-xs-12 {
    margin: 0;
    padding: 0;
}

#Container_Carousel {
    margin: 0;
    padding: 0;
    width: 100%;
    max-height: 850px;
}

.item img {
    width: 100%;
    max-height: 850px;
}

.carousel,
.item,
.active {
    height: 100%;
}

.carousel-inner {
    height: 100%;
}

.carousel-control.left,
.carousel-control.right {
    background-image: none;
}

.glyphicon-circle-arrow-left {
    position: absolute;
    top: 50%;
    font-size: 50px;
    opacity: 0.5;
    left: 50px;
}

.glyphicon-circle-arrow-right {
    position: absolute;
    top: 50%;
    font-size: 50px;
    opacity: 0.5;
    right: 50px;
}

.m10 {
    margin: 10px auto;
}

We see you’re using an ad blocker.

Our website is made possible by displaying ads to our visitors.

Please help us continue to provide you with free. So please disabling your ad blocker.