/*CONTENTS:

- BASE PALETTE
- ASSIGNMENTS
	- text
	- browse my stuff links
	- backgrounds
	- header
	- aside
	- page specific

*/

/*|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~*/

/*|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~*/

/* --------------------------------------------
-------			BASE PALETTE			-------
-----------------------------------------------*/

:root {
    --backgroundColor1: #938b8f;
    --backgroundColor2: #4e3d4d;

    /*default text color*/
    --textColor1: white;
    /*links*/
    --textColor2: rgb(239, 74, 176);
    /*links, hovered*/
    --textColor3: #ffdcf5;
}

/*|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~|~*/

/* --------------------------------------------
-------		   	ASSIGMENTS	    		-------
-----------------------------------------------*/

/* ----				text				------*/

body {
	color: var(--textColor1);
}

a {
	color: var(--textColor2);
}

a:hover {
	color: var(--textColor1);
}

hr {
	color: var(--textColor1);
}

::selection {
	background-color:  var(--textColor1);
	color: var(--textColor2);
}

button:hover {
    color: var(--textColor1);
    background-color: var(--backgroundColor2);
}

button {
    color: var(--backgroundColor2);
    background-color: var(--textColor1);
}

/* ----		browse my stuff links		------*/

.browseA {	
	color: var(--textColor2);
	background-color: var(--backgroundColor2);
}

.browseA:hover, .browseA.currentPage {
	color: var(--backgroundColor2);
	background-color: var(--textColor2);	
}

/* ----			backgrounds				------*/

main{
	scrollbar-color: #88858F #3D3848;
}

.mainBlockSection {
	background-color: var(--backgroundColor1);
}

body {	/*in case the background image doesn't load*/
	background-color: #3E3647;
}

/* ----				header				------*/

header {
	background-color: rgb(120, 120, 120);
}

#headerTextDiv {
	background-color: black;
	color: var(--textColor1);
}

#underConstructionWarningDiv {
	background-color: #d10108;
}

/* ----				aside				------*/

#additionalCreditDiv, #additionalCreditDiv hr {
	color: #989898;
}

#lastUpdatedP {
	color: var(--textColor1);
}

aside a {
	color: var(--textColor2);
}

aside a:hover, aside .currentPage {
	color: var(--textColor3);
}

/* ----				nav bar				------*/

nav {
	background-color: var(--backgroundColor2);
}

.dropdownContent {    
	background-color: var(--backgroundColor2);
}

/* ----				borders				------*/

.mainBlockSection{
	border: solid 1px;
	border-block-width: 1px;
}

#regularHeader, #underConstructionWarningDiv {
	border-block-end: solid 1px;
}

/* ----			page specific				------*/

/*support-me.html*/
#kofiWidgetWrapper {
	background-color: var(--backgroundColor2);
	border: solid 1px;
}

#kofiframe {
	background: var(--backgroundColor2);
	border: none;
}

/*index.html*/
.accentedText {
	color: #b10043;
}