:root {
    --primary_color: #05386b;
    --primary_light_color: hsl(210, 91%, 32%); /* Start with secondary color... Increase "l" by 10. */
    --primary_dark_color: hsl(210, 91%, 12%); /* Start with secondary color... Decrease "l" by 10. */
    --primary_color_opacity: rgba(5, 56, 107, 0.2); /* Start with secondary color... Set "a" to 0.2. */

    --secondary_color: #64CD9A;
    --secondary_light_color: hsl(151, 51%, 70%); /* Start with secondary color... Increase "l" by 10. */
    --secondary_dark_color: hsl(151, 51%, 50%); /* Start with secondary color... Decrease "l" by 10. */
    --secondary_color_opacity: rgba(100, 205, 154, 0.2); /* Start with secondary color... Set "a" to 0.2. */

    --success_color: #198754;
    --success_light_color: hsl(152, 69%, 41%); /* Start with success color... Increase "l" by 10. */
    --success_dark_color: hsl(152, 69%, 21%); /* Start with success color... Decrease "l" by 10. */
    --success_color_opacity: rgba(25, 135, 84, 0.2); /* Start with success color... Set "a" to 0.2. */

    --danger_color: #dc3545;
    --danger_light_color: hsl(354, 70%, 64%); /* Start with danger color... Increase "l" by 10. */
    --danger_dark_color: hsl(354, 70%, 44%); /* Start with danger color... Decrease "l" by 10. */
    --danger_color_opacity: rgba(220, 53, 69, 0.2); /* Start with danger color... Set "a" to 0.2. */

    --darkest_color: black;
    --box_shadow_color: rgba(88, 88, 91, 0.65);

    --body_font_family: 'Multi', sans-serif;
    --heading_font_family: 'Poppins', sans-serif;
    --ui_font_family: 'Poppins', sans-serif;
}