*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
	xbackground-image:url('https://chazu.arkku.net/files/img/cross.png');
	background-color:	#1f5393 ;  /* #1C1C1A,  #121211, legit harmaa > #2b2f34 */
	background-color: #04101e;
	background-color: #0b284b;
}
	

body {	
	font-family: Roboto, Arial;
	color:#c7d1c7; /* DCEBDD FFFFCC */
	padding:0px;
	margin:0px;
	overflow-x:hidden;
	width:100vw;
}
	
a:link {
	color:#00cc66;
	text-decoration: none;
} 
a:visited {color:#00cc66; } 
a:hover {xcolor:#16e980;} 
a:focus {
	color:#00ff80;
	text-decoration: underline;
} 
a:active {color:#00ff80;} 



#content {
	xborder:2px solid lime;
	width:95%;
	height:100%;
	max-width: 900px;
	border-radius:5px;
	padding:30px 0px;
	background-color:rgba(0,0,0,0.5);
	line-height: 1.4;
	overflow-x: hidden;
	margin: auto
}

#links {
	xborder:1px solid red;
}

#links > .list-cont {
	border-bottom: 2px solid rgb(55, 55, 55);
	margin-top: 20px;
}

#links > .list-cont > .title {
	font-size: 1.5em;
	padding: 5px 40px;
	display:flex;
	align-items: center;
	justify-content: start;
}

#links > .list-cont > .title > i {
	margin-right: 10px;
	font-size:0.8em;
}

#links > .list-cont > .list  {	
	xborder:1px solid grey;
	xpadding: 0px 40px;
	margin-bottom: 20px;

}





#links > .list-cont > .list > .item {
	padding:0px 5px 0px 5px;
	xcolor:grey;
	position: relative;
	xborder:1px solid green;
	font-family: Roboto, Arial;

	display:flex;
	justify-content: center;
	align-items: center;
}


#links > .list-cont > .list > .item:hover {
	color:lime;
	color:#00ff80;
}

#links > .list-cont > .list > .item:hover {
	background-color: rgba(255,255,255,0.1);
}

#links > .list-cont > .list > .item > .link-numbering {
	xmargin-right:15px;
	color:grey;
	padding:5px 10px 5px 40px;
}

#links > .list-cont > .list > .item > .title {
	padding-left:50px;
	padding:5px;
	height:100%;
	width:95%;
	display:inline-block;
}


.dont-break-out {
  /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;

}

#footer {
	xborder-radius:5px;
	color:grey;
	text-align:center;
	font-family: Roboto Mono, Consolas,monaco,monospace; 
	font-size:0.8em;
	xmargin:20px auto 20px auto;
	margin-top:20px;
	padding:10px;
	xbackground-color:rgba(0,0,0,0.7);
	background-color:#16191c;
	box-shadow: 0px -2px 5px rgba(0, 0, 0, 1);
	width:100%;
	height:100px;
	xmax-width: 1000px;
	display:flex;
	justify-content: center;
	align-items: center;
}