@import url("opensans.css");

@viewport {
  width: device-width ;
  zoom: 1.0 ;
}

body{
padding: 0px;
margin: 0px;
top: 0px;
background-color: #464655;;
}

.sub-head-h-pad{

}

.ark-work{
padding: 8px;
}

.ark-ws-pad{
display: flex;
flex-direction: row;
}

.box-steam{
padding: 0px 8px;
}

.bug-t-pad{
width: 100%;
align-items: center;
align-content:center;
text-align: center;
font-family: 'Paytone One Regular';
font-size: 1.25vw;
text-transform: capitalize;

}

.bug-c-pad{
font-family: 'Open Sans Condensed Bold';
padding-top: 16px;
}

.bug-s-pad, .bug-o-pad, .bug-d-pad{
padding: 8px 16px 8px 16px;
font-family: 'Open Sans Regular'!important;
}

.bug-container{
max-width: 80%;
padding: 8px 10%;

}


		.bug-panel-blue{
		border: solid 1px #ffffff33;
		border-radius: 8px;
		padding: 2px 16px 8px 16px;
		background-color: #233f66aa;
		color: #ffffff;
		box-shadow: inset 0px 0px 40px 0px #476FFF66;
		}
		.bug-panel-green{
		border: solid 1px #ffffff33;
		border-radius: 8px;
		padding: 2px 16px 8px 16px;
		background-color: #004400aa;
		color: #ffffff;
		box-shadow: inset 0px 0px 40px 0px #00a30066;
		}
		.bug-panel-purple{
		border: solid 1px #ffffff33;
		border-radius: 8px;
		padding: 2px 16px 8px 16px;
		background-color: #662266aa;
		color: #ffffff;
		box-shadow: inset 0px 0px 40px 0px #cc66EE66;
		}

a{
color: #cc66EE;
}

a:hover{
color: #662266;
text-decoration: none;
}

a:visited{

}

.highest{
color: red;
font-family: 'Open Sans Bold';
}

.mild{
color: orange;
font-family: 'Open Sans Bold';
}

.lowest{
color: yellow;
font-family: 'Open Sans Bold';
}

.holy{
padding: 16px;
}

.bug-sub-h-pad{
text-align: center;
font-size: 1vw;
}

.bug-sub-h{
display: inline-flex;
flex-direction: row;
align-content: center;
align-items: center;
width: 100%;
justify-content: center;
}

.bug-content{
text-align: left;
font-size: 1vw;
}

.nobug-pad{
width: 100%;
height: 256px;
display: inline-flex;
flex-direction: column;
justify-content: center;
align-content:center;
align-items: center;
text-align: center;
font-family: 'Paytone One Regular';
font-size: 1.25vw;
}

.steam-cont{
width: 224px;
background-color: #0e141b;
color: #ffffff;
border-radius: 0.325vw;
border: solid 1px #ffffff55;
box-shadow: inset 0px 0px 4vw 0px #000000, inset 0px 0px 8vw 0px #aaccff44, 5px 5px 4px 0px #000000;
display: inline-flex;
flex-direction: row;
align-content: center;
align-items: center;
justify-content: center;
text-slign: center;
min-height: 224px;
}

.steam-cont-2{
width: 224px;
background-color: #0e141b;
color: #ffffff;
border-radius: 0.325vw;
border: solid 1px #ffffff55;
box-shadow: inset 0px 0px 4vw 0px #000000, inset 0px 0px 8vw 0px #aaccff44, 5px 5px 4px 0px #000000;
display: none;
flex-direction: row;
align-content: center;
align-items: center;
justify-content: center;
text-slign: center;
min-height: 224px;
}

.steam-pad{
padding: 1vw;
display: inline-flex;
flex-direction: column;
align-items: center;
align-content: center;
justify-content: center;
overflow:visible;
}

.steam-title{
padding-top: 16px;
width: 100%;
font-family: "Open Sans Bold";
font-size: 1vw;
}

.steam-img{
width: 160px;
background-size: cover; 
background-position: contain;
background-repeat: no-repeat;
height: 96px;
border-radius: 8px;
border: solid 1px #aaccff44;
}

.instruct-row{
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
text-align: left;
padding: 16px 0px;
color: #662266;
border-radius: 16px;
background-color: #ffffff;
}

.instruct-row2{
display: flex;
flex-direction: row;
align-items: start;
width: 100%;
text-align: left;
padding: 16px 0px;
}

.instruct-panel{
width: 80%;
display: inline-flex;
flex-direction: column;
text-align: center;
align-items: center;
align-content: center;
padding: 8px 10%;
}

.instruct-none{
display: inline-block;
flex-direction: row;
align-content: start;
}

.step-container{
width: 100%;
text-align: left;
display: inline-flex;
padding: 8px 0px
}

.step-1-blue, .step-2-blue, .step-3-blue{
font-family: "Open Sans Bold";
color: #233f66;
padding-right: 16px;
}

.step-1-green, .step-2-green, .step-3-green{
font-family: "Open Sans Bold";
color: #004400;
padding-right: 16px;
}

.step-1-purple, .step-2-purple, .step-3-purple{
font-family: "Open Sans Bold";
color: #662266;
padding-right: 16px;
}

.step-1-image{
background-image:url('Plugins_files/step1_2023.jpg');
background-size: cover;
background-position: 0px;
}

.step-2-image{
background-image:url('Plugins_files/step2_2023.jpg'); 
background-size: 440px;
background-position: -108px -3px;
}

.step-3-image{
background-image:url('Plugins_files/codecs1.png'); 
background-size: 500px;
background-position: 0px;
}

.step-1-image, .step-2-image, .step-3-image{
width: 224px;
min-width: 224px;
background-repeat: no-repeat;
height: 170px;
border-radius: 8px;
border: solid 1px #aaccff44;
box-shadow: inset 0px 0px 4vw 0px #000000, 5px 5px 4px 0px #000000;
}

.instruct-title{
font-family: "Paytone One Regular";
text-align: center!important;
font-size: 1.4vw;
width: 100%;
}

.title-blue{
	color: #000000;
	font-family: "Paytone One Regular";
	background-color: #476FFF;
text-align: center;
border-radius: 8px 8px 0px 0px;
height: 3vw;
padding: 0px 0px 4px 0px;
box-shadow: inset 0px 0px 40px #00398f;
color: #ffffff;;
	border-top: solid 1px #476FFF;
	border-left: solid 1px #476FFF;
	border-right: solid 1px #476FFF;
	font-size: 1vw;
}

.title-green{
	color: #000000;
	font-family: "Paytone One Regular";
	background-color: #00a300;
text-align: center;
border-radius: 8px 8px 0px 0px;
height: 3vw;
padding: 0px 0px 4px 0px;
box-shadow: inset 0px 0px 40px #003300;
color: #ffffff;;
	border-top: solid 1px #00a300;
	border-left: solid 1px #00a300;
	border-right: solid 1px #00a300;
	font-size: 1vw;
}

.title-purple{
	color: #000000;
	font-family: "Paytone One Regular";
	background-color: #cc66EE;
text-align: center;
border-radius: 8px 8px 0px 0px;
height: 3vw;
padding: 0px 0px 4px 0px;
box-shadow: inset 0px 0px 40px #220066;
color: #ffffff;;
	border-top: solid 1px #cc66EE;
	border-left: solid 1px #cc66EE;
	border-right: solid 1px #cc66EE;
	font-size: 1vw;
}

.article-container{
display: inline-flex;
flex-direction: column;
border-radius: 16px;
box-shadow: 5px 5px 10px 0px #000000;
width: 80%;
}

.content-green{
font-family: "Open Sans Regular";
font-size: 11pt;
box-shadow: inset 0px 0px 48px #000000;
border-radius: 0px 0px 8px 8px;
background-color: #00a30066;
border-left: solid 1px #00a300;
border-right: solid 1px #00a300;
border-bottom: solid 1px #00a300;
color: #ffffff;
}

.content-blue{
font-family: "Open Sans Regular";
font-size: 11pt;
box-shadow: inset 0px 0px 48px #000000;
border-radius: 0px 0px 8px 8px;
background-color: #476FFF66;
border-left: solid 1px #476FFF;
border-right: solid 1px #476FFF;
border-bottom: solid 1px #476FFF;
color: #ffffff;
}

.content-purple{
font-family: "Open Sans Regular";
font-size: 11pt;
box-shadow: inset 0px 0px 48px #000000;
border-radius: 0px 0px 8px 8px;
background-color: #cc66EE66;
border-left: solid 1px #cc66EE;
border-right: solid 1px #cc66EE;
border-bottom: solid 1px #cc66EE;
color: #ffffff;
}

.section{
height: calc(1vw + 0.25vw);
padding: 0px;
margin: 0px;
display: block;
font-size: 1.35vw;
}

.subsection{
padding: 0px;
margin: 0px;
display: block;
font-size: 11pt;
text-align: left;
}

.nav-container{
display: inline-flex;
flex-direction: column;
width: 100%;
padding: 0px 0px 0px 0px;
text-align: center;
align-items: center;
align-content: center;
}

.nav-containter-content{
background-image: linear-gradient(90deg, #00000000 0%, #000000ff 33%, #000000ff 66%, #00000000 100%);
padding: 0px 0px 4px 0px;
margin: 0px;
display: inline-block;
flex-direction: row;
text-align: center;
align-content: center;
align-items: center;
width: 100%;
height: 32px;
color: #ffffff;
}

.nav-containter-blue, .nav-containter-2-blue{
background-image: linear-gradient(90deg, #476FFF00 0%, #476FFF88 33%, #476FFF88 66%, #476FFF00 100%);
color: #ffffff;
}

.nav-containter-green, .nav-containter-2-green{
background-image: linear-gradient(90deg, #00a30000 0%, #00a30088 33%, #00a30088 66%, #00a30000 100%);
color: #ffffff;
}

.nav-containter-purple, .nav-containter-2-purple{
background-image: linear-gradient(90deg, #cc66EE00 0%, #cc66EE88 33%, #cc66EE88 66%, #cc66EE00 100%); 
color: #ffffff;
}

.nav-containter-purple, .nav-containter-green, .nav-containter-blue{
margin: 0px;
display: inline-block;
flex-direction: row;
text-align: center;
align-content: center;
align-items: center;
width: 100%;
height: 32px;
}

.nav-containter-2-purple, .nav-containter-2-green, .nav-containter-2-blue{
padding: 0px 0px 0px 0px;
margin-top: 0px;
display: inline-flex;
flex-direction: row;
text-align: center;
align-content: center;
align-items: center;
justify-content: center;
width: 100%;
}

.m-nav-pad{
display: block;
width: 100%;
background-color: #ffffff;
}

.m-container-purple{
		background-color: #cc66EE88;
		display: inline-flex;
		flex-direction: row;
		text-align: center;
		align-content: center;
		align-items: center;
		width: 100%;
		height: 64px;
		color: #ffffff;
		}

.m-nav-mm-purple{
background-image: url('images/icons 2023/images/hbm.png');
width: 64px;
height: 64px;
min-height: 64px;
min-width: 64px;
background-size: contain;
}

.button-spot{
display: inline-flex;
vertical-align: middle;
align-content: center;
align-items: center;
font-family: "Paytone One Regular";
height: 32px;
}

.mm-b-text{
font-family: 'Open Sans Condensed Bold';
font-size: 1vw;
}

.mainmenu-blue{
background-color: #233f66;
}
.mainmenu-green{
background-color: #004400;
}
.mainmenu-purple{
background-color: #662266;
}

#big-nav{
display: block;
}

#m-nav{
display: none;
position: fixed;
margin-top: 0px;
left: 0px;
right: 100%;
top: 0px;
height:32px;
}

.head-blue, .head-blue-ark{
background-color: #233f66aa;
background-blend-mode: multiply;
}
.head-green, .head-green-ark{
background-color: #004400aa;
background-blend-mode: multiply;
}
.head-purple, .head-purple-ark{
background-color: #662266aa;
background-blend-mode: multiply;
}

.head-blue, .head-green, .head-purple{
background-attachment: fixed;
background-size: cover;
background-position: center;
background-image: url( "serenebg_2022.jpg");
background-blend-mode: multiply;
width: 100%;
text-align: center;
align-items: center;
display: inline-flex;
flex-direction: column;
}

.head-blue-ark, .head-green-ark, .head-purple-ark{
background-attachment: fixed;
background-size: cover;
background-position: center;
background-image: url( "1292307-3000x1701-desktop-hd-ark-survival-evolved-wallpaper-photo.jpg");
background-blend-mode: multiply;
width: 100%;
text-align: center;
align-items: center;
display: inline-flex;
flex-direction: column;
}

.blur-me{
width: 100%;
text-align: center;
align-items: center;
display: inline-flex;
flex-direction: column;
backdrop-filter: blur(2px);
}

.mbutton{
text-transform: uppercase;
}

.serene-logo{
font-family: "Paytone One Regular";
font-size: 1vw;
text-align: center;
color: #ffffff;
display: flex;
flex-direction: row;
align-items: center;
align-content: center;
padding-top: calc(8vw / 7);
}

.serene-title{
font-size: 4.5vw;
}

.serene-image{
background-image: url("serenespin.gif");
background-size: contain;
width: 8vw;
height: 8vw;
display: inline-block;
position: absolute;
margin-left: -8vw;
}

.grad-hr{
border: none;
outline: none;
padding: none;
width: 100%;
background-image: linear-gradient(90deg, #ffffff00 0%, #ffffffff 25%, #ffffffff 75%, #ffffff00 100%);
height: 2px;
margin: 0px;
}

.blue-hr2{
background-image: linear-gradient(90deg, #233f66cc 0%, #233f66ff 25%, #233f66ff 75%, #233f66cc 100%);
}

.purple-hr2{
background-image: linear-gradient(90deg, #662266cc 0%, #cc66EEff 25%, #662266ff 75%, #662266cc 100%);
}

.green-hr2{
background-image: linear-gradient(90deg, #004400cc 0%, #004400ff 25%, #004400ff 75%, #004400cc 100%);
}

.blue-hr{
background-image: linear-gradient(90deg, #233f6600 0%, #233f66ff 25%, #233f66ff 75%, #233f6600 100%);
}

.green-hr{
background-image: linear-gradient(90deg, #00440000 0%, #004400ff 25%, #004400ff 75%, #00440000 100%);
}

.purple-hr{
background-image: linear-gradient(90deg, #66226600 0%, #662266ff 25%, #662266ff 75%, #66226600 100%);
}

.purple-hr, .blue-hr, .green-hr, .purple-hr2, .blue-hr2, .green-hr2{
height: 2px!important;
margin: 0px;
border: none;
outline: none;
padding: 0px;

}

#mainpage{
width: 100%;
text-align: center;
padding-top: 0px;
}

.sectioned-area-1{
height: 12.5vw;
width: 100%;
background-attachment: fixed;
background-size: cover;
background-position: center;
background-color: #cc66EE;
background-image: url( "serenebg_2022.jpg");
background-blend-mode: multiply;
opacity: 1.0;
box-shadow: inset 0px 0px 32px #000000;
}

.sectioned-area-2{
width: 100%;
background-attachment: fixed;
background-size: cover;
background-position: center;
background-color: #cc66EE;
background-image: url( "serenebg_2022.jpg");
background-blend-mode: multiply;
opacity: 1.0;
box-shadow: inset 0px 0px 32px #000000;
max-width:100%;
transition-duration: 2s;
}

.sectioned-area-2-ark{
width: 100%;
background-attachment: fixed;
background-size: cover;
background-position: center;
background-color: #cc66EE;
background-image: url( "1292307-3000x1701-desktop-hd-ark-survival-evolved-wallpaper-photo.jpg");
background-blend-mode: multiply;
opacity: 1.0;
box-shadow: inset 0px 0px 32px #000000;
max-width:100%;
transition-duration: 2s;
}

.sectioned-area-2-mc{
width: 100%;
background-attachment: fixed;
background-size: cover;
background-position: center;
background-color: #cc66EE;
background-image: url( "mcbg.png");
background-blend-mode: multiply;
opacity: 1.0;
box-shadow: inset 0px 0px 32px #000000;
max-width:100%;
transition-duration: 2s;
}

.sectional-bg-purple, .sectional-bg-purple-2{
background-color: #662266aa;
box-shadow: inset 0px 0px 12vw #662266;
}

.sectional-bg-green, .sectional-bg-green-2{
background-color: #004400aa;
box-shadow: inset 0px 0px 12vw #004400;
}

.sectional-bg-blue, .sectional-bg-blue-2{
background-color: #233f66aa;
box-shadow: inset 0px 0px 12vw #233f66;
}

.sectional-bg-blue, .sectional-bg-green, .sectional-bg-purple{
height: 12.5vw;
width: 100%;
position: absolute;
left: 0;
right: 100%;
border-top: solid 2px #ffffff;
border-bottom: solid 2px #ffffff;
backdrop-filter: blur(2px);
}

.sectional-bg-blue-2, .sectional-bg-green-2, .sectional-bg-purple-2{
width: 100%;
backdrop-filter: blur(2px);
display: inline-flex!important;
align-items: center;
align-content: center;
text-align: center;
max-width:100%
}

.section-content-color{
height: 12.5vw;
width: 80%;
color: #ffffff;
font-family: "Open Sans Condensed Bold";
font-size: 1.2vw;
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
vertical-align: middle;
}

.section-content-color-2{
width: 100%;
color: #ffffff;
font-family: "Open Sans Condensed Bold";
font-size: 1.2vw;
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
vertical-align: middle;
padding: 1vw;
}

.button-nav{
width: 100%;
margin-top: 8px;
padding: 0px 0px;
}

.button-nav-2{
width: 100%;
display: flex;
flex-direction: column;
}

.informative{
width: 80%;
padding: 48px 10% 64px 10%;
font-family: "Paytone One Regular";
font-size: 2vw;
background-color: #ffffff;
}

.informative2{
max-width: 100%;
padding: 16px 10% 32px 10%;
font-family: "Paytone One Regular";
font-size: 2vw;
background-color: #ffffff;
text-align: center;
}

.informative3{
max-width: 100%;
padding: 16px 10% 0px 10%;
font-family: "Paytone One Regular";
font-size: 2vw;
background-color: #ffffff;
text-align: center;
}

.informative4{
max-width: 100%;
padding: 0px 10% 0px 10%;
font-family: "Paytone One Regular";
font-size: 2vw;
background-color: #ffffff;
text-align: center;
}

.info-panel{
justify-content: center;
align-content: center;
align-items: top;
text-align: center;
display: inline-flex;
width: 80%;
}

.info-title-blue, .info-title-2-blue{
color: #233f66;
}

.info-title-green, .info-title-2-green{
color: #004400;
}

.info-title-purple, .info-title-2-purple{
color: #662266;
}

.info-title-blue, .info-title-green, .info-title-purple{
padding-bottom: 32px;
font-size: 2vw; 
text-align: center;
}

.info-title-2-blue, .info-title-2-green, .info-title-2-purple{
padding-bottom: 0px;
font-size: 2vw; 
text-align: center;
margin: 0px;
}

.info-col-green{
color: #004400;
}

.info-col-blue{
color: #233f66;
}

.info-col-purple{
color: #662266;
}

.info-col-purple, .info-col-green, .info-col-blue{
font-family: "Open Sans Condensed Bold";
width: 100%;
display: block;
text-align: center;
font-size: 1.2vw;

}

.icon-img-purple, .icon-img-blue, .icon-img-green{
width: 9vw;
height: 9vw;
background-size: contain;
}

.icon-img-purple{
filter: sepia(100%) brightness(25%) saturate(1800%) hue-rotate(270deg);
}

.icon-img-blue{
filter: sepia(100%) brightness(20%) saturate(1800%) hue-rotate(190deg);
}

.icon-img-green{
filter: sepia(100%) brightness(20%) saturate(1800%) hue-rotate(120deg);
}

.subicon{
width: 2.5vw;
height: 2.5vw;
background-size: contain;
}

.subicon-padding{
display: flex;
flex-direction: row;
}

.subinfo{
display: flex;
flex-direction: column;
vertical-align: middle;
padding-left: 16px;
font-family: "Open Sans Condensed Bold";
align-content: center;
align-items: center;
justify-content: center;
page-break-inside: avoid;
break-inside: avoid;
font-size: 1vw;
}

.icon-img-green, .icon-img-blue, .icon-img-purple{
user-select: none;
cursor: pointer;
}

.icon-column{
display: flex;
flex-direction: row;
align-items: center;
align-content: center;
justify-content: center;
text-align: center;
max-width: 100%;
padding-top: 2px;
}

.icon-padding-green, .icon-padding-blue, .icon-padding-purple{
padding: 0px 2.8vw;
display: flex;
flex-direction: column;
font-family: "Paytone One Regular";
font-size: 14pt;
user-select: none;
}

.icon-padding-green, .icons-title-green{
color: #004400;
}

.icon-padding-blue, .icons-title-blue{
color: #233f66;
}

.icon-padding-purple, .icons-title-purple{
color: #662266;
}

.icons-title-green, .icons-title-blue, .icons-title-purple{
font-family: "Paytone One Regular";
font-size: 2vw;
}

.icon-name{
font-size: 1.2vw;
}

.icon-container{
display: inline-flex;
flex-direction: column;
text-align: center;
align-content: center;
align-items: center;
justify-content: center;
max-width: 100%;
}

.info-col-1-green{
width: 80%;
display: block;
color: #004400;
}

.info-col-1-blue{
width: 80%;
display: block;
color: #233f66;
}

.info-col-1-purple{
width: 80%;
display: block;
color: #662266;
}

.info-col-1-blue, .info-col-1-green, .info-col-1-purple{
padding-top: 32px;
padding-bottom: 32px;
font-family: "Open Sans Condensed Bold";
text-align: justify;
font-size: 1.2vw;
max-width: 80%;
}

.serene-quote{
font-family: "Open Sans Italic";
font-size: 1vw;
}

.info-stuff{
visibility: hidden;
display: none;
position: absolute;
background-color: #ffffff;
z-index: 200;
box-shadow: 5px 5px 20px 0px #000000;
text-align: left;
padding: 16px 16px;
margin-top: calc(9vw + 1vw);
border-radius: 16px;
width: 50vw;
left: calc(50vw * 0.5)
}

#theater:hover .info-stuff{
	visibility: hidden;
	display: block;
}
#arena:hover .info-stuff{
	visibility: hidden;
	display: block;
}
#egypt:hover .info-stuff{
	visibility: hidden;
	display: block;
}
#caves:hover .info-stuff{
	visibility: hidden;
	display: block;
}
#anime:hover .info-stuff{
	visibility: hidden;
	display: block;
}
.gen-button-purple, .gen-button-green, .gen-button-blue{
display:none;
visibility:hidden;
}

.video-panel{
display: inline-flex;
flex-direction: column;
align-items: center!important;
align-content: center!important;
text-align: center!important;
width: 80%;
}

.video-text{
display: flex;
flex-direction: column;
width: 80%;
}

.youtube-vid{
max-width: 480px;
max-height:300px;
min-width: 200px;
min-height: 360px;
height: 100%;
width: 100%;
}

.video{
padding-top:2vw;
width: 100%; 
}

.video-title{
font-family: "Paytone One Regular";
font-size: 2vw;
padding-bottom: 1vw;
}

.video-info{
text-align: justify;
}
.s-panel{
		display: inline-flex;
		flex-direction: column;
		max-width: 100%;
		align-content: center;
		align-items: center;
		text-align: center;
		justify-content: center;
		width: 100%;
	}
	.staff_sub_panel{
		display: inline-flex;
		flex-direction: row;
		padding: 0px 0px 0px 0px;
		align-content: center;
		align-items: center;
		text-align: center;
		justify-content: center;
		max-width: 100%;
	}
	.staff-header-padding{
		text-align: center;
		padding-bottom: 16px;
	}
	.s-icon-out-pad{
		padding: 0px 4px;
		width: 12.5vw;
	}
	.s-img-blue{
		border: solid 4px #233f66;
		box-shadow: inset 0px 0px 24px 3px #476FFF;
	}
	
	.s-img-blue:hover{
		border: solid 4px #476FFF;
		box-shadow: inset 0px 0px 48px 3px #233f66;
	}
	
	.s-img-green{
		border: solid 4px #004400;
		box-shadow: inset 0px 0px 24px 3px #00a300;
	}
	
	.s-img-green:hover{
		border: solid 4px #00a300;
		box-shadow: inset 0px 0px 48px 3px #004400;
	}
	
	.s-img-purple{
		border: solid 4px #662266;
		box-shadow: inset 0px 0px 24px 3px #cc66EE;
	}
	
	.s-img-purple:hover{
		border: solid 4px #cc66EE;
		box-shadow: inset 0px 0px 48px 3px #662266;
	}
	
	.s-img-purple, .s-img-green, .s-img-blue{
		min-width: 5vw;
		min-height: 5vw;
		max-width: 5vw;
		max-height: 5vw;
		border-radius: 5vw;
		transition-duration: 0.6s;
		cursor: pointer;
		display: block;
	}
	
	.s-icon-in-pad:hover .s-name, .s-icon-in-pad:hover .s-role, .s-icon-in-pad:hover .s-name, .s-icon-in-pad:hover .s-role, .s-icon-in-pad:hover .s-name, .s-icon-in-pad:hover .s-role{
		opacity: 1.0;
		
	}
	
	.s-icon-place{
		max-width: 100%;
		padding-bottom: 8px;
		text-align:center;
		display: inline-flex;
		align-content: center;
		align-items: center;
		justify-content: center;
		width: 100%;
	}
	
	.s-name, .s-role{
	width: 100%;
	opacity: 0.0;
	transition-duration: 0.3s;
	user-select: none;
	}
	
	.s-name{
	font-family: "Paytone One Regular";
	font-size: 1vw;
	margin-top: -0.5vw;
	}
	
	.s-role{
	font-family: "Open Sans Condensed Bold";
	font-size: 1vw;
	}
	
	.news_button-blue{
	color: #233f66
	}
	
	.news_button-purple{
	color: #662266
	}
	
	.news_button-green{
	color: #004400
	}
	
	.news_button-blue, .news_button-green, .news_button-purple{
	padding-bottom: 8px;
	font-size: 1.2vw;
	user-select: none;
	}
	
	.news-container{
	font-family: "Open Sans Bold";
	color: #ffffff;
	display: inline-flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding-bottom: 24px;
	width: 80%;
	}
	
	.news-h3, .news-date{
	padding: 0px;
	margin: 0px;
	font-size: 1.3vw;
	}
	
	.news-title{
	display: inline-flex;
	flex-direction: row;
	padding: 4px 0px 0px 0px;
	text-align: center;
	width: 100%;
	align-content: center;
	align-items: center;
	justify-content: center;
	background-color: #ffffff33;
	border-bottom: solid 1px #ffffff22;
	}
	
	.news-title-name, .news-date{
	text-align: center;
	width:50%;
	padding-bottom: 8px;
	}
	
	.news-panel{
	width: 60%;
	border: solid 1px #ffffff66;
	background-color: #00000044;
	border-radius: 8px;
	width: 80%;
	box-shadow: 5px 5px 10px 0px #00000066;
	backdrop-filter: blur(8px); 
	}
	
	.news-content{
	font-family: "Open Sans Regular";
	text-align: justify;
	padding: 24px 16px 8px 16px;
	font-size: 1vw;
	box-shadow: inset 0px 0px 48px 0px #000000;
	border-radius: 8px;
	}
	
	.links-blue{
	color: #476FFF;
	}
	
	.links-green{
	color: #00a300;
	}
	
	.links-purple{
	color: #cc66EE;
	}
	
	.links-purple, .links-green, .links-blue{
	font-family: "Paytone One Regular";
	padding: 0px 12px;
	text-decoration: none;
	}
	
.page-numbers-container{
display: inline-flex;
flex-direction: row;
width: 100%;
align-content: center;
align-items: center;
justify-content: center;
text-align: center;
} 

.page-number-padding{
padding: 0px 0.325vw;

}

.page-number{
font-size: 1.75vw;
}
	
	.rules-pad{
	padding: 0px 15% 0px 5%;
	font-family: "Open Sans Regular";
	font-size: 1vw;
	max-width: 80%;
	width: 100%;
	}
	
	.rules-div{
	text-align: left;
	}
	
	.rules-blue, .rules-green, .rules-purple{
	list-style-position: outside;
	padding-left: 48px;
	text-align: left;
	font-family: "Open Sans Bold";
	padding-top: 0;
	padding-bottom: 0;
	font-weight: normal;
	letter-spacing: 0.3pt;
	color: #000000;
}

.rules-blue li{
	color: #233f66;
	padding: 0;
	line-height: 0pt;
	margin: 0px;
}

.rules-green li{
	color: #004400;
	padding: 0;
	line-height: 0pt;
	margin: 0px;
}

.rules-pruple li{
	color: #662266;
	padding: 0;
	line-height: 0pt;
	margin: 0px;
}

.rules-green li p, .rules-blue li p, .rules-purple li p{
	font-family: "Open Sans Condensed Bold";
	font-size: 1vw;
	padding-left: 4px;
	line-height: 12pt;
	padding-top: 0;
	padding-bottom: 0;
}

.rules-green li p{
	color: #004400;
}

.rules-blue li p{
	color: #233f66;
}

.rules-purple li p{
	color: #662266;
}

.rules-green li .subrules-green li p, .rules-blue li .subrules-blue li p, .rules-purple li .subrules-purple li p{
	font-family: "Open Sans Condensed Bold";
	line-height: 12pt;
	letter-spacing: -0.25pt;
	word-spacing: 2pt;
	padding-top: 0;
	padding-bottom: 0;
}

.rules-blue li .subrules-blue li p{
	color: #476FFF;
}

.rules-purple li .subrules-purple li p{
	color: #cc66EE;
}

.rules-green li .subrules-green li p{
	color: #00a300;
}

.subrules-blue li, .subrules-green li, .subrules-purple li{
	list-style-position: outside;
	list-style-type: upper-alpha;
	font-size: 1vw;
	margin-left: -24px;
	line-height: 1.2vw;
}

.last-rule-green{
	color: #00a300;
}

.last-rule-blue{
	color: #476FFF;
}

.last-rule-purple{
	color: #cc66EE;
}

.subrules-blue li p, .subrules-purple li p, .subrules-green li p{
	text-align: left;
	font-size: 1vw;
	font-family: "Open Sans Regular";
	display: inline;
	line-height: 0.9vw;
}

.subrules-blue li p{
	color: #476FFF;
}

.subrules-green li p{
	color: #00a300;
}

.subrules-purple li p{
	color: #cc66EE;
}

span.racist{
color: #ff0000!important;
}

.m-menu{
display: inline-flex;
}

.m-logo{
			background-image: url('images/icons 2023/images/logo.png');
			background-repeat: no-repeat;
			background-size: contain;
			background-position: center;
			width: 795px;
			height: 64px;
			min-height: 64px;

			}