<div id="accordion" class="panel-group">
    <div class="panel panel-default">
        <div>
            <h4 class="panel-title">
                <div style="margin-top:20px;" >
                    <div style="padding:0 !important;" class="mapcantiner_inner1">
                        <div style="margin:0 0 0; padding:0 0 0;" class="">
                            <div align="center" class="col-md-2 sightmargin overviueimgcar"> <span class="image_box padding_margin0"> <img src="/images/guide_icon.png" style="height:50px; width:auto;"></span> <br>
                                <p style="font-size:12px;"> Guide </p></div>
                            <div align="left" class="col-md-2 sightmargin padding_margin0">
                                <div class="amenities">
                                    <ul>
                                        <li style="float:left; line-height:13px;  padding: 0 0 0 5px; text-align:center;" title="No of Adult"><i class="icon_pertion"></i><br>
                                            <br>
                                            3</li>
                                        <li style="float:left; line-height:13px;  padding: 0 0 0 5px; text-align:center;" title="No of Child"><i class="icon_child"></i><br>
                                            <br>
                                            2</li>
                                        <li style="float:left; line-height:13px;  padding: 0 0 0 5px; text-align:center;" title="No of Guide"><i class="icon_guide"></i><br>
                                            <br>
                                            1</li>
                                    </ul>
                                </div>
                            </div>
                            <div align="left" class="col-md-31 sightmargin overviueimg2car1"> <span class="vehicle_name"><?php echo $data['pickup_city']; ?></span><br>
                                <span class="vehicle_name"><?php echo $data['pickup_date']; ?> <br> <?php echo $data['pickup_time']; ?></span></div>

                            <div align="left" class="col-md-31 sightmargin overviueimg2"> <span class="vehicle_name">&nbsp;</span><br>
                                <span class="vehicle_name">&nbsp;</span> </div>

                            <div align="left" class="col-md-31 sightmargin overviueimg2 padding12top"> <span class="vehicle_name"><?php echo $data['guide_language_name']; ?></span></div>

                            <div align="left" style="line-height:" class="col-md-2 sightmargin padding_margin0">
                                <div style="float:left;" class="vehicle_name">&#x20b9;1500 </div><br>


                                <div id="item_3" class="tooltip" style="float:left; cursor:pointer;">
                                    Fare Details
                                    <div class="tooltiptext" title="Item 3 Description">
                                        <table width="90%" align="center" cellspacing="5" cellpadding="5" style="color:#fff;">
                                            <tr>
                                                <td>Base Fare</td>
                                                <td align="right">Rs 300</td>
                                            </tr>
                                            <tr>
                                                <td>Per KM Price</td>
                                                <td align="right">Rs 7</td>
                                            </tr>

                                            <tr>
                                                <td>Distance</td>
                                                <td align="right">50KM</td>
                                            </tr>

                                            <tr>
                                                <td>Tex (14.5%)</td>
                                                <td align="right">Rs 100</td>
                                            </tr>

                                            <tr>
                                                <td>Total Fare</td>
                                                <td align="right">Rs 500</td>
                                            </tr>

                                            <tr>
                                                <td>Base Fare</td>
                                                <td align="right">Rs 300</td>
                                            </tr>
                                        </table>
                                    </div>
                                </div>
                                <div class="vehicle_name pull-left"  ><a class="btn btn-more" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">more..</a></div>
                            </div>
                        </div>

                        <div class="clearfix"> </div>
                        <div id="collapseOne" class="panel-collapse collapse">
                            <div >
                                <div style="" >
                                    <div style="padding:0 !important;" class="mapcantiner_inner1">

                                        <?php for ($i = 1; $i <= 2; $i++) { ?>

                                            <div style="margin:0 0 10px; padding:0 0 10px; " class="testimonial_box col-md-10">


                                                <div style="margin:0 0 0; padding:0 0 0;" class="">
                                                    <div align="center" class="col-md-2 sightmargin overviueimgcar"> <span class="image_box padding_margin0"> <img src="/images/guide/1.jpg"></span> <br>
                                                    </div>
                                                    <div align="left" class="col-md-8 ">
                                                        <div class="amenities">
                                                            <p style="font-size:12px;"> <strong>Shruti</strong> <br>
                                                                New Delhi, Delhi, India
                                                            </p>
                                                        </div>

                                                    </div>
                                                    <div align="left" style="float:right;" class="col-md-2 sightmargin padding_margin0">
                                                        <div style="float:left;" class="vehicle_name"  >&#x20b9;500 /h</div><br>
                                                        <div id="item_3" class="tooltip" style="float:left; cursor:pointer;">
                                                            Fare Details
                                                            <div class="tooltiptext" title="Item 3 Description">
                                                                <table width="90%" align="center" cellspacing="5" cellpadding="5" style="color:#fff; ">
                                                                    <tr>
                                                                        <td>Base Fare</td>
                                                                        <td align="right">Rs 300</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Per KM Price</td>
                                                                        <td align="right">Rs 7</td>
                                                                    </tr>

                                                                    <tr>
                                                                        <td>Distance</td>
                                                                        <td align="right">50KM</td>
                                                                    </tr>

                                                                    <tr>
                                                                        <td>Tex (14.5%)</td>
                                                                        <td align="right">Rs 100</td>
                                                                    </tr>

                                                                    <tr>
                                                                        <td>Total Fare</td>
                                                                        <td align="right">Rs 500</td>
                                                                    </tr>

                                                                    <tr>
                                                                        <td>Base Fare</td>
                                                                        <td align="right">Rs 300</td>
                                                                    </tr>
                                                                </table>
                                                            </div>
                                                        </div><br>


                                                        <div class="col-sm-12 padding0 car_select_but" style="width:52px;">

                                                            <label class="select-car">Book
                                                                <input type="radio" class="vehicle-select" name="vehicleid" value="<?php echo $i; ?>">
                                                                <span class="checkmarkSelect"></span>
                                                            </label>

                                                        </div>



                                                    </div>

                                                    <div align="left" class="col-md-8 ">
                                                        <span class="vehicle_name col-sm-1 padding_margin0">Rating:</span>
                                                        <span class="col-md-6">
                                                            <img src="/images/star_icon.png" style="width:10px; height:10px;">
                                                            <img src="/images/star_icon.png" style="width:10px; height:10px;">
                                                            <img src="/images/star_icon.png" style="width:10px; height:10px;">
                                                            <img src="/images/star_icon.png" style="width:10px; height:10px;">
                                                            <img src="/images/star_icon.png" style="width:10px; height:10px;">
                                                        </span></div>

                                                    <div align="left" class="col-md-8 " style="margin-bottom:5px;">
                                                        <span class="vehicle_name col-sm-2 padding_margin0">Languages:</span>
                                                        <span class="col-md-10">
                                                            English (fluent), French (conversational), Hindi (fluent)
                                                        </span> </div>

                                                    <div align="left" class="col-md-10 ">
                                                        <span class="vehicle_name col-sm-2 padding_margin0" style="width:12.667%;">Biography:</span>
                                                        <span class="col-md-10">
                                                            My Name is Vishnu, and I'm a professional tour guide of Northern India, approved by the Ministry of Tourism, Govt of India.
                                                        </span> </div>

                                                    <div class="clearfix"> </div>

                                                    <div class="col-sm-12">

                                                        <div  style="margin-bottom:10px !important; background:none !important; border:none !important; padding:0;">
                                                            <div class="mapcantiner_inner1" style="padding:0 !important;">
                                                                <div class="" style="margin:0 0 10px; padding:0 0 10px;">
                                                                    <div class="tab">
                                                                        <button class="tablinks icon_about" onclick="openCity(event, 'About-<?php echo $i; ?>')">About</button>
                                                                        <button class="tablinks icon_expriance" onclick="openCity(event, 'Experience-<?php echo $i; ?>')">Experience</button>
                                                                        <button class="tablinks icon_qualification" onclick="openCity(event, 'Qualifications-<?php echo $i; ?>')">Qualifications</button>
                                                                        <button class="tablinks icon_review" onclick="openCity(event, 'Reviews-<?php echo $i; ?>')">Reviews</button>
                                                                        <button class="tablinks icon_language" onclick="openCity(event, 'Language-<?php echo $i; ?>')">Language </button>
                                                                        <button class="tablinks icon_specialities" onclick="openCity(event, 'Specialities-<?php echo $i; ?>')">Specialities </button>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>


                                                <div >

                                                    <div align="left" class="col-md-12">
                                                        <div id="About-<?php echo $i; ?>" class="tabcontent" style="display:none;">
                                                            <h3>About</h3>
                                                            <p><span class="vehicle_name" style="font-size:13px; text-align:justify; font-weight:normal; line-height:18px;">
                                                                    My Name is Vishnu, and I'm a professional tour guide of Northern India, approved by the Ministry of Tourism, Govt of India.<br>
                                                                    <br>

                                                                    My area of expertise are New Delhi, Agra & Jaipur, which is also known as the Golden Triangle of India. I have an experience of more then 10 years with almost 2000 successful local and outstation tours catering to over 10000 satisfied overseas guests from almost all the countries around the world.<br>
                                                                    <br>

                                                                    Guiding and tour escorting have been my passion from very beginning because my father and my grandfather both were tour guide, so I'm the third generation in this profession. Hence I did my master in Indian history from MDS University. Teaching, reading, traveling, exploring new sites & places of tourist interest are my hobbies.</span></p>
                                                        </div>

                                                        <div id="Experience-<?php echo $i; ?>" class="tabcontent" style="display:none;">
                                                            <h3>PROFESSIONAL EXPERIENCE</h3>
                                                            <p>
                                                                <span class="vehicle_name" style="font-size:13px; text-align:justify; font-weight:normal; line-height:18px;">

                                                                    <ul>
                                                                        <li style="line-height:18px;"> * Working as a Local Tour Guide In Northern India for the past 10 Years.</li>
                                                                        <li style="line-height:18px;"> * Worked With leading tour agencies of New Delhi</li>

                                                                    </ul>

                                                                </span>
                                                            </p>
                                                        </div>

                                                        <div id="Qualifications-<?php echo $i; ?>" class="tabcontent" style="display:none;">
                                                            <h3>GUIDE QUALIFICATIONS</h3>
                                                            <p>
                                                                <span class="vehicle_name" style="font-size:13px; text-align:justify; font-weight:normal; line-height:18px;">
                                                                    <ul>
                                                                        <li style="line-height:18px;">* Licensed By The Ministry Of Tourism, Govt Of India.English (fluent), French (conversational), Hindi (fluent) </li>


                                                                    </ul>
                                                                </span>
                                                            </p>

                                                            <h3>EDUCATION QUALIFICATIONS</h3>

                                                            <p>
                                                                <span class="vehicle_name" style="font-size:13px; text-align:justify; font-weight:normal; line-height:18px;">
                                                                    <ul>
                                                                        <li style="line-height:18px;"> * Master Of Arts ( History )….From MDS University.</li>
                                                                        <li style="line-height:18px;"> * Bachelor Of Arts ( History )….From MDS University. </li>

                                                                    </ul>
                                                                </span>

                                                            </p>
                                                        </div>

                                                        <div id="Reviews-<?php echo $i; ?>" class="tabcontent" style="display:none;">
                                                            <h3>REVIEW</h3>
                                                            <p>
                                                                <span class="vehicle_name" style="font-size:13px; text-align:justify; font-weight:normal; line-height:18px;">
                                                                    <ul>
                                                                        <li></li>


                                                                    </ul>
                                                                </span>
                                                            </p>


                                                        </div>

                                                        <div id="Language-<?php echo $i; ?>" class="tabcontent" style="display:none;">
                                                            <h3>LANGUAGE</h3>
                                                            <p>
                                                                <span class="vehicle_name" style="font-size:13px; text-align:justify; font-weight:normal; line-height:18px;">
                                                                    <ul>
                                                                        <li style="line-height:18px;">* Licensed By The Ministry Of Tourism, Govt Of India.</li>
                                                                        <li style="line-height:18px;"> * Guiding Training From The "Indian Institute Of Tourism & Travel Management".</li>
                                                                        <li style="line-height:18px;">* Advanced Level French, Alliance Francaise De Ahamdabad.</li>
                                                                        <li style="line-height:18px;">* American Safety And Health Institute First Aid Training, Delhi.</li>
                                                                        <li style="line-height:18px;">* Govt. Of India Regional Level Guide Training ( Northern Region ).</li>
                                                                    </ul>
                                                                </span>
                                                            </p>

                                                        </div>

                                                        <div id="Specialities-<?php echo $i; ?>" class="tabcontent" style="display:none;">
                                                            <h3>Specialities</h3>
                                                            <p>
                                                                <span class="vehicle_name" style="font-size:13px; text-align:justify; font-weight:normal; line-height:23px;">
                                                                    <ul>
                                                                        <li style="line-height:18px;">* Licensed By The Ministry Of Tourism, Govt Of India.</li>
                                                                        <li style="line-height:18px;"> * Guiding Training From The "Indian Institute Of Tourism & Travel Management".</li>
                                                                        <li style="line-height:18px;">* Advanced Level French, Alliance Francaise De Ahamdabad.</li>
                                                                        <li style="line-height:18px;">* American Safety And Health Institute First Aid Training, Delhi.</li>
                                                                        <li style="line-height:18px;">* Govt. Of India Regional Level Guide Training ( Northern Region ).</li>
                                                                    </ul>
                                                                </span>
                                                            </p>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        <?php } ?>
                                    </div>
                                    <div class="clearfix"> </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </h4>
        </div>
    </div>
</div>