title = "Account bookings"
url = "/account/bookings/:code?"
layout = "account"
is_hidden = 0

[viewBag]
localeUrl[gr] = "/account/bookings"

[account]
redirect = "user/bookings"
paramCode = "code"
forceSecure = 0
==
<div class="current-books">
    <nav>
        <ul class="nav nav-tabs nav-fill" id="nav-tab" role="tablist">
            <li><a class="nav-item nav-link active" id="nav-home-tab"
                   data-toggle="tab" href="#nav-home" role="tab"
                   aria-controls="nav-home" aria-selected="true">Current
                    BOOKINGs</a></li>
            <li><a class="nav-item nav-link" id="nav-profile-tab"
                   data-toggle="tab" href="#nav-profile" role="tab"
                   aria-controls="nav-profile" aria-selected="false">past
                    bookings</a></li>
        </ul>
    </nav>
    <div class="tab-content" id="nav-tabContent">
        <!--<div class="tab-pane fade active show" id="nav-home" role="tabpanel"
             aria-labelledby="nav-home-tab">
            <div class="box-content-2">
                <div class="get-excited-benifit">
                    <div class="james">
                        <div class="row">
                            <div class="col-md-8">
                                <div class="james-text"><h4>Get excited James,
                                        <br>your next trip is coming up soon!
                                    </h4></div>
                            </div>
                            <div class="col-md-4 row-align-center">
                                <ul class="grid-lists">
                                    <li><a href="#"> <i class="fas fa-list"></i>
                                        </a></li>
                                    <li><a href="#"> <i
                                                    class="far fa-calendar-alt"></i>
                                        </a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <ul id="app" class="post-pagination">
                        {% if bookings %}
                            <li id="US1">
                                <div class="row">
                                    <div class="col-md-7 col-7">
                                        <div class="post-info"><h3>2-5 July
                                                202US1</h3>
                                            <p>A bolder way to beach day,St. John’s,
                                                Antigua &amp; Barbuda</p> <a
                                                    href="#" class="pink">Corrently
                                                viewing</a></div>
                                    </div>
                                    <div class="col-md-5 col-5">
                                        <div class="post-img"><img
                                                    src="images/myaccount/postthumb.png"
                                                    class="img-fluid"></div>
                                    </div>
                                </div>
                            </li>
                            <li id="US2">
                                <div class="row">
                                    <div class="col-md-7 col-7">
                                        <div class="post-info"><h3>2-5 July
                                                202US2</h3>
                                            <p>A bolder way to beach day,St. John’s,
                                                Antigua &amp; Barbuda</p> <a
                                                    href="#" class="pink">Corrently
                                                viewing</a></div>
                                    </div>
                                    <div class="col-md-5 col-5">
                                        <div class="post-img"><img
                                                    src="images/myaccount/postthumb.png"
                                                    class="img-fluid"></div>
                                    </div>
                                </div>
                            </li>
                            <li id="US3">
                                <div class="row">
                                    <div class="col-md-7 col-7">
                                        <div class="post-info"><h3>2-5 July
                                                202US3</h3>
                                            <p>A bolder way to beach day,St. John’s,
                                                Antigua &amp; Barbuda</p> <a
                                                    href="#" class="pink">Corrently
                                                viewing</a></div>
                                    </div>
                                    <div class="col-md-5 col-5">
                                        <div class="post-img"><img
                                                    src="images/myaccount/postthumb.png"
                                                    class="img-fluid"></div>
                                    </div>
                                </div>
                            </li>
                            <li id="US4">
                                <div class="row">
                                    <div class="col-md-7 col-7">
                                        <div class="post-info"><h3>2-5 July
                                                202US4</h3>
                                            <p>A bolder way to beach day,St. John’s,
                                                Antigua &amp; Barbuda</p> <a
                                                    href="#" class="pink">Corrently
                                                viewing</a></div>
                                    </div>
                                    <div class="col-md-5 col-5">
                                        <div class="post-img"><img
                                                    src="images/myaccount/postthumb.png"
                                                    class="img-fluid"></div>
                                    </div>
                                </div>
                            </li>
                            <ol class="pagination">
                                <li class="prev"><a href="javascript:void(0);"><i
                                                class="fas fa-caret-left"></i></a>
                                </li>
                                <li><a href="javascript:void(0);"
                                       class="button current-page">1</a></li>
                                <li><a href="javascript:void(0);"
                                       class="button">2</a></li>
                                <li><a href="javascript:void(0);"
                                       class="button">3</a></li>
                                <li><a href="javascript:void(0);"
                                       class="button">4</a></li>
                                <li><a href="javascript:void(0);"
                                       class="button">5</a></li>
                                <li class="next"><a href="javascript:void(0);"><i
                                                class="fas fa-caret-right"></i></a>
                                </li>
                            </ol>
                        {% else %}
                            <div style="text-align: center;margin-top: 50%;
                            font-size: 24px;">
                                No bookings yet
                            </div>
                        {% endif %}
                    </ul>
                </div>
                <div class="post-ratio-60">
                    <div class="booking-date"><h1>2-5 July 2020</h1> <a
                                href="javascript:void(0)"
                                class="bookingbtn text-center"> <i
                                    class="fas fa-pencil-alt"></i> &nbsp; Edit
                            Booking </a></div>
                    <div class="row">
                        <div class="col-md-12 col-lg-12 col-xl-9">
                            <div class="bolder-text"><h2>A bolder way to beach
                                    day, <br>St. John’s, Antigua &amp; Barbuda
                                </h2>
                                <h3 class="hills_mountain">Hilus Mountain</h3>
                                <ul class="stars">
                                    <li><i class="fa fa-star"
                                           aria-hidden="true"></i></li>
                                    <li><i class="fa fa-star"
                                           aria-hidden="true"></i></li>
                                    <li><i class="fa fa-star"
                                           aria-hidden="true"></i></li>
                                    <li><i class="fa fa-star"
                                           aria-hidden="true"></i></li>
                                    <li><i class="fa fa-star"
                                           aria-hidden="true"></i></li>
                                </ul>
                                <p>Morbi mollis vestibulum sollicitudin. Nunc in
                                    eros a justo facilisis rutrum. Aenean id
                                    ullamcorper libero. Vestibulum imperdiet
                                    nibh vel magna lacinia commodo ultricies,
                                    lectus nisl facilisis enim, vitae viverra
                                    urna nulla sed turpis.</p>
                                <div class="checkinout">
                                    <p>
                                        <small>CHECK-IN</small>
                                        Thurs, 2 Jul 2020
                                    </p>
                                    <p>
                                        <small>CHECK-OUT</small>
                                        Sun, 2 Jul 2020
                                    </p>
                                </div>
                                <div class="slider-multiform">
                                    <div class="slider slider-for multi-images slick-initialized slick-slider">
                                        <div class="slick-list draggable">
                                            <div class="slick-track"
                                                 style="opacity: 1; width: 1017px;">
                                                <div class="slick-slide slick-current slick-active"
                                                     data-slick-index="0"
                                                     aria-hidden="false"
                                                     style="width: 339px; position: relative; left: 0px; top: 0px; z-index: 999; opacity: 1;">
                                                    <div>
                                                        <div style="width: 100%; display: inline-block;">
                                                            <img src="images/myaccount/postthumb.png"
                                                                 class="img-fluid">
                                                            <ul class="view-package">
                                                                <li><a href="#"
                                                                       class="reviewstar "
                                                                       tabindex="0">
                                                                        <i class="fas fa-star"></i>
                                                                        &nbsp;
                                                                        See
                                                                        reviews
                                                                    </a></li>
                                                                <li><a href="#"
                                                                       class="packageblue "
                                                                       tabindex="0">
                                                                        View
                                                                        package</a>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="slick-slide"
                                                     data-slick-index="1"
                                                     aria-hidden="true"
                                                     tabindex="-1"
                                                     style="width: 339px; position: relative; left: -339px; top: 0px; z-index: 998; opacity: 0;">
                                                    <div>
                                                        <div style="width: 100%; display: inline-block;">
                                                            <img src="images/myaccount/postthumb.png"
                                                                 class="img-fluid">
                                                            <ul class="view-package">
                                                                <li><a href="#"
                                                                       class="reviewstar "
                                                                       tabindex="-1">
                                                                        <i class="fas fa-star"></i>
                                                                        &nbsp;
                                                                        See
                                                                        reviews
                                                                    </a></li>
                                                                <li><a href="#"
                                                                       class="packageblue "
                                                                       tabindex="-1">
                                                                        &nbsp;
                                                                        View
                                                                        package</a>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="slick-slide"
                                                     data-slick-index="2"
                                                     aria-hidden="true"
                                                     tabindex="-1"
                                                     style="width: 339px; position: relative; left: -678px; top: 0px; z-index: 998; opacity: 0;">
                                                    <div>
                                                        <div style="width: 100%; display: inline-block;">
                                                            <img src="images/myaccount/postthumb.png"
                                                                 class="img-fluid">
                                                            <ul class="view-package">
                                                                <li><a href="#"
                                                                       class="reviewstar "
                                                                       tabindex="-1">
                                                                        <i class="fas fa-star"></i>
                                                                        &nbsp;
                                                                        See
                                                                        reviews
                                                                    </a></li>
                                                                <li><a href="#"
                                                                       class="packageblue "
                                                                       tabindex="-1">
                                                                        View
                                                                        package</a>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="slider-relative">
                                        <div class="slider slider-nav slick-initialized slick-slider">
                                            <div class="slick-list draggable">
                                                <div class="slick-track"
                                                     style="opacity: 1; width: 1469px; transform: translate3d(-339px, 0px, 0px);">
                                                    <div class="slick-slide slick-cloned"
                                                         data-slick-index="-3"
                                                         id=""
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-1.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-cloned"
                                                         data-slick-index="-2"
                                                         id=""
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-2.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-cloned"
                                                         data-slick-index="-1"
                                                         id=""
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-1.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-current slick-active"
                                                         data-slick-index="0"
                                                         aria-hidden="false"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-1.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-active"
                                                         data-slick-index="1"
                                                         aria-hidden="false"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-2.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-active"
                                                         data-slick-index="2"
                                                         aria-hidden="false"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-1.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide"
                                                         data-slick-index="3"
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-2.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide"
                                                         data-slick-index="4"
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-1.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-cloned"
                                                         data-slick-index="5"
                                                         id=""
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-1.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-cloned"
                                                         data-slick-index="6"
                                                         id=""
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-2.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-cloned"
                                                         data-slick-index="7"
                                                         id=""
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-1.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-cloned"
                                                         data-slick-index="8"
                                                         id=""
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-2.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="slick-slide slick-cloned"
                                                         data-slick-index="9"
                                                         id=""
                                                         aria-hidden="true"
                                                         tabindex="-1"
                                                         style="width: 93px;">
                                                        <div>
                                                            <div style="width: 100%; display: inline-block;">
                                                                <img src="images/myaccount/thumb-1.png"
                                                                     class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <ul class="arrow-nav">
                                            <li class=""><a href="javascript:"
                                                            class="home-sale-prev slick-arrow"
                                                            style=""> <i
                                                            class="fas fa-chevron-left"></i>
                                                </a></li>
                                            <li class=""><a href="javascript:"
                                                            class="home-sale-next slick-arrow"
                                                            style=""> <i
                                                            class="fas fa-chevron-right"></i>
                                                </a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-12 col-lg-12 col-xl-3">
                            <ul class="room-feature">
                                <li><span>1</span> ROom</li>
                                <li><span>2</span> Adults</li>
                                <li><span>3</span> Nights</li>
                            </ul>
                            <ul class="premium-feature">
                                <li><img src="images/myaccount/oldbus.png"
                                         class="img-fluid"> <span>Convenient Transportaion</span>
                                </li>
                                <li><img src="images/myaccount/plate.png"
                                         class="img-fluid">
                                    <span>Gastronomy</span></li>
                                <li><img src="images/myaccount/telescope.png"
                                         class="img-fluid"> <span>Wildlife Viewing</span>
                                </li>
                                <li><img src="images/myaccount/glass.png"
                                         class="img-fluid">
                                    <span>Good drinks</span></li>
                                <li><img src="images/myaccount/closet.png"
                                         class="img-fluid">
                                    <span>Nice interior</span></li>
                            </ul>
                        </div>
                        <div class="col-md-12">
                            <div class="refregusets">
                                <ul class="refrelist"><h4>Refrence</h4>
                                    <li>Ref. No.: A72501227</li>
                                    <li>-15 Discount : $25.00</li>
                                    <li>Total Amount: $2500.00</li>
                                </ul>
                                <ul class="refrelist"><h4>Guests</h4>
                                    <li>Guest 1 : James King</li>
                                    <li>Guest 2 : James King</li>
                                </ul>
                                <ul class="refrelist"><h4>Hotel</h4>
                                    <li>Ref. No.: A72501227</li>
                                    <li>-15 Discount : $25.00</li>
                                    <li>Total Amount: $2500.00</li>
                                </ul>
                            </div>
                            <div class="download-option"><a href="#"> <i
                                            class="fas fa-arrow-alt-circle-down"></i>
                                    &nbsp; DOwnload </a> <a href="#"> <i
                                            class="fas fa-envelope"></i> &nbsp;
                                    Email </a> <a href="#"> <i
                                            class="fas fa-list"></i> &nbsp; View
                                    Invietary </a> <a href="#"> <i
                                            class="fas fa-times-circle"></i>
                                    &nbsp; Cancel booking </a></div>
                            <div class="contact-support">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="email-support"><span
                                                    class="ics"> <i
                                                        class="fas fa-envelope"></i> </span>
                                            <p>Email Support</p>
                                            <p><a href="#" class="pink">support@oceaus.net</a>
                                            </p></div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="email-support"><span
                                                    class="ics"> <i
                                                        class="fas fa-phone-alt"></i> </span>
                                            <p>Time :08 - 20 hrs</p>
                                            <p><a href="#" class="pink">882-8445-5545</a>
                                            </p></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> !-->
        <div class="tab-pane fade" id="nav-profile" role="tabpanel"
             aria-labelledby="nav-profile-tab"></div>
    </div>
</div>