
/****
    Colors 
*/

$color-text-dark: #111;
$color-text-light: #eee;

$color-accent: #ffc744;
$color-border: #aaa;
$color-error: #c00;
$color-link: #3e6afa;
$color-primary: #0d69ab;
$color-neutral: #ccc;



/****
    fonts 
*/

$font-header-face: "Open Sans", sans-serif;
$font-header-size-1: 30px;
$font-header-size-2: 22px;
$font-header-size-3: 20px;

$font-input-face: Verdana, Geneva, sans-serif;
$font-input-size: 14px;
$font-input-line: 22px;

$font-normal-face: "Roboto", sans-serif;
$font-normal-size: 16px;
$font-normal-line: 22px;

$font-small-face: Verdana, Geneva, sans-serif;
$font-small-size: 12px;
$font-small-line: 16px;

// computed - don't touch
$font-header-1: bold #{$font-header-size-1}/#{$font-header-size-1} $font-header-face;
$font-header-2: italic #{$font-header-size-2}/#{$font-header-size-2} $font-header-face;
$font-header-3: #{$font-header-size-3}/#{$font-header-size-3} $font-header-face;
$font-input: #{$font-input-size}/#{$font-input-line} $font-input-face;
$font-normal: #{$font-normal-size}/#{$font-normal-line} $font-normal-face;
$font-small: #{$font-small-size}/#{$font-small-line} $font-small-face;



/****
    Sizes
*/

$height-medium: 100px;
$height-big: 256px;

$padding-small: 2px;
$padding-medium: 5px;
$padding-big: 16px;

$width-small: 110px;
$width-medium: 190px;
$width-big: 517px;
$width-paragraph: 800px;