123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172 |
- <section>
- <div class="text-md-center text-light page-highlight" style="background-image: url(./assets/image/dbparticle2.png);">
- <div class="container-fluid p-0 m-0" data-aos="zoom-in" >
- <p class="db-h3 text-highlight">Venues</p>
- <p class="mx-auto p-0 about-paragraph db-h5">You can book venue and field to organize our matches according to you preferred date and time</p>
- </div>
- </div>
- </section>
- <section id="booking-section">
- <div class="text-light section-5">
- <div class="row g-0 booking-container text-center">
-
- <div class="col-12 position-relative px-3 mb-5">
- <select id="select-location" class="db-input" id="cars" name="cars">
- <option value="default" selected>Select City and State</option>
- </select>
- </div>
-
- <div id="field-location-container" class="container-fluid p-0 col-12 row text-center my-5">
- <p class="db-h5 text-highlight title">SELECT LOCATION</p>
- <div id="field-location-template" class="col-xl-4 position-relative p-0 p-lg-3 animate__animated animate__fadeIn" style="display: none;">
- <div class="position-relative location-item field-location-img">
- <div class="position-absolute d-flex flex-wrap field-details">
- <div class="mt-auto d-flex location-overlay"></div>
- </div>
- </div>
- </div>
- </div>
-
- <div id="field-container" class="container-fluid p-0 col-12 row my-5">
- <p class="db-h5 text-highlight">SELECT FIELD</p>
- <div id="field-template" class="col-xl-4 position-relative p-0 p-lg-3 animate__animated animate__fadeIn field-c" style="display: none;">
- <div class="position-relative field-item field-img">
- <div class="position-absolute d-flex flex-wrap field-details">
- <div class="mt-auto field-overlay text-start">
- <p class="text-highlight db-h5 fw-bold m-0 field-text"></p>
- <p class="p-0 m-0"><a class="text-light d-block article-details-href"> Book Now <span><i class="fa-solid fa-angle-right ps-3 text-db"></i></span></a></p>
- </div>
- </div>
- </div>
- </div>
- </div>
-
- <div class="row g-0">
- <div class="col-lg-5 my-4 my-lg-5 px-5 my-lg-0 position-relative">
- <input id="input-booking-date" class="db-input" type="date" id="start" name="trip-start" value="2018-07-22" min="2018-01-01" max="2018-12-31" />
- </div>
- <div class="col-lg-5 my-4 my-lg-5 px-5 my-lg-0 position-relative">
- <select id="input-booking-slot" class="db-input" id="cars" name="cars">
- <option selected>Select Available slot</option>
- </select>
- </div>
- <div class="col-lg-2 my-5 my-lg-0 d-flex">
- <a href="https://play.google.com/store/apps/details?id=club.thebola.app" target="_blank" class="nav-link db-btn mx-auto mt-auto" style="font-size: clamp(18px,1vw,23px);font-weight: 500;padding: 0.5rem 3rem;">Book Now</a>
- </div>
- </div>
-
- </div>
- </div>
- </section>
- <section>
- <div class="text-light section-8" style="background-image: url(./assets/image/dbparticle3.png);">
- <div data-aos="zoom-in" class="text-center ">
- <p class="db-h3 text-highlight" style="line-height: clamp(3rem,2.5vw,4rem);">Our Mobile Apps Is Coming Soon!</p>
- <p class="mx-auto p-0 db-h5 mb-5" style="line-height: clamp(1.7rem,2.5vw,3rem);">Soon all of the amazing features that we provide here will be available in<br/> an exclusive app for both android and iOS.</p>
- </div>
- <div class="container-fluid d-flex flex-wrap justify-content-center">
- <img data-aos="fade-up" data-aos-delay="100" class="mx-2" src="./assets/image/gplay.png" alt="google-play-img" style="width: 200px;">
- <img data-aos="fade-up" data-aos-delay="100" class="mx-2" src="./assets/image/appstore.png" alt="google-play-img" style="width: 200px;">
- </div>
- </div>
- </section>
|