.modal .menu {
  width: 35%;
  display: flex;
  flex-direction: column;
  background: lightgrey;
  float: left;
}

.modal .menu .menu-item {
  cursor: pointer;
  text-decoration:none;
  padding: 5px;
  color: black;
}

.modal {
  font-size: 18px;
}

.modal .menu .menu-item:hover {
  background-color: lightsalmon;
}

.modal .menu .menu-item:active {
  background-color: lightsalmon;
}


.modal .content .form-data {
  width: 65%;
  float: left;
  height: 100%;
}

.modal .content .form-data .new-file {
  padding: 10px;
}

.modal .content .form-data .new-file .file-name {
  float: left;
}

.modal .content .form-data .new-file .file-input {
  float: left; 
  clear: left;
  width: 100%;
}

input[type="text"] {
  margin: 10px 0px;
  width: 50%;
  font-size: 18px;
}

.modal .content .form-data .new-file .file-input .custom-file-action {
  background-color: green;
  color: white;
}

.modal .header {
  border-bottom: 1px solid gray;
  font-size: 24px;
  text-align: center;
  padding: 5px;
  font-weight: bold;
}

.modal .content {
  height: 15vh;
}

.modal .actions {
  width: 100%;
  padding: 10px 0px;
}

.modal .actions > button {
  font-size: 18px;
  padding: 5px 10px;
  color: white;
  position: relative;
  float: right;
  margin-right: 20px;
}

.modal .actions .btn-create {
  background-color: green;
}

.modal .actions .btn-cancel {
  background-color: gray;
}