:root {
	/* debug old stuff */
	--primary: #3E3B92;
	--secondary: #F44369;
	--primary: #3C7474;
	--secondary: #F9EA9A;
	
	/* COLOR SCHEME */
	/* light or dark depending on overall theme colors*/
	color-scheme: light;
	
	/* color pallet: https://coolors.co/eaebe5-666666-3c7474-d57d03-f9ea9a */
	
	/* PRIVATE COLOR LIST */
	/* add or delete colors as needed for your theme */
	--color-white:		#ffffff;
	--color-black:		#000000;
	--color-gray:		#666666;
	--color-off-white:	#eaebe5;
	--color-pine-blue:	#3C7474;
	--color-amber-earth:#d57d03;
	--color-light-gold: #f9ea9a;
	
	/* board alert colors */
	--color-red: 		#9c0000;
	--color-blue: 		#002b48;
	--color-green: 		#144800;
	--color-yellow: 	#ffd808;
	
	/* MAIN COLORS */
	/* adjust these to change the overall color scheme of the theme */
	--color-primary: var(--color-off-white); 		/* main color for backgrounds */
	--color-secondary: var(--color-gray);			/* main color for text and ui */
	--color-accent: var(--color-pine-blue);			/* main color for accents such as buttons, links etc. */
	
	/* MAIN TEXT COLORS */
	--color-text: var(--color-gray);				/* normal text on main background color */
	--color-text-accent: var(--color-amber-earth);	/* text in <b> or <i> tags */
	--color-text-link: var(--color-pine-blue);		/* text links */
	
	/* define a textcolor that is readable on --color-accent (NOTE: not --color-text-accent!). on light accent colors, this should be a dark value*/
	--color-text-on-accent: var(--color-white);
	
	/* GRADATION COLORS */
	/* generates different shades of given color */
	/* add more if needed, but keep primary, secondary and accent color gradations */
	/* mix whith white for dark colors or black/dark or transparent values for light colors */
	--color-primary-100: color-mix(in srgb, var(--color-primary), transparent 0%);
	--color-primary-80:  color-mix(in srgb, var(--color-primary), transparent 20%);
	--color-primary-60:  color-mix(in srgb, var(--color-primary), transparent 40%);
	--color-primary-40:  color-mix(in srgb, var(--color-primary), transparent 60%);
	--color-primary-20:  color-mix(in srgb, var(--color-primary), transparent 80%);
	
	--color-secondary-100: color-mix(in srgb, var(--color-secondary), white 0%);
	--color-secondary-80:  color-mix(in srgb, var(--color-secondary), white 20%);
	--color-secondary-60:  color-mix(in srgb, var(--color-secondary), white 40%);
	--color-secondary-40:  color-mix(in srgb, var(--color-secondary), white 60%);
	--color-secondary-20:  color-mix(in srgb, var(--color-secondary), white 80%);
	
	--color-accent-100: color-mix(in srgb, var(--color-accent), white 0%);
	--color-accent-80:  color-mix(in srgb, var(--color-accent), white 20%);
	--color-accent-60:  color-mix(in srgb, var(--color-accent), white 40%);
	--color-accent-40:  color-mix(in srgb, var(--color-accent), white 60%);
	--color-accent-20:  color-mix(in srgb, var(--color-accent), white 80%);
	
	
	/* INDIVIDUAL COLORS IN THEME */
	/* to set individual colors, set the variable corresponding to the element you wish to adjust */
	/* didn't find the element you where looking for? ask arby */
	
	/* SCROLLBAR */
	--color-scrollbar-thumb: var(--color-accent-60);
	--color-scrollbar-track: transparent;
	
	/* TICON */
	--color-ticon-background: var(--color-primary);
	--color-ticon-border: var(--color-secondary);
	
	/* TIPSY TOOLTIP */
	--color-tooltip: var(--color-text-on-accent);
	--color-tooltip-background: var(--color-accent);
	
	/* HEADER */
	--color-header-background: var(--color-primary);
	--color-header-button: var(--color-secondary);
	--color-header-button--hover: var(--color-accent);
	--color-header-button-background: transparent;
	--color-header-button-background--hover: transparent;
	
	/* FORUM TITLE */
	--color-forum-title-name: var(--color-secondary-80);
	--color-forum-title-shortfacts: var(--color-secondary);
	--color-forum-title-mobile-background: var(--color-primary-80);
	
	/* FORUM INFO */
	--color-forum-info-box-border: var(--color-white);
	--color-forum-info-box-background: var(--color-primary-80);
	
	/* BREADCRUMB NAVIGATION */
	--color-breadcrumbs-background: transparent;
	--color-breadcrumbs-border: transparent;
	
	/* FORUM BIT */
	--color-forum-wrapper-background: transparent; /* color behind all forums. set transparent if you want gaps between the individual forums */
	--color-forum-wrapper-border: none; /* same */
	--color-forum-bit-background: var(--color-primary-80); /* background behind individual forum. might wanna set to transparent if you already ahve a wrapper background */
	--color-forum-bit-border: 1px solid var(--color-white); /* same */
	--color-forum-bit-name: var(--color-text);
	--color-subforum-name: var(--color-accent);
	
	/* THREAD LIST */
	--color-threadlist-header-text: var(--color-text-on-accent);
	--color-threadlist-header-background: var(--color-accent);
	--color-threadlist-subheader-text: var(--color-text);
	--color-threadlist-subheader-background: transparent;
	--color-thread-selected-background: var(--color-accent-20);
	
	
	/* MODALS */
	--color-modal-background: var(--color-white);
	--color-modal-text: var(--color-text);
	--color-modal-title-background: var(--color-accent);
	--color-modal-title-text: var(--color-text-on-accent);
	--color-modal-close-icon: var(--color-text);
	--color-modal-close-icon-background: var(--color-primary);
	--color-modal-close-icon-border: var(--color-text);
	--color-modal-close-icon--hover: var(--color-accent);
	--color-modal-close-icon-background--hover: var(--color-primary);
	--color-modal-close-icon-border--hover: var(--color-accent);
	
	/* INPUT ELEMENTS */
	--color-input-text: var(--color-text);
	--color-input-icon: var(--color-accent);
	--color-input-background: transparent;
	--color-input-placeholder: var(--color-secondary-80);
	--color-input-border: var(--color-secondary);
	--color-input-border--hover: var(--color-accent);
	--color-checkbox-radio-background: var(--color-accent-20);
	
	/* SHADOWS */
	--box-shadow-light: -1px 1px 0.5rem 0 #00000033;
	--box-shadow-medium: 0 1px 0.75rem 0 #00000066;
	--box-shadow-strong: 0 0 0.75rem 0 var(--color-black);
	
	
	/* IMAGES */
	--forum-background-texture: url(../../../images/designs/tek/background-texture.jpg);
	--forum-background-image: url(../../../images/designs/tek/background-wolf.jpg);
	/* TODO */
	--image-forum-on: url(../../../images/designs/animal/on.png);
	--image-forum-off: url(../../../images/designs/animal/off.png);
	--image-forum-off-lock: url(../../../images/designs/animal/offlock.png);
}

* {
	scrollbar-color: var(--color-scrollbar-thumb) var(--color-scrollbar-track);
}

legend {
    border-bottom: 4px solid var(--primary);
}

.forum_on {
   color: var(--primary);
}

.active-color {
	background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
}

.postbit_user_btn a:link, .postbit_user_btn a:visited, .postbit_user_btn a:active {
   background: #1c1c1c;
    color: #fff;
}

.panel-primary>.panel-heading {
    background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
    border-color: var(--primary);
}

blockquote {
    border-left: 5px solid var(--primary);
}

.thead {
	background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
	color: #fff;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	font-weight: bold;
}

.thead a:link, .thead a:visited {
	color:#fff;
}

.popup_item:hover {
	background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
}

a:link {
	color: var(--primary);
	text-decoration: none;
}

a:visited {
	color: var(--primary);
	text-decoration: none;
}

a:hover,
a:active {
	color: var(--primary);
	text-decoration: none;
}

#logo {
	background: var(--primary);
}

.forum_on {
color: var(--primary);
}

#portal #nav-portal a,
#forums #nav-forums a,
#searchh #nav-search a,
#member #nav-member a,
#calendar #nav-calendar a,
#help #nav-help a {
    background-color: var(--primary);
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
     background-color: var(--primary);
	 color: #fff;
}

.popup_item:hover {
 background: var(--primary);
 color: #fff;
}


.thead input.textbox,
.thead select {
 border: 1px solid var(--primary);
border-radius: 4px;
}

.modcp_nav_item:before {
	color: var(--primary);
}

 .postbit_buttons > a:link,
   .postbit_buttons > a:hover,
   .postbit_buttons > a:visited,
   .postbit_buttons > a:active {
    display: inline-block;
    padding: 2px 5px;
    margin: 2px;
    background: #1c1c1c;
    border: 1px solid var(--primary);
    color: #fff;
    border-radius: 4px;
}

.postbit_buttons > a:hover {
   border-color: var(--primary);
}

button,
   input.button {
    padding: 3px 8px;
    cursor: pointer;
    background: #1c1c1c;
    border: 1px solid var(--primary);
    color: #fff;
    border-radius: 4px;
    outline: 0;
}

button:hover,
   input.button:hover {
    border-color: var(--primary);
}

button,
   input.button {
    padding: 3px 8px;
    cursor: pointer;
    background: #1c1c1c;
    border: 1px solid var(--primary);
    color: #fff;
    border-radius: 4px;
    outline: 0;
}

button:hover,
   input.button:hover {
    border-color:  var(--secondary);
}

li.nav-forums:hover {
    background: var(--primary)!impotant;
}