*{
    margin: 0;
}

h1{
    background-color: rgb(22, 95, 95);
    text-align: center;
    color:white;
    
}
p{
    text-align: center;
    font-size: 22px;
    margin:20px 0 60px 0;

}
footer{
    background-color:rgb(22, 95, 95);
    color: aliceblue;
    padding: 20px;
    font-size:20px;
    margin:0;
    text-align: center;
    position:absolute;
    bottom:0px;
    left:0px;
    right:0px
}

#wrapper{
    background-color:rgb(236, 239, 239);
    
    min-width:200px;
    max-width: 500px;
    margin:auto;
    margin-top:5rem;
    border-radius: 20px;
    min-height: 300px;
}
#appName{
    padding:20px 0 20px 0;
    text-align: center;
    background-color: rgb(77, 160, 237);
    color: rgba(63, 63, 63, 0.851);
    display: block;
    font-size: 30px;
    border-radius: 20px  20px 0 0;
    font-weight:bolder;
}
#formDiv{
    display: flex;
    justify-content:center;
}
hr {
    border: none;
    border-top: solid 1px rgb(2, 2, 2) !important;
    margin: 3px 0 !important;
    opacity: 0.1 !important;
     /* Subtract padding from both sides */
    margin-left: -52px!important; /* Add left padding */
    margin-right:-20px!important;
    margin-bottom: 10px!important;
}
#form{
    margin: 30px 0 20px 20px;
    
}
#input{
    width: 300px;
    padding: 5px;
    margin:0 5px 0 0;
}
#listWrapper{
    padding:20px 20px 40px 20px;
    
}

li{
    padding: 5px 0;
    
}
.orderItems{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
button#delete{
    margin-left:5px
}

.itemMouseOver{
    color:rgb(120, 119, 119);
    cursor:pointer;
    
}
.itemClicked{
    text-decoration: line-through solid 1px;
    
}

.titleBoxSpace{
    border:3px solid white;
}