// base
	$base: 8px;
	$css-path: ".";

// colour
	// basic colour
		$palette-blue:           #2196f3;
		$palette-blue-dark:      #0d47a1;
		$palette-blue-dark-m:    #1976d2;
		$palette-blue-light:     #bbdefb;
		$palette-blue-light-m:   #64b5f6;

		$palette-green:          #8bc34a;
		$palette-green-dark:     #33691e;
		$palette-green-dark-m:   #689f38;
		$palette-green-light:    #dcedc8;
		$palette-green-light-m:  #aed581;

		$palette-purple:         #9c27b0;
		$palette-purple-dark:    #4a148c;
		$palette-purple-dark-m:  #7b1fa2;
		$palette-purple-light:   #e1bee7;
		$palette-purple-light-m: #ba68c8;

		$palette-red:            #f44336;
		$palette-red-dark:       #b71c1c;
		$palette-red-dark-m:     #d32f2f;
		$palette-red-light:      #ffcdd2;
		$palette-red-light-m:    #e57373;

		$palette-yellow:         #ffc107;
		$palette-yellow-dark:    #ff6f00;
		$palette-yellow-dark-m:  #ffa000;
		$palette-yellow-light:   #ffecb3;
		$palette-yellow-light-m: #ffd54f;

	// black and white
		$black:                  #000000;
		$black-bg:               #e0e0e0;
		$black-hint:             #9e9e9e;
		$black-sec:              #616161;
		$black-text:             #212121;

		$white:                  #ffffff;
		$white-bg:               #f5f5f5;
		$white-bg-dark:          #eeeeee;
		$white-bg-light:         #fafafa;

	// brand colour
		$brand-color:            #4caf50;
		$brand-color-dark:       #1b5e20;
		$brand-color-dark-m:     #388e3c;
		$brand-color-light:      #c8e6c9;
		$brand-color-light-m:    #81c784;

//bring the colors orange, lightgreen, indigo, teal and pink
        @import "conferencia/_colors.scss";

	// list
		$palette-color:         $brand-color, $palette-blue, $palette-green, $palette-purple, $palette-red, $palette-yellow, $palette-orange, $palette-lightgreen, $palette-indigo, $palette-teal, $palette-pink; 
		$palette-color-dark:    $brand-color-dark, $palette-blue-dark, $palette-green-dark, $palette-purple-dark, $palette-red-dark, $palette-yellow-dark,$palette-orange-dark, $palette-lightgreen-dark, $palette-indigo-dark, $palette-teal-dark, $palette-pink-dark;
		$palette-color-dark-m:  $brand-color-dark-m, $palette-blue-dark-m, $palette-green-dark-m, $palette-purple-dark-m, $palette-red-dark-m, $palette-yellow-dark-m, $palette-orange-dark-m, $palette-lightgreen-dark-m, $palette-indigo-dark-m, $palette-teal-dark-m, $palette-pink-dark-m;
		$palette-color-light:   $brand-color-light, $palette-blue-light, $palette-green-light, $palette-purple-light, $palette-red-light, $palette-yellow-light, $palette-orange-light, $palette-lightgreen-light, $palette-indigo-light, $palette-teal-light, $palette-pink-light;
		$palette-color-light-m: $brand-color-light-m, $palette-blue-light-m, $palette-green-light-m, $palette-purple-light-m, $palette-red-light-m, $palette-yellow-light-m, $palette-orange-light-m, $palette-lightgreen-light-m, $palette-indigo-light-m, $palette-teal-light-m, $palette-pink-light-m;
		$palette-list:          "alt", "blue", "green", "purple", "red", "yellow", "home", "search", "profile", "proposal", "pink";

// font
	$font-fam:       Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
	$font-fam-mono:  Monaco, Menlo, Consolas, "Courier New", monospace;
	$font-fam-serif: Georgia, serif;

	// font size
		$font-size:    ($base * 2);         // 16px
		$font-size-h1: ($base * 5.5);       // 44px
		$font-size-h2: ($base * 4.5);       // 36px
		$font-size-h3: ($base * 3.5);       // 28px
		$font-size-h4: ($base * 2.5);       // 20px
		$font-size-h5: ($base * 2);         // 16px
		$font-size-h6: ($base * 1.5);       // 12px
		$font-size-lg: ($base * 7.5);       // 60px

	// line height
		$line-height:    ($base * 3);       // 24px
		$line-height-h1: ($base * 6);       // 48px
		$line-height-h2: ($base * 5);       // 40px
		$line-height-h3: ($base * 4);       // 32px
		$line-height-h4: ($base * 3.5);     // 28px
		$line-height-h5: ($base * 3);       // 24px
		$line-height-h6: ($base * 2.5);     // 20px
		$line-height-lg: ($base * 9);       // 72px

	// other
		$btn-height:   (($base * 3) * 1.5); // 36px
		$cell-height:  (($base * 3) * 2);   // 48px
		$input-height: (($base * 3) * 1.5); // 36px

// grid
	$grid-cols: 12;
	$grid-gutter: ($base * 2);

// link
	$link-color: $palette-blue;
	$link-color-hover: $palette-blue-dark;

// responsive
	$screen-lg: 1440px;
	$screen-md: 992px;
	$screen-sm: 768px;
	$screen-xs: 480px;

// timing
	$timing: cubic-bezier(0.4, 0, 0.2, 1);

// z-index
	$bottom-base:  10;
	$content-base: 20;
	$header-base:  30;
	$top-base:     40;