I'm working on my first theme for wordpress and I am running in to some problems. I was busy building a customizer page for the theme. It went great up until the customizer wouldn't parse the default settings to the css. I've tried building the functions file all over again but nothing worked.

Could you guys take a look t the code and tell me if there is anything wrong, or if anyone else had this problem tell me what the solution is.

here is the code of my funtions.php file

<?php

add_theme_support( 'menus' );
if ( function_exists( 'register_nav_menus' ) ) {
register_nav_menus(
    array(
    'header-menu' => 'main'
    )
);
}
add_action( 'init', 'register_my_menus' );

add_theme_support( 'post-thumbnails' );

function claboxico_customize_register( $wp_customize ) {


//fonts array
$googlefonts = array(
        'arial'=>'Arial',
        'verdana'=>'Verdana, Geneva',
        'trebuchet'=>'Trebuchet',
        'trebuchet ms'=>'Trebuchet MS',
        //this list contains way more fonts
      );

//general panel
$wp_customize->add_panel( 'colors', array(
'title' => __( 'Colors' ),
'description' => 'Edit the general styling',
) );

//general colors section
$wp_customize->add_section('primairy_color', array(
  'title' => __('Primairy Colors', 'claboxico'),
  'panel' => 'colors',
  'description' => 'Edit the primairy color of the theme.'
));
//primairy color setting
$wp_customize->add_setting('primairy_color', array(
'default' => '#43bfd8',
));
//primairy color control
$wp_customize->add_control( new WP_Customize_Color_control( $wp_customize, 'primairy_color', array(
'label' => __('Primairy Color', 'claboxico'),
'section' => 'primairy_color',
'setting' => 'primairy_color',
) ));


//link kleur
$wp_customize->add_section('link_color', array(
'title' => __('Link Colors', 'claboxico'),
'panel' => 'colors',
'description' => 'Edit the color of the links.'
));
$wp_customize->add_setting('link_color', array(
'default' => '#0eb1ed',
));
$wp_customize->add_control( new WP_Customize_Color_control( $wp_customize, 'link_color', array(
'label' => __('Link Color', 'claboxico'),
'section' => 'link_color',
'setting' => 'link_color',
) ));

//plain text color
$wp_customize->add_section('paragraph_color', array(
'title' => __('Paragraph Colors', 'claboxico'),
'panel' => 'colors',
'description' => 'Edit the paragraph text color.'
));
$wp_customize->add_setting('paragraph_color', array(
'default' => '#000',
));
$wp_customize->add_control( new WP_Customize_Color_control( $wp_customize, 'paragraph_color', array(
'label' => __('Link Color', 'claboxico'),
'section' => 'paragraph_color',
'setting' => 'paragraph_color',
) ));




//fonts panel
$wp_customize->add_panel( 'fonts', array(
  'title' => __( 'Fonts' ),
  'description' => 'Edit the fonts',
) );

  //heading fonts section
  $wp_customize->add_section('heading_font', array(
    'title' => __('Heading fonts', 'claboxico'),
    'panel' => 'fonts',
    'description' => 'Edit the font for h1, h2 etc.'
  ));
  $wp_customize->add_setting('heading_font', array(
    'default' => 'Rokkitt',
  ));

  $wp_customize->add_control( 'heading_font',array(
    'type' => 'select',
    'label' => __('Heading font', 'claboxico'),
    'section' => 'heading_font',
    'setting' => '',
    'choices' => $googlefonts,
    )
  );



}

function claboxico_css_customizer() {
?>

<style type="text/css">

  @import url(http://fonts.googleapis.com/css?family=<?php
    $font_sizes = ':300,400,700,900|';
    $heading_google_font = get_theme_mod('heading_font');
    $heading_font = str_replace(' ', '+', $heading_google_font);
    echo $heading_font;
    echo $font_sizes;

    $paragraph_google_font = get_theme_mod('paragraph_font');
    $paragraph_font = str_replace(' ', '+', $paragraph_google_font);
    echo $paragraph_font;
    echo $font_sizes;


   ?>);
  body{font-family: '<?php echo get_theme_mod('paragraph_font'); ?>'; color: <?php echo get_theme_mod('paragraph_color'); ?> }
  /* background color */
  .header{background-color: <?php echo get_theme_mod('header_background_color'); ?> ;}
  /* heading colors and font */
  h1, h2, h3, header .logo{color: <?php echo get_theme_mod('primairy_color', '#43bfd8');?> ; font-family:'<?php    echo get_theme_mod('heading_font');     ?>';}
  /*link colors*/
  a, a:hover{color: <?php echo get_theme_mod('link_color');?>;}
  /* primairy colors */
  header{border-bottom-color: <?php echo get_theme_mod('primairy_color', '#43bfd8');?> ;}
  header .mobile-header-icon, header nav ul li a{color: <?php echo get_theme_mod('primairy_color', '#43bfd8');?> ;}

  footer{border-top-color: <?php echo get_theme_mod('primairy_color', '#43bfd8');?> ;}

</style>

<?php
}
add_action('wp_head', 'claboxico_css_customizer');
add_action( 'customize_register', 'claboxico_customize_register' );
?>

I hope someone can help me with this problem.