:root {
    --pantone-classic-blue: hsl(210, 80%, 30%);
    --dark-pantone-classic-blue: hsl(210, 80%, 20%);
    --light-pantone-classic-blue: hsl(210, 80%, 60%);
    --pantone-gradient-start: hsl(210, 80%, 10%);
    --pantone-gradient-end: hsl(210, 80%, 25%);

    --boeing-blue: hsl(219, 100%, 33%);
    --dark-boeing-blue: hsl(219, 100%, 20%);
    --light-boeing-blue: hsl(219, 100%, 67%);
    --boeing-gradient-start: hsl(219, 100%, 10%);
    --boeing-gradient-end: hsl(219, 100%, 25%);

    --light-logo-blue: hsl(220, 80%, 65%);
    --medium-logo-blue: hsl(220, 80%, 35%);
    --dark-logo-blue: hsl(220, 80%, 25%);
    --logo-red: hsl(355, 75%, 48%);
    --logo-gradient-start: hsl(220, 80%, 20%);
    --logo-gradient-end: hsl(220, 80%, 30%);
    

    --red: var(--logo-red);
    --light-blue: var(--light-boeing-blue);
    --medium-blue: var(--boeing-blue);
    --dark-blue: var(--dark-boeing-blue);
    --gradient-start: var(--boeing-gradient-start);
    --gradient-end: var(--boeing-gradient-end);


    --bgcolor: var(--dark-blue);
    --popup-bg: hsla(0, 0%, 50%, 0.9);
    --menu: var(--dark-blue);
    --link: var(--light-blue);
    --link-hover: var(--red);
    --hbar: var(--red);
    --box-text: var(--light-blue);
    --package: var(--dark-blue);
    --package-highlight: var(--red);
}