@extends('layouts.contentLayoutMaster')
{{-- page title --}}
@section('title','Basic Card')

@section('content')
<div class="alert bg-rgba-primary">
  <i class="bx bx-info-circle mr-1 align-middle"></i>
  <span class="align-middle">
    Click <a href="https://getbootstrap.com/docs/4.3/components/card/" target="_blank"><u>here</u></a>
    for more info on cards.
  </span>
</div>
<!-- Basic card section start -->
<section id="content-types">
  <div class="row">
    <div class="col-xl-4 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <div class="card-body">
            <h4 class="card-title">Card With Header And Footer</h4>
            <p class="card-text">
              Gummies bonbon apple pie fruitcake icing biscuit apple pie jelly-o sweet roll. Toffee
              sugar plum sugar plum jelly-o jujubes bonbon dessert carrot cake.
            </p>
          </div>
          <img class="img-fluid" src="{{asset('images/slider/11.png')}}" alt="Card image cap">
        </div>
        <div class="card-footer d-flex justify-content-between">
          <span>Card Footer</span>
          <button class="btn btn-light-primary">Read More</button>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <img src="{{asset('images/slider/10.png')}}" class="card-img-top img-fluid" alt="singleminded">
          <div class="card-body">
            <h5 class="card-title">Be Single Minded</h5>
            <p class="card-text">
              Chocolate sesame snaps apple pie danish cupcake sweet roll jujubes tiramisu.Gummies
              bonbon apple pie fruitcake icing biscuit apple pie jelly-o sweet roll.
            </p>
          </div>
        </div>
        <ul class="list-group list-group-flush">
          <li class="list-group-item">Cras justo odio</li>
          <li class="list-group-item">Dapibus ac facilisis in</li>
          <li class="list-group-item">Vestibulum at eros</li>
        </ul>
      </div>
    </div>
    <div class="col-xl-4 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <div class="card-body">
            <h4 class="card-title">Carousel</h4>
            <h6 class="card-subtitle">Support card subtitle</h6>
          </div>
          <div id="carousel-example-card" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
              <li data-target="#carousel-example-card" data-slide-to="0" class="active"></li>
              <li data-target="#carousel-example-card" data-slide-to="1"></li>
              <li data-target="#carousel-example-card" data-slide-to="2"></li>
            </ol>
            <div class="carousel-inner rounded-0" role="listbox">
              <div class="carousel-item active">
                <img src="{{asset('images/slider/01.jpg')}}" class="d-block w-100" alt="First slide">
              </div>
              <div class="carousel-item">
                <img src="{{asset('images/slider/02.jpg')}}" class="d-block w-100" alt="Second slide">
              </div>
              <div class="carousel-item">
                <img src="{{asset('images/slider/03.jpg')}}" class="d-block w-100" alt="Third slide">
              </div>
            </div>
            <a class="carousel-control-prev" href="#carousel-example-card" role="button" data-slide="prev">
              <span class="bx bx-chevron-left icon-prev" aria-hidden="true"></span>
              <span class="sr-only">Previous</span>
            </a>
            <a class="carousel-control-next" href="#carousel-example-card" role="button" data-slide="next">
              <span class="bx bx-chevron-right icon-next" aria-hidden="true"></span>
              <span class="sr-only">Next</span>
            </a>
          </div>
          <div class="card-body">
            <p class="card-text">
              Lorem ipsum dolor sit amet consectetur adipisicing elit. Sunt assumenda mollitia
              officia dolorum eius quasi.Chocolate sesame snaps apple pie danish cupcake sweet roll jujubes tiramisu.
            </p>
            <p class="card-text">
              Gummies bonbon apple pie fruitcake icing biscuit apple pie jelly-o sweet roll. Toffee sugar plum sugar
              plum jelly-o jujubes bonbon dessert carrot cake.
              Sweet pie candy jelly. Sesame snaps biscuit sugar plum. Sweet roll topping fruitcake. Caramels liquorice
              biscuit ice cream fruitcake cotton candy tart.
            </p>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-md-6 col-sm-12">
      <div class="card collapse-icon accordion-icon-rotate">
        <div class="card-header">
          <h1 class="card-title pl-1">Accordion</h1>
        </div>
        <div class="card-content">
          <div class="card-body">
            <div class="accordion" id="cardAccordion">
              <div class="card">
                <div class="card-header" id="headingOne" data-toggle="collapse" data-target="#collapseOne"
                  aria-expanded="false" aria-controls="collapseOne" role="button">
                  <span class="collapsed collapse-title">Accordion Item 1</span>
                </div>
                <div id="collapseOne" class="collapse pt-1" aria-labelledby="headingOne" data-parent="#cardAccordion">
                  <div class="card-body">
                    Cheesecake muffin cupcake dragée lemon drops tiramisu cake gummies chocolate cake. Marshmallow tart
                    croissant. Tart dessert tiramisu marzipan lollipop lemon drops.
                  </div>
                </div>
              </div>
              <div class="card collapse-header">
                <div class="card-header" id="headingTwo" data-toggle="collapse" data-target="#collapseTwo"
                  aria-expanded="false" aria-controls="collapseTwo" role="button">
                  <span class="collapsed collapse-title">Accordion Item 2</span>
                </div>
                <div id="collapseTwo" class="collapse pt-1" aria-labelledby="headingTwo" data-parent="#cardAccordion">
                  <div class="card-body">
                    Pastry pudding cookie toffee bonbon jujubes jujubes powder topping. Jelly beans gummi bears sweet
                    roll bonbon muffin liquorice. Wafer lollipop sesame snaps.
                  </div>
                </div>
              </div>
              <div class="card open">
                <div class="card-header" id="headingThree" data-toggle="collapse" data-target="#collapseThree"
                  aria-expanded="true" aria-controls="collapseThree" role="button">
                  <span class="collapsed collapse-title">Accordion Item 3</span>
                </div>
                <div id="collapseThree" class="collapse show pt-1" aria-labelledby="headingThree"
                  data-parent="#cardAccordion">
                  <div class="card-body">
                    Sweet pie candy jelly. Sesame snaps biscuit sugar plum. Sweet roll topping fruitcake. Caramels
                    liquorice biscuit ice cream fruitcake cotton candy tart.
                  </div>
                </div>
              </div>
              <div class="card">
                <div class="card-header" id="headingFour" data-toggle="collapse" data-target="#collapseFour"
                  aria-expanded="false" aria-controls="collapseFour" role="button">
                  <span class="collapsed  collapse-title">Accordion Item 4</span>
                </div>
                <div id="collapseFour" class="collapse pt-1" aria-labelledby="headingFour" data-parent="#cardAccordion">
                  <div class="card-body">
                    Sweet pie candy jelly. Sesame snaps biscuit sugar plum. Sweet roll topping fruitcake. Caramels
                    liquorice biscuit ice cream fruitcake cotton candy tart.
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <div class="card-body">
            <h4 class="card-title mb-0">Video Card</h4>
          </div>
          <div class="embed-responsive embed-responsive-item embed-responsive-16by9">
            <iframe src="https://www.youtube.com/embed/1La4QzGeaaQ" allowfullscreen></iframe>
          </div>
          <div class="card-body">
            <p class="card-text">
              Candy cupcake sugar plum oat cake wafer marzipan jujubes.
              Jelly-o sesame snaps cheesecake topping. Cupcake fruitcake macaroon donut pastry gummies tiramisu
              chocolate bar muffin.
            </p>
            <a href="#" class="card-link">Card link</a>
            <a href="#" class="card-link">Another link</a>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <div class="card-body">
            <h4 class="card-title">Feedback Form</h4>
            <p class="card-text">
              Gummies bonbon apple pie fruitcake icing biscuit apple pie jelly-o sweet roll. Toffee sugar plum sugar
              plum jelly-o jujubes bonbon dessert carrot cake.
            </p>
            <form class="form">
              <div class="form-body">
                <div class="form-group">
                  <label for="feedback1" class="sr-only">Name</label>
                  <input type="text" id="feedback1" class="form-control" placeholder="Name" name="name">
                </div>
                <div class="form-group">
                  <label for="feedback4" class="sr-only">Last Game</label>
                  <input type="text" id="feedback4" class="form-control" placeholder="Last Name" name="LastName">
                </div>
                <div class="form-group">
                  <label for="feedback2" class="sr-only">Email</label>
                  <input type="email" id="feedback2" class="form-control" placeholder="Email" name="email">
                </div>
                <div class="form-group">
                  <select name="reason" class="form-control">
                    <option value="Inquiry">Inquiry</option>
                    <option value="Complain">complaints</option>
                    <option value="Quotation">Quotation</option>
                  </select>
                </div>
                <div class="form-group form-label-group">
                  <textarea class="form-control" id="label-textarea" rows="3" placeholder="Suggestion"></textarea>
                  <label for="label-textarea"></label>
                </div>
              </div>
              <div class="form-actions d-flex justify-content-end">
                <button type="submit" class="btn btn-primary mr-1">Submit</button>
                <button type="reset" class="btn btn-light-primary">Cancel</button>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
    <div class="col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <img class="card-img-top img-fluid" src="{{asset('images/slider/05.jpg')}}" alt="Card image cap" />
          <div class="card-body">
            <h4 class="card-title">Top Image Cap</h4>
            <p class="card-text">
              Jelly-o sesame snaps cheesecake topping. Cupcake fruitcake macaroon donut
              pastry gummies tiramisu chocolate bar muffin. Dessert bonbon caramels brownie chocolate bar
              chocolate tart dragée.
            </p>
            <p class="card-text">
              Cupcake fruitcake macaroon donut pastry gummies tiramisu chocolate bar muffin.
            </p>
            <button class="btn btn-primary block">Update now</button>
          </div>
        </div>
      </div>
    </div>
    <div class="col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <div class="card-body">
            <h4 class="card-title">Bottom Image Cap</h4>
            <p class="card-text">
              Jelly-o sesame snaps cheesecake topping. Cupcake fruitcake macaroon donut
              pastry gummies tiramisu chocolate bar muffin. Dessert bonbon caramels brownie chocolate bar
              chocolate tart dragée.
            </p>
            <p class="card-text">
              Cupcake fruitcake macaroon donut pastry gummies tiramisu chocolate bar
              muffin.
            </p>
            <small class="text-muted">Last updated 3 mins ago</small>
          </div>
          <img class="card-img-bottom img-fluid" src="{{asset('images/slider/06.jpg')}}" alt="Card image cap">
        </div>
      </div>
    </div>
  </div>
</section>
<!-- Basic Card types section end -->

<!-- Card Captions and Overlay section start -->
<section id="card-caps">
  <div class="row">
    <div class="col-xl-3 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <img class="card-img img-fluid" src="{{asset('images/slider/08.jpg')}}" alt="Card image">
          <div class="card-img-overlay overlay-success d-flex justify-content-between flex-column">
            <div class="overlay-content">
              <p class="card-text text-ellipsis">
                Sugar plum tiramisu sweet. Cake jelly marshmallow cotton candy chupa
                chups.
              </p>
            </div>
            <div class="overlay-status">
              <p class="mb-25"><small>Last updated 3 mins ago</small></p>
              <a href="#" class="btn btn-success">Check More </a>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-3 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <img class="card-img img-fluid" src="{{asset('images/slider/07.jpg')}}" alt="Card image">
          <div class="card-img-overlay overlay-dark bg-overlay d-flex justify-content-between flex-column">
            <div class="overlay-content">
              <h4 class="card-title mb-50">Online Messages</h4>
              <p class="card-text text-ellipsis">
                Sugar plum tiramisu sweet. Cake jelly marshmallow cotton candy chupa
                chups.
              </p>
            </div>
            <div class="overlay-status">
              <p class="mb-25"><small>Last updated 3 mins ago</small></p>
              <a href="#" class="white">Check More </a>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-3 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <img class="card-img img-fluid" src="{{asset('images/slider/08.jpg')}}" alt="Card image">
          <div class="card-img-overlay overlay-dark d-flex justify-content-between flex-column">
            <div class="overlay-content">
              <p class="card-text text-ellipsis">
                Sugar plum tiramisu sweet. Cake jelly marshmallow cotton candy chupa
                chups.
              </p>
            </div>
            <div class="overlay-status">
              <p class="mb-25"><small>Last updated 3 mins ago</small></p>
              <a href="#" class="btn btn-outline-info">Check More</a>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-3 col-md-6 col-sm-12">
      <div class="card">
        <div class="card-content">
          <img class="card-img img-fluid" src="{{asset('images/slider/07.jpg')}}" alt="Card image">
          <div class="card-img-overlay overlay-warning d-flex justify-content-between flex-column">
            <div class="overlay-content">
              <h4 class="card-title mb-50">Image Overlay</h4>
              <p class="card-text text-ellipsis">
                Sugar plum tiramisu sweet. Cake jelly marshmallow cotton candy chupa
                chups.
              </p>
            </div>
            <div class="overlay-status">
              <p class="mb-25"><small>Last updated 3 mins ago</small></p>
              <a href="#" class="white">Check More </a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- Card Captions and Overlay section end -->

<!-- Background variants section start -->
<section id="bg-variants">
  <div class="row">
    <div class="col-12 mt-3 mb-1">
      <h4 class="text-uppercase">Background variants</h4>
    </div>
  </div>
  <div class="row">
    <div class="col-xl-4 col-sm-6 col-12">
      <div class="card">
        <div class="card-content">
          <div class="row no-gutters">
            <div class="col-md-12 col-lg-4">
              <img src="{{asset('images/banner/banner-35.jpg')}}" alt="element 01"
                class="h-100 w-100 rounded-left">
            </div>
            <div class="col-md-12 col-lg-8">
              <div class="card-body">
                <p class="card-text text-ellipsis">
                  Tiramisu dessert gingerbread topping tiramisu tart bonbon. Powder
                  cotton candy sweet roll sugar plum donut jelly-o donut chocolate.
                </p>
                <span><i class="bx bx-heart font-size-large align-middle mr-50"></i> 1 ARTICLE</span>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-sm-6 col-12">
      <div class="card bg-primary bg-lighten-1">
        <div class="card-content">
          <div class="row no-gutters">
            <div class="col-lg-4 col-md-12 d-flex align-items-center justify-content-center p-1">
              <img src="{{asset('images/elements/apple-lap.png')}}" class="card-img img-fluid"
                alt="apple-lap.png">
            </div>
            <div class="col-lg-8 col-md-12">
              <div class="card-body text-center">
                <h4 class="card-title white">New Arrival</h4>
                <p class="card-text white">Mac Book.</p>
                <button class="btn btn-secondary">Buy Now</button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-sm-6 col-12">
      <div class="card">
        <div class="card-content">
          <div class="row no-gutters">
            <div class="col-lg-8 col-12">
              <div class="card-body">
                <p class="card-text text-ellipsis">
                  Tiramisu dessert gingerbread topping tiramisu tart bonbon. Powder
                  cotton candy sweet roll sugar plum donut.
                </p>
                <button class="btn btn-info">View More</button>
              </div>
            </div>
            <div class="col-lg-4 col-12">
              <img src="{{asset('images/banner/banner-30.jpg')}}" alt="element 01"
                class="h-100 w-100 rounded-right">
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-sm-6 col-12">
      <div class="card text-center bg-secondary bg-lighten-1">
        <div class="card-content text-white">
          <div class="card-body">
            <img src="{{asset('images/elements/amazon-speaker.png')}}" alt="element 05" class="mb-1 w-100"
              height="200">
            <h4 class="card-title white">Storage Device</h4>
            <p class="card-text">945 items</p>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-sm-6 col-12">
      <div class="card text-center">
        <div class="card-content">
          <div class="card-body">
            <img src="{{asset('images/elements/beats-headphones.png')}}" alt="element 02" class="mb-1">
            <h3 class="card-title">Ceramic Bottle</h3>
            <p class="card-text">456 items</p>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-4 col-sm-6 col-12">
      <div class="card text-center bg-danger bg-lighten-2">
        <div class="card-content d-flex">
          <div class="card-body">
            <img src="{{asset('images/elements/ipad-pro.png')}}" alt="element 06" height="150" class="mb-1">
            <h4 class="card-title white">New Arrival</h4>
            <p class="card-text white">Donut toffee candy brownie.</p>
            <button class="btn btn-danger white">Buy Now</button>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- Background variants section end -->

<!-- Groups section start -->
<section id="groups">
  <div class="row match-height">
    <div class="col-12 mt-3 mb-1">
      <h4 class="text-uppercase">Groups</h4>
    </div>
  </div>
  <div class="row match-height">
    <div class="col-12">
      <div class="card-group">
        <div class="card">
          <div class="card-content">
            <img class="card-img-top img-fluid" src="{{asset('images/pages/content-img-3.jpg')}}"
              alt="Card image cap">
            <div class="card-body">
              <h4 class="card-title">Card title</h4>
              <p class="card-text">
                This card has supporting text below as a natural lead-in to additional
                content.</p>
              <small class="text-muted">Last updated 3 mins ago</small>
            </div>
          </div>
        </div>
        <div class="card">
          <div class="card-content">
            <img class="card-img-top img-fluid" src="{{asset('images/pages/content-img-2.jpg')}}"
              alt="Card image cap" />
            <div class="card-body">
              <h4 class="card-title">Card title</h4>
              <p class="card-text">
                This card has supporting text below as a natural lead-in to additional
                content.
              </p>
              <small class="text-muted">Last updated 3 mins ago</small>
            </div>
          </div>
        </div>
        <div class="card">
          <div class="card-content">
            <img class="card-img-top img-fluid" src="{{asset('images/pages/content-img-4.jpg')}}"
              alt="Card image cap">
            <div class="card-body">
              <h4 class="card-title">Card title</h4>
              <p class="card-text">
                This card has supporting text below as a natural lead-in to additional
                content.
              </p>
              <small class="text-muted">Last updated 3 mins ago</small>
            </div>
          </div>
        </div>
        <div class="card">
          <div class="card-content">
            <img class="card-img-top img-fluid" src="{{asset('images/pages/content-img-1.jpg')}}"
              alt="Card image cap">
            <div class="card-body">
              <h4 class="card-title">Card title</h4>
              <p class="card-text">
                This card has supporting text below as a natural lead-in to additional
                content.
              </p>
              <small class="text-muted">Last updated 3 mins ago</small>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- Groups section end -->

<!-- Decks section start -->
<section id="decks">
  <div class="row match-height">
    <div class="col-12 mt-3 mb-1">
      <h4 class="text-uppercase">Decks</h4>
    </div>
  </div>
  <div class="row match-height">
    <div class="col-12">
      <div class="card-deck-wrapper">
        <div class="card-deck">
          <div class="row no-gutters">
            <div class="col-md-3 col-sm-6 mb-sm-1">
              <div class="card">
                <div class="card-content">
                  <img class="card-img-top img-fluid" src="{{asset('images/slider/01.jpg')}}"
                    alt="Card image cap" />
                  <div class="card-body">
                    <h4 class="card-title">Card title</h4>
                    <p class="card-text">
                      This card has supporting text below as a natural lead-in to
                      additional content.
                    </p>
                    <small class="text-muted">Last updated 3 mins ago</small>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-md-3 col-sm-6 mb-sm-1">
              <div class="card">
                <div class="card-content">
                  <img class="card-img-top img-fluid" src="{{asset('images/slider/04.jpg')}}"
                    alt="Card image cap" />
                  <div class="card-body">
                    <h4 class="card-title">Card title</h4>
                    <p class="card-text">
                      This card has supporting text below as a natural lead-in to
                      additional content.
                    </p>
                    <small class="text-muted">Last updated 3 mins ago</small>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-md-3 col-sm-6">
              <div class="card">
                <div class="card-content">
                  <img class="card-img-top img-fluid" src="{{asset('images/slider/05.jpg')}}"
                    alt="Card image cap" />
                  <div class="card-body">
                    <h4 class="card-title">Card title</h4>
                    <p class="card-text">
                      This card has supporting text below as a natural lead-in to
                      additional content.</p>
                    <small class="text-muted">Last updated 3 mins ago</small>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-md-3 col-sm-6">
              <div class="card">
                <div class="card-content">
                  <img class="card-img-top img-fluid" src="{{asset('images/slider/06.jpg')}}"
                    alt="Card image cap" />
                  <div class="card-body">
                    <h4 class="card-title">Card title</h4>
                    <p class="card-text">
                      This card has supporting text below as a natural lead-in to
                      additional content.</p>
                    <small class="text-muted">Last updated 3 mins ago</small>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- Decks section end -->

<!-- Columns section start -->
<section id="columns">
  <div class="row">
    <div class="col-12 mt-3 mb-1">
      <h4 class="text-uppercase">Columns</h4>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12 mt-1">
      <div class="card-columns">
        <div class="card">
          <div class="card-content">
            <img class="card-img-top img-fluid" src="{{asset('images/slider/09.png')}}" alt="Card image cap">
            <div class="card-body">
              <h4 class="card-title">Card title</h4>
              <p class="card-text">
                Some quick example text to build on the card title and make up the bulk
                of the card's content.
              </p>
              <a href="#" class="btn btn-outline-primary">Go somewhere</a>
            </div>
          </div>
        </div>
        <div class="card bg-primary text-center">
          <div class="card-content">
            <div class="card-body">
              <img src="{{asset('images/elements/iphone-x.png')}}" alt="element 05" width="150"
                class="mb-1 img-fluid">
              <h4 class="card-title text-white">Storage Device</h4>
              <p class="card-text text-white">945 items</p>
            </div>
          </div>
        </div>
        <div class="card text-white bg-danger bg-lighten-1 text-center">
          <div class="card-content">
            <div class="card-body">
              <img src="{{asset('images/elements/ipad-pro.png')}}" alt="element 02" width="120"
                class="mb-1 img-fluid">
              <h3 class="card-title text-white">Ceramic Bottle</h3>
              <p class="card-text">456 items</p>
            </div>
          </div>
        </div>
        <div class="card">
          <div class="card-content">
            <div class="card-body">
              <h4 class="card-title">Bottom Image Cap</h4>
              <p class="card-text">
                Jelly-o sesame snaps cheesecake topping. Cupcake fruitcake macaroon
                donut pastry gummies tiramisu chocolate bar muffin. Dessert bonbon caramels brownie
                chocolate bar chocolate tart dragée.
              </p>
              <p class="card-text">
                Cupcake fruitcake macaroon donut pastry gummies tiramisu chocolate bar
                muffin.
              </p>
              <small class="text-muted">Last updated 3 mins ago</small>
            </div>
            <img class="card-img-bottom img-fluid" src="{{asset('images/slider/04.jpg')}}" alt="Card image cap">
          </div>
        </div>
        <div class="card text-white">
          <div class="card-content">
            <img class="card-img img-fluid" src="{{asset('images/slider/03.jpg')}}" alt="Card image">
            <div class="card-img-overlay overlay-warning">
              <h4 class="card-title white mb-50">Overlay Card</h4>
              <p class="card-text text-ellipsis">
                Sugar plum tiramisu sweet. Cake jelly marshmallow cotton candy chupa
                chups carrot cake topping chupa chups.
              </p>
              <small>Last updated 3 mins ago</small>
            </div>
          </div>
        </div>
        <div class="card border-info text-center bg-transparent">
          <div class="card-content">
            <div class="card-body">
              <div class="row">
                <div class="col-md-6 col-sm-12 mb-50 d-flex justify-content-center">
                  <img src="{{asset('images/elements/macbook-pro.png')}}" alt="element 04" width="150"
                    class="float-left mt-1 img-fluid">
                </div>
                <div class="col-md-6 col-sm-12 d-flex justify-content-center flex-column">
                  <h4>
                    <span class="badge badge-light-info">New Arrival</span>
                  </h4>
                  <p class="card-text">Mac Book.</p>
                </div>
              </div>
              <button class="btn btn-info mt-50">Buy Now</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<!-- Columns section end -->   
@endsection