:root {
	/* General */
	--tt-main-color: #b70d7f; /* Template main color. #bf4a1a */
	--tt-dark-color: #121212; /* Template dark color. #121212 */
	--tt-light-color: #efedea; /* Template light color. #efedea */

	--tt-bg-color: #00628b; /* Template background color. #0a0a0a */
	--tt-text-color: #efedea; /* Template text color. #efedea */
	--tt-text-muted-color: #8f8f8f; /* Template text muted color. #8f8f8f */
	--tt-border-color: rgb(133 133 133 / 50%); /* Template borders color. rgb(133 133 133 / 50%) */

	--tt-linear-text-bg-color: rgb(255 255 255 / 20%); /* For linear text reveal effect (do not change it!). rgb(255 255 255 / 20%) */

	/* Fonts */
	--tt-body-font: 'Poppins', sans-serif; /* Body font. */
	--tt-alter-font: "Big Shoulders Display", sans-serif; /* Secondary/Alter font. */

	/* Page transition */
	--tt-page-trans-overlay-bg-color: #161616; /* Page transition overlay background color. #161616 */

	/* Cursor ball */
	--tt-ball-border-color: #666; /* Ball border color. #666 */
	--tt-ball-magnetic-color: var(--tt-main-color); /* Ball magnetic border color. */
	--tt-ball-bg-color: color-mix(in oklab, var(--tt-main-color) 93%, transparent); /* Ball view background color. */
	--tt-ball-color: #FFF; /* Ball view text color. #FFF */

	/* Links */
	--tt-link-color: #00628b; /* Link color. #c93b00 */
	--tt-link-hover-color: #980064; /* Link hover color. #f5533a */

	/* Main menu */
	--tt-sub-menu-bg-color: #252525; /* Sub menu background color. #252525 */
	--tt-sub-menu-link-color: #bbb9b2; /* Sub menu link color. #bbb9b2 */
	--tt-sub-menu-link-hover-color: #FFF; /* Sub menu link hover color. #FFF */

	/* Force to light color */
	--tt-force-to-light-color: #f3f3f3; /* If the element has a background image/video (page header, fullscreen slider, etc.), make all inner elements light (for better visibility). #f3f3f3 */
}
