.section{
  border: 5px groove #9F9C92;
}
.section{
  width: 98%;
  padding: 0px;
  display:inline-flex;
  flex-wrap: nowrap;
}
.side-section{
  border: 5px groove #D0CCC2;
  width:17%;
  text-align: left;
}
.main-section{
  border: 5px groove #D0CCC2;
  text-align: left;
  width: 80%;
  font-size: 20px;
}


.modal{
  display: none; 
  position: fixed; 
  z-index: 1; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%;
  overflow: auto;
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal-content {
  display: block;
  margin: 1%;
  height:80vh;
}
.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}