@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Metal+Mania&display=swap');


body

{
	font-family: 'VT323', monospace;
	font-weight: 300;
	background: black;
	color: white;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	-webkit-user-drag: none;
	-khtml-user-drag: none;
	-moz-user-drag: none;
	-o-user-drag: none;
	height: 510px;
;
}



#story
{
	position: relative;
	margin: 100px auto;
	overflow: scroll;
	overflow-x: hidden;
	height: 510px;
	max-height: 510px;
	min-height: 510px;
	width: 580px;
	transition: opacity 2s ease;
	padding: 20px;
	background-size: 600px 550px;
	background-image: url("Images/chatboxbg.png");
	background-repeat: no-repeat;
	
	
}

@media (hover:none), (hover:on-demand)
{
	#story
	{
		max-width: 100%;
		max-height:100%;
	} 
}


::-webkit-scrollbar {
	width: 20px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
	box-shadow: inset 0 0 5px grey;
	background: #0B0303;
  }
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
	background: #f1ae32;
	background-image: linear-gradient(#613f00, #f1ae32, #ffe5b4, #f1ae32, #613f00);
	box-shadow: inset 0 0 10px #4d3200;

  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
	background: #f3b84a;
	background-image: linear-gradient(#f1ae32, #ffe5b4, #f1ae32);
  }


/* ================================================================= */

p
{

	font-size: 16pt;
	line-height: 1.2;
	margin: 0;
	padding: 0;
	position: relative;


}

p, p > *
{
	-webkit-user-drag: none;
	-khtml-user-drag: none;
	-moz-user-drag: none;
	-o-user-drag: none;
}


/* server text formatting */
.s
{
	color: rgb(190, 190, 190);
}

/* global chat text formatting */
.gl
{
	color: paleturquoise;
}

/* whisper chat text formatting */
.wh
{
	color: rgb(255, 188, 255);
}

/* global chat text formatting for player */
.gls
{
	color: orange;
}

/* whisper chat text formatting for player*/
.whs
{
	color: rgb(255, 227, 175);
}

/* server commands chat text formatting for player */
.ss
{
	color: orange;
}

/* guild */
.g {
	color: rgb(94, 230, 94);

}

/*guild self*/
.gs {
	color: rgb(175, 252, 175);
	
}

/* for the title */
.logo {
	color: red;
	font-family: 'Metal Mania';
	font-size: 49px;
	text-align: center;

}

/* for the welcome */
.w {
	text-align: center;

}

.error {
	color: rgb(219, 22, 22);
}

a 
{
	color: white;
	text-decoration: none !important;
	transition: all 0.5s linear;
	position: relative; bottom: 5%;
	margin: auto;
	padding: auto;
}

a:hover
{
	color: orange;
}
/*
.choice > a
{
	transition: all 1s linear;
	color: orange;
}
*/
.choice > a:hover
{
	color: orange;
	opacity: 1;
	transition: all 1s;	
}

.choice > a:active
{
	color:red;
}

.chosen
{
	color: white !important;
	opacity: 1 !important;
}