Can't save array options

Hi guys, I’m fairly new to adding a theme options page. What I want to do is for the admin to modify the size and font of the blog title.
I found a tutorial on how to do this and the font is working fine but the size is not. Here is the code:

add_action( 'admin_menu', 'my_admin_menu' );
function my_admin_menu() {
    add_theme_page( 'Header Typography', 'Header Typography', 'edit_theme_options', 'my-theme-options', 'my_theme_options' );
}

function my_theme_options() {
?>
    <div class="wrap">
        <div><br></div>
        <h2>Header Typography Options</h2>

        <form method="post" action="options.php">
            <?php wp_nonce_field( 'update-options' ); ?>
            <?php settings_fields( 'my-options' ); ?>
            <?php do_settings_sections( 'my-options' ); ?>
            <?php submit_button(); ?>
        </form>

    </div>
<?php
}

add_action( 'admin_init', 'my_register_admin_settings' );
function my_register_admin_settings() {
    register_setting( 'my-options', 'my-options' );
		register_setting( 'my-options', 'font-size');

    // Settings fields and sections
    add_settings_section( 'section_typography', 'Typography Options', 'my_section_typography', 'my-options' );
    add_settings_field( 'primary-font', 'Site Title Font Face', 'my_field_primary_font', 'my-options', 'section_typography' );
		add_settings_field( 'title-size', 'Site Title Font Size', 'my_field_primary_size', 'my-options', 'section_typography' );
}
function my_section_typography() {
    echo 'Change the font-face, style and size of your site title.';
}

function get_my_available_fonts() {
    $fonts = array(
        'open-sans' => array(
            'name' => 'Open Sans',
            'import' => '@import url(https://fonts.googleapis.com/css?family=Open+Sans);',
            'css' => "font-family: 'Open Sans', sans-serif;"
        ),
        'lato' => array(
            'name' => 'Lato',
            'import' => '@import url(https://fonts.googleapis.com/css?family=Lato);',
            'css' => "font-family: 'Lato', sans-serif;"
        ),
        'arial' => array(
            'name' => 'Arial',
            'import' => '',
            'css' => "font-family: Arial, sans-serif;"
        )
    );

    return apply_filters( 'my_available_fonts', $fonts );
}

function my_field_primary_font() {
    $options = (array) get_option( 'my-options' );
    $fonts = get_my_available_fonts();
    $current_font = 'arial';

    if ( isset( $options['primary-font'] ) )
        $current_font = $options['primary-font'];

    ?>
        <select name="my-options[primary-font]">
        <?php foreach( $fonts as $font_key => $font ): ?>
            <option <?php selected( $font_key == $current_font ); ?> value="<?php echo $font_key; ?>"><?php echo $font['name']; ?></option>
        <?php endforeach; ?>
        </select>
    <?php
}

add_action( 'wp_head', 'my_wp_head' );
function my_wp_head() {
    $options = (array) get_option( 'my-options' );
    $fonts = get_my_available_fonts();
    $current_font_key = 'arial';

    if ( isset( $options['primary-font'] ) )
        $current_font_key = $options['primary-font'];

    if ( isset( $fonts[ $current_font_key ] ) ) {
        $current_font = $fonts[ $current_font_key ];

        echo '<style>';
        echo $current_font['import'];
        echo '#site-title * { ' . $current_font['css'] . ' } ';
        echo '</style>';
    }
}

/*SITE TITLE FONT SIZE*/
function get_my_available_size() {
    $fonts = array(
        '12px' => array(
            'name' => '12',
            'css' => "font-size: 12px;"
        ),
        '14px' => array(
            'name' => '14',
            'css' => "font-size: 14px;"
        ),
        '16px' => array(
            'name' => '16',
            'css' => "font-size: 16px;"
        )
    );

    return apply_filters( 'my_available_fonts', $fonts );
}

function my_field_primary_size() {
    $options = (array) get_option( 'my-options' );
    $fonts = get_my_available_size();
    $current_font = '12px';

    if ( isset( $options['title-size'] ) )
        $current_font = $options['title-size'];

    ?>
        <select name="my-options[title-size]">
        <?php foreach( $fonts as $font_key => $font ): ?>
            <option <?php selected( $font_key == $current_font ); ?> value="<?php echo $font_key; ?>"><?php echo $font['name']; ?></option>
        <?php endforeach; ?>
        </select>
    <?php
}

add_action( 'wp_head', 'my_wp_head_title_size' );
function my_wp_head_title_size() {
    $options = (array) get_option( 'my-options' );
    $fonts = get_my_available_size();
    $current_size_key = '12px';

    if ( isset( $options['title-size'] ) )
        $current_size_key = $options['title_size'];

    if ( isset( $fonts[ $current_size_key ] ) ) {
        $current_size = $fonts[ $current_size_key ];

        echo '<style>';
        echo '#site-title * { ' . $current_size['css'] . ' } ';
        echo '</style>';
    }
}

Help is really appreciated. Thanks in advance.