*{
  
  cursor: url("images/mooncursor.png"), auto;
  
  }
  

body {
  font-family:"Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;


  background-image: url('http://dl.glitter-graphics.net/pub/519/519821po41a2leng.gif');
  background-attachment: fixed;
  background-repeat: repeat;
  
  color: white;
  
    

  }

#page {
  
  display: grid;
  
  grid-template-areas:
  
  "title title title"
  "nav mood mood"
  "nav intro intro";
  
  grid-template-rows: 159px 1fr 1fr;
  grid-template-columns: 150px 1fr 1fr;

}

#title{
  grid-area: title;
  margin: 5px;
  padding: 5px;
  
  background-color: rgba(7, 7, 33, 0.5);
  border-style: solid ;
  border-width: 5px;
  border-color: rgb(6, 6, 48);
  border-radius: 10px;
}

#status{
  grid-area: mood;
  margin: 5px;
  padding: 20px;
  
  background-color: rgba(7, 7, 33, 0.5 );
  border-style: solid ;
  border-width: 5px;
  border-color: rgb(6, 6, 48);
  border-radius: 10px;
    
}

#status p{
  margin: 10px;
  padding: 10px;
  
  background-color: rgb(7, 7, 33 );
  border-style: solid ;
  border-width: 5px;
  border-color: rgb(6, 6, 48);
  border-radius: 10px;
  

}

#info{
  grid-area: intro;
    margin: 5px;
    padding: 20px;

    background-color: rgba(7, 7, 33, 0.5 );
    border-style: solid ;
    border-width: 5px;
    border-color: rgb(6, 6, 48);
    border-radius: 10px;
}

.info-p{
  margin: 10px;
  padding: 10px;
  
  background-color: rgb(7, 7, 33 );
  border-style: solid ;
  border-width: 5px;
  border-color: rgb(6, 6, 48);
  border-radius: 10px;
  

}



#nav{
  grid-area: nav;
  
  background-color: rgb(7, 7, 33 );
  border-style: solid ;
  border-width: 5px;
  border-color: rgb(6, 6, 48);
  border-radius: 10px;
}

#nav ul {
   list-style: none;
   padding: 0;

}


#nav ul li {
  margin-bottom:10px;
  
  border-style: solid ;
  border-width: 2px;
  border-color: white;
  border-radius: 2px;
  padding: 5px;

}

#nav ul li a{
  
  text-decoration: none;
  color: blue;
  
}
#nav ul li a:active{
  
  color: blue;
      
  }
  
#nav ul li a:visited{
  
  color: white;
      
  }

#blogfilters{
 display: flex; 
list-style: none;
}

#blogfilters li{
  margin: 5px;
}

.blinkie-box{
  
  border: solid black 3px;
  background-color: grey;
  padding-left: 5px;
  font: 24px/36px sans-serif;
  width: 200px;
  height: 50px;
  overflow-x: hidden;
  overflow-y: scroll;


}


.blinkie-box p {
  font-size: small;
  }
  
.resident {
    
    display: flex;
    padding: 20px;

    
    }
    
.left a, img{
  margin-left: 8px;
  
  }

    
.resident div{
  
  margin: 10px;
}

    
#lemon.resident{
  
  background-color: rgb(36, 39, 87);
  
  }
  
#lemon.resident p {
  
  color: black;
  
  }

#lemon.resident h2 {
  
  color: black;
  
  }