WordPress theme changes when adding category featured images

bosco_archive.php

<?php
/**
 * @package Bosco
 */

if ( is_category() && function_exists('category_image_src')) {
	$category_image = category_image_src( array( 'size' => 'full' ) , false ); 
} else {
	$category_image = '';
}		

get_header(); ?>

	<section id="primary" class="content-area">
		<div id="content" class="site-content" role="main">

		<?php if ( have_posts() ) : ?>

			<header class="page-header <?php if ($category_image==true) echo 'category-image'; ?>">
							
				<?php if ($category_image) : ?>
				
				<!-- category featured image -->
				<img src="<?php echo $category_image; ?>" alt="<?php single_cat_title();?>" desc="<?php echo wp_strip_all_tags( category_description() );?>"/>			
				
				<?php endif; ?>


				<h1 class="page-title">
					<?php
						if ( is_category() ) :
						
							single_cat_title();

						elseif ( is_tag() ) :
							single_tag_title();

						elseif ( is_author() ) :
							printf( __( 'Author: %s', 'bosco' ), '<span class="vcard">' . get_the_author() . '</span>' );

						elseif ( is_day() ) :
							printf( __( 'Day: %s', 'bosco' ), '<span>' . get_the_date() . '</span>' );

						elseif ( is_month() ) :
							printf( __( 'Month: %s', 'bosco' ), '<span>' . get_the_date( 'F Y' ) . '</span>' );

						elseif ( is_year() ) :
							printf( __( 'Year: %s', 'bosco' ), '<span>' . get_the_date( 'Y' ) . '</span>' );

						elseif ( is_tax( 'post_format', 'post-format-aside' ) ) :
							_e( 'Asides', 'bosco' );

						elseif ( is_tax( 'post_format', 'post-format-image' ) ) :
							_e( 'Images', 'bosco');

						elseif ( is_tax( 'post_format', 'post-format-video' ) ) :
							_e( 'Videos', 'bosco' );

						elseif ( is_tax( 'post_format', 'post-format-quote' ) ) :
							_e( 'Quotes', 'bosco' );

						elseif ( is_tax( 'post_format', 'post-format-link' ) ) :
							_e( 'Links', 'bosco' );

						else :
							_e( 'Archives', 'bosco' );

						endif;
					?>
				</h1>
				<?php
					// Show an optional term description.
					$term_description = term_description();
					if ( ! empty( $term_description ) ) :
						printf( '<div class="taxonomy-description">%s</div>', $term_description );
					endif;
				?>
			</header><!-- .page-header -->

			<?php /* Start the Loop */ ?>
			<?php while ( have_posts() ) : the_post(); ?>

				<?php
					/* Include the Post-Format-specific template for the content.
					 * If you want to overload this in a child theme then include a file
					 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
					 */
					get_template_part( 'content', get_post_format() );
				?>

			<?php endwhile; ?>

			<?php bosco_paging_nav(); ?>

		<?php else : ?>

			<?php get_template_part( 'no-results', 'archive' ); ?>

		<?php endif; ?>

		</div><!-- #content -->
	</section><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

bosco_category_images.css

header.category-image {
  	max-width: 100%;
}

header.category-image img {
	width: 100%;
	padding: 0;
	margin: 0;
	position: relative;  
}

header.category-image h1.page-title {
	position: absolute;
	color: #ffffff;
	font-size: 48pt;
  	margin-top: -140px;
        margin-left: 25px;
}

header.category-image div.taxonomy-description {
	position: absolute;
	color: #ffffff;
	font-size: 18pt;
  	margin-top: -60px;
        margin-left: 25px;  
}

twentytwelve_category.php

<?php
/**
 * The template for displaying Category pages
 *
 * Used to display archive-type pages for posts in a category.
 *
 * @link http://codex.wordpress.org/Template_Hierarchy
 *
 * @package WordPress
 * @subpackage Twenty_Twelve
 * @since Twenty Twelve 1.0
 */

// grab the URL for the category image
if (function_exists('category_image_src')) {
	$category_image = category_image_src( array( 'size' => 'full' ) , false ); 
} else {
	$category_image = '';
}

get_header(); ?>

	<section id="primary" class="site-content">
		<div id="content" role="main">

		<?php if ( have_posts() ) : ?>
		
			<!-- add a class to the header if a category image exists -->
			<header class="archive-header <?php if ($category_image==true) echo 'category-image'; ?>">
	
				<?php if ($category_image) : ?>
				
				<!-- category featured image -->
				<img src="<?php echo $category_image; ?>" alt="<?php single_cat_title();?>" desc="<?php echo wp_strip_all_tags( category_description() );?>"/>			
				
				<?php endif; ?>
			
				<h1 class="archive-title"><?php printf( __( 'Category Archives: %s', 'twentytwelve' ), '<span>' . single_cat_title( '', false ) . '</span>' ); ?></h1>

			<?php if ( category_description() ) : // Show an optional category description ?>
				<div class="archive-meta"><?php echo category_description(); ?></div>
			<?php endif; ?>
			</header><!-- .archive-header -->

			<?php
			/* Start the Loop */
			while ( have_posts() ) : the_post();

				/* Include the post format-specific template for the content. If you want to
				 * this in a child theme then include a file called called content-___.php
				 * (where ___ is the post format) and that will be used instead.
				 */
				get_template_part( 'content', get_post_format() );

			endwhile;

			twentytwelve_content_nav( 'nav-below' );
			?>

		<?php else : ?>
			<?php get_template_part( 'content', 'none' ); ?>
		<?php endif; ?>

		</div><!-- #content -->
	</section><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

twentytwelve_category_images.css

header.category-image img {
	width: 100%;
	padding: 0;
	margin: 0;
	position: relative;  
}

header.category-image h1.archive-title {
	position: absolute;
	color: #ffffff;
	font-size: 48pt;
  	margin-top: -140px;
        margin-left: 25px;
}