body{
    background-color: #ececec;
}
#cartnav{
width:100%;
height:70px;
background-color: #212121;
display:flex;
justify-content:space-between;
}
#cartnav img{
margin-left: 10%;
}
#aftercartnav{
width:100%;
height:70px;
background-color:rgb(238, 230, 230);


}
#aftercartnav{
    text-align:center;
}
#cartmaindiv{
display:flex;
justify-content:space-around;
}
#cartproduct{

width: 60%;
padding-left:5%;
}
#cartrhs{
width:30%;


}
.makeitflex{
width:80%;
display:flex;
justify-content:space-evenly;
margin:auto;
background-color:white;
margin-top: 2%;
}
.makeitflex > h4{
margin-top: 10px;
}
#aftercoupondiv{
width:80%;
background-color:white;
margin:auto;
text-align:center;
}
#aftercoupondiv > p+p{
font-size: 18px;
font-family: semibold;
color: rgb(218, 28, 92);
}
.nomargintop{
width:80%;
display:flex;
justify-content:space-around;
margin:auto;
background-color:white;
}
.nomargintop > h4{
font-family: semibold;
color: #80797b;
}
#cartproduct img{
width:200px;
} 
div > u{
margin-top: 10px;
}
#seperateitems{
display:flex;
justify-content:space-evenly;
margin-top: 2%;
background-color:white;

}
#pricediv{
display:flex;

}
#pricediv > p{
margin-right:8%;
}
#pricediv > s{
margin-top: 6%;
}
#removewish{
display:flex;
gap:5%;
}

#quantdiv{
display:flex;
}
#quantdiv > button{
margin-left: 5%;
margin-right: 5%;
cursor: pointer;
}
#itemprice{
font-family: semibold;
font-size: 22px;

}
#removefromcart{
width:90px;
height:30px;
margin-top:5%;
border-radius: 10px;
border: transparent;
background-color:black;
color:white;
cursor: pointer;
}
#checkoutbuttonincart{
height: 40px;
width: 150px;
border-radius: 20px;
float: none;
background: none rgb(255, 23, 68);
border: transparent;
color:white;
margin-top: 5%;
cursor: pointer;
}

#checkoutbuttonincart:hover{
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px; 
color: goldenrod;
}
#margingapdiv{
padding-top: 10px;
margin-top: 2%;
}
/* From cssbuttons.io by @westitan */
button {
position: relative;
/* padding: 19px 6px; */
display: block;
text-decoration: none;
text-transform: uppercase;
overflow: hidden;
border-radius: 40px;
border: none;
}

button span {
position: relative;
color: #fff;
font-family: Arial;
letter-spacing: 4px;
z-index: 1;
}

button .liquid {
position: absolute;
top: -80px;
left: 0;
width: 100%;
height: 250px;
background:  rgb(255, 23, 68);
box-shadow: inset 0 0 50px rgba(0, 0, 0, .5);
transition: .5s;
}

button .liquid::after,
button .liquid::before {
content: '';
width: 200%;
height: 200%;
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -75%);
background: #fff;
}

button .liquid::before {
border-radius: 45%;
background: rgba(20, 20, 20, 1);
animation: animate 5s linear infinite;
}

button .liquid::after {
border-radius: 40%;
background: rgba(20, 20, 20, .5);
animation: animate 10s linear infinite;
}

button:hover .liquid {
top: -120px;
}

@keyframes animate {
0% {
transform: translate(-50%, -75%) rotate(0deg);
}

100% {
transform: translate(-50%, -75%) rotate(360deg);
}
}