@extends('layout.app')

@section('content')
<!-- ==== Banner Breadcrumbs ==== -->
    <div  class="banner-bredcrumbs pt-70-fixed n4-bg position-relative overflow-hidden">
        <div class="container">
            <div class="breadcrumbs-content position-relative cus-z1 pt-120 pb-120 text-center">
                <span class="mb-xxl-8 mb-xl-6 mb-5 display-two nw1-clr" data-aos="zoom-in" data-aos-duration="2000">
                    Contest Details
                </span>
                <div class="box">
                    <ul class="bread d-flex justify-content-center align-items-center gap-2">
                        <li>
                            <a href="index.html" class="fs20 fw_600 nw1-clr">
                                Home
                            </a>
                        </li>
                        <li>
                            <i class="ph ph-caret-double-right nw1-clr"></i>
                        </li>
                        <li>
                            <span class="fs20 fw_600 p1-clr">
                                Contest Details
                            </span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!--Banner Shape Images-->
        <img src="{{asset('')}}assets/images/global/ball-shape19-1.png" alt="img" class="ball-shape-breadcrumb" data-aos="zoom-in-right" data-aos-duration="2200">
        <img src="{{asset('')}}assets/images/global/ball-breadcrumbs.png" alt="img" class="ball-circle-breadcrumb">
        <img src="{{asset('')}}assets/images/global/shape-breadcrum-right.png" alt="img" class="shape-breadcrumbright">
        <!--Banner Shape Images-->
    </div>
    <!-- ==== Banner Breadcrumbs ==== -->

    <!-- ==== Contest Details Slide ==== -->
    <div class="contest-carslide-section position-relative">
        <div class="container">
            <div class="contest-details-carslidewrap position-relative biggest-winner-sldewrap s1-bg swiper py-xxl-5 py-lg-6 py-7 px-2">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="cons-decar-items">
                            <img src="{{asset('')}}assets/images/banner/banner-thumb-car1.png" alt="img">
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="cons-decar-items">
                            <img src="{{asset('')}}assets/images/banner/banner-car3.png" alt="img">
                        </div>
                    </div>
                </div>
                <div class="click-slideluxry-button">
                    <div class="container">
                        <div class="slider-btn d-inline-flex justify-content-between w-100 gap-xxl-5 gap-3" data-aos="zoom-in-down" data-aos-duration="1400">
                            <button type="button" class="luxury-prevteam cmn-s1-slide cmn-48 act4-border p1-clr radius-circle">
                                <i class="ph-light ph-caret-left act4-clr"></i>
                            </button>
                            <button type="button"  class="luxury-nextteam cmn-s1-slide cmn-48 act4-border p1-clr radius-circle">
                                <i class="ph-light ph-caret-right act4-clr"></i>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ==== Contest Details Slide ==== -->

    <!-- ==== Contest Section ==== -->
    <section class="contest-details pt-120">
        <div class="container">
            <div class="row g-6">
                <div class="col-lg-6">
                    <div class="contest-details-leftwrap">
                       <div class="border-bottom pb-xxl-8 pb-6 mb-xxl-8 mb-6">
                            <h2 class="n4-clr mb-xxl-3 mb-2">
                                WIN THIS 520BHP BMW M3 COMPETITION + £1,000 CASH!
                            </h2>
                            <div class="d-flex align-items-center gap-2 flex-wrap">
                                <span class="fs-eight n3-clr">Lottery No. 114</span>
                                <span class="border-con"></span>
                                <span class="fs-eight n3-clr">Drawn: 18 January 2024</span>
                            </div>
                       </div>
                       <div class="common-tabwrap">
                        <div class="singletab">
                            <div class="example-common-button mb-xxl-8 mb-xl-7 mb-6">
                                <ul class="tablinks d-grid gap-sm-0 gap-3 d-sm-flex align-items-center">
                                    <li class="nav-links active">
                                        <button class="tablink n3-clr d-center border p-xxl-3 p-2 w-100">Description</button>
                                    </li>
                                    <li class="nav-links">
                                        <button class="tablink n3-clr d-center border p-xxl-3 p-2 w-100">Lottery History</button>
                                    </li>
                                    <li class="nav-links">
                                        <button class="tablink n3-clr d-center border p-xxl-3 p-2 w-100">Reviews (02)</button>
                                    </li>
                                </ul>
                            </div>
                            <div class="tabcontents">
                                <div class="tabitem active">
                                    <div class="description-body">
                                        <p class="n3-clr mb-xxl-8 mb-xl-5 mb-4">
                                            Embark on an exhilarating journey with Lottovibe where your dream car is just a ticket away. We're more than just a lottery platform; we're your gateway to the thrill of hitting the jackpot and driving home in style.
                                        </p>
                                        <span class="fs20 n4-clr fw_700 d-block mb-xl-5 mb-4">
                                            Why Choose [Lottovibe]
                                        </span>
                                        <p class="cmn-textbox n3-clr mb-xl-6 mb-md-4 mb-2">
                                             <span class="fw_700 n1-clr">Diverse Fleet:</span> Explore a fleet of luxurious cars, from sleek sports cars to stylish SUVs. Our lotteries feature an array of coveted automotive brands to suit every taste.
                                        </p>
                                        <p class="cmn-textbox n3-clr mb-xl-6 mb-md-4 mb-2">
                                            <span class="fw_700 n1-clr">Secure Transactions:</span>
                                            Your security is our priority. With state-of-the-art encryption and secure payment methods, you can trust us with your transactions and personal information.
                                        </p>
                                        <p class="cmn-textbox n3-clr mb-xl-6 mb-md-4 mb-2">
                                            <span class="fw_700 n1-clr">Global Reach:</span>
                                            No matter where you are, our platform brings the excitement of winning a premium car directly to you. Join a community of enthusiasts from around the world.
                                        </p>
                                        <p class="cmn-textbox n3-clr mb-xl-6 mb-md-4 mb-2">
                                            <span class="fw_700 n1-clr">Fair Draws:</span>
                                            Experience transparency and fairness in every draw. Our random selection process ensures that everyone has an equal chance of driving home a winner.
                                        </p>
                                        <p class="cmn-textbox n3-clr">
                                            <span class="fw_700 n1-clr">User-Friendly Interface:</span>
                                            Navigating [Lottovibe] is a breeze. Purchase tickets seamlessly, track lottery results, and manage your account effortlessly.
                                        </p> 
                                        <p class="n3-clr mt-xxl-8 mt-6">
                                            At Lottovibe, we're not just making dreams come true; we're igniting a passion for premium automotive experiences. Join us on the road to extraordinary adventures – where every ticket holds the promise of a life-changing drive. Get ready to rev up your luck with [Lottovibe]!
                                        </p> 
                                    </div>
                                </div>
                                <div class="tabitem">
                                    <div class="lottery-history">
                                        <p class="n3-clr mb-xl-4 mb-3">
                                            Embark on a journey through the rich history of lotteries and discover how the thrill of winning has evolved over time. Lotteries have deep roots, dating back to ancient civilizations where they were used to fund public projects and infrastructure.
                                        </p>
                                        <p class="n3-clr mb-xl-4 mb-3">
                                            In the Renaissance era, lotteries became a popular means of financing cultural endeavors, including the construction of iconic landmarks and works of art. The allure of the lottery spread across continents, becoming a global phenomenon with each region adding its unique flavor to the game.
                                        </p>
                                        <p class="n3-clr">
                                            In the Renaissance era, lotteries became a popular means of financing cultural endeavors, including the construction of iconic landmarks and works of art. The allure of the lottery spread across continents, becoming a global phenomenon with each region adding its unique flavor to the game.
                                        </p>
                                    </div>
                                </div>
                                <div class="tabitem">
                                    <div class="cash-setest">
                                        <span class="n3-clr fw_600 mb-xxl-8 mb-xl-6 mb-lg-4 mb-3">There are no reviews yet.</span>
                                        <div class="cash-title mb-xl-8 mb-lg-6 mb-5">
                                            <span class="fs20 fw_700 n2-clr mb-xl-3 mb-2">
                                                Be the first to review “Setest”
                                            </span>
                                            <p class="n3-clr">
                                                Your email address will not be published. Required fields are marked *
                                            </p>
                                        </div>
                                        <form action="#" class="myrating">
                                            <div class="myrating-title mb-xxl-10 mb-xl-7 mb-lg-6 mb-5">
                                                <span class="n3-clr mb-xl-3 mb-2">Your rating *</span>
                                                <ul class="ratting d-flex align-items-center gap-1">
                                                    <li>
                                                        <i class="ph-fill ph-star fs-five act4-clr"></i>
                                                    </li>
                                                    <li>
                                                        <i class="ph-fill ph-star fs-five act4-clr"></i>
                                                    </li>
                                                    <li>
                                                        <i class="ph-fill ph-star fs-five act4-clr"></i>
                                                    </li>
                                                    <li>
                                                        <i class="ph-fill ph-star fs-five act4-clr"></i>
                                                    </li>
                                                    <li>
                                                        <i class="ph-fill ph-star-half fs-five act4-clr"></i>
                                                    </li>
                                                </ul>
                                            </div>
                                            <input type="text" placeholder="Name*">
                                            <input type="text" placeholder="Email*">
                                            <textarea name="your-review" rows="4" placeholder="Your review*"></textarea>                                  
                                            <button type="submit" class="mt-xxl-3 act4-bg radius12 d-center fw_700 n0-clr py-xxl-3 py-2 px-xxl-10 px-6">
                                                Submit Now
                                            </button>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="competition-ending border radius24">
                        <div class="conpetition-title border-bottom py-xxl-10 py-xl-7 py-6 px-xxl-8 px-xl-6 px-4">
                            <h3 class="n4-clr mb-xxl-8 mb-xl-6 mb-5 text-center">
                                This competition ends in:
                            </h3>
                        </div>
                        <div class="contest-price-title py-xxl-10 py-8 px-xxl-12 px-xl-9 px-sm-7 px-5">
                            <div class="d-flex flex-wrap align-items-center justify-content-center justify-content-sm-between mb-xxl-8 mb-xl-6 mb-5 gap-2">
                                <h3 class="d-flex align-items-center gap-3 n4-clr">
                                    <span class="pr">$8.00</span> <span class="fs-six text-uppercase">PER ENTRY</span>
                                </h3>
                                <span class="n1-clr fs20 fw_700">
                                    Contest No: B2T
                                </span>
                            </div>
                            <div class="d-flex align-items-center justify-content-between mb-2">
                                <span class="fs-eight fw_700 n4-clr">
                                    Ticket Sold
                                </span>
                                <span class="n4-clr soldout fw_700 fs-eight">
                                    45% Sold
                                </span>
                            </div>
                            <div class="range-custom mw-100 range-custom-act4 position-relative">
                                <span class="curs-range"></span>
                            </div>
                        </div>
                        <div class="ans-qustion-wrap mx-xxl-12 mx-xl-9 mx-lg-7 mx-sm-6 mx-2 mb-xxl-10 mb-6">
                            <span class="ans-title py-xxl-5 py-3 px-3 w-100 text-center">
                                PLEASE ANSWER THE QUESTION
                            </span>
                            <div class="ans-select-qustion border-bottom">
                                <div class="py-xxl-8 py-xl-6 py-5 px-xxl-8 px-xl-6 px-4">
                                    <h4 class="n4-clr mb-xl-3 mb-2">
                                        Answer the question ?
                                    </h4>
                                    <p class="n3-clr">
                                        Which of the below is another car manufactured by  Cobra?
                                    </p>
                                </div>
                                <ul class="question-tag d-flex flex-wrap px-xxl-6 px-sm-4 px-2 pb-xxl-6 pb-4">
                                    <li>
                                        <a href="#0" class="n0-bg radius12 d-center py-xl-3 py-2 px-6 n4-clr fw_600">
                                            Fiesta
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#0" class="n0-bg radius12 d-center py-xl-3 py-2 px-6 n4-clr fw_600">
                                            Tiguan
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#0" class="n0-bg radius12 d-center py-xl-3 py-2 px-6 n4-clr fw_600">
                                            M8 Competition
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#0" class="n0-bg radius12 d-center py-xl-3 py-2 px-6 n4-clr fw_600">
                                            Corsa
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div class="ans-ticket py-xxl-8 py-xl-6 py-5 px-xxl-8 px-xl-6 px-4">
                                <h4 class="n1-clr mb-xxl-18 mb-xl-6 mb-4">
                                    How many tickets?
                                </h4>
                                <div class="custom-many-ticketprice mb-xxl-8 mb-xl-7 mb-sm-6 mb-5">
                                    <div class="range-custom mw-100 range-custom-act4 position-relative">
                                        <span class="curs-range"></span>
                                        <span class="scroll-price-count act4-bg py-1 px-1 d-center nw1-clr">
                                            227
                                        </span>
                                    </div>
                                    <div class="d-flex align-items-center justify-content-between mt-2">
                                        <span class="fs-eight fw_700 n4-clr">
                                            Ticket Sold
                                        </span>
                                        <span class="n4-clr soldout fw_700 fs-eight">
                                            45% Sold
                                        </span>
                                    </div>
                                </div>
                                <div class="quantity-basket mb-xxl-15 mb-xl-10 mb-sm-8 mb-6">
                                    <form action="#">
                                        <p class="qty d-flex align-items-center gap-2 justify-content-between">
                                            <button class="qtyminus" aria-hidden="true">&minus;</button>
                                            <span class="d-flex align-items-center">
                                                <span class="n3-clr fs18 fw_600">Number of tickets: </span>
                                                <input type="number" name="qty" id="qty" min="1" max="10" step="1" value="1">
                                            </span>
                                            <button class="qtyplus" aria-hidden="true">&plus;</button>
                                        </p>
                                    </form>	
                                </div>
                                <button type="button" class="act4-bg radius12 d-center w-100 nw1-clr fw_700 py-xxl-3 py-2 px-6" data-bs-toggle="modal" data-bs-target="#exampleModal">
                                    Add ticket to basket
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ==== Contest Section ==== -->

    <!-- ==== Contest Section ==== -->
    <section class="contest-section pt-120 pb-120 n0-bg">
        <div class="container">
            <h2 class="fw_700 mb-xxl-15 mb-xl-10 mb-8 n4-clr">
                Related Competitions
            </h2>
            <div class="row g-6">
                <div class="col-lg-4 col-md-6" data-aos="zoom-in" data-aos-duration="1000">
                    <div class="current-lottery-item cmn-cartborder current-bg position-relative radius24">
                        <div class="current-l-badge position-relative cus-z1 mb-xxl-10 mb-xl-8 mb-lg-6 mb-4 d-flex align-items-center justify-content-between pt-xxl-5 pt-4 pe-xxl-5 pe-4">
                            <span class="draw-badge n4-clr">
                                <span class="n4-clr position-relative fw_700 fs-eight">
                                    Draw Today
                                </span>
                            </span>
                            <span class="cmn-40 n0-bg radius-circle n0-hover">
                                <i class="ph ph-bold ph-shopping-cart n4-clr fs-six"></i>
                            </span>
                        </div>
                        <div class="thumb cus-z1 position-relative px-3 mb-xxl-10 mb-xl-8 mb-lg-6 mb-4">
                            <img src="{{asset('')}}assets/images/lottery/lc1.png" alt="img">
                        </div>
                        <div class="content-middle">
                            <div class="cmn-prrice-range px-xxl-6 px-xl-5 px-lg-4 px-3 d-flex align-items-center gap-2">
                                <div class="range-custom position-relative">
                                    <span class="curs-range"></span>
                                </div>
                                <span class="n4-clr soldout fw_700 fs-eight">
                                    27% Sold
                                </span>
                            </div>
                            <div class="d-flex px-xxl-6 px-xl-5 px-lg-4 px-3 nw4-bb py-xxl-5 py-sm-4 py-3 flex-wrap gap-3 align-items-center justify-content-between">
                               <div class="box">
                                    <h4 class="mb-xxl-3 mb-2">
                                        <a href="contest-details.html" class="n4-clr">
                                            The Breeze Zodiac IX
                                        </a>
                                    </h4>
                                    <div class="d-flex align-items-center gap-xl-3 gap-2">
                                        <ul class="ratting d-flex align-items-center gap-1">
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star-half fs-five act4-clr"></i>
                                            </li>
                                        </ul>
                                        <span class="n3-clr fw_600">
                                            0.97 reviews
                                        </span>
                                    </div>
                               </div>
                               <span class="cmn-40 radius-circle act4-border n0-fillhover">
                                    <i class="ph-bold ph-bookmark-simple act4-clr"></i>
                               </span>
                            </div>
                            <ul class="remaining-info px-xxl-6 px-xl-5 px-lg-4 px-3 py-xxl-5 py-xl-3 py-2 nw4-bb d-flex align-items-center gap-xxl-5 gap-lg-3 gap-2">
                                <li class="d-flex align-items-center gap-2">
                                    <i class="ph ph-clock fs-five n3-clr"></i>
                                    <span class="n3-clr fw_600">
                                        03 Days
                                    </span>
                                </li>
                                <li class="vline-remaing">

                                </li>
                                <li class="d-flex align-items-center gap-2">
                                    <i class="ph ph-barbell fs-five n3-clr"></i>
                                    <span class="n3-clr fw_600">
                                        1750 Remaining
                                    </span>
                                </li>
                            </ul>
                            <div class="d-flex px-xxl-6 px-xl-5 px-lg-4 px-3 py-xxl-8 py-xl-6 py-lg-4 py-3 align-items-center justify-content-between">
                                <h3 class="d-flex align-items-center gap-3 n4-clr">
                                    <span class="pr">$8.00</span> <span class="fs-six text-uppercase">PER ENTRY</span>
                                </h3>
                                <a href="contest-details.html" class="cmn-40 radius-circle s1-bg s1-hover">
                                    <span>
                                        <i class="ph-bold ph-arrow-up-right n0-clr lh"></i>
                                    </span>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6" data-aos="zoom-in-up" data-aos-duration="1200">
                    <div class="current-lottery-item cmn-cartborder current-bg position-relative radius24">
                        <div class="current-l-badge position-relative cus-z1 mb-xxl-10 mb-xl-8 mb-lg-6 mb-4 d-flex align-items-center justify-content-between pt-xxl-5 pt-4 pe-xxl-5 pe-4">
                            <span class="draw-badge n4-clr">
                                <span class="n4-clr position-relative fw_700 fs-eight">
                                    Draw Today
                                </span>
                            </span>
                            <span class="cmn-40 n0-bg radius-circle n0-hover">
                                <i class="ph ph-bold ph-shopping-cart n4-clr fs-six"></i>
                            </span>
                        </div>
                        <div class="thumb cus-z1 position-relative px-3 mb-xxl-10 mb-xl-8 mb-lg-6 mb-4">
                            <img src="{{asset('')}}assets/images/lottery/lc2.png" alt="img">
                        </div>
                        <div class="content-middle">
                            <div class="cmn-prrice-range px-xxl-6 px-xl-5 px-lg-4 px-3 d-flex align-items-center gap-2">
                                <div class="range-custom position-relative">
                                    <span class="curs-range"></span>
                                </div>
                                <span class="n4-clr soldout fw_700 fs-eight">
                                    23% Sold
                                </span>
                            </div>
                            <div class="d-flex px-xxl-6 px-xl-5 px-lg-4 px-3 nw4-bb py-xxl-5 py-sm-4 py-3 flex-wrap gap-3 align-items-center justify-content-between">
                               <div class="box">
                                    <h4 class="mb-xxl-3 mb-2">
                                        <a href="contest-details.html" class="n4-clr">
                                            Chiptuning Von ABT
                                        </a>
                                    </h4>
                                    <div class="d-flex align-items-center gap-xl-3 gap-2">
                                        <ul class="ratting d-flex align-items-center gap-1">
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star-half fs-five act4-clr"></i>
                                            </li>
                                        </ul>
                                        <span class="n3-clr fw_600">
                                            0.97 reviews
                                        </span>
                                    </div>
                               </div>
                               <span class="cmn-40 radius-circle act4-border n0-fillhover">
                                    <i class="ph-bold ph-bookmark-simple act4-clr"></i>
                               </span>
                            </div>
                            <ul class="remaining-info px-xxl-6 px-xl-5 px-lg-4 px-3 py-xxl-5 py-xl-3 py-2 nw4-bb d-flex align-items-center gap-xxl-5 gap-lg-3 gap-2">
                                <li class="d-flex align-items-center gap-2">
                                    <i class="ph ph-clock fs-five n3-clr"></i>
                                    <span class="n3-clr fw_600">
                                        05 Days
                                    </span>
                                </li>
                                <li class="vline-remaing">

                                </li>
                                <li class="d-flex align-items-center gap-2">
                                    <i class="ph ph-barbell fs-five n3-clr"></i>
                                    <span class="n3-clr fw_600">
                                        1950
                                         Remaining
                                    </span>
                                </li>
                            </ul>
                            <div class="d-flex px-xxl-6 px-xl-5 px-lg-4 px-3 py-xxl-8 py-xl-6 py-lg-4 py-3 align-items-center justify-content-between">
                                <h3 class="d-flex align-items-center gap-3 n4-clr">
                                    <span class="pr">$5.00</span> <span class="fs-six text-uppercase">PER ENTRY</span>
                                </h3>
                                <a href="contest-details.html" class="cmn-40 radius-circle s1-bg s1-hover">
                                    <span>
                                        <i class="ph-bold ph-arrow-up-right n0-clr lh"></i>
                                    </span>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6" data-aos="zoom-in" data-aos-duration="1400">
                    <div class="current-lottery-item cmn-cartborder current-bg position-relative radius24">
                        <div class="current-l-badge position-relative cus-z1 mb-xxl-10 mb-xl-8 mb-lg-6 mb-4 d-flex align-items-center justify-content-between pt-xxl-5 pt-4 pe-xxl-5 pe-4">
                            <span class="draw-badge n4-clr">
                                <span class="n4-clr position-relative fw_700 fs-eight">
                                    Draw Today
                                </span>
                            </span>
                            <span class="cmn-40 n0-bg radius-circle n0-hover">
                                <i class="ph ph-bold ph-shopping-cart n4-clr fs-six"></i>
                            </span>
                        </div>
                        <div class="thumb cus-z1 position-relative px-3 mb-xxl-10 mb-xl-8 mb-lg-6 mb-4">
                            <img src="{{asset('')}}assets/images/lottery/lc3.png" alt="img">
                        </div>
                        <div class="content-middle">
                            <div class="cmn-prrice-range px-xxl-6 px-xl-5 px-lg-4 px-3 d-flex align-items-center gap-2">
                                <div class="range-custom position-relative">
                                    <span class="curs-range"></span>
                                </div>
                                <span class="n4-clr soldout fw_700 fs-eight">
                                    20% Sold
                                </span>
                            </div>
                            <div class="d-flex px-xxl-6 px-xl-5 px-lg-4 px-3 nw4-bb py-xxl-5 py-sm-4 py-3 flex-wrap gap-3 align-items-center justify-content-between">
                               <div class="box">
                                    <h4 class="mb-xxl-3 mb-2">
                                        <a href="contest-details.html" class="n4-clr">
                                            Shelby Cobra
                                        </a>
                                    </h4>
                                    <div class="d-flex align-items-center gap-xl-3 gap-2">
                                        <ul class="ratting d-flex align-items-center gap-1">
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star fs-five act4-clr"></i>
                                            </li>
                                            <li>
                                                <i class="ph-fill ph-star-half fs-five act4-clr"></i>
                                            </li>
                                        </ul>
                                        <span class="n3-clr fw_600">
                                            0.97 reviews
                                        </span>
                                    </div>
                               </div>
                               <span class="cmn-40 radius-circle act4-border n0-fillhover">
                                    <i class="ph-bold ph-bookmark-simple act4-clr"></i>
                               </span>
                            </div>
                            <ul class="remaining-info px-xxl-6 px-xl-5 px-lg-4 px-3 py-xxl-5 py-xl-3 py-2 nw4-bb d-flex align-items-center gap-xxl-5 gap-lg-3 gap-2">
                                <li class="d-flex align-items-center gap-2">
                                    <i class="ph ph-clock fs-five n3-clr"></i>
                                    <span class="n3-clr fw_600">
                                        02 Days
                                    </span>
                                </li>
                                <li class="vline-remaing">

                                </li>
                                <li class="d-flex align-items-center gap-2">
                                    <i class="ph ph-barbell fs-five n3-clr"></i>
                                    <span class="n3-clr fw_600">
                                        1200 Remaining
                                    </span>
                                </li>
                            </ul>
                            <div class="d-flex px-xxl-6 px-xl-5 px-lg-4 px-3 py-xxl-8 py-xl-6 py-lg-4 py-3 align-items-center justify-content-between">
                                <h3 class="d-flex align-items-center gap-3 n4-clr">
                                    <span class="pr">$3.00</span> <span class="fs-six text-uppercase">PER ENTRY</span>
                                </h3>
                                <a href="contest-details.html" class="cmn-40 radius-circle s1-bg s1-hover">
                                    <span>
                                        <i class="ph-bold ph-arrow-up-right n0-clr lh"></i>
                                    </span>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ==== Contest Section ==== -->

     <!-- Added Ticket Modal -->
     <div class="modal added-ticket-modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header pt-xxl-8 pt-4 px-xxl-8 px-4 border-bottom-0">
                    <h5 class="modal-title" id="exampleModalLabel">You've added tickets to basket</h5>
                    <button type="button" class="btn-close border radius-circle d-center" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body border-top-0 mt-xxl-5">
                    <div class="car-ticketwrap mb-xxl-10 mb-xl-8 mb-6">
                        <div class="thumb position-relative d-center">
                            <img src="assets/images/lottery/car-ticket.png" alt="img">
                        </div>
                        <div class="cont">
                            <span class="n1-clr fs20 fw_700 d-block mb-xl-3 mb-2">
                                Win This 520BHP BMW M3 Competition + £1,000 Cash!
                            </span>
                            <h4 class="s1-clr">
                                <a href="#0" class="s1-clr act4-texthover">20 tickets </a>
                            </h4>
                        </div>
                    </div>
                    <div class="d-sm-flex d-grid align-items-center gap-xxl-6 gap-4 border-bottom pb-xxl-8 pb-xl-6 pb-4 mx-sm-0 mx-10">
                        <button type="button" class="w-100 act4-border radius12 fw_700 act4-clr py-xxl-3 py-2 px-5">
                            Keep shopping
                        </button>
                        <button type="button" class="w-100 act4-bg radius12 fw_700 n0-clr py-xxl-3 py-2 px-5">
                            View basket
                        </button>
                    </div>
                    <div class="thumb-ticketbig position-relative d-center">
                        <div class="thumb">
                            <img src="assets/images/lottery/ticket-big.png" alt="img">
                        </div>
                    </div>
                    <span class="fs20 fw_600 n3-clr text-center">
                        Want to also win this <span class="fw_700">Mansory Lamborghini Urus or 
                            £140,000 tomorrow?</span>
                    </span>
                </div>
                <div class="modal-footer border-top-0 d-center pb-xxl-8 pb-6 mx-xxl-15 mx-10">
                    <button type="button" class="w-100 act4-bg radius12 fw_700 n0-clr py-xxl-3 py-2 px-5">Enter Here</button>
                </div>
            </div>
        </div>
    </div>
    <!-- Added Ticket Modal -->
@endsection