*{
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

#cartBody{
    padding: 20px;
}
#cart_body{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    
}
#cart_products{
    display: flex;
    flex-direction: column;
    width: 60%;
}

#cart_products .div_col{
    display: flex;
    flex-direction: row;
    column-gap: 20px;
    padding: 10px;
}
#cart_products .div_col > div+div{
    display: flex;
    flex-direction: column;
}
#cart_products .div_col2{
    width: 200px;
}
#cart_products .div_col2 h3{
    margin-bottom: 10px;
}
#cart_products .div_col2 .q_tag{
    display: flex;
    flex-direction: row;
    margin-bottom: 20px;
}
#cart_products .div_col2 .q_tag > #product_quantity{
    width: 50px;
}
#cart_products .div_col .button_tags{
    border-radius: 20px;
    height: 30px;
    padding: 5px;
    margin-left: 10px;
}

#cart_products img{
    width: 150px;
    margin-top: 10%;
}
#cart_products .store_total{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 20px;
}

#cart_total{
    display: flex;
    flex-direction: column;
    width: 35%;
    background-color:  #f0f1f7;
    padding: 1%;
}
#cart_total > div > hr+div{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
#cart_total > div > div+div{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
#cart_total button{
    width: 40%;
    margin-top: 5%;
    font-size: large;
    padding: 10px;
    border-radius: 20px;
}
#cart_total #proceed_btn{
    background-color: #414467;
    color: white;
    font-weight: 700;
}
#cart_total #PayPal, #payLater{
    background-color: #ffc439;
}
#cart_total #visa{
    color: white;
    background-color: black;
}

@media screen and (max-width: 1100px) {
    #cart_products{
        width: 40%;
    }
    
    #cart_products .div_col{
        display: flex;
        flex-direction: column  ;
        column-gap: 20px;
        padding: 10px;
    }
    #cart_products .div_col .button_tags{
        width: 30%;
    }
    #cart_total{
        width: 50%;
    }
}
@media screen and (max-width: 1100px) {
    #cart_products .div_col .button_tags{
        width: 200px;
        margin-bottom: 10px;
    }
}
@media screen and (max-width: 630px) {
    #cart_products{
        width: 100%;
    }
    #cart_total{
        width: 100%;
    }
    #cart_body{
        display: flex;
        flex-direction: column;
    }
    #cart_products .div_col .button_tags{
        width: 200px;
    }
}