.blog-card{box-shadow:inset -1px -20px 20px -16px #91c2298f;position:relative;background-color:#fff!important;display:flex;flex-direction:column;height:100%}.blog-card-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:background-color .3s ease-in-out;z-index:1}.blog-card-overlay svg{color:#fff;transition:translate .3s ease-in-out,opacity .3s ease-in-out;translate:-30% 0;opacity:0}.blog-card:hover .blog-card-overlay{background-color:var(--green-80)}.blog-card:hover .blog-card-overlay svg{translate:0 0;opacity:1}.blog-card h3{position:relative;z-index:3;margin:0;color:var(--dark-100);font-size:1.5rem;line-height:1.2;font-weight:500;transition:color .3s linear,translate .3s ease-in-out}.blog-card:hover h3{color:#fff;translate:0 -20%}.blog-card .info ul{margin-top:1rem;display:flex;flex-wrap:wrap;gap:1rem;color:var(--dark-100);font-size:1.25rem;z-index:2;position:relative;transition:color .3s linear}.blog-card img{object-fit:cover;height:15rem;border-bottom:3px solid var(--green-100)}.blog-card .info{position:relative;padding:1rem;background-color:#fff;color:var(--dark-100);border-bottom:3px solid var(--green-100);display:flex;gap:.5rem;flex-direction:column;justify-content:space-between;height:100%}.blog-card .info p{text-align:start;position:relative;color:inherit;font-size:1.125rem;line-height:1.6rem;z-index:3;transition:color .3s linear}.blog-card:hover .info p,.blog-card:hover .info ul{color:#fff}.info span{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;color:#fff}.container{display:flex;align-items:center;align-self:flex-start;z-index:10001}.underlay{position:absolute;background-color:#1a1a1a69;inset:0;z-index:8}input{width:100%;padding:.25rem .5rem;font-family:Montserrat,Helvetica;background-color:#2c2c2c;border:1px solid grey;border-radius:4px;line-height:1.5rem;color:silver;outline-color:var(--green-100);min-width:18rem}form{position:relative;z-index:10}form>button{position:absolute;top:0;right:.25rem;bottom:0;background-color:transparent;border:none;color:var(--green-100);width:fit-content;min-width:0;display:flex;align-items:center}.search-wrapper{position:relative}.drop-list{left:0;position:absolute;width:200%;max-width:200%;background-color:#0009;backdrop-filter:blur(8px);box-shadow:0 0 10px 6px #0009;display:flex;flex-direction:column;z-index:9;max-height:30rem;overflow:auto}.drop-list .drop-item{display:flex;gap:.5rem;padding:.75rem}.drop-list .drop-item:hover{background-color:#0006}.drop-list>li:not(:last-child){border-bottom:1px solid grey}.drop-item .tags{gap:.5rem}.drop-item .tags li{font-size:.875rem;font-weight:500}.drop-item p{font-size:.875rem;line-height:1.2;display:inline;white-space:wrap;word-break:break-all;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;text-overflow:ellipsis}.drop-list h4{color:#fff}.drop-list .drop-item img{max-width:100%;height:auto;vertical-align:middle;width:6rem;aspect-ratio:16/9;object-fit:cover}.drop-list.tags{display:flex;row-gap:1rem;column-gap:.5rem;flex-wrap:wrap}.tags li{display:flex;align-items:center;gap:.25rem;color:var(--green-100);font-size:1.25rem;font-weight:600}.tags li:hover{cursor:pointer}.blog-content-container{display:flex;flex-direction:column;gap:3rem}.blog-content-container>h2{color:#fff;position:relative;width:fit-content;align-self:center}.blog-content-container>h2:before{position:absolute;height:3px;width:70%;content:"";bottom:-.25em;left:50%;translate:-50% 0;background-color:var(--green-100)}.posts-info{display:grid;grid-template-columns:1fr auto 1fr;gap:2rem;align-items:center;max-width:1600px;z-index:1000}.divider{height:50%;width:3px;background-color:var(--green-100)}.top-posts{display:grid;gap:2rem}.top-posts>li{box-shadow:0 0 16px 12px #00000070}.all-posts-wrapper{display:flex;flex-direction:column;gap:1rem;height:100%}.all-posts{display:grid;gap:1rem;max-height:50rem;overflow-y:auto}.small-post{display:flex;gap:1rem}.small-post .tags{display:flex;gap:1rem;flex-wrap:wrap;row-gap:.25rem}.small-post .tags li{font-size:.875rem}.small-post p{line-height:1.2;font-size:.875rem;text-align:start}.small-post h4{color:#fff}.small-post img{max-width:100%;height:auto;vertical-align:middle;width:8rem;aspect-ratio:16/12;object-fit:cover}
