/** 

YOURSPACE PAGE - made by Nyar @ https://fear.garden

I originally made this for personal use in 2019, and I've been messing around with it ever since. Quality is a bit meh, but hey, it works!

Feel free to customise to your heart's content.

**/

/** general **/
body {
  background-image: url('https://mishearingoaths.neocities.org/gifs/goner.gif');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  image-rendering: optimizeQuality; 
}

/*
 body, html { 
	margin: 0;
	padding: 0;
}
body {
	background: #BADEFC;
	color: #000;
}
b:40231F g:1F4023*/
p {
  color: #FFFfff; /* Changes all paragraph text to white */
}
body, table {font: 14px sans-serif;}
a {color: #1F4023;}
h1, h2, h3 {background: #1F4023}
h1, h2, h3, th {
	box-sizing: border-box;
	color: #FFFFFF;
	margin: 0;
	padding: 2px 4px;
}
td {
  color: #FFFfff;
}

h1, h2 {
	font-size: 16px;
	width: 100%;
}
h3 {
	display: inline-block;
	font-size: 15px;
	margin: 2px 3px; 
	padding: 2px 4px;
}
img, iframe {max-width: 100%;}
table {width: 100%;}
th {
	background: #1F4023;
	color: #ffffff;
	text-align: left;
	width: auto;
}

/** class **/
.box {
	background: #00000050;
	border: #40231F 2px solid;
	margin: 10px 0;
	padding: 3px;
}
.center {text-align: center;}
.container, .blinkies, .footer, .header, .stamps {
	background: #00000050;
	box-sizing: border-box;
	border-left: #40231F 2px solid;
	border-right: #40231F 2px solid;
	margin: 0 auto;
	width: 850px;
}
.container {
	height: 100%;
	padding: 0 1em 1em;
}
.columns {
	display: grid;
	grid-column-gap: 1em;
	grid-template-columns: 292px auto;
	width: 100%;
}

/* .curve {border-radius: 7px;}
.footer, .header {
	background: #d7e4ff;
	box-sizing: border-box;
	font-family: sans-serif;
} 
*/

.footer {
	border-top: #00000000 0px solid;
	border-bottom: #40231F 2px solid;
	padding: 10px 30px 10px;
}
.header {
	border-bottom: #40231F 2px solid;
	border-top: #40231F 2px solid;
	padding: 0 30px 10px;
	color: #ffffff;
}
.blinkiez {
  margin: 0 auto;
  border-top: #40231F 2px solid;
  border-bottom: #40231F 2px solid;
  border-right: #40231F 2px solid;
  border-left: #40231F 2px solid;
  width: 850px; /* Set this to match the exact width of your other boxes */
  box-sizing: border-box;
} 
.stamps {
  margin: 0 auto;
  border-top: #40231F 2px solid;
  border-bottom: #40231F 2px solid;
  border-right: #40231F 2px solid;
  border-left: #40231F 2px solid;
  width: 850px; /* Set this to match the exact width of your other boxes */
  padding: 0;
  box-sizing: border-box;
}

.header span {
	padding: 0 15px;
}
.header .title {
  color: #ffffff;
	font-size: 200% ;
	text-align: left;
	text-decoration: none;
}
.profimg {
	float: left;
	padding: 5px 5px 0 0;
}

/** id **/
#contact a {
	font-weight: bold;
	text-decoration: none;
}
#contact a::before {
	content: url('https://mishearingoaths.neocities.org/gifs/TheSoulTesting.png');
	padding: 0 1em 0 0;
}
#interests td, #details td {width: 70%;}
#url span {font: 12px monospace;}

/** Small screens **/
@media (max-width: 865px) {
	.container, .navbar, .footer, .header {width: 100%;}
	.blinkies, .stamps {width: 50%;}
	.columns {grid-template-columns: 100%;}
	.box {margin: 1em 0;}
	.box:last-child {margin: 0;}
}