*{
	padding: 0px;
	margin: 0px;
}
body{
	background-color:#d3d3d3;
	font-size: 21px;
	display: flex;
	flex-direction: column;
}
#main{
	margin-left: 40%;
}
header{
    background: #4a4a35;
    color: #ffffff;
	min-height: 60px;
	border-bottom: #a1e81d 3px solid;
}
.hightlight{
	color: #e8491d;
    font-weight: bold;
}
#moha{
float:left;
}
 h1{
     margin-bottom: 2px;;
    padding: 10px;
    text-align: center;
}
.h1{
	
	margin-top: 1.5%;
	color: #302f35;
}
input{
	margin-top: 30px;
	width: 180px;
	height: 35px;
}
button{
	text-shadow: rgb(175, 7, 7);
	color: #ffffff;
	border-radius: 100%;
	width: 4.5%;
	height: 4.5%;
	border-style: hidden;
	background-color: hsla(131, 7%, 46%, 0.918);
}
button:hover{
	background-color: #a1e81d;
}

#addTodo:disabled{
	background-color: #e41919;
}

li{
	margin-left: 0;
	display: block;
}
/*when LI is hovered show Deletebtn*/
li:hover .deleteTodoBtn{
	color: #00ffff;
	display: inline;
}
/*deltebtn must be displayed none*/
.deleteTodoBtn{
	color: #ffffff;
	display: none;
	border-radius: 100%;
	width: 4.5%;
	height: 4.5%;
	border-style: hidden;
	margin-left: 8px;
	margin-right: 0;
	margin-top: 4px;
	background-color: hsla(131, 7%, 46%, 0.918);
}
.deleteTodoBtn:hover{
background-color: red;
}

#counter{
	color: #1a1919;
}
#left{
float:right;
}
footer{
	font-size: 10px;
    padding: 10px;
	margin-top: auto;
 margin-botton:auto;
    text-align: center;
    }

footer p{
float:right;
	
}