:root {
	/* Primary color */
		/* Hue */
		--primary-color-hue: 200;

	/* Body */
		/* Background */
		--body-bg: hsl(var(--primary-color-hue), 40%, 85%); 
		/* Color */
		--body-txt-color: hsl(0, 0%, 15%);
		/* Color Strong */
		--body-txt-color-strong: hsl(0, 0%, 35%);
		/* Font Family */
		--body-font-family: 'Lato', 'Segoe UI', 'Helvetica', 'Arial';

	/* Links */
		/* Color */
		--body-link-color: hsl(var(--primary-color-hue), 40%, 40%);

	/* Mode Toggle */
		/* Icon */
		--mode-icon-content: "\f185";
		/* Color */
		--mode-icon-color: hsl(40, 85%, 60%);

	/* Inputs */
		/* Background */
		--input-bg: hsl(0, 0%, 100%);
		--input-bg-disabled: hsl(0, 0%, 85%);
		/* Border */
		--input-border-color: hsl(0, 0%, 80%);
		/* Shadow */
		--input-shadow-color: rgba(180, 180, 180, 0.3);
		/* Color */
		--input-txt-color: hsl(0, 0%, 0%);
		--input-accent-color: hsl(var(--primary-color-hue), 50%, 75%);

	/* Button */
		/* Background */
		--button-bg: var(--buttonlist-bg-active);
		--button-bg-hover: var(--buttonlist-bg-active);
		/* Color */
		--button-txt-color: var(--buttonlist-txt-color-active);
		--button-txt-color-hover: hsl(0, 0%, 50%);
		/* Border */
		--button-border-color: var(--buttonlist-border-color-active);
		--button-border-color-hover: var(--buttonlist-border-color-hover);

	/* New Button */
		/* Background */
		--newbutton-bg: linear-gradient(var(--catbg-bg), hsl(var(--primary-color-hue), 35%, 60%));
		/* Color */
		--newbutton-txt-color: hsl(var(--primary-color-hue), 30%, 95%);

	/* Catbg */
		/* Background */
		--catbg-bg: hsl(var(--primary-color-hue), 25%, 45%);
		/* Color */
		--catbg-txt-color: hsl(var(--primary-color-hue), 40%, 95%);

	/* Titlebg */
		/* Background */
		--titlebg-bg: linear-gradient(to bottom, hsl(var(--primary-color-hue), 35%, 90%) 0%, var(--windowbg-bg) 100%);
		--titlebg-bg-right: linear-gradient(to right, hsl(var(--primary-color-hue), 35%, 90%) 0%, var(--windowbg-bg) 100%);
		--titlebg-bg-left: linear-gradient(to left, hsl(var(--primary-color-hue), 35%, 90%) 0%, var(--windowbg-bg) 100%);
		/* Color */
		--titlebg-txt-color: hsl(var(--primary-color-hue), 25%, 40%);

	/* Windowbg */
		/* Background */
		--windowbg-bg: hsl(var(--primary-color-hue), 15%, 95%);
		--windowbg2-bg: hsl(var(--primary-color-hue), 20%, 92%);
		--windowbg-bg-target: hsl(var(--primary-color-hue), 25%, 85%);
		--windowbg-bg-hover: var(--header-bg);
		/* Shadow */
		--windowbg-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1) inset, 0px -1px 1px 0px rgba(0, 0, 0, 0.1) inset;

	/* Roundframe */
		/* Background */
		--roundframe-bg: var(--windowbg-bg);
		/* Shadow */
		--roundframe-shadow: var(--windowbg-shadow);

	/* Header */
		/* Background */
		--header-bg: hsl(var(--primary-color-hue), 60%, 90%);
		/* Border */
		--header-border-color: hsl(var(--primary-color-hue), 45%, 80%);

	/* Logo */
		/* Background */
		--logo-bg-hover: hsl(0, 0%, 30%);

	/* Footer */
		/* Background */
		--footer-bg: hsl(var(--primary-color-hue), 50%, 92%);

	/* Nav */
		/* Background */
		--nav-bg: hsl(0, 0%, 95%);
		/* Shadow */
		--nav-shadow-color: rgba(0, 0, 0, 0.1);

	/* Main Nav Items */
		/* Background */
		--nav-item-bg: transparent;
		--nav-item-bg-hover: transparent;
		--nav-item-bg-active: var(--catbg-bg);
		/* Color */
		--nav-item-txt-color: hsl(0, 0%, 15%);
		--nav-item-txt-color-hover: hsl(var(--primary-color-hue), 25%, 40%);
		--nav-item-txt-color-active: hsl(0, 0%, 100%);

	/* Main Nav Drodown */
		/* Background */
		--nav-dropdown-bg: hsl(0, 0%, 97%);

	/* Main Nav Drodown Items */
		/* Background */
		--nav-dropdown-item-bg: transparent;
		--nav-dropdown-item-bg-hover: var(--nav-item-bg-active);
		/* Color */
		--nav-dropdown-item-txt-color: hsl(0, 0%, 12%);
		--nav-dropdown-item-txt-color-hover: hsl(0, 0%, 100%);

	/* Button List */
		/* Background */
		--buttonlist-bg: hsl(var(--primary-color-hue), 15%, 90%);
		--buttonlist-bg-hover: hsl(var(--primary-color-hue), 15%, 85%);
		--buttonlist-bg-active: hsl(var(--primary-color-hue), 32%, 85%);
		/* Shadow */
		--buttonlist-shadow: 1px -1px 0px 0px rgba(0, 0, 0, 0.1) inset, 0px 1px rgba(255,255,255,0.7) inset;
		/* Border */
		--buttonlist-border-color: hsl(var(--primary-color-hue), 15%, 85%);
		--buttonlist-border-color-hover: hsl(var(--primary-color-hue), 15%, 80%);
		--buttonlist-border-color-active: hsl(var(--primary-color-hue), 15%, 75%);
		/* Color */
		--buttonlist-txt-color: hsl(0, 0%, 10%);
		--buttonlist-txt-color-hover: hsl(0, 0%, 15%);
		--buttonlist-txt-color-active: hsl(0, 0%, 25%);
		/* Text Shadow */
		--buttonlist-txt-shadow: 0px 1px 0px rgba(255, 255, 255, 0.4);

	/* Profile Cover */
		/* Top Height */
		--profile-cover-image-height: 150px;
		/* Bottom Height */
		--profile-cover-details-height: 75px;

	/* Poster */
		/* Background */
		--poster-bg: hsl(var(--primary-color-hue), 12%, 90%);
		/* Width */
		--poster-width: 185px;

	/* Status Colors */
		/* Sticky */
		--status-sticky-bg: hsl(var(--primary-color-hue), 30%, 90%);
		/* Locked */
		--status-locked-bg: hsl(var(--primary-color-hue), 15%, 75%);
		/* Approve */
		--status-approve-bg: hsl(5, 45%, 85%);
		/* Approve Topic */
		--status-approvet-bg: hsl(0, 55%, 90%);
	
	/* Tables and Lists */
		/* Border */
		--table-border-color: hsl(var(--primary-color-hue), 25%, 90%);

	/* Content Section */
		/* Background */
		--content-section-bg: hsl(0, 0%, 100%);

	/* Other Sections */
		/* Background */
		--uppersection-bg: hsl(0, 0%, 90%);
		--forumsections-bg: linear-gradient(hsl(var(--primary-color-hue), 20%, 90%) 0,hsl(0, 0%, 99%) 70%);

	/* Forum News */
		/* Background */
		--forumnews-bg: hsl(var(--primary-color-hue), 25%, 95%);
		/* Inactive Background */
		--forumnews-bg-inactive: hsl(var(--primary-color-hue), 20%, 85%);

	/* Board Moderators */
		/* Background */
		--boardmoderators-bg: hsl(var(--primary-color-hue), 10%, 90%);
	
	/* Board Description */
		/* Background */
		--boarddescription-bg: hsl(var(--primary-color-hue), 35%, 90%);

	/* Sub Boards */
		/* Background */
		--subboards-bg: hsl(var(--primary-color-hue), 25%, 92%);

	/* Tab Items */
		/* Background */
		--themetab-item-bg: hsl(0, 0%, 98%);
		/* Color */
		--themetab-item-txt-color: hsl(0, 0%, 35%);

	/* Popup Container */
		/* Background */
		--popup-container-bg: rgba(0, 0, 0, 0.7);

	/* Linktree */
		/* Before */
		--linktree-li-before-border-color: rgba(0, 0, 0, 0.1);

	/* ScEditor Group */
		/* Background */
		--sceditor-group-bg: hsl(var(--primary-color-hue), 25%, 95%);
		--sceditor-group-bg-active: hsl(var(--primary-color-hue), 25%, 98%);
		/* Border */
		--sceditor-group-border-color: hsl(var(--primary-color-hue), 25%, 67%);

	/* NoticeBox */
		/* Background */
		--noticebox-bg: hsl(50, 100%, 90%);
		/* Border */
		--noticebox-border-color: hsl(48, 95%, 50%);
		/* Color */
		--noticebox-txt-color: hsl(0, 0%, 15%);

	/* ErrorBox */
		/* Background */
		--errorbox-bg: hsl(0, 100%, 90%);
		/* Border */
		--errorbox-border-color: hsl(0, 95%, 50%);
		/* Color */
		--errorbox-txt-color: var(--noticebox-txt-color);

	/* InfoBox */
		/* Background */
		--infobox-bg: hsl(120, 100%, 90%);
		/* Border */
		--infobox-border-color: hsl(120, 95%, 50%);
		/* Color */
		--infobox-txt-color: var(--noticebox-txt-color);

	/* Amt */
		/* Background */
		--amt-bg: var(--catbg-bg);
		--amt-bg-active: hsl(var(--primary-color-hue), 15%, 25%);

	/* Board Icons */
		/* Color */
		--boardicons-txt-color: hsl(var(--primary-color-hue), 15%, 35%);

	/* Avatar */
		/* Border */
		--avatar-border-radius: 50%;

	/* Quote */
		/* Border */
		--quote-border-color: hsl(var(--primary-color-hue), 35%, 65%);
		/* Background */
		--quote-bg: hsl(var(--primary-color-hue), 5%, 90%);
		--qutoe-alternate-bg: hsl(var(--primary-color-hue), 10%, 85%);

	/* Code */
		/* Border */
		--code-border-color: hsl(var(--primary-color-hue), 40%, 50%);
		/* Background */
		--code-bg: hsl(var(--primary-color-hue), 25%, 95%);

	/* Alerts */
		/* Background */
		--alert-bg: hsl(var(--primary-color-hue), 12%, 98%);
		--alert-bg-hover: hsl(var(--primary-color-hue), 15%, 95%);
		/* Border */
		--alert-border-color: hsl(var(--primary-color-hue), 50%, 85%);
}