@import url("book-detail.7ef11a0c067b.css");
@import url("readpage.ee3749254d44.css");
@import url("form.06b639291e5b.css");
@import url("about.52f748bbb5e8.css");
@import url("contact.498c3cbfed83.css");
@import url("authorpage.091bc5a7de46.css");
@import url("Listview-Audiobook.874c7ff6e47f.css");
@import url("splashscreen.38c37d74c9c4.css");
@import url("navbar.531bea05b0d5.css");
@import url("accordian.18030afdf780.css");
@import url("faq.ccffe39567de.css");
@import url("carousel.05b239e37588.css");
@import url("cart-table.16a548803eda.css");
@import url("gridbox.96747999ffc0.css");
@import url("modal.8e959eb108b3.css");
@import url("verify-otp.84abeb9df1f8.css");
@import url("privacy.5513438ea3cf.css");
@import url("conditions.d41d8cd98f00.css");
@import url("order.b5a6b74a3525.css");
@import url("footer.44fa64e7d882.css");
@import url("cards.0481026c8173.css");
@import url("model-search.1e8e6b1dcb23.css");
@import url("audioplayer.81a8b702259c.css");

@import url("audiobooklist.0627c40678c4.css");
@import url("overlay.f27cb5e3609b.css");
@import url("sidebar.d5e65c3b133f.css");
@import url("blog.fe4ed084eac1.css");
@import url("booksbytags.8b37ddee09ef.css");
@import url("library.503548d993e7.css");
@import url("homepage.44697f08b224.css");

:root {
  --primary-color: rgb(250, 247, 242);
--fallback-color: #F1EAE2;
  --secondary-color: #F2eae3;
  --ternary-color:#000000;
  --light-black: #ddd;

  --primary-font: "Spectral", serif;
  --supporting-font: 'Karla', sans-serif;

  --link:1.188rem;
  --button-link: 1.0rem;
  --small-link:1.0rem;


}



*{
box-sizing: border-box;
margin:0;

padding:0;
cursor:context-menu;
}
html{

 height: 100%;
  font-size: 16px; /* Base font size for calculations */
  scroll-behavior: smooth;
}

body{
 font-family: var(--supporting-font);
  font-size: 1rem; /* 16px */
  line-height: 1.6;
   color: #333;

  font-weight: 400;
  letter-spacing: 0.3px;
  background-color: var(--primary-color);
  min-height: 100%;  /* Ensure the body takes at least the full height of the viewport */
  display: flex;
    margin: 0;
  flex-direction: column;
  }

main{
margin: 0px 70px;

padding-top:14vh;
 flex-grow: 1;
box-sizing:border-box;

}
nav a, .nav-link {
  font-family: 'Poppins', sans-serif;
  font-size: 0.95rem; /* 15.2px */
  font-weight: 500;
  letter-spacing: 0.5px;
}


img {
    image-rendering: crisp-edges; /* Prevents blur but keeps edges sharp */
    -webkit-image-rendering: crisp-edges; /* Safari */
    -moz-image-rendering: crisp-edges; /* Firefox */
}



article ul li,.art ul li, .art ol li,
article ol li {
    list-style-type: initial;
    list-style-position: inside; /* Moves bullets/numbers inside the box */
           /* Centers the text */
  margin: 0 auto;
     /* or 'disc' for ul, 'decimal' for ol */
}

article p{
margin: 20px 0px;
text-align:justify;
line-height:1.75em;
}
/* Basic usage */

/* For headings */

h1, h2,h3, h4, h5{
font-family:var(--primary-font);
text-transform:capitalize;
}
h1{

  font-family: 'Spectral', serif;
  font-size: 3.5rem; /* 56px */
  font-weight: 700;
  line-height: 1.2; /* 67.2px */
  margin: 1.5rem 0 1rem 0;
  letter-spacing: -0.5px;
  color: #1a1a1a;

 }
 h2, .h2 {
  font-family: 'Spectral', serif;
  font-size: 2.75rem; /* 44px */
  font-weight: 700;
  line-height: 1.3; /* 57.2px */
  margin: 1.25rem 0 0.875rem 0;
  letter-spacing: -0.3px;
  color: #2a2a2a;
}

/* H3 - Subsection Heading */
h3, .h3 {
  font-family: 'Spectral', serif;
  font-size: 2rem; /* 32px */
  font-weight: 600;
  line-height: 1.4; /* 44.8px */
  margin: 1rem 0 0.75rem 0;
  letter-spacing: 0px;
  color: #333;
}

/* H4 - Small Heading */
h4, .h4 {
  font-family: 'Spectral', serif;
  font-size: 1.5rem; /* 24px */
  font-weight: 600;
  line-height: 1.4; /* 33.6px */
  margin: 0.875rem 0 0.625rem 0;
  color: #444;
}

/* H5 - Minor Heading */
h5, .h5 {
  font-family: 'Poppins', sans-serif;
  font-size: 1.25rem; /* 20px */
  font-weight: 600;
  line-height: 1.5; /* 30px */
  margin: 0.75rem 0 0.5rem 0;
  letter-spacing: 0.5px;
  color: #555;
}

/* H6 - Tiny Heading */
h6, .h6 {
  font-family: 'Poppins', sans-serif;
  font-size: 1rem; /* 16px */
  font-weight: 700;
  line-height: 1.5; /* 24px */
  margin: 0.625rem 0 0.5rem 0;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #666;
}

p {
  font-family: var(--supporting-font);
  font-size: 1.1rem; /* 16px */
  font-weight: 400;
  line-height: 1.7; /* 27.2px */
  margin: 0 0 1.5rem 0;
  color: #444;
}


.cen{
text-align:center;
}
#bot{
margin-bottom: 50px;}

h4, .small-font{

font-weight:normal;
line-height:1.5;

}

.wishlist-box h4, .align{
text-align:center;}







    .left{
    text-align:left;
    margin-top: 50px
    }

a {

  text-decoration: none;
 color:#444;
 text-transform:capitalize;
  font-weight: 500;
}

 b,  {
  font-weight: 700;

}
.bold{
font-weight: 400;
}



.center-text{

margin-top: 100px;
 grid-column: 1 / -1;
 text-align: center;

}




#center{
display: block;
  width: fit-content;
  margin: 0 auto;

  }

.button a, .button-class a,#ed{
color: white;


font-weight:400;


  font-family: 'Poppins', sans-serif;
  font-size: 1rem; /* 16px */

  letter-spacing: 0.9px;
  text-transform: capitalize;

}




.title-text{
margin-top: 30px;
padding-top: 30px;

}


.black{
background-color:var(--ternary-color);
padding: 20px;
}





.center-header{
text-align: center;
}





ul li{

list-style-type:none;

padding: 10px;
}


section{
margin: 50px 0;
}

.center-paragraph{
text-align:center;
}
.side-icon a{
margin-left: 15px;}




@media only screen and (max-width: 1024px) {
html{

font-size: 15px;}
h1{
font-size: 2.5rem;
}
 main{
margin:0px;

padding:50px 25px;
}
body{
margin:0px;

padding:0px;
}

  .asides{
width: 100%;

}
.author-profile{

 place-items: start;
 }
  .author-profile p
  {
  text-align:left;
  padding:0px;
  }
  .author-name{
font-size: 20px;
text-align:left;
}
.author-profile img
{
width: 80px;
height:80px;
}
  .author-profile{
  flex-direction:row;
  gap: 15px;
  }
.image-book img{
height: 250px;
width: 200px;
padding: auto 0px;
}

.author-box{
display:grid;
grid-template-columns: 1fr;
width:100%;
}

 .order-items{
display: flex;
width:100%;
flex-wrap: wrap;
justify-content:center;
align-items:center;
}
 .wishlist-box{
 margin-top: 30px;
 }
 .player {
 padding: 40px;
 }

 .controls{
 column-gap: 30px;
 row-gap: 30px;
 }
 .overlay-flex{
 column-gap: 15px;
 }
.title-text{
margin-top: 60px;}





  .tab {
  cursor: pointer;
  padding: 20px 50px;

  border-bottom: 1px solid #ddd;

}

.audio-gridbox{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
place-items:center;
row-gap: 30px;

}



}


@media only screen and (max-width: 820px) {

html{

font-size: 14px;}
h1{
font-size: 2.5rem;}



.contain{
gap: 10px;


}


.author-box{
display:grid;
grid-template-columns: 1fr;
width:100%;
}


.aside-blog-card{


display:flex;






}



.image-book{
grid-template-columns: 1fr;
}
article{
width: 100%;
margin: 0 auto;}
.article-container{
margin: 10px 0px;

}
main{
margin:0px;
padding-left: 20px;
padding-right: 20px;

padding-bottom: 20px;}
.book-section{
margin-top: 10px;}
.book-section{
order: 1;

}
.order-summary{
width:100%;
}


aside h2{
display:none;}
aside  .li{
display:none;
}
.book-section .description h2, .book-section .description p {
text-align: justify;
}
.description .button-class{
display:block;
max-width: 130px;
}
 .account_form .second h3{
 padding-top: 30px;

 }



.overlay-flex{
 column-gap: 15px;
 }





footer{

grid-template-columns:auto;
gap: 0px;}
footer>div{
padding: 5px;
}

.contain{
grid-template-columns:auto;
gap: 25px;
margin-bottom: 25px;
}
aside{
align-self:end;}
aside .image, aside .image img{
width: 180px;
height:270px;}
.contain .description{
padding:0px}
.overlay-flex{
 column-gap: 15px;

 }
.account_form .first{
display:none;}
.account_form .second{
background-color: var(--secondary-color);
padding: 10px 20px;
}
.overlay-text{
 top: 20%;
    left: 10%;}
footer{
margin-top: 10px;}
.account_form{
grid-template-columns: 1fr;}
}



@media only screen and (max-width: 640px) {
html{

font-size: 14px;}
h1{
font-size: 2.5rem;
}

.author-box{
display:grid;
grid-template-columns: 1fr;
width:100%;
}



.side-bar{
position:fixed;
top: 80px;
background-color:var(--secondary-color);
color:black;
writing-mode:horizontal-tb;
left:0px;
width:100%;
}


.account_form .first{
display:none;
}

.aside-blog-card{
display:flex;
}
.tab {

  padding:10px 35px;

  border-bottom: 1px solid #ddd;

}


.about-para{
padding-top: 1px;
width: 180px;
}





#com_email , #com-but{
  grid-column: 1 / -1;

}






}
