body{
          margin: 0px;
          min-width: 250px;
		}
   
       {
       	box-sizing: border-box;
       }
      
      /* remove padding and margin from the list*/
       ul {
       	margin: 0;
       	padding: 0;
       }
      
      /* style the list item */
      ul li{
      	cursor: pointer;
      	position: relative;
      	padding: 12px 20px 12px 50px;
      	list-style-type: none;
      	background: #eef;
      	font-size: 18px;
      	transition: 0.2s;

      	/* make the list item unselectable*/
      	-webkit-user-select: none;
      	-moz-user-select: none;
      	-ms-user-select: none;
      	user-select: none;
      }

      /* select all odd list items to a different color*/
      ul li:nth-child(odd){
      	background: mediumpurple;
      }
      
      /* darker background-color on hover*/
      ul li:hover{
      	background: #darkgoldenrod;
      }

      /* when clicked on, add a background color and strike out text*/
      ul li.checked{
      	background: #888;
      	color: #fff;
      	text-decoration: line-through;
      }

      /* add a "checked" mark when clicked on */
      ul li.checked::before{
      	content: '';
      	position: absolute;
      	border-color: #fff;
      	border-style: solid;
      	border-width: 0 2px 2px 0;
      	top: 10px;
      	left: 16px;
      	transform: rotate(45deg);
      	height: 15px;
      	width: 7px;
      }
      /* style the close button */
      .close{
      	position:absolute;
      	right: 0;
      	top: 0;
      	padding:12px 16px 12px 16px;
      }
      .close :hover{
      	background-color: #f44336;
      	color: white;
      }

      /* style the header */
      .header{
            background-color: black;
            padding: 30px 40px;
            color: white;
            text-align: center;
      }

      /* clear floats after the header*/
      .header:after{
            content: "";
            display: table;
            clear: both;

      }
       
       /* style the input */

      input {
            margin : 0;
            border: none;
            border-radius: 0;
            width: 75%;
            padding: 10px;
            float: left;
            font-size: 16px;
      }

      /* Style the "Add" button*/
      .addBtn {
            padding: 10px;
            width: 30%;
            background: red;
            color: #555;
            float: left;
            text-align: center;
            font-size: 20px;
            cursor: pointer;
            transition: 0.3s;
            border-radius: 0;
      }

      .addBtn:hover{
            background-color: #bbb;
            color: green;
      }