/* Material color palette with 2 additional dark levels, mid-luminance de-emphasis, color equalization, saturation equalization, luminosity equalization */

:root{
/* black and white */

--bw1: hsl(0, 0%, 100%);
--bw2: hsl(0, 0%, 96%);
--bw3: hsl(0, 0%, 89%);
--bw4: hsl(0, 0%, 82%);
--bw5: hsl(0, 0%, 72%);
--bw6: hsl(0, 0%, 61%);
--bw7: hsl(0, 0%, 49%);
--bw8: hsl(0, 0%, 37%);
--bw9: hsl(0, 0%, 25%);
--bw10:hsl(0, 0%, 18%);
--bw11:hsl(0, 0%, 10%);
--bw12:hsl(0, 0%, 0%);

/* full spectrum  -5% saturation + lower fade */

--red1: hsl(354, 85%, 96%);
--red2: hsl(355, 90%, 92%);
--red3: hsl(0, 71%, 82%);
--red4: hsl(1, 71%, 72%);
--red5: hsl(1, 74%, 66%);
--red6: hsl(3, 75%, 60%);
--red7: hsl(1, 68%, 54%);
--red8: hsl(0, 62%, 48%);
--red9: hsl(0, 58%, 41%);
--red10:hsl(0, 58%, 31%);
--red11:hsl(0, 60%, 23%);
--red12:hsl(0, 61%, 15%);
--pink1: hsl(342, 71%, 95%);
--pink2: hsl(341, 70%, 89%);
--pink3: hsl(342, 69%, 79%);
--pink4: hsl(342, 70%, 70%);
--pink5: hsl(343, 69%, 62%);
--pink6: hsl(344, 68%, 56%);
--pink7: hsl(342, 63%, 51%);
--pink8: hsl(341, 58%, 44%);
--pink9: hsl(338, 57%, 37%);
--pink10:hsl(332, 53%, 27%);
--pink11:hsl(330, 53%, 21%);
--pink12:hsl(330, 52%, 16%);
--purple1: hsl(292, 39%, 93%);
--purple2: hsl(290, 39%, 86%);
--purple3: hsl(291, 39%, 73%);
--purple4: hsl(290, 38%, 63%);
--purple5: hsl(290, 42%, 55%);
--purple6: hsl(290, 43%, 48%);
--purple7: hsl(285, 44%, 43%);
--purple8: hsl(278, 46%, 38%);
--purple9: hsl(272, 47%, 33%);
--purple10:hsl(260, 49%, 30%);
--purple11:hsl(256, 50%, 25%);
--purple12:hsl(256, 50%, 19%);
--purpleDeep1: hsl(261, 41%, 94%);
--purpleDeep2: hsl(258, 40%, 87%);
--purpleDeep3: hsl(259, 40%, 75%);
--purpleDeep4: hsl(257, 40%, 67%);
--purpleDeep5: hsl(257, 40%, 58%);
--purpleDeep6: hsl(255, 40%, 51%);
--purpleDeep7: hsl(253, 43%, 47%);
--purpleDeep8: hsl(250, 45%, 42%);
--purpleDeep9: hsl(247, 48%, 36%);
--purpleDeep10:hsl(241, 50%, 31%);
--purpleDeep11:hsl(240, 53%, 25%);
--purpleDeep12:hsl(240, 53%, 18%);
--indigo1: hsl(227, 41%, 94%);
--indigo2: hsl(228, 41%, 87%);
--indigo3: hsl(227, 41%, 76%);
--indigo4: hsl(226, 41%, 67%);
--indigo5: hsl(226, 44%, 59%);
--indigo6: hsl(225, 46%, 51%);
--indigo7: hsl(226, 49%, 44%);
--indigo8: hsl(225, 53%, 38%);
--indigo9: hsl(226, 56%, 33%);
--indigo10:hsl(227, 63%, 27%);
--indigo11:hsl(228, 68%, 22%);
--indigo12:hsl(228, 68%, 16%);
--blue1: hsl(204, 78%, 94%);
--blue2: hsl(206, 78%, 88%);
--blue3: hsl(206, 80%, 78%);
--blue4: hsl(206, 80%, 70%);
--blue5: hsl(206, 81%, 62%);
--blue6: hsl(206, 82%, 53%);
--blue7: hsl(207, 77%, 45%);
--blue8: hsl(208, 75%, 40%);
--blue9: hsl(209, 77%, 34%);
--blue10:hsl(212, 88%, 27%);
--blue11:hsl(214, 89%, 23%);
--blue12:hsl(214, 89%, 16%);
--blueLight1: hsl(195, 85%, 95%);
--blueLight2: hsl(196, 85%, 90%);
--blueLight3: hsl(196, 85%, 79%);
--blueLight4: hsl(196, 84%, 70%);
--blueLight5: hsl(196, 84%, 61%);
--blueLight6: hsl(196, 84%, 49%);
--blueLight7: hsl(197, 84%, 43%);
--blueLight8: hsl(198, 88%, 38%);
--blueLight9: hsl(199, 92%, 31%);
--blueLight10:hsl(202, 97%, 25%);
--blueLight11:hsl(204, 97%, 20%);
--blueLight12:hsl(204, 97%, 13%);
--cyan1: hsl(185, 70%, 94%);
--cyan2: hsl(187, 71%, 87%);
--cyan3: hsl(187, 71%, 76%);
--cyan4: hsl(187, 67%, 68%);
--cyan5: hsl(187, 71%, 58%);
--cyan6: hsl(187, 73%, 46%);
--cyan7: hsl(187, 74%, 39%);
--cyan8: hsl(187, 74%, 35%);
--cyan9: hsl(185, 73%, 27%);
--cyan10:hsl(182, 72%, 21%);
--cyan11:hsl(180, 69%, 16%);
--cyan12:hsl(180, 69%, 11%);
--teal1: hsl(176, 43%, 93%);
--teal2: hsl(176, 43%, 85%);
--teal3: hsl(175, 45%, 74%);
--teal4: hsl(174, 49%, 67%);
--teal5: hsl(175, 54%, 55%);
--teal6: hsl(174, 63%, 44%);
--teal7: hsl(173, 66%, 37%);
--teal8: hsl(172, 68%, 33%);
--teal9: hsl(172, 68%, 26%);
--teal10:hsl(170, 68%, 22%);
--teal11:hsl(168, 70%, 16%);
--teal12:hsl(168, 70%, 12%);
--green1: hsl(125, 38%, 94%);
--green2: hsl(124, 37%, 88%);
--green3: hsl(124, 36%, 76%);
--green4: hsl(124, 37%, 68%);
--green5: hsl(124, 37%, 60%);
--green6: hsl(124, 36%, 51%);
--green7: hsl(124, 37%, 43%);
--green8: hsl(124, 38%, 39%);
--green9: hsl(125, 40%, 31%);
--green10:hsl(126, 43%, 25%);
--green11:hsl(127, 45%, 20%);
--green12:hsl(127, 45%, 14%);
--greenLight1: hsl(86, 45%, 94%);
--greenLight2: hsl(87, 43%, 89%);
--greenLight3: hsl(87, 41%, 79%);
--greenLight4: hsl(87, 41%, 71%);
--greenLight5: hsl(88, 42%, 62%);
--greenLight6: hsl(88, 42%, 52%);
--greenLight7: hsl(90, 39%, 47%);
--greenLight8: hsl(93, 38%, 41%);
--greenLight9: hsl(96, 38%, 34%);
--greenLight10:hsl(106, 38%, 27%);
--greenLight11:hsl(108, 39%, 22%);
--greenLight12:hsl(108, 39%, 14%);
--lime1: hsl(63, 63%, 95%);
--lime2: hsl(63, 62%, 90%);
--lime3: hsl(63, 62%, 81%);
--lime4: hsl(63, 62%, 74%);
--lime5: hsl(64, 61%, 68%);
--lime6: hsl(64, 58%, 59%);
--lime7: hsl(62, 51%, 52%);
--lime8: hsl(60, 42%, 47%);
--lime9: hsl(56, 44%, 39%);
--lime10:hsl(50, 48%, 31%);
--lime11:hsl(48, 50%, 24%);
--lime12:hsl(48, 50%, 15%);
--yellow1: hsl(52, 96%, 96%);
--yellow2: hsl(51, 96%, 92%);
--yellow3: hsl(51, 96%, 86%);
--yellow4: hsl(51, 96%, 80%);
--yellow5: hsl(51, 96%, 75%);
--yellow6: hsl(51, 96%, 68%);
--yellow7: hsl(45, 94%, 64%);
--yellow8: hsl(39, 91%, 60%);
--yellow9: hsl(33, 89%, 53%);
--yellow10:hsl(26, 80%, 44%);
--yellow11:hsl(24, 78%, 34%);
--yellow12:hsl(24, 78%, 25%);
--amber1: hsl(43, 96%, 95%);
--amber2: hsl(42, 96%, 91%);
--amber3: hsl(42, 96%, 82%);
--amber4: hsl(42, 96%, 75%);
--amber5: hsl(41, 96%, 69%);
--amber6: hsl(39, 96%, 64%);
--amber7: hsl(36, 95%, 61%);
--amber8: hsl(31, 95%, 59%);
--amber9: hsl(27, 93%, 51%);
--amber10:hsl(20, 84%, 44%);
--amber11:hsl(18, 82%, 33%);
--amber12:hsl(18, 82%, 25%);
--orange1: hsl(35, 96%, 94%);
--orange2: hsl(34, 96%, 89%);
--orange3: hsl(33, 94%, 80%);
--orange4: hsl(32, 95%, 73%);
--orange5: hsl(31, 95%, 66%);
--orange6: hsl(29, 95%, 60%);
--orange7: hsl(27, 90%, 57%);
--orange8: hsl(24, 84%, 54%);
--orange9: hsl(21, 79%, 47%);
--orange10:hsl(15, 73%, 43%);
--orange11:hsl(13, 72%, 34%);
--orange12:hsl(13, 72%, 24%);
--deepOrange1: hsl(6, 65%, 96%);
--deepOrange2: hsl(13, 90%, 91%);
--deepOrange3: hsl(13, 89%, 81%);
--deepOrange4: hsl(13, 90%, 74%);
--deepOrange5: hsl(12, 91%, 68%);
--deepOrange6: hsl(11, 90%, 61%);
--deepOrange7: hsl(11, 81%, 55%);
--deepOrange8: hsl(11, 71%, 48%);
--deepOrange9: hsl(11, 68%, 42%);
--deepOrange10:hsl(11, 66%, 33%);
--deepOrange11:hsl(10, 69%, 25%);
--deepOrange12:hsl(10, 69%, 16%);

/* arbitrary colors */

--brown1: hsl(12, 13%, 91%);
--brown2: hsl(16, 15%, 82%);
--brown3: hsl(16, 16%, 70%);
--brown4: hsl(15, 18%, 60%);
--brown5: hsl(15, 20%, 50%);
--brown6: hsl(15, 22%, 41%);
--brown7: hsl(13, 23%, 36%);
--brown8: hsl(12, 24%, 31%);
--brown9: hsl(10, 25%, 26%);
--brown10:hsl(10, 26%, 20%);
--brown11:hsl(10, 28%, 15%);
--brown12:hsl(10, 28%, 10%);
--blueGrey1: hsl(192, 14%, 93%);
--blueGrey2: hsl(198, 15%, 86%);
--blueGrey3: hsl(198, 14%, 75%);
--blueGrey4: hsl(199, 15%, 66%);
--blueGrey5: hsl(199, 14%, 57%);
--blueGrey6: hsl(200, 17%, 48%);
--blueGrey7: hsl(197, 17%, 42%);
--blueGrey8: hsl(197, 16%, 35%);
--blueGrey9: hsl(197, 15%, 29%);
--blueGrey10:hsl(200, 15%, 21%);
--blueGrey11:hsl(203, 15%, 15%);
--blueGrey12:hsl(203, 15%, 10%);

/* colored table rows */

--redRow:           hsl(351, 69%, 95%);
--redRowAlt:        hsl(356, 70%, 89%);
--redRowBorder:     hsl(1, 69%, 80%);
--amberRow:         hsl(43, 65%, 92%);
--amberRowAlt:      hsl(46, 73%, 85%);
--amberRowBorder:   hsl(37, 80%, 76%);
--greenRow:         hsl(127, 40%, 93%);
--greenRowAlt:      hsl(123, 36%, 86%);
--greenRowBorder:   hsl(125, 40%, 73%);
--tealRow:          hsl(176, 46%, 90%);
--tealRowAlt:       hsl(176, 46%, 83%);
--tealRowBorder:    hsl(175, 50%, 71%);
--blueRow:          hsl(208, 60%, 93%);
--blueRowAlt:       hsl(205, 65%, 86%);
--blueRowBorder:    hsl(205, 75%, 75%);
--indigoRow:        hsl(227, 59%, 92%);
--indigoRowAlt:     hsl(228, 55%, 86%);
--indigoRowBorder:  hsl(227, 54%, 77%);
--purpleRow:        hsl(290, 46%, 95%);
--purpleRowAlt:     hsl(291, 40%, 87%);
--purpleRowBorder:  hsl(292, 45%, 77%);

/* generic colors ( intensity level 6 ) */

--red:       hsl(4, 80%, 60%);
--pink:      hsl(344, 72%, 55%);
--purple:    hsl(290, 42%, 45%);
--purpleDeep:hsl(255, 36%, 49%);
--indigo:    hsl(225, 43%, 46%);
--blue:      hsl(205, 80%, 53%);
--blueLight: hsl(198, 82%, 51%);
--cyan:      hsl(187, 66%, 48%);
--teal:      hsl(174, 59%, 35%);
--green:     hsl(124, 27%, 50%);
--greenLight:hsl(88, 38%, 55%);
--lime:      hsl(64, 56%, 59%);
--yellow:    hsl(51, 95%, 68%);
--amber:     hsl(39, 95%, 62%);
--orange:    hsl(29, 93%, 60%);
--deepOrange:hsl(11, 92%, 60%);
--brown:     hsl(15, 23%, 38%);
--blueGrey:  hsl(200, 17%, 46%);

/* vivid colors */

--redViv1:      hsl(4, 95%, 75%);
--redViv2:      hsl(0, 96%, 66%);
--redViv3:      hsl(352, 96%, 58%);
--redViv4:      hsl(1, 77%, 46%);
--pinkViv1:     hsl(342, 95%, 75%);
--pinkViv2:     hsl(343, 96%, 64%);
--pinkViv3:     hsl(345, 88%, 55%);
--pinkViv4:     hsl(338, 64%, 46%);
--purpleViv1:   hsl(291, 86%, 75%);
--purpleViv2:   hsl(290, 87%, 66%);
--purpleViv3:   hsl(288, 86%, 60%);
--purpleViv4:   hsl(272, 92%, 61%);
--purpleDeepViv1:hsl(257, 90%, 77%);
--purpleDeepViv2:hsl(248, 90%, 67%);
--purpleDeepViv3:hsl(248, 91%, 62%);
--purpleDeepViv4:hsl(251, 74%, 56%);
--indigoViv1:   hsl(226, 90%, 75%);
--indigoViv2:   hsl(225, 90%, 64%);
--indigoViv3:   hsl(224, 91%, 59%);
--indigoViv4:   hsl(223, 92%, 55%);
--blueViv1:     hsl(214, 92%, 74%);
--blueViv2:     hsl(214, 93%, 61%);
--blueViv3:     hsl(213, 94%, 55%);
--blueViv4:     hsl(218, 93%, 54%);
--blueLightViv1:hsl(198, 95%, 75%);
--blueLightViv2:hsl(198, 95%, 63%);
--blueLightViv3:hsl(199, 96%, 52%);
--blueLightViv4:hsl(201, 100%, 45%);
--cyanViv1:     hsl(180, 98%, 77%);
--cyanViv2:     hsl(180, 99%, 61%);
--cyanViv3:     hsl(187, 97%, 58%);
--cyanViv4:     hsl(189, 73%, 47%);
--tealViv1:     hsl(167, 95%, 83%);
--tealViv2:     hsl(166, 96%, 71%);
--tealViv3:     hsl(164, 76%, 57%);
--tealViv4:     hsl(171, 63%, 45%);
--greenViv1:    hsl(138, 70%, 84%);
--greenViv2:    hsl(151, 76%, 69%);
--greenViv3:    hsl(146, 73%, 55%);
--greenViv4:    hsl(139, 60%, 48%);
--greenLightViv1:hsl(87, 91%, 79%);
--greenLightViv2:hsl(89, 92%, 71%);
--greenLightViv3:hsl(101, 93%, 63%);
--greenLightViv4:hsl(102, 64%, 55%);
--limeViv1:     hsl(63, 93%, 77%);
--limeViv2:     hsl(64, 94%, 68%);
--limeViv3:     hsl(76, 94%, 64%);
--limeViv4:     hsl(79, 75%, 58%);
--yellowViv1:   hsl(58, 100%, 80%);
--yellowViv2:   hsl(58, 100%, 65%);
--yellowViv3:   hsl(51, 100%, 64%);
--yellowViv4:   hsl(45, 100%, 63%);
--amberViv1:    hsl(45, 100%, 77%);
--amberViv2:    hsl(44, 100%, 68%);
--amberViv3:    hsl(40, 100%, 62%);
--amberViv4:    hsl(34, 99%, 61%);
--orangeViv1:   hsl(35, 100%, 77%);
--orangeViv2:   hsl(30, 99%, 66%);
--orangeViv3:   hsl(27, 98%, 60%);
--orangeViv4:   hsl(19, 97%, 58%);
--deepOrangeViv1:hsl(13, 97%, 75%);
--deepOrangeViv2:hsl(13, 97%, 64%);
--deepOrangeViv3:hsl(9, 97%, 57%);
--deepOrangeViv4:hsl(8, 75%, 49%);
}