/* * */

:root {
  --lriwhite: #3c5441;
  --lrigolden: #aaa191;
}

body.night {
  background: black;
}

body.day {
  background: #CEC5B4;
}

body.night,
body.day {
  margin: 0;
}

.center {
  text-align:center;
}

.strong {
  font-weight: bold;
}

.pagestart {
  padding-top: 65px;
}

.lriheader {
  font-size: 17px;
  position:fixed;
  padding:16px 0;
  display:flex;
  width:48%;
  margin-left:26%;
  margin-right:26%;
  top:0;
  z-index:1;
}

.lriheader img {
  margin-left:16px;
  display:block;
}

.night .lriheader {
  border-bottom: 1px solid var(--lriwhite); 
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.block {
  position: absolute;
  margin-top: 11px;
  display: flex;
  text-indent: 17px;
  right: 14px;
  color: #dbdbdb;
}

.day .lriheader {
  background: linear-gradient(
    to right,
    #39413A 0%,
    #39413A 75px,     /* solid square zone */
    var(--lriwhite) 60px,
    var(--lriwhite) 100%
  );
}

/* weekly */

#logs {
  max-width: 631.5px;
  margin: 30px auto 0;
}

.log {
  display: grid;
  grid-template-rows: auto auto auto; /* title, body, date */
  margin-bottom: 9px;
  background: #dbdbdb;
  border-collapse: collapse; /* makes rows join cleanly */
}

.log .row {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0;
  text-align: left;
  padding: 2px 4px 2px 4px;
  border: 1px solid #000;   /* each row gets full border */
  border-bottom: none;      /* remove bottom line (except last) */
}

.log .row:last-child {
  border-bottom: 1px solid #000; /* close the box */
}

/* title row */
.log .row.title {
  min-height: 16px;
  background: #39413A;
  color: #dbdbdb;
  border-bottom: 1px solid #000;
}


/* body row */
.log .row.body {
  font-size: 14px;
  line-height: 1.25;
  white-space: pre-wrap;
}

/* date row */
.log .row.date {
  font-size: 11px;
  line-height: 1.2;
  text-align: right;
}

/* [more] button */
.more-wrapper {
  text-align: center;
  margin: 16px 0 24px;
}
#loadMore {
  background: none;
  border: 0;
  font-weight: bold;
  font-size: 12px;
  cursor: pointer;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#loadMore:focus { outline: none; }
#loadMore[disabled] { opacity: .4; cursor: default; }



/* screens */

@media (max-width:1400px){
  .lriheader{width:100%;margin:0;}
}

@media only screen and (max-width: 1400px) {
  .reader .lriheader {
    width: 100%;
    margin-left: 0%;
    margin-right: 0%;
  }
}

@media (max-width: 600px) {
  .log .row.body {
    font-size: 15px;
  }
}