:root { --font-slate-700: red; --white: hsl(0, 0%, 100%); --slate-50: hsl(0, 0%, 98.04%); --slate-100: hsl(260, 14.29%, 95.88%); --slate-200: hsl(265.71, 13.73%, 90%); --slate-300: hsl(270, 11.32%, 79.22%); --slate-400: hsl(268.57, 11.73%, 64.9%); --slate-500: hsl(271.43, 8.94%, 46.08%); --slate-600: hsl(268.57, 12.14%, 33.92%); --slate-700: hsl(268.24, 12.78%, 26.08%); --slate-800: hsl(274.29, 8.64%, 15.88%); --slate-900: hsl(265.71, 13.73%, 10%); --slate-950: hsl(270, 20%, 3.92%); --bg-body: hsl(0, 0%, 100%); --slate-150: hsl(270, 11.11%, 92.94%); --slate-75: hsl(240, 6.67%, 97.06%); --slate-250: hsl(270, 12.82%, 84.71%); --border: hsl(270, 11.32%, 79.22%); --font-white: hsl(0, 0%, 100%); --lightbox: hsl(0, 0%, 7%); --lightbox-btn: hsl(210, 20%, 98%); --font-heading: hsl(270, 20%, 3.92%); --btn-border: hsl(268.24, 12.78%, 26.08%, 0.3); --btn-hover: hsl(249.73, 62.71%, 88.43%); --btn-fill: hsl(270, 20%, 3.92%); --font-body: hsl(268.57, 12.14%, 33.92%); --link-hover: hsl(260.85, 46.83%, 49.41%); --slate-450: hsl(268.57, 9.25%, 55.49%); --btn-hover-transparent: hsl(250, 100%, 92%, 0.45); --bg-glass: rgba(255, 255, 255, 0.35); --br-glass: rgba(255, 255, 255, 0.5); --btn-ripple: hsl(249.73, 62.71%, 88.43%); --bg-tools: hsl(0, 0%, 100%); --bg-pwd-card: hsl(0, 0%, 100%); --pwd-card-lines: hsl(0, 0%, 100%, 0.3); --card-hover: hsl(249.73, 62.71%, 88.43%); --menu-glass: rgba(255, 255, 255, 0.35); --bg-grad1: hsl(288.39, 97.89%, 81.37%, 0.5); --bg-grad2: hsl(251.25, 100%, 81.18%, 0.5); --br-glass2: rgba(0, 0, 0, 0.05); --bg-glass2: rgba(255, 255, 255, 0.35); --icon-shadow: hsl(260.85, 46.83%, 49.41%, 0.75);}