popup.css

 body{
    background-color: #E4E9FD;
    background: linear-gradient(to bottom,  #bf2dfd 35% , #22c1c3 100%);
    min-width: 500px;
    border-radius: 10px;
    border: 2px;
  }
.heading {
  
    text-decoration: solid;
    padding: 2px 10px;
    text-shadow: darkgray;
    font-family: "Miama";
    font-size: 48px;
    font-weight: 800;
    color: whitesmoke;
   position:relative;
   left: 10px;
   top: 10px;

   
}
@font-face {
  font-family: "Miama";
  src: url("Miama.ttf");
  }

#M_qote {
  padding: 5px 5px;
    position: relative;
  text-align: center;
  font-family:cursive;
  font-size: 25px;
  font-weight: 500;
  color:black;
  
}
#author {
  /* padding: 2px 2px; */
    position: relative;
    right : 10px;
    top: 0px;
  text-align: right;
  font-family: "Miama";
  font-size: 20px;
  color: rgb(243, 243, 234);
}





#task {
    text-align: center;
    height: 40px;
    top: 12px;
  
    margin: 8px 3px;
    background: #fff;
    box-sizing: border-box;
    border: 2px solid;
    border-color: rgb(12, 173, 168);
    border-radius: 5px;
    position:relative;
    left: 120px;
    top: 25px;
  }

  
.prio {
  padding: 6px;

  background-origin: padding-box;

  border-color: rgb(14, 78, 180);
  border-radius: 8px;
position: relative;
left: 12px;
bottom: 25px;
font-family: Arial;
}

.prio:hover {
  border-color: rgb(126, 141, 164);
}
.prio-select select {
  display: none; 
}
.prio.select-items {
  position: absolute;
  background-color: rgb(55, 147, 239);
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}


input[type="datetime-local"]{
  border-color: rgb(89, 111, 148);
  border-radius: 10px;
  padding: 4px;

  background-origin: padding-box;

  position: relative;
    left: 320px;
    bottom: 55px;

}
 #sbmit {
  border-radius: 4px;
  padding: 6px;
  background-color: #afafaf;
  font-size: 120%;
  font-weight: 400;
  position: relative;
  left: 150px;
  bottom:  30px;
  border: none;
cursor: pointer;
 }
 #sbmit:hover {
  background-color: rgb(67, 198, 67);
 }