.single-blog .gb-grid-wrapper {
	padding:0 15px ;
	background:#f3f3f3;
}
.single-blog .sidebar h2{
	margin-bottom:5px;
	margin-top:5px;
}

/* Related posts container */
.crp_related {
  background-color: #f9f9f9;  /* light grey background */
  border: 1px solid #ddd;  /* border around the container */
  padding: 20px;  /* space inside the container */
  margin-bottom: 20px;  /* space below the container */
}

/* Each related post */
.crp_related li {
  list-style: none;  /* removes the default bullet point */
  border-bottom: 1px solid #ddd;  /* line between each post */
  padding: 10px 0;  /* space above and below each post */
}

/* The link inside each related post */
.crp_related li a {
  text-decoration: none;  /* removes the underline */
  color: #007BFF;  /* dark grey text */
  font-weight: bold;  /* makes the text bold */
}

/* The link on mouse hover */
.crp_related li a:hover {
  color: #4B158C;  /* changes the text color when hovered */
}

/* The post date 
.crp_related .post-date {
  color: #666;  /* medium grey
  font-size: 0.8em;  /* smaller than the default text */
}

/* This css code is to display the ad unit on amp page between menu and logo take from gpt help */
.amp-ad-container {
  text-align: center;
  margin: 20px 0;
}

/* Yellowish Background
div.inside-article {
    background-color: #f5f5c14a !important; /* Change this to your desired color 
} */

/* Style for the Table of Contents container */
#rank-math-toc {
    max-width: 100%;
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    font-family: Poppins, sans-serif;
}

/* Style for the navigation */
#rank-math-toc nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* Style for the list items in two columns */
#rank-math-toc ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr; /* Two columns */
    gap: 10px; /* Space between items */
}

/* Style for each link */
#rank-math-toc ul li a {
    display: block;
    padding: 10px 15px;
    color: #333;
    text-decoration: none;
	border: 2px solid #D6C0B3; /* Border instead of background */
    border-radius: 5px;
     transition: border-color 0.3s ease, color 0.3s ease;
    font-weight: bold;
    text-align: left;
}

#rank-math-toc ul li a:hover {
    background-color: #493628;
    color: #fff;
}

/* Make the table of contents responsive */
@media (max-width: 768px) {
    #rank-math-toc ul {
        grid-template-columns: 1fr; /* Single column on smaller screens */
    }
}


/* Target the H2 headings specifically on the "Best Hindi Books to Read" page */
.page-id-116637 h2 {
    font-size: 1.8em;
    color: #493628;
    background:  #493628;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    font-family: "Poppins", serif;
    padding-bottom: 10px;
    margin: 20px 0;
    text-align: left;
    position: relative;
}

/* Add an elegant underline effect */
.page-id-116637 h2::after {
    content: '';
    display: block;
    width: 80%;
    height: 4px;
    background-color: #493628;
    margin-top: 8px;
    border-radius: 2px;
}

/* Optional text shadow for added depth */
.page-id-116637 h2 {
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}