@font-face { font-family: "trans"; src: url("https://dysiata.com/fonts/robo.ttf") format("truetype"); }
		@font-face { font-family: "terminal"; src: url("https://dysiata.com/fonts/terminal.ttf") format("truetype"); }
		@font-face {font-family: "puma"; src: url('https://dysiata.com/fonts/puma.ttf'); format("truetype"); }
		@font-face {font-family: "euro"; src: url('https://dysiata.com/fonts/eurostar.ttf'); format("truetype"); }
		@font-face {font-family: "mont"; src: url('https://dysiata.com/fonts/mont.ttf'); format("truetype"); }

	::-webkit-scrollbar {width: 10px;}
	::-webkit-scrollbar-thumb { border: 5px double #4a4a4a;background-color: #fff;}
	::-webkit-scrollbar-track { background-color: #0d0d0d; border: 1px solid #0d0d0d;}
	
* {margin: 0;padding: 0;}

a {
	text-decoration: none;
	-moz-transition: all .5s ease-in-out;
	-webkit-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

body {
	background: white;
	font-family: 'euro', sans-serif;
	font-size: 1rem;
	color: #ffffff;
}

.page {
	display:flex;
	flex-direction:column;
	width:100vw;
	gap:0;
	justify-content: center;
	align-items: center;
}

.bg { position:absolute;}

.heading {
	font-size: 2.5rem;
	font-family: 'trans';
	color: #000000;
	text-shadow: 0px 0px 2px rgb(255, 255, 255);
	margin:0 auto;
	text-align:left;
	width:90%;
}

.number { font-size:3rem;}
.name { font-size:2rem; letter-spacing:0;}

#title {
	display: inline-flex;
	align-items: center;justify-content: center;
	background: black;
	padding:0.5rem;
	text-decoration: none;
	color: white;
	font-family: 'Segoe UI', sans-serif;
	letter-spacing:5px;
	width:100%;
}

#title p {
	font-family:'mont';
	text-shadow: 4px 4px 2px gray;
	letter-spacing:5px;
	width:100%;
	padding-left:5%;
}

hr { border:2px black double; margin:0.5rem; width:100%; }

#subtitle {
	width:90%;
	text-align:right;
	color:#4a4a4a;
	font-family:'euro';
	font-size:1.3rem;
	display:flex;
	flex-direction:column;
	gap:1rem;
	
}

.item {
	width:90%;
	padding: 20px 25px 0px 25px;
	box-sizing: border-box;
	border-radius: 5px;
	border: 1px black solid;
	background: rgba(0, 0, 0, 0.7); 
	font-weight:600;
	letter-spacing:1px;
	font-size:1.2rem;
	margin-bottom:1.5rem;
}

.item img {
	width:99%;
	border:1px solid white;
	border-radius:5px;
	padding:5px;
	margin:5px;
	margin-top:1rem;
}

.console {
	width:80%;
	background:black;
	border:1px gray solid; border-radius: 5px;
	font-family:'terminal';
	font-size:1.2rem;
	padding:1rem; margin: 1rem;
	color:lightgray;
	text-shadow: 0 0 5px white;
	align-self:flex-end;
}

.console b {
	letter-spacing:2px;
	color: white;
}

video {
	width:99%;
	border:1px solid white;
	border-radius:5px;
	padding:5px;
	margin:5px;
}

.item hr { border:1px white solid; width:100%; }

.sub {
	font-size:1rem;
	text-align:right;
	width:90%;
	margin:8px;
	margin-top:2px;
}

.double {
	display:grid;
	grid-template-columns:1fr 1fr;
	width:99%;
	gap:1rem;
	margin-top:1rem;
}

.triple {
	display:grid;
	grid-template-columns:1fr 1fr 1fr;
	width:99%;
	gap:0.6rem;
	margin-top:1rem;
}

.subhead {
	background:white;
	max-width:80%;
	padding: 0.5rem 2rem;
	color:black;
	letter-spacing:3px;
	border: 1px double gray;
	border-radius: 0 0 5px 5px;
	margin-left:1rem;
	font-weight:600;
	margin-bottom:1rem;
	margin-top:0;
	text-indent:0;
}

@media (max-width: 900px) {
	#title { background:black; }
	#title p {
	font-family:'mont';
	text-shadow: 4px 4px 2px gray;
	letter-spacing:5px;
	width:100%;
	background:black;
	padding:0.6rem;
	}
}


#toggle a { background:black; color:white; padding: 0.5rem 1rem;}
#toggle icon { background:white; color:black; margin-right:5px; }
#toggle a:hover { background:white; color:black; }

@media (min-width: 1400px) {

body {
	background: url("dev/entrybg.png");
	background-attachment: fixed;
	background-repeat:no-repeat;
	background-size:cover;
	font-family: 'euro', sans-serif;
	font-size: 1rem;
	color: #ffffff;
}	

.page {
	width:60vw;
	margin:0 auto;
	border-left:8px solid black;
	border-right:8px solid black;
}	
#toggle {display:none;}
}