body {
  background-color: #282f32;
  color: #282f32;
}
/*scrollbar*/
body {
  --sb-track-color: black;
  --sb-thumb-color: #282f32;
  --sb-size: 8px;
}

body::-webkit-scrollbar {
  width: var(--sb-size)
}

body::-webkit-scrollbar-track {
  background: var(--sb-track-color);
  border-radius: 3px;
}

body::-webkit-scrollbar-thumb {
  background: var(--sb-thumb-color);
  border-radius: 3px;
  border: 1px solid #44505a;
}

@supports not selector(::-webkit-scrollbar) {
  body {
    scrollbar-color: var(--sb-thumb-color)
                     var(--sb-track-color);
  }
}

/*outside*/
#computer {
  min-width: 928px; 
  margin: 0 auto;
  }
  
/*main content*/
.container{
  display: grid;
  height: 1740px;
  margin: auto;
  width: 928px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  padding: 10px;
  gap: 5px;
}
#header {
  background-color: #acb3b4;
  grid-area: 1/ 1/ span 1/ span 15;
  text-align: center;
  padding: 5px;
  border-radius: 2% 2% 2% 2%;
  border-style: groove;
  border-width:5px;
  border-color: #5c6269;
  }
#para {
  background-color: #acb3b4;
  grid-area: 2/ 1/ span 1/ span 15;
  text-align: center;
  padding: 5px;
  border-radius: 2% 2% 5% 5%;
  border-style: groove;
  border-width:5px;
  border-color: #5c6269;
  }
#sidebar {
  background-color: #acb3b4;
  grid-area:3/ 1/ span 6/ span 4;
  border-radius: 5% 5% 5% 5%;
  border-style: groove;
  border-width:5px;
  border-color: #5c6269;
}
#content {
  background-color: #acb3b4;
  overflow-x: hidden;
  overflow-y: auto;
  grid-area:3 / 5/ span 12 / span 11;
  border-radius: 5% 5% 5% 5%;
  border-style: groove;
  border-width:5px;
  border-color: #5c6269;
  position: relative;
}
#comments {
  background-color: #acb3b4;
  grid-area: 9 / 1 /span 4/ span 4;
  border-radius: 5% 5% 5% 5%;
  border-style: groove;
  border-width:5px;
  border-color: #5c6269;
}
#top1 {
 max-width:680px;
 top: 0;
 left: 0;
 position: sticky;

}
#bottom1 {
  max-width: 680px;
  bottom: 0;
  left: 0;
  position: sticky;
}
#entry {
   border-top: 3px dotted;
    overflow: visible;
    width:600px;
    height:50px;
    
  }


  
.dashed {
  border-top: 3px dashed #bbb;
}

/*.box {
 border-top: 3px dotted;
  overflow-x: visible;
  overflow-y: auto;
  padding: 20px;
    width:600px;
    
  }*/

.entry {
    width: 600px;
    border-top-style: dotted;
    border-style: none;
    height: 800px;
    
    
}