<div class="customizer">
    <div class="customizer-content">
        <div class="customizer-content-inner">
            <h2><?php echo __( 'Header Variant', 'realia' ); ?></h2>

            <ul class="list clearfix">
                <li><a href="?header-variant=information"><?php echo __( 'Contact information', 'realia'); ?></a></li>
                <li><a href="?header-variant=standard"><?php echo __( 'Standard layout', 'realia' ); ?></a></li>
                <li><a href="?header-variant=search"><?php echo __( 'Large search', 'realia'); ?></a></li>
                <li><a href="?header-variant=ad-space"><?php echo __( 'Ad space', 'realia'); ?></a></li>
            </ul>

        	<h2><?php echo __( 'Color Combinations', 'realia' ); ?></h2>

        	<ul class="squares clearfix">
        		<li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/cyan-blue-grey.css"><span class="color-1 cyan"></span><span class="color-2 blue-grey"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/light-blue-amber.css"><span class="color-1 light-blue"></span><span class="color-2 amber"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/blue-pink.css"><span class="color-1 blue"></span><span class="color-2 pink"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/blue-light-green.css"><span class="color-1 blue"></span><span class="color-2 light-green"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/indigo-red.css"><span class="color-1 indigo"></span><span class="color-2 red"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/indigo-green.css"><span class="color-1 indigo"></span><span class="color-2 green"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/brown-light-green.css"><span class="color-1 brown"></span><span class="color-2 light-green"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/brown-red.css"><span class="color-1 brown"></span><span class="color-2 red"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/green-deep-orange.css"><span class="color-1 green"></span><span class="color-2 deep-orange"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/green-amber.css"><span class="color-1 green"></span><span class="color-2 amber"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/red-brown.css"><span class="color-1 red"></span><span class="color-2 brown"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/pink-amber.css"><span class="color-1 pink"></span><span class="color-2 amber"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/teal-amber.css"><span class="color-1 teal"></span><span class="color-2 amber"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/teal-cyan.css"><span class="color-1 teal"></span><span class="color-2 cyan"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/blue-grey-amber.css"><span class="color-1 blue-grey"></span><span class="color-2 amber"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/blue-grey-lime.css"><span class="color-1 blue-grey"></span><span class="color-2 lime"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/deep-purple-light-green.css"><span class="color-1 deep-purple"></span><span class="color-2 light-green"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/deep-purple-purple.css"><span class="color-1 deep-purple"></span><span class="color-2 purple"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/deep-orange-light-green.css"><span class="color-1 deep-orange"></span><span class="color-2 light-green"></span></li>
                <li rel="<?php echo get_template_directory_uri(); ?>/assets/css/variants/deep-orange-light-blue.css"><span class="color-1 deep-orange"></span><span class="color-2 light-blue"></span></li>
        	</ul>
        </div><!-- /.customizer-content-inner -->
    </div><!-- /.customizer-content -->

    <div class="customizer-header closed">
        <i class="fa fa-cog"></i>
    </div><!-- /.customizer-header -->
</div><!-- /.customizer -->        