*{
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        background-color: rgb(229, 226, 223);
    }


   i{
    width: 30px;
    height: 30px;
    font-size: 50px;
    color: white;
    background-color: #fff;
    margin: 5px;
    text-shadow: 
    -1px -1px 0 black,  
     1px -1px 0 black,
    -1px  1px 0 black,
     1px  1px 0 black;
   }

   i{
    position: relative;
    left: 30px;
    top: 5px;
   }

   i:hover{
    cursor: pointer;
   }

    header{
        text-align: center;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 1000;
    }

   

    header>h1{
        background-color: black;
        color: white;
    }

    .cart>img{
        width:250px;
        height:250px;
        border-radius: 30px;
    }

    .cart{
        width: 300px;
        height: 350px;
        background-color: #fff;
        padding: 20px;
        margin: 25px;
        border-radius: 50px;
    }

    

    button,a{
        height: 30px;
        width: 100px;
        text-decoration: none;
        background-color:black;
        color: white;
    }

    button{
        margin-top:5px ;
        position: relative;
        left: 90px;
        border-radius: 25px;
    }

   .container{
    display: flex;
    flex-wrap: wrap;
    margin-left: 50px;
    justify-content: center;
   }


    footer>h3{
        text-align: center;
        background-color: black;
        color: white;
        height: 100px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .liked{
        color: red;
    }

    @media screen and (min-width:321px) {
        .container{
            margin: 30px;
        }
    }