@import url("./themes.css?v=1");
@import url("/fonts/fonts.css?v=1");
@import url("../../css/header.css?v=1");
@import url("../../css/footer.css?v=1");
a{
	color:var(--color-primary-accent);
}
a:hover{
	color:var(--hyperlink-hover-color);
}
body,html{
	padding:0;margin:0;
	color:var(--color-primary-dark);
	font-family:"Segoe UI", helvetica, arial, sans-serif;
}
html[data-theme="BOIS"] body
{
	color:var(--color-primary-light);
}
html{
	background:var(--html-bg);
	background-size:var(--html-bg-size);
}
body{
	background-size:var(--bg-size);
	
	background-image:var(--bg-img);
	min-height:100vh;
	display: flex;
	flex-direction: column;
}
#maximizeButton {
	width: fit-content;
	right: 0;
	background-color:var(--color-primary-accent);
	border: solid 1px black;
	margin: 0 4px 0 0;
	padding: 0 8px;
	border-radius: 0 0 4px 4px;
	box-shadow: inset 0 0 4px black;
	height: 20px;
	line-height: 0;
	padding-bottom: 12pt;
	font-size: 20pt;
	font-weight: bold;
	margin-bottom: 8px;
	text-shadow: 0 0 2px black;
	color: white;
}
#maximizeButton:hover{
	filter:saturate(120%) brightness(110%) contrast(110%) drop-shadow(0 0 2px color-mix(in srgb,white 10%,var(--color-primary-accent)));
}
#chatPanel{
	width: 340px;
	background: var(--main-content-bg-color);
	position:fixed;
	bottom:0;right:0;
	border:ridge var(--color-primary-accent) 3px;
	box-shadow:0px 0px 4px var(--color-primary-accent);
	display:flex;flex-direction:column;
	padding:0;
	box-sizing:border-box;
	transition:width 1s;
}
#chatPanel #chatControls{
	display:flex;
	justify-content:flex-end;
}
#chatPanel #chatTitle{
	width:100%;
	text-align:center;
	font-weight:bold;color:var(--color-main);
	box-sizing:border-box;
	padding:2px 12px;
	pointer-events:none;

}
#chatPanel:not([minimized="1"]) #chatTitle{
	position:absolute;
	left:0;right:0;
}

#chatPanel[minimized="1"]{
	width:120px;
}
#chatPanel>iframe{
	transition:height 1s;
}
#chatPanel[minimized="1"]>iframe{
	padding:0;
	height:0;
	width:0;
}
#chatPanel[minimized="1"] #maximizeButton{
	position:relative;
	line-height:1;
	padding-bottom: initial;
	height: fit-content;
	margin-bottom:0;
	margin:2px;
	font-size:16pt;
	border-radius:4px;
}
label{user-select:none;}
.flex_center{
	display:flex;
	justify-content:center;
	align-items:flex-start;
	flex-grow:1;
}
#main_content,.main_content
{
	width:70%;
	margin-top:1em;
	border:ridge var(--color-primary-accent) 3px;
	box-shadow:0px 0px 4px var(--color-primary-accent);
		padding:0 4em;
		background-color:var(--main-content-bg-color);
		background-image:var(--main-body-bgimage);
		background-size:50% auto;
		background-repeat:no-repeat;
		background-position:100% 50%;
	margin-bottom:1em;
	padding-bottom:2em;
	box-sizing:border-box;
}

h1{color:var(--h1text-color);}
h2{color:var(--color-primary-accent);}
h3{font-size:12pt;}
p{color:var(--textcolor);}

.contentwimg{
	margin-right:2em;
}
.contentsideimg{
}
.contentsideimgwrapper{
	width:fit-content;
}
.contentsideimgright{
	margin-left:20px;
}
.main_contentwimg{
	display:flex;align-items:flex-start;justify-content:center;
}
.main_contentwimg>div:not(.contentsideimgwrapper){
	flex-grow:2;
}

@media (max-aspect-ratio:5/4){
	html:not([data-rendering="1"]){
		#main_content,.main_content{
			width:90%;
		}

		h1{
			font-size:16pt;
			text-align:center;
			
		}
		h2{
			font-size:14pt;
			text-align:center;
			
		}
	}
}
@media (max-aspect-ratio:1/1){
	html:not([data-rendering="1"]){
		#main_content,.main_content
		{
			width:100%;
			padding-left:2em;
			padding-right:2em;
			border:none;
		}
		.contentwimg{
			margin-right:0;
		}
		.contentwimg{
			width:auto;
		}
		.contentsideimg{
			display:none;
		}
	}
}


.noselect{
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}
table{color:var(--table-text);
}
.hidden{display:none}
