Untitled

<!DOCTYPE html>
<html lang=nl>
    <head>
        <meta charset=utf-8/>
        <!--css toevoegen-->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="../css/main.css"/>
        <link href="../css/mdb.min.css" rel="stylesheet">
        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css">
        <title>Australian Labradoodle Producten</title>
    </head>
    <body>
    <ul class="nav justify-content-center">
        <li class="nav-item">
            <a class="nav-link menu" href="../home.php">Home</a>
        </li>
        <li class="nav-item">
            <a class="nav-link menu" href="../producten.php">Producten</a>
        </li>
        <li class="nav-item">
            <a class="nav-link menu" href="../info.php">Info</a>
        </li>
        <li class="nav-item">
            <a class="nav-link menu" href="../contact.php">Contact</a>
        </li>
        <li class="nav-item">
            <a class="nav-link menu" href="../winkelwagentje.php">Winkelwagentje</a>
        </li>
    </ul>
    <div class="container mt-5 pt-3">

        <!--Section: Product detail -->
        <section id="productDetails" class="pb-5">

            <!--News card-->
            <div class="card mt-5 hoverable">
                <div class="row mt-5">
                    <div class="col-lg-6">

                        <!--Carousel Wrapper-->
                        <div id="carousel-thumb" class="carousel slide carousel-fade carousel-thumbnails"
                             data-ride="carousel">

                            <!--Slides-->
                            <div class="carousel-inner text-center text-md-left" role="listbox">
                                <div class="carousel-item active">
                                    <img src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Products/17.jpg"
                                         alt="First slide" class="img-fluid">
                                </div>
                                <div class="carousel-item">
                                    <img src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Products/18.jpg"
                                         alt="Second slide" class="img-fluid">
                                </div>
                                <div class="carousel-item">
                                    <img src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Products/19.jpg"
                                         alt="Third slide" class="img-fluid">
                                </div>
                            </div>
                            <!--/.Slides-->

                            <!--Thumbnails-->
                            <a class="carousel-control-prev" href="#carousel-thumb" role="button" data-slide="prev">
                                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                <span class="sr-only">Previous</span>
                            </a>
                            <a class="carousel-control-next" href="#carousel-thumb" role="button" data-slide="next">
                                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                <span class="sr-only">Next</span>
                            </a>
                            <!--/.Thumbnails-->

                        </div>
                        <!--/.Carousel Wrapper-->
                    </div>
                    <div class="col-lg-5 mr-3 text-center text-md-left">
                        <h2 class="h2-responsive text-center text-md-left product-name font-weight-bold dark-grey-text mb-1 ml-xl-0 ml-4 producttitel">
                            <strong class="productnaam">Productnaam</strong><strong class="prijs">€49</strong>

                        </h2>
                        <h3 class="h3-responsive text-center text-md-left mb-5 ml-xl-0 ml-4">
                          <span class="text font-weight-bold">
                          </span>
                        </h3>
                        </br>
                        </br>
                        <!--Accordion wrapper-->
                        <div class="accordion md-accordion tekstentitel" id="accordionEx" role="tablist" aria-multiselectable="true">

                            <!-- Accordion card -->
                            <div class="card">

                                <!-- Card header -->
                                <div class="card-header" role="tab" id="headingOne1">
                                    <a data-toggle="collapse" data-parent="#accordionEx" href="#collapseOne1"
                                       aria-expanded="true" aria-controls="collapseOne1">
                                        <h5 class="mb-0">
                                            Beschrijving:
                                        </h5>
                                    </a>
                                </div>

                                <!-- Card body -->
                                <div id="collapseOne1" class="collapse show" role="tabpanel" aria-labelledby="headingOne1"
                                     data-parent="#accordionEx">
                                    <div class="card-body">
                                        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry
                                        richardson ad squid. 3 wolf moon officia aute,
                                        non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
                                        Brunch 3 wolf moon
                                        tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda
                                        shoreditch et.
                                    </div>
                                </div>
                            </div>
                            <form>
                            <div class="form-group">
                                <label for="exampleFormControlSelect1">Example select</label>
                                <select class="form-control" id="exampleFormControlSelect1">
                                    <option>1</option>
                                    <option>2</option>
                                    <option>3</option>
                                    <option>4</option>
                                    <option>5</option>
                                </select>
                            </div>
                            </form>
                            <div class="row winkelwagenknop">
                                <div class="col-md-12">
                                    <button type="submit" class="btn main-btn pull-right knop">Toevoegen aan winkelwagentje <i class="fas fa-shopping-cart"></i></button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        </section>
    </body>
</html>