html {
    font-family:Georgia, 'Times New Roman', Times, serif;
    font-size:20px;
	background-color: black;
}

body {
	color:white;
	background:black;
	margin:0 5% 0 5%;
	padding:2em;
}

a {
	color:#FF0080;
	text-decoration-color: #7DF9FF;
	text-decoration-thickness:0.15em;
}

a:hover {
	color:yellow;
	text-decoration:none;
}

h1 {
	border-bottom:0.15em solid;
	border-color:#FF0080;
	padding: 0 0.5em 0 0.5em;
}

h2, h3 {
	border-bottom:0.15em solid #FF0080;
	border-top:0.15em solid #7DF9FF;
	width: fit-content;
	padding: 0 0.5em 0 0.5em;
}

h3 {
	border-bottom:0.15em solid #7DF9FF;
}

div#mood {  
    border: 1px solid yellow;
    padding: 0.5%;    
	float:right;
	text-align: center;
}

ul {
  padding: 0;
  margin: 0;
  list-style:none;  
}

li {	
	text-indent: 1em; 
}

li:before {
	padding:0 0.5em 0 0;
	content:"◕◡◕  ";
	color:#FF0080;
}
 
 li:nth-child(2n):before {
	color: #7DF9FF;
	content:"◐ω◑  ";
}

 li:nth-child(3n):before {
	color: yellow;
	content:"ಠ_ರೃ   ";
}

blockquote {
	background: linear-gradient(to right, #FF0080, #7DF9FF);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-align: center;
	margin:2em auto;
	color: #FF0080;
	font-size:1.5em;
	padding: 0 0.5em 0 0.5em;
	border-color:purple;
	border-style:solid;
	border-width:2px;
	border-radius: 5px;	
	width:fit-content;
	max-width: 75%;
	box-shadow: rgba(125, 249, 255, 0.4) 5px 5px, rgba(71, 172, 179, 0.3) 10px 10px, rgba(39, 116, 122, 0.2) 15px 15px, rgba(14, 62, 66, 0.1) 20px 20px, rgba(240, 46, 170, 0.05) 25px 25px;	
}

pre {
	background:black;
	margin:2em;
	color:yellow;
	padding:1em;
	display:block;	
	overflow-x: auto;
	border-style:solid;
	border-color: yellow;
	border-width:1px;
	border-radius: 5px;	
	box-shadow: rgba(240, 46, 170, 0.4) 5px 5px, rgba(240, 46, 170, 0.3) 10px 10px, rgba(240, 46, 170, 0.2) 15px 15px, rgba(240, 46, 170, 0.1) 20px 20px, rgba(240, 46, 170, 0.05) 25px 25px;	
}

article {
	margin:5%;
}

article img {
    margin: auto;
    display: block;
}

img.emoji, img.custom-icon {
	width: 20px;
	vertical-align: middle;
	padding: 0px;
	margin: 0px 5px 0px 5px;
    display:inline;
    border:none;
    box-shadow: none;
}

div#button {
	margin:0;
	padding:0;
}

div#button ul {
}

div#button li {
    list-style: none;
	float:left;
    border-right: 2px solid #FF0080;
	border-left:2px solid #7DF9FF;
	border-top:2px solid #7DF9FF;
	border-bottom:2px solid #FF0080;	
	min-height:1.5em;
	vertical-align:center;
	text-transform: lowercase;
	width: fit-content;
	padding:0.5em;
	margin:0.5em;
}

div#button a {
	text-decoration-color:yellow;
}

a[href^='http']::after {
  /* Styles for external links */
  content: "⇗";
  color:yellow;
  background-color: 7DF9FF;
}

footer {
    font-style: italic;
	background:black;
	width:100%;

	padding:1em;
	position: flow;
	color:yellow;
	text-align:center;
	vertical-align:middle;
}

hr {
  background: linear-gradient(to right, #FF0080, #7DF9FF);
  height: 2px;
  border: 0;  
}