/* The container */
    /* img {
      border: 1px solid #ddd;
      border-radius: 4px;
      left: auto;
      right: auto;
      top: auto;
      bottom: auto;
      padding: 5px;
      width: 700px;
    } */
    body {
      background-image: url("https://previews.123rf.com/images/davib/davib1305/davib130500008/19934509-empty-notebook-page.jpg");
      background-size: 830px, 751px;
      background-repeat: no-repeat;
      background-position: center top;
    }
    .container {
      
      margin-left: 500px;
      top: 130px;
      width: 600px;
      height: 70px;
      display: block;
      position: relative;
      padding-left: 75px;
      cursor: pointer;
      font-family: 'Letter Gothic', 'Letter Gothic Regular';
      font-size: 70px;
       color: #44444F;
      text-align: left bottom;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }
    
    /* Hide the browser's default radio button */
    .container input {
      position: absolute;
      opacity: 0;
      cursor: pointer;
    }
    
    .checkmark {
      position: absolute;
      margin-top: 20px;
      left: 0px;
      height: 70px;
      width: 70px;
    }
    .checkmarksolid {
      opacity: 1;
      position: absolute;
      margin-top: 20px;
      left: 0px;
      height: 70px;
      width: 0px;
      background-image: url("https://i.ibb.co/LRPJxNT/check.png");
      background-size: 70px, 70px;
      background-position-x: 0;
      background-position-y: 0px;
      background-repeat: no-repeat;
    }
    .box {
      position: absolute;
      margin-top: 20px;
      left: 5px;
      height: 35px;
      width: 35px;
      
      border: 4px solid #44444F;
      border-radius: 20%;
    }
    
    /* On mouse-over, add a grey background color */
    .container input:hover ~ .checkmark{
      background-image: url("https://i.ibb.co/LRPJxNT/check.png");
      opacity: 0.3;
      background-size: 70px, 70px;
      background-position-x: 0;
      background-position-y: 0px;
      background-repeat: no-repeat;
    }
    
    .del {
      
      right: 200px;
      top: 10px;
      width: 80px;
      height: 280px;
      display: block;
      position: absolute;
      cursor: pointer;
      background-image: url("https://i.ibb.co/P6qmczk/eraser.png");
      background-size: 80px, 280px;
      background-repeat: no-repeat;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      
    }
    .del input {
      position: absolute;
      opacity: 0;
      cursor: pointer;
    } */
    /* When the radio button is checked, add a blue background