*, *::before, *::after {
	box-sizing: border-box;
	scrollbar-width: thin;
	scrollbar-color: hsl(339, 100%, 50%) hsla(339, 85%, 58%, 0.8);
}
::-webkit-scrollbar {
	width: 8px; height: 8px;
}
::-webkit-scrollbar-thumb {
	background-color: hsl(339, 100%, 50%) ;
}
::-webkit-scrollbar-track {
	background-color: hsla(339, 85%, 58%, 0.8);
}

body {
	background: url('/assets/tiles/byheart-pinkbricksbg.png');
	background-size: 192px;
	background-attachment: fixed;

	margin: 0;
	font-size: 16px;
	text-align: center;
	color: #fff;
}

::selection {
	background: #fff;
	color: hsl(339, 100%, 50%);
}

p {
	margin-top: 0;
	margin: 0 auto;
	width: min(1136px, 90%);
}
a {
	color: yellow;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	text-shadow: 0 0 25px yellow;
}



header h1 {
	font-weight: normal;
	font-size: 8rem;
	margin: 0 auto;
}
header details {
	margin: 1em auto;
	width: 500px;
}
header details>ul {
	margin: 0;padding: 0;
	list-style-type: none;
}
header details li {
	width: 90%;
	margin: 0.5em auto;
	background: hsla(339, 85%, 58%, 0.6);
	font-family: consolas, monospace;
}

.notes-div {
	padding: 0.3rem;
}
.notes-div ul {
	margin: 0; padding: 0;
}



section {
	width: min(940px, 90%);
	margin: 0 auto;
}
section>h1 {
	font-family: 'Strawberry-Blossom', monotype corsiva, comic sans ms, fantasy, serif;
	background: hsla(339, 100%, 50%, 0.6);

	font-size: 2.5rem;
	font-weight: normal;
	margin: 0;
	margin-bottom: 1rem;
}
section>p, section>ul {
	font-family: consolas, monospace;
	background: hsla(339, 85%, 58%, 0.6);
	border: 1px solid white;
	padding: 0.3em;
	margin-bottom: 1rem;
}
section ul {
	width: min(1136px, 90%);
	margin: 0 auto;
	margin-bottom: 1rem;
}
section img {
	max-width: 100%;
	margin-bottom: 1rem;
}



#todo-box {
	margin: 1rem auto;
}
#todo-box ul {
	text-align: left;
	padding-left: 15px;
}

footer {
	margin-bottom: 1rem;
}




/* text decor */
.pink-glow {
	text-shadow: 0 0 25px #c40045;
}
.mnspc {
	font-family: consolas, monospace;
	padding: 0 0.3em;
}
.lv1-pink {
	background: hsla(339, 100%, 50%, 0.6);
}
.lv2-pink {
	background: hsla(339, 85%, 58%, 0.6);
}
.title-header {
	font-family: 'Strawberry-Blossom', monotype corsiva, comic sans ms, fantasy, serif;
}

.y {
	color: yellow;	
}
.cy {
	color: cyan;
}

.big-w {
	width: min(738px, 90%);
	margin: 0 auto;
}



hr {
	border: white dashed;
	border-width: 2px 0;
	margin: 1rem 0;
}