body {
  //background-color: #687866;
  background-color : #050BF2
}

section {
  //background-color : #DAE6A0;
  //background-color : #EEE;
  background-color: #BFE4FD;
  border-radius: 33px 33px 33px 33px;
  -moz-border-radius: 33px 33px 33px 33px;
  -webkit-border-radius: 33px 33px 33px 33px;
  border: 3px solid #000000;
  padding : 1em;
  margin: 1em;
  font-size: 1.2em;
}

img {
  max-width : 100%;
}

.task {
  position: relative;
  border-radius: 33px 33px 33px 33px;
  -moz-border-radius: 33px 33px 33px 33px;
  -webkit-border-radius: 33px 33px 33px 33px;
  border: 3px solid #000000;
  padding : 1em;
  font-size: 1.5em;
  background-color: #f3fafe;
}
.andys {
  border-radius: 33px 33px 33px 33px;
  -moz-border-radius: 33px 33px 33px 33px;
  -webkit-border-radius: 33px 33px 33px 33px;
  border: 3px solid #000000;
    -webkit-box-shadow: 0 0 9px 4px rgba(0,0,0,0.5) inset;
    box-shadow: 0 0 9px 4px rgba(0,0,0,0.5) inset;
  padding : 1em;
  font-size: 1.5em;
  background-color: #f3fafe;
}

.task.easy:after {
  display: inline-block;
  text-align: center;
  color: rgba(90, 142, 34, 0.5);
  position: absolute;
  padding-right: 1em;
  bottom: 0;
  right: 0;
  content: "EASY";
}

.task.medium:after {
  display: inline-block;
  text-align: center;
  color: rgba(238, 130, 0, 0.5);
  position: absolute;
  padding-right: 1em;
  bottom: 0;
  right: 0;
  content: "MEDIUM";
}

.task.hard:after {
  display: inline-block;
  text-align: center;
  color: rgba(175, 30, 45, 0.5);
  position: absolute;
  padding-right: 1em;
  bottom: 0;
  right: 0;
  content: "HARD";
}


.task:nth-of-type(3n){
  //background-color : #E6FC73;
  //background-color : #f3f7fe;
}

.task:nth-of-type(3n+1){
 //background-color: #E8F98C;
 //background-color: #f4f4fe;
}

.task:nth-of-type(3n+2){
 //background-color : #EDE6A5;
 //background-color: #f3fafe;
}