@font-face {
	font-family: Caveat; src: url(https://archive.the-next.eliterature.org/scholars-note/font/Caveat-VariableFont_wght.ttf);
}

#scholars-note {
  position: fixed; bottom: 10%; right: 5%; transform: rotate(-5deg);            
}

#scholars-note img {
  position: relative; width: 300px;
}

#scholars-note p {
  position: absolute; top: 7%; left: 10%; margin: 0; padding: 0; width: 84%; font-family: Caveat, Arial; font-size: 22px; color: rgba(0,0,0,.9);
}

#close-note-button {
  margin: auto; position: absolute; top: initial; bottom: 10%; right: 6%; text-align: right; background: none; color: rgba(0,0,0,.65); border: none; padding: 0; font: verdana; cursor: pointer; outline: inherit; font-size: 16px;
}

.close-note {
  transition: opacity .15s linear; opacity: 0;
}