<div class="row mt-4">
    <div class="col-12 col-md-5 col-lg-4">
        <div class="s-calendar">
            <div class="m-4 position-relative">
                <i class="bi bi-chevron-left s-prev position-absolute top-0 start-0 translate-middle"></i>
                <div class="s-title position-absolute top-0 start-50 translate-middle"></div>
                <i class="bi bi-chevron-right s-next position-absolute top-0 start-100 translate-middle"></i>
            </div>
            <div class="s-weekdays mt-3 d-flex justify-content-center text-center">
                <!-- days name from js -->
            </div>
            <div class="s-days">
                <!-- days from js -->
            </div>
            <div class="s-goto-today">
                <div class="s-goto">
                    <input type="text" name="" id="" placeholder="ddmmyy or mmyy" class="s-date-input">
                    <button class="s-goto-btn">Go</button>
                </div>
                <a href="#" class="s-goto-last-event">Last Event <i class="bi bi-arrow-right"></i></a>
                <button class="s-today-btn">Today</button>
            </div>
        </div>
    </div>
    <div class="s-right1 col-12 col-md-7 col-lg-8">
        <div class="row s-today-date">
            <div class="s-today-date-left col-12 col-md-6">
                <div class="s-event-day">Wed</div>
                <div class="s-event-date">04 January 1995</div>
            </div>
            <div class="s-today-date-right col-12 col-md-6 text-md-end">
                <div class="s-event-this-month">This month: 0 events</div>
                <div class="s-event-this-day">This day: 0 events</div>
            </div>
        </div>
        <div class="s-events mt-3"></div>
    </div>
</div>