Category Descriptions – displaying all but the first

I found a loop online that seemed to do exactly what I need : Group posts by a child category together.

I can’t seem to get the category description(s) to work properly though. In this instance it doesn’t display the first category description at all, but puts the first description where the second is, the third where the fourth is and so on.

Could anyone take a look at this and point me in the right direction?
It would be much appreciated, I know it’s very close to working!

<div id="categories-wrap">

<?php $cats = get_categories('parent=15&orderby=count'); ?>
<?php foreach ($cats as $cat) { ?>
<?php $cat_id= $cat->term_id; ?>

<div class="category-description-wrap">
<?php echo '<h2 class="category-title">'.$cat->name.'</h2>';?>
<div class="category-description <?php echo $cat->name ;?>"><?php echo category_description(); ?></div>
</div>

<div id="" class="category">
<?php query_posts("cat=$cat_id"); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

<div class="category-product">
<h3 class="category-product-title"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h3>
<p class="category-subtitle"><?php the_field('cf_subtitle'); ?></p>
<div class="category-thumbnail"><?php the_post_thumbnail('category-thumb'); ?></div>
</div> 

<?php endwhile; endif;?>
</div>
<?php } // done the foreach statement ?>	

</div>