.Blog_Page{ .blogV2{ padding: 10px; background-color: var(--themeUltraLight); } .blogGrid{ display: grid; grid-template-columns: auto 350px; gap: 10px; /*align-items: flex-start;*/ margin-top: 10px; } .blogV2Area{ background-color: #FFFFFF; padding: 20px; border-radius: 5px; box-shadow: 0 0 30px #00000019; max-width: 100%; overflow: auto; } .blogForm{ background-color: #FFFFFF; padding: 10px; border-radius: 5px; box-shadow: 0 0 30px #00000019; } .blogFormHead{ font-weight: 600; font-size: 18px; } .blogFormField { margin-top: 10px; } .blogFormField label{ font-weight: 600; font-size: 14px; } .blogFormField input, .blogFormField textarea{ padding: 10px; background-color: var(--themeUltraLight); border: 0.5px solid var(--themeLightColor); width: -webkit-fill-available; border-radius: 5px; font-size: 14px; margin-top: 5px; } .blogFormField button{ padding: 10px; width: -webkit-fill-available; background-color: var(--btnColor); color: var(--btnColorText); border: 0; border-radius: 5px; cursor: pointer; } .stickySidebar{ position: sticky; top: 160px; } .relatedBlogs{ margin-top: 10px; padding: 10px; border-radius: 5px; background-color: #FFFFFF; box-shadow: 0 0 30px #00000019; display: grid; grid-template-columns: 80px auto; gap: 10px; } .relatedBlogImg{ aspect-ratio: 1/1; border-radius: 10px; overflow: hidden; } .relatedBlogImg img{ width: 100%; height: 100%; object-fit: cover; } .relatedBlogTitle{ font-size: 14px; color: #000000; } .dateRelated{ font-size: 12px; color: #000000AA; } @media only screen and (max-width: 900px) { .blogGrid{ grid-template-columns: 1fr; } } }.Blog_Page{ @media only screen and (max-width: 900px) { background-attachment:scroll; } }