//
// Color system
//

$color1:             #0AADA7;
$color1-trans1:      rgba(10,173,167,.8);
$color1-trans2:      rgba(10,173,167,.5);
$color1-trans2:      rgba(10,173,167,.2);

$color2:             #058B8C;
$color2-trans1:      rgba(5,139,140,.8);
$color2-trans2:      rgba(5,139,140,.5);
$color2-trans2:      rgba(5,139,140,.2);

$color3:             #303433;
$color3-trans1:      rgba(48,52,51,.8);
$color3-trans2:      rgba(48,52,51,.5);
$color3-trans2:      rgba(48,52,51,.2);

$color4:             #000000;
$color4-trans1:      rgba(0.0.0,.8);
$color4-trans2:      rgba(0.0.0,.5);
$color4-trans2:      rgba(0.0.0,.2);

$color5:             #ffffff;
$color5-trans1:      rgba(255,255,255,.8);
$color5-trans2:      rgba(255,255,255,.5);
$color5-trans2:      rgba(255,255,255,.2);


//
// Class to id assignment
//

$green:             $color1;
$darkgreen:             $color2;
$darkgrey:             $color3;
$black:             $color4;
$white:             $color5;

//
// Copy&paste colors for _styleguide.scss
//

&.color-1 {
    background-color: $green;
}

&.color-2 {
    background-color: $darkgreen;
}

&.color-3 {
    background-color: $darkgrey;
}

&.color-4 {
    background-color: $black;
}

&.color-5 {
    background-color: $white;
}