@font-face{
font-family:'Trade Winds';
src:local('Trade Winds'),local('TradeWinds'),url('/rc/tw/trade-winds-v6-latin-regular.woff2') format('woff2');
font-weight:400;
font-style:normal;
font-display:swap;
}
html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}
body{ 
color:#ddd;
margin:0px;
padding:0px;
font:1em/1.5em "Source Sans Pro",sans-serif !important;
-webkit-tap-highlight-color:transparent;
background:#000;
}
/* a{color:#bacaaa;text-decoration:none} */
a{color:#bec7e8;text-decoration:none}
a:hover{color:#f4a460;text-decoration:underline 0.01em;text-underline-offset:0.3em}
.bg{
position:fixed; 
top:0; 
right:0; 
bottom:0; 
left:0; 
z-index:-1
}
.bgImg{
width:100%;
height:100%;
object-fit:cover;
object-position:center;
filter:grayscale(80%) brightness(80%);
}
.fSml{font-size:0.8em}
/* RANDOM MAP STUFF */
.sHead{
	border-bottom:1px solid #543c22;
	width:100%;
	display:flex;
	align-items:center;
}
.sFl1, .sFl2, .sFl3, .sFl4{
	display:inline-block;
	flex:auto;
}
.sFl2{
	width:66%;
	max-width:864px;
}
.sFl3{
	width:33%;
	max-width:432px;
}
#sTitle{
	padding:1em;
	font-family:'Trade Winds';
	font-size:2em;
	box-sizing:border-box;
	text-align:center;
	border-right:1px solid #543c22;
}
#sAuthor{
	padding:1em;
	box-sizing:border-box;
	font-family:ui-monospace,"Roboto Mono","JetBrains Mono","DejaVu Sans Mono","Cascadia Code","Source Code Pro","Hack","Droid Sans Mono",monospace;
}
.sBody{
	border-bottom:1px solid #543c22;
	display:flex;
}
.sImg{
	padding:2em 1em 2em 1em;
	text-align:center;
	box-sizing:border-box;
}
.sImg img{
	width:100%;
	vertical-align:top;
	aspect-ratio:16/9;
	object-fit:cover;
	object-position:center;
	transition:opacity 250ms;
}
.sImg640{max-width:640px;}
.sImg800{max-width:800px;}
.sImgSoft{opacity:0;}
#sOverview{
	padding:2em 1em 2em 1em;
	font-size:0.9em;
	font-family:ui-monospace,"Roboto Mono","JetBrains Mono","DejaVu Sans Mono","Cascadia Code","Source Code Pro","Hack","Droid Sans Mono",monospace;
	box-sizing:border-box;
}
.sFoot{
	text-align:center;
	padding:1em 1em 4em 1em;
	font-size:0.9em;
	font-family:ui-monospace,"Roboto Mono","JetBrains Mono","DejaVu Sans Mono","Cascadia Code","Source Code Pro","Hack","Droid Sans Mono",monospace;
}
.sOptions{max-width:40ch}
.sHref{
	/* color:#bacaaa; */
	line-height:2em;
	white-space:nowrap;
/*	transition:all 250ms; */
}
.sHref::before{
	content:"[ ";
	color:#543c22;
	transition:all 500ms;
}
.sHref::after{
	content:" ]";
	color:#543c22;
	transition:all 500ms;
}
.sHref:hover, .sHref:hover::before, .sHref:hover::after, .sHref:active, .sHref:active::before, .sHref:active::after{
	text-decoration:none;
	color:#f4a460;
/*	background:#16130f; */
}
.sNoWrap{
	white-space:nowrap;
}
#sLoadingFull{
	position:fixed;
	top:0px;
	right:0px;
	bottom:0px;
	left:0px;
	justify-content:center;
	background:rgba(22,19,15,0.6);
}
.sLoading{
	display:inline-block;
	white-space:nowrap;
	overflow:hidden;
	padding-top:2em;
}
.sLoading pre{
	font-family:ui-monospace,"Roboto Mono","JetBrains Mono","DejaVu Sans Mono","Cascadia Code","Source Code Pro","Hack","Droid Sans Mono",monospace;
	font-size:0.75em;
	line-height:1.15em;
}
.sLoading pre b{animation:sLoadingLoop 2s infinite}
@keyframes sLoadingLoop{
0%{color:#ffffff} 
50%{color:#f4a460}
100%{color:#ffffff}
}
.sFlex{display:flex}
.sHide{display:none}
@media all and (max-width:1296px){
	.sFl1, .sFl4{
		display:none;
	}
}
@media all and (max-width:800px){
	.sFl2, .sFl3{
		width:100%;
		max-width:100%;
	}
	.sHead{
		display:block;
	}
	#sTitle{
		padding:1em 1em 0.5em 1em;
		border:0px;
	}
	#sAuthor{
		padding:0.5em 1em 1em 1em;
		text-align:center;
	}
	.sImg, #sOverview{
		padding:1em;
	}
}
@media all and (max-width:720px){
	.sBody{
		display:block;
	}
	.sImg{
		padding:1em 1em 0.5em 1em;
	}
	#sOverview{
		padding:0.5em 1em 1em 1em;
		text-align:center;
	}
	.sOptions{
		max-width:100%;
	}
}
@media all and (max-width:600px){
	.sLoading pre{
		font-size:0.5em;
	}
}

