templates/web/vehicles/vehicle-detail.html.twig line 1

  1. {% extends 'base.html.twig' %}
  2. {% block body %}
  3.     <!-- Breadscrumb Section -->
  4.     <div class="breadcrumb-bar">
  5.         <div class="container">
  6.             <div class="row align-items-center text-center">
  7.                 <div class="col-md-12 col-12">
  8.                     <h2 class="breadcrumb-title">{{ vehicle.model.brand.name ~ ' ' ~ vehicle.model.name }}</h2>
  9.                     <nav aria-label="breadcrumb" class="page-breadcrumb">
  10.                         <ol class="breadcrumb">
  11.                             <li class="breadcrumb-item"><a href="{{ path("web_home") }}">Inicio</a></li>
  12.                             <li class="breadcrumb-item"><a href="{{ path("web_vehicles") }}">Vehículos</a></li>
  13.                             <li class="breadcrumb-item active" aria-current="page">
  14.                                 {{ vehicle.model.brand.name ~ ' ' ~ vehicle.model.name ~ ' ' ~ vehicle.yearModel }}
  15.                             </li>
  16.                         </ol>
  17.                     </nav>
  18.                 </div>
  19.             </div>
  20.         </div>
  21.     </div>
  22.     <!-- /Breadscrumb Section -->
  24.     <!-- Detail Page Head-->
  25.     <section class="product-detail-head">
  26.         <div class="container">
  27.             <div class="detail-page-head">
  28.                 <div class="detail-headings">
  29.                     <div class="star-rated">
  30.                         <div class="list-rating">
  31.                             <span class="year">{{ vehicle.yearModel }}</span>
  32.                             {# <i class="fas fa-star filled"></i>
  33.                             <i class="fas fa-star filled"></i>
  34.                             <i class="fas fa-star filled"></i>
  35.                             <i class="fas fa-star filled"></i>
  36.                             <i class="fas fa-star filled"></i>
  37.                             <span class="d-inline-block average-list-rating"> 5.0 </span> #}
  38.                         </div>
  39.                         <div class="camaro-info">
  40.                             <h3>{{ vehicle.model.brand.name ~ ' ' ~ vehicle.model.name }}</h3>
  41.                             {# <div class="camaro-location">
  42.                                 <div class="camaro-location-inner">
  43.                                     <i class="feather-map-pin me-2"></i>
  45.                                     <span class="me-2"> <b>Location :</b> Miami St, Destin, FL 32550, USA </span>
  46.                                 </div>
  47.                                 <div class="camaro-locations-inner">
  48.                                     <i class="feather-eye me-2"></i>
  50.                                     <span><b>Views :</b> 250 </span>
  51.                                 </div>
  52.                             </div> #}
  53.                         </div>
  55.                     </div>
  56.                 </div>
  57.                 {# <div class="details-btn">
  58.                     <a href=""> <img src="/img/git-compare.svg" alt=""> Compare</a>
  59.                     <a href=""><i class="feather-heart"></i> Wishlist</a>
  60.                 </div> #}
  61.             </div>
  62.         </div>
  63.     </section>
  64.     <!-- /Detail Page Head-->
  66.     <section class="section product-details">
  67.         <div class="container">
  68.             <div class="row">
  69.                 <div class="col-lg-8">
  70.                     <div class="detail-product">
  71.                         <div class="slider detail-bigimg">
  72.                             {% for image in gallery %}
  73.                             <div class="product-img">
  74.                                 <img src="/img/vehicles/{{ image.imagename }}" alt="Slider">
  75.                             </div>
  76.                             {% endfor %}
  77.                         </div>
  78.                         <div class="slider slider-nav-thumbnails">
  79.                             {% for image in gallery %}
  80.                                 <div><img src="/img/vehicles/{{ image.imagename }}" alt="product image"></div>
  81.                             {% endfor %}
  82.                         </div>
  83.                     </div>
  84.                     {# <div class="review-sec extra-service">
  85.                         <div class="review-header">
  86.                             <h4>Extra Service</h4>
  87.                         </div>
  88.                         <span>Baby Seat - $10</span>
  89.                     </div> #}
  91.                     <!--Listing Features Section-->
  92.                     <div class="review-sec specification-card ">
  93.                         <div class="review-header">
  94.                             <h4>Especificaciones</h4>
  95.                         </div>
  96.                         <div class="card-body">
  97.                             <div class="lisiting-featues">
  98.                                 <div class="row">
  99.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  100.                                         <div class="feature-img">
  101.                                             <img src="/img/specification/specification-icon-1.svg" alt="">
  102.                                         </div>
  103.                                         <div class="featues-info">
  104.                                             <span>Carrocería </span>
  105.                                             <h6> {{ vehicle.model.vehicleType.name }}</h6>
  106.                                         </div>
  107.                                     </div>
  108.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  109.                                         <div class="feature-img">
  110.                                             <img src="/img/specification/specification-icon-2.svg" alt="">
  111.                                         </div>
  112.                                         <div class="featues-info">
  113.                                             <span>Marca </span>
  114.                                             <h6>{{ vehicle.model.brand.name }}</h6>
  115.                                         </div>
  116.                                     </div>
  117.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  118.                                         <div class="feature-img">
  119.                                             <img src="/img/specification/specification-icon-3.svg" alt="">
  120.                                         </div>
  121.                                         <div class="featues-info">
  122.                                             <span>Transmisión </span>
  123.                                             <h6> {{ vehicle.transmissionType.name |capitalize }}</h6>
  124.                                         </div>
  125.                                     </div>
  126.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  127.                                         <div class="feature-img">
  128.                                             <img src="/img/specification/specification-icon-4.svg" alt="">
  129.                                         </div>
  130.                                         <div class="featues-info">
  131.                                             <span>Combustible</span>
  132.                                             <h6>{{ vehicle.fuelType.name }}</h6>
  133.                                         </div>
  134.                                     </div>
  135.                                     {#<div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  136.                                         <div class="feature-img">
  137.                                             <img src="/img/specification/specification-icon-5.svg" alt="">
  138.                                         </div>
  139.                                         <div class="featues-info">
  140.                                             <span>Mileage </span>
  141.                                             <h6>16 Km</h6>
  142.                                         </div>
  143.                                     </div>
  144.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  145.                                         <div class="feature-img">
  146.                                             <img src="/img/specification/specification-icon-6.svg" alt="">
  147.                                         </div>
  148.                                         <div class="featues-info">
  149.                                             <span>Drivetrian </span>
  150.                                             <h6>Front Wheel</h6>
  151.                                         </div>
  152.                                     </div>#}
  153.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  154.                                         <div class="feature-img">
  155.                                             <img src="/img/specification/specification-icon-7.svg" alt="">
  156.                                         </div>
  157.                                         <div class="featues-info">
  158.                                             <span>Año</span>
  159.                                             <h6> {{ vehicle.yearModel }}</h6>
  160.                                         </div>
  161.                                     </div>
  162.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  163.                                         <div class="feature-img">
  164.                                             <img src="/img/specification/specification-icon-8.svg" alt="">
  165.                                         </div>
  166.                                         <div class="featues-info">
  167.                                             <span>AC </span>
  168.                                             <h6> Air Condition</h6>
  169.                                         </div>
  170.                                     </div>
  171.                                     {#<div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  172.                                         <div class="feature-img">
  173.                                             <img src="/img/specification/specification-icon-9.svg" alt="">
  174.                                         </div>
  175.                                         <div class="featues-info">
  176.                                             <span>VIN </span>
  177.                                             <h6> 45456444</h6>
  178.                                         </div>
  179.                                     </div>#}
  180.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  181.                                         <div class="feature-img">
  182.                                             <img src="/img/specification/specification-icon-10.svg" alt="">
  183.                                         </div>
  184.                                         <div class="featues-info">
  185.                                             <span>Puertas</span>
  186.                                             <h6>{{ vehicle.numberDoor }}</h6>
  187.                                         </div>
  188.                                     </div>
  189.                                     {#<div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  190.                                         <div class="feature-img">
  191.                                             <img src="/img/specification/specification-icon-11.svg" alt="">
  192.                                         </div>
  193.                                         <div class="featues-info">
  194.                                             <span>Brake </span>
  195.                                             <h6> ABS</h6>
  196.                                         </div>
  197.                                     </div>#}
  198.                                     <div class="featureslist d-flex align-items-center col-lg-3 col-md-4">
  199.                                         <div class="feature-img">
  200.                                             <img src="/img/specification/specification-icon-12.svg" alt="">
  201.                                         </div>
  202.                                         <div class="featues-info">
  203.                                             <span>Engine (Hp) </span>
  204.                                             <h6> 3,000</h6>
  205.                                         </div>
  206.                                     </div>
  207.                                 </div>
  208.                             </div>
  209.                         </div>
  210.                     </div>
  212.                     <!--Listing Features Section-->
  213.                     <div class="review-sec listing-feature">
  214.                         <div class="review-header">
  215.                             <h4>Características del vehículo</h4>
  216.                         </div>
  217.                         <div class="listing-description">
  218.                             <div class="row">
  219.                                 <ul class="booking-list">
  220.                                     <li>
  221.                                         Marca
  222.                                         <h6>{{ vehicle.model.brand.name }}</h6>
  223.                                     </li>
  224.                                     <li>
  225.                                         Modelo
  226.                                         <h6>{{ vehicle.model.name }}</h6>
  227.                                     </li>
  228.                                     <li>
  229.                                         Año
  230.                                         <h6>{{ vehicle.yearModel }}</h6>
  231.                                     </li>
  232.                                     <li>
  233.                                         Tipo de carrocería
  234.                                         <h6>{{ vehicle.model.vehicleType.name }}</h6>
  235.                                     </li>
  236.                                     <li>
  237.                                         Dirección
  238.                                         <h6>{{ vehicle.vehicleDirection.name }}</h6>
  239.                                     </li>
  240.                                     <li>
  241.                                         Transmisión
  242.                                         <h6>{{ vehicle.transmissionType.name }}</h6>
  243.                                     </li>
  244.                                     <li>
  245.                                         Combustible
  246.                                         <h6>{{ vehicle.fuelType.name }}</h6>
  247.                                     </li>
  248.                                     <li>
  249.                                         Cantidad de puertas
  250.                                         <h6>{{ vehicle.numberDoor }}</h6>
  251.                                     </li>
  252.                                     <li>
  253.                                         Capacidad de pasajeros
  254.                                         <h6>{{ vehicle.numberPassenger }} pasajeros</h6>
  255.                                     </li>
  256.                                 </ul>
  257.                             </div>
  258.                         </div>
  259.                     </div>
  260.                     <!--/Listing Features Section-->
  262.                     <div class="review-sec listing-feature">
  263.                         <div class="review-header">
  264.                             <h4>Accesorios del vehículo</h4>
  265.                         </div>
  266.                         <div class="listing-description">
  267.                             <div class="row">
  268.                                 <div class="col-md-4">
  269.                                     <ul>
  270.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Multi-zone A/C</li>
  271.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Heated front seats</li>
  272.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Andriod Auto</li>
  273.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Navigation system</li>
  274.                                     </ul>
  275.                                 </div>
  276.                                 <div class="col-md-4">
  277.                                     <ul>
  278.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Premium sound system
  279.                                         </li>
  280.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Bluetooth</li>
  281.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Keyles Start</li>
  282.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Memory seat</li>
  283.                                     </ul>
  285.                                 </div>
  286.                                 <div class="col-md-4">
  287.                                     <ul>
  288.                                         <li><span><i class="fa-solid fa-check-double"></i></span>6 Cylinders</li>
  289.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Adaptive Cruise Control
  290.                                         </li>
  291.                                         <li><span><i class="fa-solid fa-check-double"></i></span>Intermittent wipers
  292.                                         </li>
  293.                                         <li><span><i class="fa-solid fa-check-double"></i></span>4 power windows</li>
  294.                                     </ul>
  296.                                 </div>
  297.                             </div>
  298.                         </div>
  299.                     </div>
  300.                     <!--/Listing Features Section-->
  302.                     {# <div class="review-sec extra-service mb-0">
  303.                         <div class="review-header">
  304.                             <h4>Description of Listing</h4>
  305.                         </div>
  306.                         <div class="description-list">
  307.                             <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard
  308.                                 dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen
  309.                                 book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
  310.                             </p>
  312.                             <p>It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with
  313.                                 desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.It was popularised in the 1960s with the
  314.                                 release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus
  315.                                 PageMaker including versions of Lorem Ipsum.
  316.                             </p>
  318.                             <p>It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with
  319.                                 desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
  320.                             </p>
  322.                             <p>It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with
  323.                                 desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.It was popularised in the 1960s with the
  324.                                 release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus
  325.                                 PageMaker including versions of Lorem Ipsum.
  326.                             </p>
  327.                         </div>
  328.                     </div>
  330.                     <div class="review-sec extra-service mb-0">
  331.                         <div class="review-header">
  332.                             <h4>Video</h4>
  333.                         </div>
  334.                         <div class="short-video">
  335.                             <iframe src="https://www.youtube.com/embed/ExJZAegsOis" width="100" height="350"></iframe>
  336.                         </div>
  337.                     </div>
  339.                     <div class="review-sec listing-review">
  340.                         <div class="review-header">
  341.                             <h4>Reviews<span class="me-2">(2)</span></h4>
  342.                             <div class="reviewbox-list-rating">
  343.                                 <p>
  344.                                     <i class="fas fa-star filled"></i>
  345.                                     <i class="fas fa-star filled"></i>
  346.                                     <i class="fas fa-star filled"></i>
  347.                                     <i class="fas fa-star filled"></i>
  348.                                     <i class="fas fa-star filled"></i>
  349.                                     <span> (5 out of 5)</span>
  350.                                 </p>
  351.                             </div>
  352.                         </div>
  353.                         <div class="review-card">
  354.                             <div class="review-header-group">
  355.                                 <div class="review-widget-header">
  356.                                         <span class="review-widget-img">
  357.                                             <img src="/img/profiles/avatar-01.jpg"  class="img-fluid" alt="">
  358.                                         </span>
  359.                                     <div class="review-design">
  360.                                         <h6>Johnson</h6>
  361.                                         <p>02 Jan 2023</p>
  362.                                     </div>
  363.                                 </div>
  364.                                 <div class="reviewbox-list-rating">
  365.                                     <p>
  366.                                         <i class="fas fa-star filled"></i>
  367.                                         <i class="fas fa-star filled"></i>
  368.                                         <i class="fas fa-star filled"></i>
  369.                                         <i class="fas fa-star filled"></i>
  370.                                         <i class="fas fa-star filled"></i>
  371.                                         <span> (5.0)</span>
  372.                                     </p>
  373.                                 </div>
  374.                             </div>
  375.                             <p>It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.It was popularised in the 1960s </p>
  376.                             <ul class="review-list-rating">
  377.                                 <li>
  378.                                     quality
  379.                                     <p>
  380.                                         <i class="fas fa-star filled"></i>
  381.                                         <i class="fas fa-star filled"></i>
  382.                                         <i class="fas fa-star filled"></i>
  383.                                         <i class="fas fa-star filled"></i>
  384.                                         <i class="fas fa-star filled"></i>
  385.                                     </p>
  386.                                 </li>
  387.                                 <li>
  388.                                     Price
  389.                                     <p>
  390.                                         <i class="fas fa-star filled"></i>
  391.                                         <i class="fas fa-star filled"></i>
  392.                                         <i class="fas fa-star filled"></i>
  393.                                         <i class="fas fa-star filled"></i>
  394.                                         <i class="fas fa-star filled"></i>
  395.                                     </p>
  396.                                 </li>
  397.                                 <li>
  398.                                     Comfort
  399.                                     <p>
  400.                                         <i class="fas fa-star filled"></i>
  401.                                         <i class="fas fa-star filled"></i>
  402.                                         <i class="fas fa-star filled"></i>
  403.                                         <i class="fas fa-star filled"></i>
  404.                                         <i class="fas fa-star filled"></i>
  405.                                     </p>
  406.                                 </li>
  407.                                 <li>
  408.                                     Driving
  409.                                     <p>
  410.                                         <i class="fas fa-star filled"></i>
  411.                                         <i class="fas fa-star filled"></i>
  412.                                         <i class="fas fa-star filled"></i>
  413.                                         <i class="fas fa-star filled"></i>
  414.                                         <i class="fas fa-star filled"></i>
  415.                                     </p>
  416.                                 </li>
  417.                             </ul>
  418.                         </div>
  419.                         <div class="review-card">
  420.                             <div class="review-header-group">
  421.                                 <div class="review-widget-header">
  422.                                         <span class="review-widget-img">
  423.                                             <img src="/img/profiles/avatar-02.jpg"  class="img-fluid" alt="">
  424.                                         </span>
  425.                                     <div class="review-design">
  426.                                         <h6>Casandra</h6>
  427.                                         <p>02 Jan 2023</p>
  428.                                     </div>
  429.                                 </div>
  430.                                 <div class="reviewbox-list-rating">
  431.                                     <p>
  432.                                         <i class="fas fa-star filled"></i>
  433.                                         <i class="fas fa-star filled"></i>
  434.                                         <i class="fas fa-star filled"></i>
  435.                                         <i class="fas fa-star filled"></i>
  436.                                         <i class="fas fa-star filled"></i>
  437.                                         <span> (5.0)</span>
  438.                                     </p>
  439.                                 </div>
  440.                             </div>
  441.                             <p>It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.It was popularised in the 1960s </p>
  442.                             <ul class="review-list-rating">
  443.                                 <li>
  444.                                     quality
  445.                                     <p>
  446.                                         <i class="fas fa-star filled"></i>
  447.                                         <i class="fas fa-star filled"></i>
  448.                                         <i class="fas fa-star filled"></i>
  449.                                         <i class="fas fa-star filled"></i>
  450.                                         <i class="fas fa-star filled"></i>
  451.                                     </p>
  452.                                 </li>
  453.                                 <li>
  454.                                     Price
  455.                                     <p>
  456.                                         <i class="fas fa-star filled"></i>
  457.                                         <i class="fas fa-star filled"></i>
  458.                                         <i class="fas fa-star filled"></i>
  459.                                         <i class="fas fa-star filled"></i>
  460.                                         <i class="fas fa-star filled"></i>
  461.                                     </p>
  462.                                 </li>
  463.                                 <li>
  464.                                     Comfort
  465.                                     <p>
  466.                                         <i class="fas fa-star filled"></i>
  467.                                         <i class="fas fa-star filled"></i>
  468.                                         <i class="fas fa-star filled"></i>
  469.                                         <i class="fas fa-star filled"></i>
  470.                                         <i class="fas fa-star filled"></i>
  471.                                     </p>
  472.                                 </li>
  473.                                 <li>
  474.                                     Driving
  475.                                     <p>
  476.                                         <i class="fas fa-star filled"></i>
  477.                                         <i class="fas fa-star filled"></i>
  478.                                         <i class="fas fa-star filled"></i>
  479.                                         <i class="fas fa-star filled"></i>
  480.                                         <i class="fas fa-star filled"></i>
  481.                                     </p>
  482.                                 </li>
  483.                             </ul>
  484.                         </div>
  486.                     </div>
  488.                     <div class="review-sec leave-reply-form">
  489.                         <div class="review-header">
  490.                             <h4>Leave a Reply</h4>
  491.                         </div>
  492.                         <ul class="review-list-rating mb-3">
  493.                             <li>
  494.                                 quality
  495.                                 <p>
  496.                                     <i class="fas fa-star filled"></i>
  497.                                     <i class="fas fa-star filled"></i>
  498.                                     <i class="fas fa-star filled"></i>
  499.                                     <i class="fas fa-star filled"></i>
  500.                                     <i class="fas fa-star filled"></i>
  501.                                 </p>
  502.                             </li>
  503.                             <li>
  504.                                 Price
  505.                                 <p>
  506.                                     <i class="fas fa-star filled"></i>
  507.                                     <i class="fas fa-star filled"></i>
  508.                                     <i class="fas fa-star filled"></i>
  509.                                     <i class="fas fa-star filled"></i>
  510.                                     <i class="fas fa-star filled"></i>
  511.                                 </p>
  512.                             </li>
  513.                             <li>
  514.                                 Comfort
  515.                                 <p>
  516.                                     <i class="fas fa-star filled"></i>
  517.                                     <i class="fas fa-star filled"></i>
  518.                                     <i class="fas fa-star filled"></i>
  519.                                     <i class="fas fa-star filled"></i>
  520.                                     <i class="fas fa-star filled"></i>
  521.                                 </p>
  522.                             </li>
  523.                             <li>
  524.                                 Driving
  525.                                 <p>
  526.                                     <i class="fas fa-star filled"></i>
  527.                                     <i class="fas fa-star filled"></i>
  528.                                     <i class="fas fa-star filled"></i>
  529.                                     <i class="fas fa-star filled"></i>
  530.                                     <i class="fas fa-star filled"></i>
  531.                                 </p>
  532.                             </li>
  533.                         </ul>
  534.                         <div class="card-body">
  535.                             <div class="review-list">
  536.                                 <ul>
  537.                                     <li class="review-box feedbackbox mb-0">
  538.                                         <div class="review-details">
  539.                                             <form class="#">
  540.                                                 <div class="row">
  541.                                                     <div class="col-lg-6">
  542.                                                         <div class="form-group">
  543.                                                             <label>Full Name <span class="text-danger">*</span></label>
  544.                                                             <input type="text" class="form-control">
  545.                                                         </div>
  546.                                                     </div>
  547.                                                     <div class="col-lg-6">
  548.                                                         <div class="form-group">
  549.                                                             <label>Email Address <span class="text-danger">*</span></label>
  550.                                                             <input type="email" class="form-control">
  551.                                                         </div>
  552.                                                     </div>
  553.                                                     <div class="col-lg-12">
  554.                                                         <div class="form-group">
  555.                                                             <label>Comments </label>
  556.                                                             <textarea rows="4" class="form-control"></textarea>
  557.                                                         </div>
  558.                                                     </div>
  559.                                                 </div>
  560.                                                 <div class="submit-btn">
  561.                                                     <button class="btn btn-primary submit-review" type="submit"> Submit Review</button>
  562.                                                 </div>
  563.                                             </form>
  564.                                         </div>
  565.                                     </li>
  566.                                 </ul>
  567.                             </div>
  568.                         </div>
  569.                     </div> #}
  570.                 </div>
  571.                 <div class="col-lg-4 theiaStickySidebar">
  572.                     <div class="review-sec mt-0">
  573.                         <div class="review-header">
  574.                             <h4>Reservar Vehículo</h4>
  575.                         </div>
  576.                         <div class="">
  577.                             <form class="">
  578.                                 <ul>
  579.                                     <li class="column-group-main">
  580.                                         <div class="form-group">
  581.                                             <label>Nombres</label>
  582.                                             <div class="group-img">
  583.                                                 <input type="text" class="form-control" placeholder="Jhon Doe">
  584.                                             </div>
  585.                                         </div>
  586.                                     </li>
  587.                                     <li class="column-group-main">
  588.                                         <div class="form-group">
  589.                                             <label>Apellidos</label>
  590.                                             <div class="group-img">
  591.                                                 <input type="text" class="form-control" placeholder="Jhon Doe">
  592.                                             </div>
  593.                                         </div>
  594.                                     </li>
  595.                                     <li class="column-group-main">
  596.                                         <div class="form-group">
  597.                                             <label>Documento de Identidad</label>
  598.                                             <div class="group-img">
  599.                                                 <input type="text" class="form-control" placeholder="">
  600.                                             </div>
  601.                                         </div>
  602.                                     </li>
  603.                                     <li class="column-group-main">
  604.                                         <div class="form-group">
  605.                                             <label>Correo electrónico</label>
  606.                                             <div class="group-img">
  607.                                                 <input type="email" class="form-control" placeholder="ejemplo@dominio.com">
  608.                                             </div>
  609.                                         </div>
  610.                                     </li>
  611.                                     <li class="column-group-main">
  612.                                         <div class="form-group m-0">
  613.                                             <label>Fecha de recojo</label>
  614.                                         </div>
  615.                                         <div class="form-group-wrapp sidebar-form">
  616.                                             <div class="form-group me-2">
  617.                                                 <div class="group-img">
  618.                                                     <input type="text" class="form-control datetimepicker" placeholder="04/11/2023">
  619.                                                 </div>
  620.                                             </div>
  621.                                             <div class="form-group">
  622.                                                 <div class="group-img">
  623.                                                     <input type="text" class="form-control timepicker" placeholder="11:00 AM">
  624.                                                 </div>
  625.                                             </div>
  626.                                         </div>
  627.                                     </li>
  628.                                     <li class="column-group-main">
  629.                                         <div class="form-group m-0">
  630.                                             <label>Fecha de devolución</label>
  631.                                         </div>
  632.                                         <div class="form-group-wrapp sidebar-form">
  633.                                             <div class="form-group me-2">
  634.                                                 <div class="group-img">
  635.                                                     <input type="text" class="form-control datetimepicker" placeholder="04/11/2023">
  636.                                                 </div>
  637.                                             </div>
  638.                                             <div class="form-group">
  639.                                                 <div class="group-img">
  640.                                                     <input type="text" class="form-control timepicker" placeholder="11:00 AM">
  641.                                                 </div>
  642.                                             </div>
  643.                                         </div>
  644.                                     </li>
  645.                                     <li class="column-group-last">
  646.                                         <div class="form-group mb-0">
  647.                                             <div class="search-btn">
  648.                                                 <button class="btn btn-primary check-available w-100" type="button" data-bs-toggle="modal" data-bs-target="#pages_edit">
  649.                                                     <i class="feather-calendar"></i> Reservar ahora
  650.                                                 </button>
  651.                                             </div>
  652.                                         </div>
  653.                                     </li>
  654.                                 </ul>
  655.                             </form>
  656.                         </div>
  657.                     </div>
  658.                     {#<div class="review-sec extra-service mt-0">
  659.                         <div class="review-header">
  660.                             <h4>Listing Owner Details</h4>
  661.                         </div>
  662.                         <div class="owner-detail">
  663.                             <div class="owner-img">
  664.                                 <a href=""><img src="/img/profiles/avatar-07.jpg" alt=""></a>
  665.                             </div>
  666.                             <div class="reviewbox-list-rating">
  667.                                 <h5><a>Brooklyn Cars</a></h5>
  668.                                 <p>
  669.                                     <i class="fas fa-star filled"></i>
  670.                                     <i class="fas fa-star filled"></i>
  671.                                     <i class="fas fa-star filled"></i>
  672.                                     <i class="fas fa-star filled"></i>
  673.                                     <i class="fas fa-star filled"></i>
  674.                                     <span> (5.0)</span>
  675.                                 </p>
  676.                             </div>
  677.                         </div>
  678.                         <ul class="booking-list">
  679.                             <li>
  680.                                 No of Listings
  681.                                 <span>05</span>
  682.                             </li>
  683.                             <li>
  684.                                 No of Bookings
  685.                                 <span>225</span>
  686.                             </li>
  687.                             <li>
  688.                                 Verification
  689.                                 <h6>Verified</h6>
  690.                             </li>
  691.                         </ul>
  692.                         <div class="message-btn">
  693.                             <a href="#" class="btn btn-order">Message to owner</a>
  694.                         </div>
  695.                     </div>#}
  696.                     <div class="review-sec share-car mt-0">
  697.                         <div class="review-header">
  698.                             <h4>Compartir este vehículo</h4>
  699.                         </div>
  700.                         <ul class="nav-social">
  701.                             <li>
  702.                                 <a href="javascript:void(0)"><i class="fa-brands fa-facebook-f fa-facebook fi-icon"></i></a>
  703.                             </li>
  704.                             <li>
  705.                                 <a href="javascript:void(0)"><i class="fab fa-instagram fi-icon"></i></a>
  706.                             </li>
  707.                             <li>
  708.                                 <a href="javascript:void(0)"><i class="fab fa-whatsapp fi-icon"></i></a>
  709.                             </li>
  710.                         </ul>
  711.                     </div>
  712.                     <div class="review-sec share-car mt-0 mb-0">
  713.                         <div class="review-header">
  714.                             <h4>Encuéntranos</h4>
  715.                         </div>
  716.                         <p><i class="feather-map-pin"></i> Av. José Gálvez Barrenechea 1079 Urb. Corpac, <br> San Borja, Lima - Perú</p>
  717.                         <br>
  718.                         <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3901.0794900935266!2d-77.01302318737262!3d-12.106710642974399!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x9105c925f4df3e79%3A0xb1724fe6e0c9a6be!2sBenibus%20S.A.C!5e0!3m2!1ses!2spe!4v1686246242553!5m2!1ses!2spe"
  719.                                 class="iframe-video"></iframe>
  720.                     </div>
  721.                 </div>
  722.             </div>
  723.             {#<div class="row">
  724.                 <div class="col-md-12">
  725.                     <div class="details-car-grid">
  726.                         <div class="details-slider-heading">
  727.                             <h3>You May be Interested in</h3>
  728.                         </div>
  729.                         <div class="car-details-slider owl-carousel">
  730.                             <div class="card">
  731.                                 <div class="listing-item pb-0">
  732.                                     <div class="listing-img">
  733.                                         <a href="listing-details.html">
  734.                                             <img src="/img/cars/car-02.jpg" class="img-fluid" alt="KIA">
  735.                                         </a>
  736.                                         <div class="fav-item">
  737.                                             <span class="featured-text">KIA</span>
  738.                                             <a href="javascript:void(0)" class="fav-icon">
  739.                                                 <i class="feather-heart"></i>
  740.                                             </a>
  741.                                         </div>
  742.                                     </div>
  743.                                     <div class="listing-content">
  744.                                         <div class="listing-features">
  745.                                             <div class="author-img">
  746.                                                 <img src="/img/profiles/avatar-02.jpg" alt="author">
  747.                                             </div>
  748.                                             <h3 class="listing-title">
  749.                                                 <a href="javascript:void(0)">Kia Soul 2016</a>
  750.                                             </h3>
  751.                                             <div class="list-rating">
  752.                                                 <i class="fas fa-star filled"></i>
  753.                                                 <i class="fas fa-star filled"></i>
  754.                                                 <i class="fas fa-star filled"></i>
  755.                                                 <i class="fas fa-star filled"></i>
  756.                                                 <i class="fas fa-star filled"></i>
  757.                                                 <span>(5.0)</span>
  758.                                             </div>
  759.                                         </div>
  760.                                         <div class="listing-details-group">
  761.                                             <ul>
  762.                                                 <li>
  763.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="Auto"></span>
  764.                                                     <p>Auto</p>
  765.                                                 </li>
  766.                                                 <li>
  767.                                                     <span><img src="/img/icons/car-parts-02.svg" alt="22 KM"></span>
  768.                                                     <p>22 KM</p>
  769.                                                 </li>
  770.                                                 <li>
  771.                                                     <span><img src="/img/icons/car-parts-03.svg" alt="Petrol"></span>
  772.                                                     <p>Petrol</p>
  773.                                                 </li>
  774.                                             </ul>
  775.                                             <ul>
  776.                                                 <li>
  777.                                                     <span><img src="/img/icons/car-parts-04.svg" alt="Diesel"></span>
  778.                                                     <p>Diesel</p>
  779.                                                 </li>
  780.                                                 <li>
  781.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="2016"></span>
  782.                                                     <p>2016</p>
  783.                                                 </li>
  784.                                                 <li>
  785.                                                     <span><img src="/img/icons/car-parts-06.svg" alt="Persons"></span>
  786.                                                     <p>5 Persons</p>
  787.                                                 </li>
  788.                                             </ul>
  789.                                         </div>
  790.                                         <div class="listing-location-details">
  791.                                             <div class="listing-price">
  792.                                                 <span class="me-2"><i class="feather-map-pin"></i></span> Belgium
  793.                                             </div>
  794.                                             <div class="listing-price">
  795.                                                 <h6>$80 <span>/ Day</span></h6>
  796.                                             </div>
  797.                                         </div>
  798.                                         <div class="listing-button">
  799.                                             <a href="listing-details.html" class="btn btn-order"><span><i
  800.                                                             class="feather-calendar me-2"></i></span>Rent Now</a>
  801.                                         </div>
  802.                                     </div>
  803.                                 </div>
  804.                             </div>
  805.                             <div class="card">
  806.                                 <div class="listing-item pb-0">
  807.                                     <div class="listing-img">
  808.                                         <a href="listing-details.html">
  809.                                             <img src="/img/cars/car-07.jpg" class="img-fluid" alt="Audi">
  810.                                         </a>
  811.                                         <div class="fav-item">
  812.                                             <span class="featured-text">Chevrolet</span>
  813.                                             <a href="javascript:void(0)" class="fav-icon">
  814.                                                 <i class="feather-heart"></i>
  815.                                             </a>
  816.                                         </div>
  817.                                     </div>
  818.                                     <div class="listing-content">
  819.                                         <div class="listing-features">
  820.                                             <div class="author-img">
  821.                                                 <img src="/img/profiles/avatar-07.jpg" alt="author">
  822.                                             </div>
  823.                                             <h3 class="listing-title">
  824.                                                 <a href="javascript:void(0)">Chevrolet Pick Truck 3.5L</a>
  825.                                             </h3>
  826.                                             <div class="list-rating">
  827.                                                 <i class="fas fa-star filled"></i>
  828.                                                 <i class="fas fa-star filled"></i>
  829.                                                 <i class="fas fa-star filled"></i>
  830.                                                 <i class="fas fa-star filled"></i>
  831.                                                 <i class="fas fa-star filled"></i>
  832.                                                 <span>(5.0)</span>
  833.                                             </div>
  834.                                         </div>
  835.                                         <div class="listing-details-group">
  836.                                             <ul>
  837.                                                 <li>
  838.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="Manual"></span>
  839.                                                     <p>Manual</p>
  840.                                                 </li>
  841.                                                 <li>
  842.                                                     <span><img src="/img/icons/car-parts-02.svg" alt="10 KM"></span>
  843.                                                     <p>10 KM</p>
  844.                                                 </li>
  845.                                                 <li>
  846.                                                     <span><img src="/img/icons/car-parts-03.svg" alt="Petrol"></span>
  847.                                                     <p>Petrol</p>
  848.                                                 </li>
  849.                                             </ul>
  850.                                             <ul>
  851.                                                 <li>
  852.                                                     <span><img src="/img/icons/car-parts-04.svg" alt="Power"></span>
  853.                                                     <p>Power</p>
  854.                                                 </li>
  855.                                                 <li>
  856.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="2012"></span>
  857.                                                     <p>2012</p>
  858.                                                 </li>
  859.                                                 <li>
  860.                                                     <span><img src="/img/icons/car-parts-06.svg" alt="Persons"></span>
  861.                                                     <p>5 Persons</p>
  862.                                                 </li>
  863.                                             </ul>
  864.                                         </div>
  865.                                         <div class="listing-location-details">
  866.                                             <div class="listing-price">
  867.                                                 <span><i class="feather-map-pin"></i></span> Spain
  868.                                             </div>
  869.                                             <div class="listing-price">
  870.                                                 <h6>$77 <span>/ Day</span></h6>
  871.                                             </div>
  872.                                         </div>
  873.                                         <div class="listing-button">
  874.                                             <a href="listing-details.html" class="btn btn-order"><span><i
  875.                                                             class="feather-calendar me-2"></i></span>Rent Now</a>
  876.                                         </div>
  877.                                     </div>
  878.                                 </div>
  879.                             </div>
  880.                             <div class="card">
  881.                                 <div class="listing-item pb-0">
  882.                                     <div class="listing-img">
  883.                                         <a href="listing-details.html">
  884.                                             <img src="/img/cars/car-03.jpg" class="img-fluid" alt="Audi">
  885.                                         </a>
  886.                                         <div class="fav-item">
  887.                                             <span class="featured-text">Audi</span>
  888.                                             <a href="javascript:void(0)" class="fav-icon">
  889.                                                 <i class="feather-heart"></i>
  890.                                             </a>
  891.                                         </div>
  892.                                     </div>
  893.                                     <div class="listing-content">
  894.                                         <div class="listing-features">
  895.                                             <div class="author-img">
  896.                                                 <img src="/img/profiles/avatar-03.jpg" alt="author">
  897.                                             </div>
  898.                                             <h3 class="listing-title">
  899.                                                 <a href="javascript:void(0)">Audi A3 2019 new</a>
  900.                                             </h3>
  901.                                             <div class="list-rating">
  902.                                                 <i class="fas fa-star filled"></i>
  903.                                                 <i class="fas fa-star filled"></i>
  904.                                                 <i class="fas fa-star filled"></i>
  905.                                                 <i class="fas fa-star filled"></i>
  906.                                                 <i class="fas fa-star filled"></i>
  907.                                                 <span>(5.0)</span>
  908.                                             </div>
  909.                                         </div>
  910.                                         <div class="listing-details-group">
  911.                                             <ul>
  912.                                                 <li>
  913.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="Manual"></span>
  914.                                                     <p>Manual</p>
  915.                                                 </li>
  916.                                                 <li>
  917.                                                     <span><img src="/img/icons/car-parts-02.svg" alt="10 KM"></span>
  918.                                                     <p>10 KM</p>
  919.                                                 </li>
  920.                                                 <li>
  921.                                                     <span><img src="/img/icons/car-parts-03.svg" alt="Petrol"></span>
  922.                                                     <p>Petrol</p>
  923.                                                 </li>
  924.                                             </ul>
  925.                                             <ul>
  926.                                                 <li>
  927.                                                     <span><img src="/img/icons/car-parts-04.svg" alt="Power"></span>
  928.                                                     <p>Power</p>
  929.                                                 </li>
  930.                                                 <li>
  931.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="2019"></span>
  932.                                                     <p>2019</p>
  933.                                                 </li>
  934.                                                 <li>
  935.                                                     <span><img src="/img/icons/car-parts-06.svg" alt="Persons"></span>
  936.                                                     <p>4 Persons</p>
  937.                                                 </li>
  938.                                             </ul>
  939.                                         </div>
  940.                                         <div class="listing-location-details">
  941.                                             <div class="listing-price">
  942.                                                 <span><i class="feather-map-pin"></i></span> Newyork, USA
  943.                                             </div>
  944.                                             <div class="listing-price">
  945.                                                 <h6>$45 <span>/ Day</span></h6>
  946.                                             </div>
  947.                                         </div>
  948.                                         <div class="listing-button">
  949.                                             <a href="listing-details.html" class="btn btn-order"><span><i
  950.                                                             class="feather-calendar me-2"></i></span>Rent Now</a>
  951.                                         </div>
  952.                                     </div>
  953.                                 </div>
  954.                             </div>
  955.                             <div class="card">
  956.                                 <div class="listing-item pb-0">
  957.                                     <div class="listing-img">
  958.                                         <a href="listing-details.html">
  959.                                             <img src="/img/cars/car-04.jpg" class="img-fluid" alt="Audi">
  960.                                         </a>
  961.                                         <div class="fav-item">
  962.                                             <span class="featured-text">Ferrai</span>
  963.                                             <a href="javascript:void(0)" class="fav-icon">
  964.                                                 <i class="feather-heart"></i>
  965.                                             </a>
  966.                                         </div>
  967.                                     </div>
  968.                                     <div class="listing-content">
  969.                                         <div class="listing-features">
  970.                                             <div class="author-img">
  971.                                                 <img src="/img/profiles/avatar-04.jpg" alt="author">
  972.                                             </div>
  973.                                             <h3 class="listing-title">
  974.                                                 <a href="javascript:void(0)">Ferrari 458 MM Speciale</a>
  975.                                             </h3>
  976.                                             <div class="list-rating">
  977.                                                 <i class="fas fa-star filled"></i>
  978.                                                 <i class="fas fa-star filled"></i>
  979.                                                 <i class="fas fa-star filled"></i>
  980.                                                 <i class="fas fa-star filled"></i>
  981.                                                 <i class="fas fa-star filled"></i>
  982.                                                 <span>(5.0)</span>
  983.                                             </div>
  984.                                         </div>
  985.                                         <div class="listing-details-group">
  986.                                             <ul>
  987.                                                 <li>
  988.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="Manual"></span>
  989.                                                     <p>Manual</p>
  990.                                                 </li>
  991.                                                 <li>
  992.                                                     <span><img src="/img/icons/car-parts-02.svg" alt="14 KM"></span>
  993.                                                     <p>14 KM</p>
  994.                                                 </li>
  995.                                                 <li>
  996.                                                     <span><img src="/img/icons/car-parts-03.svg" alt="Diesel"></span>
  997.                                                     <p>Diesel</p>
  998.                                                 </li>
  999.                                             </ul>
  1000.                                             <ul>
  1001.                                                 <li>
  1002.                                                     <span><img src="/img/icons/car-parts-04.svg" alt="Basic"></span>
  1003.                                                     <p>Basic</p>
  1004.                                                 </li>
  1005.                                                 <li>
  1006.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="2022"></span>
  1007.                                                     <p>2022</p>
  1008.                                                 </li>
  1009.                                                 <li>
  1010.                                                     <span><img src="/img/icons/car-parts-06.svg" alt="Persons"></span>
  1011.                                                     <p>5 Persons</p>
  1012.                                                 </li>
  1013.                                             </ul>
  1014.                                         </div>
  1015.                                         <div class="listing-location-details">
  1016.                                             <div class="listing-price">
  1017.                                                 <span><i class="feather-map-pin"></i></span> Newyork, USA
  1018.                                             </div>
  1019.                                             <div class="listing-price">
  1020.                                                 <h6>$160 <span>/ Day</span></h6>
  1021.                                             </div>
  1022.                                         </div>
  1023.                                         <div class="listing-button">
  1024.                                             <a href="listing-details.html" class="btn btn-order"><span><i
  1025.                                                             class="feather-calendar me-2"></i></span>Rent Now</a>
  1026.                                         </div>
  1027.                                     </div>
  1028.                                 </div>
  1029.                             </div>
  1030.                             <div class="card">
  1031.                                 <div class="listing-item pb-0">
  1032.                                     <div class="listing-img">
  1033.                                         <a href="listing-details.html">
  1034.                                             <img src="/img/cars/car-05.jpg" class="img-fluid" alt="Audi">
  1035.                                         </a>
  1036.                                         <div class="fav-item">
  1037.                                             <span class="featured-text">Chevrolet</span>
  1038.                                             <a href="javascript:void(0)" class="fav-icon">
  1039.                                                 <i class="feather-heart"></i>
  1040.                                             </a>
  1041.                                         </div>
  1042.                                     </div>
  1043.                                     <div class="listing-content">
  1044.                                         <div class="listing-features">
  1045.                                             <div class="author-img">
  1046.                                                 <img src="/img/profiles/avatar-05.jpg" alt="author">
  1047.                                             </div>
  1048.                                             <h3 class="listing-title">
  1049.                                                 <a href="javascript:void(0)">2018 Chevrolet Camaro</a>
  1050.                                             </h3>
  1051.                                             <div class="list-rating">
  1052.                                                 <i class="fas fa-star filled"></i>
  1053.                                                 <i class="fas fa-star filled"></i>
  1054.                                                 <i class="fas fa-star filled"></i>
  1055.                                                 <i class="fas fa-star filled"></i>
  1056.                                                 <i class="fas fa-star filled"></i>
  1057.                                                 <span>(5.0)</span>
  1058.                                             </div>
  1059.                                         </div>
  1060.                                         <div class="listing-details-group">
  1061.                                             <ul>
  1062.                                                 <li>
  1063.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="Manual"></span>
  1064.                                                     <p>Manual</p>
  1065.                                                 </li>
  1066.                                                 <li>
  1067.                                                     <span><img src="/img/icons/car-parts-02.svg" alt="18 KM"></span>
  1068.                                                     <p>18 KM</p>
  1069.                                                 </li>
  1070.                                                 <li>
  1071.                                                     <span><img src="/img/icons/car-parts-03.svg" alt="Diesel"></span>
  1072.                                                     <p>Diesel</p>
  1073.                                                 </li>
  1074.                                             </ul>
  1075.                                             <ul>
  1076.                                                 <li>
  1077.                                                     <span><img src="/img/icons/car-parts-04.svg" alt="Power"></span>
  1078.                                                     <p>Power</p>
  1079.                                                 </li>
  1080.                                                 <li>
  1081.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="2018"></span>
  1082.                                                     <p>2018</p>
  1083.                                                 </li>
  1084.                                                 <li>
  1085.                                                     <span><img src="/img/icons/car-parts-06.svg" alt="Persons"></span>
  1086.                                                     <p>4 Persons</p>
  1087.                                                 </li>
  1088.                                             </ul>
  1089.                                         </div>
  1090.                                         <div class="listing-location-details">
  1091.                                             <div class="listing-price">
  1092.                                                 <span><i class="feather-map-pin"></i></span> Germany
  1093.                                             </div>
  1094.                                             <div class="listing-price">
  1095.                                                 <h6>$36 <span>/ Day</span></h6>
  1096.                                             </div>
  1097.                                         </div>
  1098.                                         <div class="listing-button">
  1099.                                             <a href="listing-details.html" class="btn btn-order"><span><i
  1100.                                                             class="feather-calendar me-2"></i></span>Rent Now</a>
  1101.                                         </div>
  1102.                                     </div>
  1103.                                 </div>
  1104.                             </div>
  1105.                             <div class="card">
  1106.                                 <div class="listing-item pb-0">
  1107.                                     <div class="listing-img">
  1108.                                         <a href="listing-details.html">
  1109.                                             <img src="/img/cars/car-06.jpg" class="img-fluid" alt="Audi">
  1110.                                         </a>
  1111.                                         <div class="fav-item">
  1112.                                             <span class="featured-text">Acura</span>
  1113.                                             <a href="javascript:void(0)" class="fav-icon">
  1114.                                                 <i class="feather-heart"></i>
  1115.                                             </a>
  1116.                                         </div>
  1117.                                     </div>
  1118.                                     <div class="listing-content">
  1119.                                         <div class="listing-features">
  1120.                                             <div class="author-img">
  1121.                                                 <img src="/img/profiles/avatar-06.jpg" alt="author">
  1122.                                             </div>
  1123.                                             <h3 class="listing-title">
  1124.                                                 <a href="javascript:void(0)">Acura Sport Version</a>
  1125.                                             </h3>
  1126.                                             <div class="list-rating">
  1127.                                                 <i class="fas fa-star filled"></i>
  1128.                                                 <i class="fas fa-star filled"></i>
  1129.                                                 <i class="fas fa-star filled"></i>
  1130.                                                 <i class="fas fa-star filled"></i>
  1131.                                                 <i class="fas fa-star filled"></i>
  1132.                                                 <span>(5.0)</span>
  1133.                                             </div>
  1134.                                         </div>
  1135.                                         <div class="listing-details-group">
  1136.                                             <ul>
  1137.                                                 <li>
  1138.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="Auto"></span>
  1139.                                                     <p>Auto</p>
  1140.                                                 </li>
  1141.                                                 <li>
  1142.                                                     <span><img src="/img/icons/car-parts-02.svg" alt="12 KM"></span>
  1143.                                                     <p>12 KM</p>
  1144.                                                 </li>
  1145.                                                 <li>
  1146.                                                     <span><img src="/img/icons/car-parts-03.svg" alt="Diesel"></span>
  1147.                                                     <p>Diesel</p>
  1148.                                                 </li>
  1149.                                             </ul>
  1150.                                             <ul>
  1151.                                                 <li>
  1152.                                                     <span><img src="/img/icons/car-parts-04.svg" alt="Power"></span>
  1153.                                                     <p>Power</p>
  1154.                                                 </li>
  1155.                                                 <li>
  1156.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="2013"></span>
  1157.                                                     <p>2013</p>
  1158.                                                 </li>
  1159.                                                 <li>
  1160.                                                     <span><img src="/img/icons/car-parts-06.svg" alt="Persons"></span>
  1161.                                                     <p>5 Persons</p>
  1162.                                                 </li>
  1163.                                             </ul>
  1164.                                         </div>
  1165.                                         <div class="listing-location-details">
  1166.                                             <div class="listing-price">
  1167.                                                 <span><i class="feather-map-pin"></i></span> Newyork, USA
  1168.                                             </div>
  1169.                                             <div class="listing-price">
  1170.                                                 <h6>$30 <span>/ Day</span></h6>
  1171.                                             </div>
  1172.                                         </div>
  1173.                                         <div class="listing-button">
  1174.                                             <a href="listing-details.html" class="btn btn-order"><span><i
  1175.                                                             class="feather-calendar me-2"></i></span>Rent Now</a>
  1176.                                         </div>
  1177.                                     </div>
  1178.                                 </div>
  1179.                             </div>
  1180.                             <div class="card">
  1181.                                 <div class="listing-item pb-0">
  1182.                                     <div class="listing-img">
  1183.                                         <a href="listing-details.html">
  1184.                                             <img src="/img/cars/car-02.jpg" class="img-fluid" alt="KIA">
  1185.                                         </a>
  1186.                                         <div class="fav-item">
  1187.                                             <span class="featured-text">KIA</span>
  1188.                                             <a href="javascript:void(0)" class="fav-icon">
  1189.                                                 <i class="feather-heart"></i>
  1190.                                             </a>
  1191.                                         </div>
  1192.                                     </div>
  1193.                                     <div class="listing-content">
  1194.                                         <div class="listing-features">
  1195.                                             <div class="author-img">
  1196.                                                 <img src="/img/profiles/avatar-02.jpg" alt="author">
  1197.                                             </div>
  1198.                                             <h3 class="listing-title">
  1199.                                                 <a href="javascript:void(0)">Kia Soul 2016</a>
  1200.                                             </h3>
  1201.                                             <div class="list-rating">
  1202.                                                 <i class="fas fa-star filled"></i>
  1203.                                                 <i class="fas fa-star filled"></i>
  1204.                                                 <i class="fas fa-star filled"></i>
  1205.                                                 <i class="fas fa-star filled"></i>
  1206.                                                 <i class="fas fa-star filled"></i>
  1207.                                                 <span>(5.0)</span>
  1208.                                             </div>
  1209.                                         </div>
  1210.                                         <div class="listing-details-group">
  1211.                                             <ul>
  1212.                                                 <li>
  1213.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="Auto"></span>
  1214.                                                     <p>Auto</p>
  1215.                                                 </li>
  1216.                                                 <li>
  1217.                                                     <span><img src="/img/icons/car-parts-02.svg" alt="22 KM"></span>
  1218.                                                     <p>22 KM</p>
  1219.                                                 </li>
  1220.                                                 <li>
  1221.                                                     <span><img src="/img/icons/car-parts-03.svg" alt="Petrol"></span>
  1222.                                                     <p>Petrol</p>
  1223.                                                 </li>
  1224.                                             </ul>
  1225.                                             <ul>
  1226.                                                 <li>
  1227.                                                     <span><img src="/img/icons/car-parts-04.svg" alt="Diesel"></span>
  1228.                                                     <p>Diesel</p>
  1229.                                                 </li>
  1230.                                                 <li>
  1231.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="2016"></span>
  1232.                                                     <p>2016</p>
  1233.                                                 </li>
  1234.                                                 <li>
  1235.                                                     <span><img src="/img/icons/car-parts-06.svg" alt="Persons"></span>
  1236.                                                     <p>5 Persons</p>
  1237.                                                 </li>
  1238.                                             </ul>
  1239.                                         </div>
  1240.                                         <div class="listing-location-details">
  1241.                                             <div class="listing-price">
  1242.                                                 <span><i class="feather-map-pin"></i></span> Belgium
  1243.                                             </div>
  1244.                                             <div class="listing-price">
  1245.                                                 <h6>$80 <span>/ Day</span></h6>
  1246.                                             </div>
  1247.                                         </div>
  1248.                                         <div class="listing-button">
  1249.                                             <a href="listing-details.html" class="btn btn-order"><span><i
  1250.                                                             class="feather-calendar me-2"></i></span>Rent Now</a>
  1251.                                         </div>
  1252.                                     </div>
  1253.                                 </div>
  1254.                             </div>
  1255.                             <div class="card">
  1256.                                 <div class="listing-item pb-0">
  1257.                                     <div class="listing-img">
  1258.                                         <a href="listing-details.html">
  1259.                                             <img src="/img/cars/car-05.jpg" class="img-fluid" alt="Audi">
  1260.                                         </a>
  1261.                                         <div class="fav-item">
  1262.                                             <span class="featured-text">Chevrolet</span>
  1263.                                             <a href="javascript:void(0)" class="fav-icon">
  1264.                                                 <i class="feather-heart"></i>
  1265.                                             </a>
  1266.                                         </div>
  1267.                                     </div>
  1268.                                     <div class="listing-content">
  1269.                                         <div class="listing-features">
  1270.                                             <div class="author-img">
  1271.                                                 <img src="/img/profiles/avatar-05.jpg" alt="author">
  1272.                                             </div>
  1273.                                             <h3 class="listing-title">
  1274.                                                 <a href="javascript:void(0)">2018 Chevrolet Camaro</a>
  1275.                                             </h3>
  1276.                                             <div class="list-rating">
  1277.                                                 <i class="fas fa-star filled"></i>
  1278.                                                 <i class="fas fa-star filled"></i>
  1279.                                                 <i class="fas fa-star filled"></i>
  1280.                                                 <i class="fas fa-star filled"></i>
  1281.                                                 <i class="fas fa-star filled"></i>
  1282.                                                 <span>(5.0)</span>
  1283.                                             </div>
  1284.                                         </div>
  1285.                                         <div class="listing-details-group">
  1286.                                             <ul>
  1287.                                                 <li>
  1288.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="Manual"></span>
  1289.                                                     <p>Manual</p>
  1290.                                                 </li>
  1291.                                                 <li>
  1292.                                                     <span><img src="/img/icons/car-parts-02.svg" alt="18 KM"></span>
  1293.                                                     <p>18 KM</p>
  1294.                                                 </li>
  1295.                                                 <li>
  1296.                                                     <span><img src="/img/icons/car-parts-03.svg" alt="Diesel"></span>
  1297.                                                     <p>Diesel</p>
  1298.                                                 </li>
  1299.                                             </ul>
  1300.                                             <ul>
  1301.                                                 <li>
  1302.                                                     <span><img src="/img/icons/car-parts-04.svg" alt="Power"></span>
  1303.                                                     <p>Power</p>
  1304.                                                 </li>
  1305.                                                 <li>
  1306.                                                     <span><img src="/img/icons/car-parts-05.svg" alt="2018"></span>
  1307.                                                     <p>2018</p>
  1308.                                                 </li>
  1309.                                                 <li>
  1310.                                                     <span><img src="/img/icons/car-parts-06.svg" alt="Persons"></span>
  1311.                                                     <p>4 Persons</p>
  1312.                                                 </li>
  1313.                                             </ul>
  1314.                                         </div>
  1315.                                         <div class="listing-location-details">
  1316.                                             <div class="listing-price">
  1317.                                                 <span><i class="feather-map-pin"></i></span> Germany
  1318.                                             </div>
  1319.                                             <div class="listing-price">
  1320.                                                 <h6>$36 <span>/ Day</span></h6>
  1321.                                             </div>
  1322.                                         </div>
  1323.                                         <div class="listing-button">
  1324.                                             <a href="listing-details.html" class="btn btn-order"><span><i
  1325.                                                             class="feather-calendar me-2"></i></span>Rent Now</a>
  1326.                                         </div>
  1327.                                     </div>
  1328.                                 </div>
  1329.                             </div>
  1330.                         </div>
  1331.                     </div>
  1332.                 </div>
  1333.             </div>#}
  1334.         </div>
  1335.     </section>
  1337.     <!-- Modal -->
  1338.     <div class="modal custom-modal fade check-availability-modal" id="pages_edit" role="dialog">
  1339.         <div class="modal-dialog modal-dialog-centered modal-md">
  1340.             <div class="modal-content">
  1341.                 <div class="modal-header">
  1342.                     <div class="form-header text-start mb-0">
  1343.                         <h4 class="mb-0 text-dark fw-bold">Availability Details</h4>
  1344.                     </div>
  1345.                     <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
  1346.                         <span class="align-center" aria-hidden="true">&times;</span>
  1347.                     </button>
  1348.                 </div>
  1349.                 <div class="modal-body">
  1350.                     <div class="row">
  1351.                         <div class="col-lg-12 col-md-12">
  1352.                             <div class="available-for-ride">
  1353.                                 <p><i class="fa-regular fa-circle-check"></i>Chevrolet Camaro is available for a ride
  1354.                                 </p>
  1355.                             </div>
  1356.                         </div>
  1357.                         <div class="col-lg-12 col-md-12">
  1358.                             <div class="row booking-info">
  1359.                                 <div class="col-md-4 pickup-address">
  1360.                                     <h5>Pickup</h5>
  1361.                                     <p>45, 4th Avanue Mark Street USA</p>
  1362.                                     <span>Date & time : 11 Jan 2023</span>
  1363.                                 </div>
  1364.                                 <div class="col-md-4 drop-address">
  1365.                                     <h5>Drop Off</h5>
  1366.                                     <p>78, 10th street Laplace USA</p>
  1367.                                     <span>Date & time : 11 Jan 2023</span>
  1368.                                 </div>
  1369.                                 <div class="col-md-4 booking-amount">
  1370.                                     <h5>Booking Amount</h5>
  1371.                                     <h6><span>$300 </span> /day</h6>
  1372.                                 </div>
  1373.                             </div>
  1374.                         </div>
  1375.                         <div class="col-lg-12 col-md-12">
  1376.                             <div class="booking-info seat-select">
  1377.                                 <h6>Extra Service</h6>
  1378.                                 <label class="custom_check">
  1379.                                     <input type="checkbox" name="rememberme" class="rememberme">
  1380.                                     <span class="checkmark"></span>
  1381.                                     Baby Seat - <span class="ms-2">$10</span>
  1382.                                 </label>
  1383.                             </div>
  1384.                         </div>
  1385.                         <div class="col-md-12">
  1386.                             <div class="booking-info pay-amount">
  1387.                                 <h6>Deposit Option</h6>
  1388.                                 <div class="radio radio-btn">
  1389.                                     <label>
  1390.                                         <input type="radio" name="radio"> Pay Deposit
  1391.                                     </label>
  1392.                                 </div>
  1393.                                 <div class="radio">
  1394.                                     <label>
  1395.                                         <input type="radio" name="radio"> Full Amount
  1396.                                     </label>
  1397.                                 </div>
  1398.                             </div>
  1399.                         </div>
  1400.                         <div class="col-md-6"></div>
  1401.                         <div class="col-md-6">
  1402.                             <div class="booking-info service-tax">
  1403.                                 <ul>
  1404.                                     <li>Booking Price <span>$300</span></li>
  1405.                                     <li>Extra Service <span>$10</span></li>
  1406.                                     <li>Tax <span>$5</span></li>
  1407.                                 </ul>
  1408.                             </div>
  1409.                             <div class="grand-total">
  1410.                                 <h5>Grand Total</h5>
  1411.                                 <span>$315</span>
  1412.                             </div>
  1413.                         </div>
  1414.                     </div>
  1415.                 </div>
  1416.                 <div class="modal-footer">
  1417.                     <a href="booking.html" class="btn btn-back">Go to Details<i class="fa-solid fa-arrow-right"></i></a>
  1418.                 </div>
  1419.             </div>
  1420.         </div>
  1421.     </div>
  1422.     <!-- /Modal -->
  1424. {% endblock %}
  1425. {% block scriptsjs %}
  1426.     <!-- Slick JS -->
  1427.     <script src="/plugins/slick/slick.js"></script>
  1429.     <!-- Sticky Sidebar JS -->
  1430.     <script src="/plugins/theia-sticky-sidebar/ResizeSensor.js"></script>
  1431.     <script src="/plugins/theia-sticky-sidebar/theia-sticky-sidebar.js"></script>
  1432. {% endblock %}