WordPress loop, search results - php

Question

looking for a steer in the right direction getting this loop working. I'm nearly there but not 100% as I've got a mysterious box appearing at the top and the bottom of the search results. Would anyone be able to check over to see if the loop is right, please?
I've tried jigging the loop around but can't make any sense of it.
<?php get_header(); ?>
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-body">
<p class="text-muted text-size-small">
<?php
global $wp_query;
echo 'You have '.$wp_query->found_posts.' results found.';?>
</p>
<hr>
<?
php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<div class="media-body">
<h6 class="media-heading text-semibold">
<?php echo get_post_meta(get_the_id(), 'title', true ); ?>,
<?php echo get_post_meta(get_the_id(), 'firstname', true ); ?>,
<?php echo get_post_meta(get_the_id(), 'lastname', true ); ?>
</h6>
<ul class="list-inline list-inline-separate text-muted mb-10">
<li><a href="#" class="text-muted">
<?php echo get_post_meta( get_the_id(), 'type', true ); ?>
</a> </li>
<li><?php echo get_post_meta(get_the_id(), 'netbios_name', true ); ?> |
<?php echo get_post_meta(get_the_id(), 'device_class', true ); ?></li>
</ul>
<?php echo get_post_meta( get_the_id(), 'asset_id', true ); ?>
<?php echo get_post_meta(get_the_id(), 'asset_status', true ); ?>
</div>
<div class="media-right text-nowrap">
<a href="<?php the_permalink();?>"
class="btn btn-warning">View</a>
</div>
</li>
<ul class="media-list content-group">
<li class="media panel panel-body stack-media-on-mobile">
<div class="media-left">
<a href="#">
<img src="assets/images/demo/brands/dell.png" class="img-rounded img-lg" alt="">
</a>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div>
</div>
</div>
</div>
<?php get_template_part('footer', 'simple');?>
<?php get_footer(); ?>
Here's what the HTML view is spitting out
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-body">
<p class="text-muted text-size-small">
You have 3 results found. </p>
<hr>
<div class="media-body">
<h6 class="media-heading text-
semibold">
, , </h6>
<ul class="list-inline list-inline-
separate text-muted mb-10">
<li><a href="#" class="text-
muted"> </a></li>
<li> | </li>
</ul>
</div>
<div class="media-right text-nowrap">
View
</div>
</li>
<ul class="media-list content-group">
<li class="media panel panel-body stack-
media-on-mobile">
<div class="media-left">
<a href="#">
<img src=" class="img-rounded
img-lg" alt="">
</a>
</div>
<div class="media-body">
<h6 class="media-heading text-
semibold">
34
, , </h6>
<ul class="list-inline list-inline-
separate text-muted mb-10">
<li><a href="#" class="text-
muted"> </a></li>
<li> | </li>
</ul>
</div>
<div class="media-right text-nowrap">
<a href="" class="btn btn-
warning">View</a>
</div>
</li>
<ul class="media-list content-group">
<li class="media panel panel-body stack-
media-on-mobile">
<div class="media-left">
<a href="#">
<img src=" class="img-rounded
img-lg" alt="">
</a>
</div>
<div class="media-body">
<h6 class="media-heading text-
semibold">
34
Mr, User, User </h6>
<ul class="list-inline list-inline-separate text-muted mb-10">
<li>User </li>
<li> | </li>
</ul>
</div>
<div
class="media-right text-nowrap">
View
</div>
</li>
<ul class="media-list content-group">
<li class="media
panel panel-body stack-media-on-mobile">
<div
class="media-left">
<a
href="#">
<img src=" class="img-rounded img-lg" alt="">
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /main content -->
</div>
<!-- /page content -->
/div>
<!-- /page container -->