/* LAYOUT CLASSES */

/* The "." prefix denotes that this is referring to a class - for example, ".container" refers to the div with the class "container", the ".inner" refers to all of the divs with the class "inner", etc. */

.container {  display: grid;
  grid-template-columns: 1fr 60% 1fr;
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    ". . .";
  margin: 0px 100px;
}

.inner {
    border-radius: 10px; 
    border: 1px solid black;
    background-color: #ffffff;
    font-family: monospace;
    text-align: center;
    padding: 10px;
    margin: 10px;
}

/* WEBSITE CUSTOMIZATION */

body {
    background-color: darkslateblue;
}

#index {
    border: 1px solid black;
    border-radius: 10px;
    margin: 0px 40px;
    text-align: center;
    
}

textarea {
  resize: horizontal;
  width: 500px;
  height: 100px;
}