/* Variables

* ===============
*
* All variables and most of the configuration is defined on this page. */

/* Containers */

$x-small: 600px; $small: 800px; $medium: 1000px; $large: 1200px;

/* Breakpoints */

$mobile: $x-small; $desktop: $medium;

/* Colors */

$background: white; $primary-color: #0366EE; $secondary-color: #FCB42A; $accent-color: cdcdcd; $alternate-background: f7f7f7; $alternate-color: #404040; $link-color: $primary-color; $link-hover-color: darken($link-color, 15%); $highlight: ffeea8; $error: #D33C40; $bq-border: 16px solid f0f0f0;

/* Typography */

// Body font $font-size: 1.05rem; $body-font-size: 1.05rem; $font-style: normal; $font-variant: normal; $font-weight: normal; $font-color: #404040; $font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Helvetica, Arial, sans-serif; $line-height: 1.6;

// Headings $heading-font-color: #404040; $heading-font-weight: 600; $heading-font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Helvetica, Arial, sans-serif; $heading-line-height: 1.2;

// Mobile heading font size $h1-mobile: 1.8rem; $h2-mobile: 1.55rem; $h3-mobile: 1.3rem; $h4-mobile: 1.15rem; $h5-mobile: 1.05rem;

// Heading font size $h1: 2.3rem; $h2: 2.05rem; $h3: 1.8rem; $h4: 1.55rem; $h5: 1.3rem;

/* Padding */

$padding: 1.5rem; $margins: 1.5rem; $content-padding: 60px; $content-padding-mobile: 30px;

/* Borders */

$border-width: 1px; $border-style: solid; $border-color: dedede; $border-radius: 0px; $borders: $border-width $border-style $border-color;

/* Buttons */

$button-background: $primary-color; $button-background-hover: darken($button-background, 10%); $button-color: ffffff; $button-font-weight: 600; $button-font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Helvetica, Arial, sans-serif; $button-font-size: 1.1rem; $button-border-width: 1px; $button-border-style: solid; $button-border-color: $button-background; $button-border-radius: $border-radius; $button-text-transform: none;

// Accent buttons $accent-button-background: $secondary-color; $accent-button-color: ffffff; $accent-button-color-hover: ffffff;

// Muted Buttons $muted-border: 1px solid $accent-color; $muted-border-hover: 1px solid darken($accent-color, 30%); $muted-background: transparent; $muted-background-hover: transparent; $muted-color: darken($accent-color, 50%); $muted-color-hover: darken($accent-color, 50%);

// Round Buttons $round-buttons: 40px;

// Large Buttons $large-buttons: 60px;

/* Forms */

$forms: ('[type=color], [type=date], [type=datetime], [type=datetime-local], [type=email], [type=month], [type=number], [type=password], [type=search], [type=tel], [type=text], [type=url], [type=week], [type=time], select, textarea'); $buttons: ('.button, a.button, button, [type=submit], [type=reset], [type=button]'); $input-background: $background; $placeholder: darken($accent-color, 20%); $form-border: 1px solid cdcdcd; $form-border-hover: 1px solid darken(cdcdcd, 10%); $form-border-focus: 1px solid $link-color;

/* Tables */

$stripes: f8f8f8; $caption: ababab;

/* Code */

$code-color: $font-color; $code-size: 14px; $code-family: Menlo, monospace; $code-background: transparent; $code-borders: $borders;