/*important*/

html, body {
margin: 0%;
background-color: var(--black);
background-image: url(../img/BG_1.jpg);
background-attachment: fixed;
}

#wrapper{
margin: auto;
}

#flex {
display: flex;
}

/*main and aside*/
main,aside{
border: 3px double var(--gray);  
background-color: var(--black);
color: var(--white);

box-sizing: border-box;
}

main{
margin-top: 5px;
margin-bottom: 5px;

padding: 1%;
margin: 1%;

width: 100%;
}

/*fixed Geocities-style aside*/
aside {
width: 25vw;
height: 100vh;
position:sticky;


z-index: 1;
top: 0;
left: 0;

overflow-x:hidden;

margin: 0px;

border-left: none;
border-top: none;
border-bottom: none;
}

/*headings*/
h1, h2, h3 {
color: var(--accent2);

margin: 0%;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
}

/*horizontal lines*/
hr {
border-top: none;
border-bottom: 1px solid var(--gray);
border-right: none;
border-left: none;
}

/*lists*/

li, ol, ul {
text-align: left;

margin: 1.5%;
padding-left: 0%;

list-style-position: inside;
list-style-type: none;
}

/*hyperlinks*/
a {
color:var(--accent1);
text-decoration: underline;
}

a:hover {
color:var(--accent2);
text-decoration: none;
}

/*tables*/
table, td, th {
border-collapse: collapse;
border: 1px solid var(--gray);
padding: 5px;
overflow:hidden;
word-break:normal;

margin-left: auto;
margin-right: auto;
}