.docs-grid { max-width: 1250px; }

.hero-content .left-side .btn { margin-bottom: 20px; }

#search-docs-form { width: 70%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
#search-docs-form .search-input-wrapper { width: 100%; }

#docs-search-input { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 60px; padding: 17px 19px 19px 22px; border: 0; color: var(--primary-color); font-size: 1rem; line-height: 24px; background-color: #fff; z-index: 1; outline: 0; }

.docs-search-btn { background-color: var(--pure-white); height: 60px; padding: 17px 19px 19px 22px; }

.doc-preview { width: 400px; height: 300px; padding: 1rem; text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; border: 1px dashed var(--pure-black); -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; background-color: var(--light-teal); }
.doc-preview .doc-header .pub-date { font-size: 0.8rem; }
.doc-preview .doc-content h3 { font-size: 0.9rem; }
.doc-preview .doc-content p { margin-top: 1.2rem; font-size: 0.8rem; }
.doc-preview .doc-footer { text-align: right; }
.doc-preview .doc-footer .download-btn { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.9rem; font-weight: 600; gap: 0.5rem; color: var(--primary-color); text-decoration: none; }
.doc-preview .doc-footer .download-btn span, .doc-preview .doc-footer .download-btn svg { display: inline-block; }
.doc-preview .doc-footer .download-btn svg { fill: var(--primary-color); height: 1rem; width: 1rem; }

@media screen and (max-width: 500px) { #search-docs-form { width: 98%; }
  .doc-preview { width: 90%; } }