Logo for small screens

$logoimage_sm = $logotype == 'image' ? $this->params->get('logoimage_sm', 'templates/' . T3_TEMPLATE . '/images/logo.png') : '';

<!-- LOGO -->
				<div class="col-xs-12 <?php echo $logosize ?> logo">
					<div class="logo-<?php echo $logotype ?>">
						<a href="<?php echo JURI::base(true) ?>" title="<?php echo strip_tags($sitename) ?>">
							<?php if($logotype == 'image'): ?>
								<img class="logo-img" src="<?php echo JURI::base(true) . '/' . $logoimage ?>" alt="<?php echo strip_tags($sitename) ?>" />
							<?php endif ?>
							<span><?php echo $sitename ?></span>
						</a>
						<a href="<?php echo JURI::base(true) ?>" title="<?php echo strip_tags($sitename) ?>">
							<?php if($logotype == 'image'): ?>
								<img class="logo-img-sm" src="<?php echo JURI::base(true) . '/' . $logoimage_sm ?>" alt="<?php echo strip_tags($sitename) ?>" />
							<?php endif ?>
							<span><?php echo $sitename ?></span>
						</a>
						<small class="site-slogan"><?php echo $slogan ?></small>
					</div>
				</div>
				<!-- //LOGO -->

@media (min-width: 480px) {
	.logo-img-sm {
		display: none;
	}
}
@media (max-width: 479px) {
	.logo-img {
		display: none;
	}
}