Mini Kabibi Habibi

<div data-options="dxView : { name: 'Index', layout: 'index' } ">
    <div data-options="dxContent : { targetPlaceholder: 'content' } ">

        <div class="index-fake-map">
            <img src="images/fake-map.png">
        </div>

        <div style="float: left;">

            <div style="overflow: hidden;">
                <h1 style="float: left;">Photos of beautiful places, taken by our users
                </h1>
                <div class="index-view-all" data-bind="click: DXTravel.notImplemented">
                    View all 321
               
                </div>
            </div>
            <div class="index-city-images">
                <img title="Paris" src="images/paris-small.jpg" width="89" height="87" data-bind="fancybox: { path: 'images/paris.jpg' }">
                <img title="Praga" src="images/praga-small.jpg" width="89" height="87" data-bind="fancybox: { path: 'images/praga.jpg' }">
                <img title="Sarasota" src="images/sarasotaflorida-small.jpg" width="89" height="87" data-bind="fancybox: { path: 'images/sarasotaflorida.jpg' }">
                <img title="Las Vegas" src="images/vegas-small.jpg" width="89" height="87" data-bind="fancybox: { path: 'images/vegas.jpg' }">
                <img title="New York" src="images/New-York-small.jpg" width="89" height="87" data-bind="fancybox: { path: 'images/New-York.jpg' }">
            </div>
            <div class="index-trips-list">
                <h1>Great travel packages</h1>
                <ul>
                    <!-- ko foreach: greatTravelPackages -->
                    <li data-bind="text: $data, click: DXTravel.notImplemented"></li>
                    <!-- /ko -->
                    <li class="index-italic-font" data-bind="click: DXTravel.notImplemented">many others ...</li>
                </ul>
            </div>
            <div class="index-trips-list">
                <h1>Recommended</h1>
                <ul data-bind="foreach: recommendedTravels">
                    <li data-bind="text: $data, click: DXTravel.notImplemented"></li>
                </ul>
                <div><strong>Or, Find A Place<br>
                    <span class="index-italic-font">That’s Special To You</span></strong></div>
                <select class="index-popular-destination" data-bind="options: greatTravelPackages, optionsCaption: 'Popular Travel Destination'">
                </select>
            </div>
        </div>

        <div class="index-right">
            <h2>Create a trip</h2>
            <div class="index-right-step">
                <div class="grid_2">
                    <div class="index-flight-out"></div>
                </div>
                <div data-options="dxViewPlaceholder : { viewName: '_fromAirport' } "></div>
            </div>
            <div class="index-right-step">
                <div class="grid_2">Date:</div>
                <div class="index-date-font">
                    <div data-options="dxViewPlaceholder : { viewName: '_outboundDate' } "></div>
                </div>
            </div>
            <div class="index-right-step">
                <div class="grid_2">
                    <div class="index-flight-in">
                    </div>
                </div>
                <div data-options="dxViewPlaceholder : { viewName: '_toAirport' } "></div>
            </div>

            <div class="index-right-step">
                <div class="grid_2">Date:</div>
                <div class="index-date-font">
                    <div data-options="dxViewPlaceholder : { viewName: '_inboundDate' } "></div>
                </div>
            </div>
            <div class="index-find-deals" data-bind="click: findFlights"></div>

        </div>

        <div style="clear: both;"></div>

    </div>
</div>