/* Selection Highlight Color */
::selection {
  background: black;
  color: #2CFF05;
}

/* Link Color */
a {
  text-decoration: none; 
  color: #2CFF05;
}

/* Body Style */
body {
  background-image: url('https://syserror404.neocities.org/pictures/background.jpg');
  background-size: cover;
  background-repeat: no-repeat;
}

h2 {
  margin: 0;
}

/* Highlight Color */
mark {
  background-color: black;
  color: #2CFF05;
}

p {
  margin: 5px;
}

ul {
  margin: 0;
}

/* Main Container */
.container {
  font-family: 'Jersey 25';
  width: 1050px;
  margin: 30px auto;
  padding: 10px;
  border: 5px solid black;
  border-radius: 25px;
  background-color: white;
  /* Grid Display Settings */
  display: grid;
    gap: 5px;
    grid-template-columns: repeat(10, 100px);
    grid-template-rows: repeat(10, 100px) 30px;
    grid-template-areas:
    'header header header header header header header header header header'
    'nav nav potw potw potw rss rss rss side side'
    'nav nav potw potw potw bmp bmp bmp side side'
    'nav nav potw potw potw bmp bmp bmp blog blog'
    'nav nav abt abt abt bmp bmp bmp blog blog'
    'nav nav abt abt abt bmp bmp bmp blog blog'
    'nav nav abt abt abt myt myt myt blog blog'
    'nav nav todo todo todo myt myt myt blog blog'
    'nav nav todo todo todo myt myt myt blog blog'
    'nav nav todo todo todo myt myt myt blog blog'
    'footer footer footer footer footer footer footer footer footer footer';
}

/* Generic Box */
.box {
  padding: 10px;
  border: 3px solid black;
  border-radius: 25px;
  color: white;
}
 /* No AI Webring */
.no-ai {
  width: 180px;
}

/* Header */
#header {
  grid-area: header;
  text-align: center;
}

/* Nav Bar */
#nav {
  grid-area: nav;
  text-align: center;
  background-image: url('https://syserror404.neocities.org/pictures/sidebar1.jpg');
  background-size: cover;
  background-repeat: no-repeat;
}

/* Picture of the Week */
#potw {
  grid-area: potw;
  text-align: center;
  background-image: url('https://syserror404.neocities.org/pictures/agreenbg.jpeg');
  background-position: center;
  background-size: cover;
}

/* RSS Feed */
#rss {
  grid-area: rss;
  background-image: url('https://syserror404.neocities.org/pictures/bg2.jpg');
  background-position: center;
  background-size: cover;
}
  
/* Be My Penpal */
#bmp {
  grid-area: bmp;
  background-image: url('https://syserror404.neocities.org/pictures/lines.jpg');
  background-position: center;
  background-size: cover;
}

/* About Me */
#abt {
  grid-area: abt;
  text-align: center;
  background-image: url('https://syserror404.neocities.org/pictures/saturn.jpg');
  background-size: cover;
  background-position: center;
}

/* My Thoughts */
#myt {
  grid-area: myt;
  background-image: url('https://syserror404.neocities.org/pictures/bg.jpg');
  background-position: center;
  background-size: cover;
  overflow-y: scroll;
  scrollbar-color: #2CFF05 black; 
}

/* To Do List */
#todo {
  grid-area: todo;
  background-image: url('https://syserror404.neocities.org/pictures/secret.jpg');
  background-size: cover;
  background-position: center;
  overflow-y: scroll;
  scrollbar-color: #2CFF05 black;
}

/* Side Bar */
#side {
  grid-area: side;
  text-align: center;
  background-image: url('https://syserror404.neocities.org/pictures/greenoverlay.jpg');
  background-position: center;
  background-size: cover;
}

/* Blog Bar */
#blog {
  grid-area: blog;
  text-align: center;
  background-image: url('https://syserror404.neocities.org/pictures/sidebar1.jpg');
  background-size: cover;
  background-repeat: no-repeat;
}

/* Footer */
#footer {
  grid-area: footer;
  padding: 4px 10px;
  background-image: url('https://syserror404.neocities.org/pictures/sidebar1.jpg');
  background-size: cover;
  background-position: center;
}