:root{
--black: #000000;
--white: #ffffff;

/* colors HEX */
--color1HEX: #0d1282;
--color2HEX: #007dbc;
--color3HEX: #4995ff;
--color4HEX: #70abff;
--color5HEX: #eb455f;
--color6HEX: #f5cc54;

/* colors RGB */
--blackRGB: 0, 0, 0;
--whiteRGB: 255, 255, 255;
--color1RGB: 13, 18, 130;
--color2RGB: 0, 125, 188;
--color3RGB: 73, 149, 255;
--color4RGB: 112, 171, 255;
--color5RGB: 235, 69, 95;
--color6RGB: 245, 204, 84;

/* layout border */
--border-width: 20px;
--border-color: #eb455f;

/* font families */
--hed-font: 'Outfit', sans-serif;
--body-font: 'Outfit', sans-serif;
--btn-font: 'Outfit', sans-serif;
--mono-font: 'Outfit', sans-serif;
--script-font: 'Outfit', sans-serif;

/* font weights */
--hed-font-weight: 800;
--body-font-weight: 300;
--link-font-weight: 700;
--btn-font-weight: 800;
--menu-font-weight: 700;

/* text transform */
--hed-transform: none;
--subhed-transform: none;
--btn-transform: none;
--menu-transform: none;

/* border-radius */
--border-radius: 0px;

/* blend mode */
--blend-mode: normal;
}

/* lity */

.lity{
	background: var(--color1HEX);
	background: linear-gradient(
		to bottom,
		var(--color2HEX) 0%,
		rgba(var(--color1RGB), 0.7) 100%
	);
}

.lity-close{
    color: var(--color6HEX);
}

.lity-close:hover,
.lity-close:focus,
.lity-close:active,
.lity-close:visited{
    color: var(--color6HEX);
}