.rankedImageBook{
    width: 132px;
    height: 232px;
    transition: all 300ms;
}

.rankedImageBook:hover{
    scale: 1.04;
}


.rankedBookContainer{
    width: 160px;
    height: 400px;
    display: flex;
    align-items: center;
    flex-flow: column;
    background-color: rgb(49, 85, 245);
    padding-top: 1rem;
    padding-bottom: 1rem;
    box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
    border-radius: 0.75rem; /* 12px */
    color: aliceblue;
}


.bookSlide{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 4% 0 4%;
}

.priceContainer{
    display: flex;
    width: 90%;
    height: fit-content;
    background-color: rgb(4, 42, 145);
    border-radius: 1rem;
}


.priceTitleSection{
    display: flex;
    flex-flow: column;
    align-items: center;
    width: 50%;
    height: 100%;
}


.priceTitle{
    font-weight: 700;
    font-size: 1.2rem;
}


.priceWithTax{
    font-size: 1rem;
    font-weight: 400;
}


.priceIconSection{
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    width: 50%;
    height: 100%;
}


.buyIconContainer{
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    background-color: wheat;
    transition: all 250ms;
}

.buyIconContainer:hover{
    scale: 1.1;
}


.cardStarIcon{
    width: 1.5rem;
    height: 1.5rem;
    transition: all 200ms;
}

.cardStarIcon:hover{
    scale: 1.3;
}