/*Variables*/
:root {
  --text-color: #FFFFFF;
  --link-color: #0008e8;
  --link-color-hover: #750B73;
  --font: Courier, monospace;
  --heading-font: Georgia, serif;
  --font-size: 18px;  
}


/*Grid Stuff*/
.wrapper {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: minmax(100px, auto);
  column-gap: 10px;
  grid-row-gap: 1em;
  overflow: hidden;
}

/*Display*/

/*Textbox*/
.box2 {
  grid-column: 1;
  grid-row: 1;
  padding: 1em;
}

/*Avatar*/


* {
  box-sizing: border-box;
}


.wrapper > div {
  border: 5px solid #FFFFFF;
  border-radius: 5px;
background: #020024;
background: linear-gradient(0deg, rgba(2, 0, 36, 1) 23%, rgba(9, 9, 121, 1) 77%);
}

body {
  color: var(--text-color);
  font-family: var(--font);
  font-size: var(--font-size);
  justify-content: center;
  margin: 0 80px;
  background-image: url("texture2.png");
  background-repeat: repeat;
  background-clip: border-box;
}


/*link stuff*/
a {
  text-decoration: underline;
  }
  
a,
a:visited {
  color: var(--link-color);
}

a:hover,
a:focus {
  color: var(--link-color-hover);
  text-decoration: none;
}