body {
  background: white;
  
  font-family: Sans-Serif;
  font-size: 16px;
  color: #241F31;
  
  image-rendering: pixelated;
  box-sizing: border-box;
  
  align-items: center;
  margin: auto;
  text-align: center;
}

/* the whole STRUCTURE of the website: */

.containr {
  margin: auto;
  max-width: 90%;
  display: flex;
  flex: 1;
}


.sider {
  flex: 1;
}

.mainer {
  flex: 1;
}

.siderrr {
  flex: 1;
}

/* --------------------------------------- */
/* each lil thing */

.main {
  box-shadow: 0px -32px #0000aa, 0px 8px #0000aa;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  background-color: white;

  padding: 6px;
  margin: auto;
  
  width: 90%;
}

/* the so called spacer boys */
/* gay intended (top n bottom... ;w;) */
.top {
  box-shadow: 0px -32px #0000aa;
  border-left: 1px solid #000000;
  border-bottom: 1px solid #000000;
  border-right: 1px solid #000000;
  background-color: white;

  padding: 6px;
  margin: auto;
  
  width: 90%;
}

.bottom {
  box-shadow: 0px 8px #0000aa;
  border-top: 1px solid #000000;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  background-color: white;

  padding: 6px;
  margin: auto;
  
  width: 90%;
}

/* dont look too far into the names ;w; */
.hetero {
  border: 1px solid #000000;
  background-color: white;

  padding: 6px;
  margin: auto;
  
  width: 90%;
}

/* ---------------------------------------------------- */

.thouart {
  box-shadow: 0px -32px #0000aa, 0px 8px #0000aa;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  background-color: white;

  padding-left: 8px;
  padding-right: 8px;
  margin: auto;
  font-size: 14px !important;
  
  width: fit-content;
}

.autistic {
  box-shadow: 0px -32px #0000aa, 0px 8px #0000aa;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  background-color: white;
  padding: 8px;
  margin: auto;
  
  width: fit-content;
}


/* siders */

.fetcher {
  box-shadow: 0px -32px #0000aa, 0px 8px #0000aa;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  background-color: white;
  text-align: justify;

  padding: 8px;
  margin: auto;

  height: fit-content;
  width: 186px;
}

.smoker {
  box-shadow: 0px -32px #0000aa, 0px 8px #0000aa;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  background-color: white;

  padding: 8px;
  margin: auto;

  width: 186px;
}


/* ------------------------------------------------------------------------------------------ */
/* misc */

/* settings links colours */
a:link {
  color: #0000FF;
  background-color: transparent;
  text-decoration: none;
}

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

a:hover {
  color: #0000FF;
  background-color: transparent;
  text-decoration: underline;
}
a:active {
  color: #0000FF;
  background-color: transparent;
  text-decoration: underline;
}

/* shoutout gecko users */
::-moz-selection {
  background: #0000aa;
  color: white;
}

::selection {
  background: #0000aa;
  color: white;
}

hr {
  border: none;
  height: 1px;

  color: #0000aa;
  background-color: #0000aa;
}


.button {
  background-color: #FFFFFF;
  border: 1px black solid;
  color: #000000;
  padding: 16px 16px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
}

button:hover {
  text-decoration: underline;
  color: #0000aa;
}