body {
	background: black;
	color: #AE2402;
	font-family: "Consolas";
}

html, body {margin: 0}

:root {
	--gradient: linear-gradient(90deg,#adffff,#00FFFF);
}
/* afyvo kl r hgic kykb kdczp */
#container {
	height: 100%;
	max-width: 90%;
	color: #D6CBC9;
	margin: 0 auto;
	
}

main {
	background-size: 80%;
	background-repeat: repeat;
	background-image: url(https://file.garden/aS1V2-6dLxrEuu8O/image%20links/backgrounds%20%26%20borders/bg-turingblk.png);
	min-height: 750px;
}

.layout {
  display: grid;
  grid-template-areas:
"content  sidebar";
  grid-template-columns: 80% 20%;
}

/* this is the middle; holds all the written content */
.layout .content {
  grid-area: content;
  color: white;
  word-wrap: break-word;
  background: rgba(4,2,13,0.7);
  margin-top: 15px;
  margin-right: 20px; /* this is the spacing between the main content and the category sidebar*/
  margin-left: 20px; /* this is the spacing between the main content and the links sidebar*/
  padding: 0em 2em 3em;
  border-style: dotted;
}

/* this is the sidebar on the left, it holds all the links*/
.layout .sidebar {
  grid-area: sidebar;
  color: white;
  text-align: left;
  word-wrap: break-word;
  margin-top: 15px;
}

/* text for navbox categories */
.layout .sidebar h2 {
	font-size: 20px;
	font-weight: bold;
	text-transform: uppercase;
  border-bottom: transparent solid 2px;
  border-image-source: var(--gradient);
  border-image-slice: 1;
	width: 100%;
}

/* this styles specifically only the links on the sidebar */
.sidebar a {
	text-decoration: none;
	color: white;
}

.sidebar a:link {
	text-decoration: none;
	color: white;
}

.sidebar a:hover {
	text-decoration: underline;
	text-decoration-style: dotted;
	font-weight: bold;
	color: white;
}

/* adds the arrow to the sidebar list */ 
.layout .sidebar li {
	list-style: inside "✦ ";
	margin-left: -40px;
}

/* colors the arrows */
.sidebar li::marker {
	color: #00ffff;
}
.clear {
	content: "";
	display: table;
	clear: both;
}

/* boxes on the left and right sidebars */
.navbox {
	color: white;
	background-color: rgba(4,2,13,0.7);
	padding: 1px 9px 1px 10px;
	margin-bottom: 10px;
  border-top: transparent solid 3px;
  border: dotted;
}

h1 {
	border-bottom: transparent solid 2px;
  border-image-source: var(--gradient);
  border-image-slice: 1;
  width: 100%;
  margin-bottom: 10px;
  color:#adffff;
}

.intlist {
  column-count: 4;
}

a:link {
  color: #adffff;
  background-color: transparent;
  text-decoration: none;
}

a:visited {
  color: #adffff;
  background-color: transparent;
  text-decoration: underline;
  text-decoration-style: dotted;
}

a:hover {
  color: #00ffff;
  background-color: transparent;
  text-decoration: underline;
  text-decoration-style: dotted;
}

a:active {
  color: #00ffff;
  background-color: transparent;
  text-decoration: underline;
  text-decoration-style: dotted;
}