body {
font-family: Georgia, serif;
margin: 0;
background-color: #08031A;
background-size: 200px;
color: #fceaff;
background-image: url('https://selachimorphic.neocities.org/images/meattile5.png');
}



#container {
max-width: 800px;
margin: 0 auto;
background-color: black;

}

#container a {
color: #D40303;
font-weight: bold;
}



#topBar {
width: 100%;
height: 30px;
padding: 10px;
font-size: smaller;
background-color: #D40303;
}

hr{
height: 1px;
background-color: #ff0000;
border: none;
}


.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.box {
background-color: #010101;
border: 1px solid #D40303;
padding: 10px;
max-width: 900px
  display: block;

}

h1,
h2,
h3,
h4,
h5 {
color: #CF0000;
}


a:link {
  color: #ff0000;
  background-color: transparent;
  text-decoration: underline;
}

a:visited {
  color: #ff0000;
  background-color: transparent;
  text-decoration: none;
}

a:hover {
  color: #820000;
  background-color: transparent;
  text-decoration: underline;
}

a:active {
  color: #ff0000;
  background-color: transparent;
  text-decoration: underline;
}


aside {
background-color: #000000;
border: 1px solid #D40303;
width: 200px;
padding: 20px;
font-size: smaller;
}


main {
max-width: 650px;
border: 1px solid #D40303;
margin: 0 auto;
background-color: black;

flex: 1;
padding: 20px;
order: 2;

}

#leftSidebar {
order: 1;
}

#rightSidebar {
order: 3;
}

footer {
background-color: #820000;
width: 100%;
height: 15px;
padding: 10px;
text-align: center;
}

.image-container {
  position: relative;
  display: inline-block;
}

.image-container img {
  display: block;
  width: 50%;
  height: auto;
}

.overlay-text {
  position: absolute;
  top: 50%; 
  left: 50%; 
  transform: translate(-50%, -50%); 
  background-color: #000000; 
  color: #D40303; 
  padding: 10px 20px; 
  font-size: 15px; 
  text-align: center;
}


 /* The sidebar menu */
.sidenav {
  height: 100%; /* Full-height: remove this if you want "auto" height */
  width: 200px; /* Set the width of the sidebar */
  position: fixed; /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #000000; /* Black */
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 20px;
}

/* The navigation menu links */
.sidenav a {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  font-size: 20px;
  color: #ff0000;
  display: block;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #820000;
}

/* Style page content */
.main {
  margin-left: 200px; /* Same as the width of the sidebar */
  padding: 0px 10px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}



u{color: #ff0000;}

h1 {text-align: center;}
h2 {text-align: center;}
h4 {text-align: center;}
h3 {text-align: center;}