
/* main section style start */

.main-section{
    margin-top: 100px;
}

.book-header h1{
    padding-left: 5px;
    border-bottom: 2px black solid;
    border-top: 2px solid black;
    font-size: 28px;
    font-weight: 500;
}

.img-and-para{
    margin-top: 70px;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.main-img{
    height: 300px;
    margin-top: 30px;
}

@media only screen and (max-width:215px) {
    .main-img{
        height: 280px;
        width: 85%;
    }
}

@media only screen and (max-width:360px){
    .book-header h1{
        font-size: 25px;
    }
}

@media only screen and (max-width:300px){
    .book-header h1{
        font-size: 18px;
    }
}

.main-img img{
    width: 100%;
    height: 100%;
}

.main-para{
    width: 700px;
    margin-top: 30px;
}

.main-para p{
    text-align: center;
}

.buy-option{
    margin-top: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.button{
    color: white;
    background-color: rgb(65, 65, 65);
    text-decoration: none;
    padding: 5px 10px;
    transition: all 0.3s linear;
    font-size: 13px;
    text-align: center;
}

.button:hover{
    background-color: rgba(82, 80, 80, 0.699);
    border-radius: 15px;
}

.button:active{
    box-shadow: rgba(0, 0, 0, 0.35) 0px 10px 15px;
}

@media only screen and (max-width:768px){
    .button{
        transition: all linear;
    }

    .button:hover{
        box-shadow: rgba(0, 0, 0, 0.35) 0px 16px 15px;
    }

    .button:active{
        box-shadow: none;
    }
}

/* main section style end */
