SCSS Variables

Sorted from gantry.config.get('styles'):

$base-padding: 1rem;
$base-margin: 1rem;
$base-bradius: 0.25rem;
$base-hrsep: 1px;
$base-font-base: "adobe-clean",Tahoma,Arial,san-serif;
$base-font-head: "adobe-clean-semicn",Tahoma,Arial,san-serif;
$base-font-alter: serif;
$base-font-mono: consola, monospace;
$base-font-size: 1rem;
$base-line-height: 1.5;
$breakpoints-large-desktop-container: 75rem;
$breakpoints-desktop-container: 60rem;
$breakpoints-tablet-container: 48rem;
$breakpoints-large-mobile-container: 30rem;
$cover-blend-mode: soft-light;
$cover-image-1: false;
$cover-image-2: false;
$cover-image-3: false;
$cover-image-4: false;
$dark-accent-color: #ff9911;
$dark-button-color: #666666;
$dark-border-color: #dddddd;
$dark-hilite-color: #eeeeee;
$dark-shade-color: #333333;
$dark-shadow-color: #222222;
$dark-background-color: #121212;
$dark-text-color: #f6f6f6;
$dark-surface-color: #667788;
$dark-warning-color: false;
$dark-error-color: false;
$dark-info-color: false;
$dark-success-color: false;
$light-background-color: #f6f6f6;
$light-text-color: #121212;
$light-surface-color: #334455;
$light-accent-color: #991111;
$light-button-color: #dddddd;
$light-warning-color: #ffcc33;
$light-error-color: #cc3333;
$light-info-color: #336699;
$light-success-color: #33bb33;
$light-border-color: #333333;
$light-hilite-color: #ffffff;
$light-shade-color: #222222;
$light-shadow-color: #111111;
$menu-col-width: 180px;
$menu-animation: g-fade;
$menu-mobile-breakpoint: 48rem;
$menu-panel-width: 75vw;
$menu-icon: fa fa-bars;
$menu-icon-w: 3rem;
$menu-icon-h: 3rem;
$option-disable_scheme: 0;
$colors-color-1: false;
$colors-color-2: false;
$colors-color-3: false;
$colors-color-4: false;
Twig Example

gantry.config.get('styles.base.font-base') return "adobe-clean",Tahoma,Arial,san-serif

gantry.config.get('styles.menu.icon') return fa fa-bars

<-- svg def -->