/* old black: #4b475c
old white: #d7dedc */


/* ============================== */
/*              fonts             */
/* ============================== */
@import url('https://fonts.cdnfonts.com/css/nintendo-ds-bios?styles=106046');
@font-face {
  font-family: 'Fieldguide';
  src: url(https://web-dead.neocities.org/assets/fonts/Fieldguide/fieldguide.woff);
}

body {
  background-color: #4b475c;
  color: #4b475c;
  font-family: 'Nintendo DS BIOS', sans-serif;
  font-size: 22px;
  margin: auto;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, li{
  margin: 0px;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Fieldguide', sans-serif;
  margin: 0px;
}

a:link, a:visited{
  color: #2668c2;
}

/* a:visited{
  / color: #97abd4;
} */

.errorgif {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 25%;
}

.center-img {
  display: block;
  margin-left: auto;
  margin-right: auto;
	padding: 1em;
}


/* ============================== */
/*             grid               */
/* ============================== */
.maincontainer {
  display: grid;
  width: 100%;
  grid-template-rows: 1fr;
  grid-template-columns: 1fr 6fr 1fr;
  grid-template-areas:
    "header header header"
    "left-sidebar content right-sidebar"
	  "left-sidebar content right-sidebar";
}


.header {
  grid-area: header;
  text-align: center;
  color: #d7dedc;
  margin: 1em;
}


.content  {
	display: grid;
  background-color: #d7dedc;
  grid-area: content;
  padding: 0.75em 0.75em 0.75em 0.75em;
	margin-left: 0.75em;
}

.left-sidebar {
	grid-area: left-sidebar;
	color: #d7dedc;
  text-align: right;
  margin-left: 0.75em;
	padding: 0.5em 0.75em 0.75em 0.75em;
	line-height: 1.2em;
}

.left-sidebar a {
  color: inherit;
  text-decoration: inherit;
}

.right-sidebar {
	grid-area: right-sidebar;
  color: #d7dedc;
  text-align: left;
  margin-left: 1.875em;
}

.right-sidebar a {
  color: inherit;
  text-decoration: inherit;
}

.left-sidebar-sub {
    border-image:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAACpF6WWAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAFaADAAQAAAABAAAAFQAAAAAIGxIOAAAALElEQVQ4EWNkQAPX7935jyZEkKuppMJIUNGogtEQGA2B0RAYDYHREBgEIQAAkscEApCswKMAAAAASUVORK5CYII=") 7 /  7px / 0 round;
    border-width:  7px;
    border-style:  solid;
	  color: #d7dedc;
	  text-align: right;
	  line-height: 1.2em;
}

.side-sub a {
  color: inherit;
  text-decoration: inherit;
}

.bookmarks-side  {
  background-color: #d7dedc;
  color: #4b475c;
  grid-area: bookmarks-side;
  padding: 0.75em 1em 1em 1em;
}

.bookmarks-side a {
  color: inherit;
  text-decoration: inherit;
}




/* ============================== */
/*          content divs          */
/* ============================== */
.undercon {
	color: black;
	text-align: center;
	grid-column: 1;
	vertical-align: middle;
}

.status-cafe {
	grid-column: 2;
	margin-left: auto;
  margin-right: auto;
}

.default-content {
	grid-column: auto;
}

/* ============================== */
/*             overlay            */
/* ============================== */
.overlay-container {
  display: grid;
  width: 100%;
  grid-template-rows: 1fr;
  grid-template-columns: auto;
  grid-template-areas:
    "overlay-imood"
    "overlay-clock";
}

.overlay-imood {
  grid-area: overlay-imood;
  place-self: start right;
}

.overlay-clock {
  grid-area: overlay-clock;
  place-self: start right;
}




/* ============================== */
/*             widgets            */
/* ============================== */

/* --------  status cafe  ------- */
#statuscafe {
    padding: .5em;
    background-color: azure;
    border: 1px solid midnightblue;
}
#statuscafe-username {
    margin-bottom: .5em;
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
}