.framer {
    background-image: url("blackcatbanner.png"); 
    background-repeat: repeat;
    background-position: top;
    color: black;
    opacity: 0.8;
    border: 2px; 
    border-color: black;
    border-style: solid;
    display: box; 
   position: absolute;
  top: 5%;
  bottom: 5%
  right: 5%;
    left: 5%;
    width: 90%;
    padding-bottom: 20px;
    padding-top: 10px;
}

.container {
  position: relative;
  text-align: center;
  color: white;

}

.bottom-right {
  position: absolute;
  bottom: 5px;
  right: 15px;
}

.grid-gallery {
  --size: 200px;
  display: grid;
  grid-template-columns: repeat(3, var(--size));
  grid-auto-rows: var(--size);
  gap: 5px;
  place-items: start center;
  margin-bottom: var(--size);
}

.grid-gallery img {
  width: calc(var(--size) * 1);
  height: calc(var(--size) * 1);
  object-fit: cover;
  grid-column: auto / span 1;
  border-radius: 5px;
  /* clip-path: path("M90,10 C100,0 100,0 110,10 190,90 190,90 190,90 200,100 200,100 190,110 190,110 110,190 110,190 100,200 100,200 90,190 90,190 10,110 10,110 0,100 0,100 10,90Z");  */
}

.grid-gallery img:nth-child(5n - 1) { 
  grid-column: 2 / span 2 
}
.drop-cap::first-letter {
        color: #000;
        float: left;
       font-size: 5em;
        font-weight: bold;
        margin: 0 .1em 0 0;
        line-height: 0.85;
      }
.authornote {
    font-size: small;
    text-align: center;
}

.menu {
    background-color: bisque; !important; 
    opacity: 0.9;
    border: 0px; 
    margin: 0px;
    padding: 0px;
    overflow-y: scroll;
    scrollbar-color: bisque lightsalmon;

}

.main {
    background-color:bisque !important;  
    opacity: 0.9;
    color:black;
    border: 0px;
    overflow-y: scroll;
    scrollbar-color: bisque lightsalmon;
  
}


.nav {
    background-color:lightsalmon !important;
    opacity: 0.8;
    border: 1px; 
    border-style: solid; 
    display: box; 
    text-align: left; 
    padding: 5px; 
    margin-bottom: 5px;
    margin-top: 5px;
    margin-left: 0px;
    margin-right: 0px;
    width: 90%;
    height: auto;
}

.current {
    background-color:lightsalmon !important;
    opacity: 0.8;
    border: 1px; 
    border-style: solid; 
    display: box; 
    text-align: left; 
    padding: 5px;
    margin-bottom: 5px;
    margin-top: 5px;
    margin-left: 0px;
    margin-right: 0px;
    width: 90%;
    height: auto;
}

a {
  color: lavender;
  text-decoration: none;
  
}

a:hover {
  color:hotpink;
  text-decoration: underline overline;
}

body {
  font-family: Helvetica, Arial, sans-serif;

}