CSS not outputting

Hi,

Ive just found this plugin and what a time saver its going to be, great work 🙂

I have everything working but it wont seem to output the css. heres the code I have :

You can see I have added 2 controls but none of them will output for some reason.

// initial Setup
Kirki::add_config( 'alfie', array(
	'capability'    => 'edit_theme_options',
	'option_type'   => 'theme_mod',
	'disable_output'   => 'false',
) );

// Sections
Kirki::add_section( 'general', array(
    'title'          => __( 'General' ),
    'description'    => __( 'General theme options' ),
    'panel'          => '',
    'priority'       => 1,
    'capability'     => 'edit_theme_options',
    'theme_supports' => '',
) );

// Controls
Kirki::add_field( 'container_width', array(
	'type'        => 'slider',
	'settings'    => 'container_width_setting',
	'label'       => esc_attr__( 'Container Max Width', 'alfie' ),
	'section'     => 'general',
	'default'     => 42,
	'choices'     => array(
		'min'  => '600',
		'max'  => '2000',
		'step' => '10',
	),
	'output' => array(
		array(
			'element'  => '.site-container',
			'property' => 'max-width',
			'units'    => 'px',
		),
	'transport' => 'postMessage',
	),
) );

Kirki::add_field( 'main_menu_font', array(
	'type'        => 'typography',
	'settings'    => 'main_menu_font_setting',
	'label'       => esc_attr__( 'Main Menu Font', 'alfie' ),
	'section'     => 'general',
	'default'     => array(
		'font-family'    => 'Roboto',
		'variant'        => 'regular',
		'font-size'      => '14px',
		'line-height'    => '1.5',
		'letter-spacing' => '0',
		'subsets'        => array( 'latin-ext' ),
		'color'          => '#333333',
		'text-transform' => 'none',
		'text-align'     => 'left'
	),
	'priority'    => 10,
	'output'      => array(
		array(
			'element' => 'h1',
		),
	),
) );