body{
    background-color: rgb(255, 255, 255);
    margin-top: 100px;
    font-family: Arial, Helvetica, sans-serif;
}

.task-list {
  background-color: #eee;
  width: 80%;
  margin: 0 auto;
  padding: 20px 10px;
  overflow: hidden;
}

.task-list form{
  padding: 0 20px; 
}

.task-list form button{
  float: right;
  padding: 10px 20px;
  font-weight: 700;
  background-color: aquamarine;
  border: 1px solid rgb(153, 153, 153);
}

.task-list form input{
  margin-top: 10px; 
}

.task-list h3{
  padding: 0 20px; 
}

.task-list ul {
  overflow: hidden; 
  padding: 0 0 0 20px; 
  margin: 0px;
}

.task-list li {
  font-size: 17px;
  margin-bottom: 10px;
  line-height: 1.4;
  text-align: left;
  width: 100%;
  float: left;
  list-style: none;
  text-decoration: none;
  border-bottom: 1px solid rgb(192, 192, 192);
  padding-bottom: 10px;
}
.task-list li:last-child{
  border-bottom: none
}

.task-list li:last-child {
  margin-bottom: 0px;
}

.task-list .remove-task {
  cursor: pointer;
  text-align: right;
  background-color: aquamarine;
  border: 1px solid rgb(153, 153, 153);
  color: black;
  margin-right: 20px;
  padding: 0px 5px;
  font-size: 14px;
  font-weight: 700;
  float: right;
}

#generated-tasks {
  background-color: #eee;
  width: 80%;
  margin: 0 auto;
  padding: 20px 10px;
  overflow: hidden;
}
#generated-tasks h3 {
  float: left;
  font-weight: 700;
  padding-left: 20px; 
  padding-right: 20px;
  width: 29%;
}
#generated-tasks ul {
  width: 100%;
  float: left;
  padding-right: 20px;
  padding-left: 20px;
  text-decoration: none;
  list-style: none;
}
#generated-tasks li {
  line-height: 1.8;
  font-weight: 500;
  margin-bottom: 5px;
  border-bottom: 1px dotted black;
}
#generated-tasks .created-task .task_number {font-weight: 700;}
#generated-tasks .task_date {font-weight: 700;}
.asll_buttons {width: 65%; float: right;}
#generated-tasks button{
  margin: 10px 20px 10px 5px;
  float: left;
  padding: 10px 20px;
  font-weight: 700;
  background-color: aquamarine;
  border: 1px solid rgb(153, 153, 153);
}
#generated-tasks .select_list{
  margin: 10px 20px 10px 5px;
  float: left;
  padding: 10px 10px;
  font-weight: 700;
  background-color: aquamarine;
}
.generated_task_header {border-bottom: 1px solid rgb(175, 175, 175); height: auto; overflow: hidden;}

#task-generator .task-list .tasks-list {display: none;}

.active {
  display: block !important;
}