main#blog-main{margin:180px auto 160px;width:70vw;div#filter{display:flex;gap:20px;margin-left:50px;button#reset-filter{padding:10px 15px}}button#reset-filter.no-filters{display:none}div#filter-keyword{border:1px solid #000;border-radius:30px;display:flex;margin-left:25px;width:fit-content;.keyword{border:solid #000;border-collapse:collapse;border-width:0 0 0 1px;padding:5px 20px;.keyword_on{display:none}}.keyword.active{.keyword_on{display:inline-block}}.keyword:first-child{border-left:0 solid #000;border-radius:30px 0 0 30px}.keyword:last-child{border-radius:0 30px 30px 0}.keyword.active,.keyword:hover{background-color:#d5eb8a}}}#blog-list h3{margin-bottom:10px;text-align:center}section#blog-list{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;padding:20px;a{text-decoration:none;width:100%}}div.blog-article{background-position:50%;background-size:cover;border:1px solid #000;border-radius:10px;display:flex;gap:20px;height:350px;justify-content:space-between;overflow:hidden;padding:20px;transition:box-shadow .2s ease-in,transform .3s ease-in-out;width:100%;div:nth-child(2){text-align:center}div.blog-article-content{display:flex;flex-direction:column;width:60%;div.keywords{align-items:end;display:flex;gap:10px;height:100%;justify-content:center}}div.blog-article-image{overflow:hidden;width:40%}}section#blog-list a:nth-child(odd) div.blog-article{flex-direction:row-reverse}div.blog-article:hover{box-shadow:12px 12px 2px 1px #000;transform:translate(-2px,-2px);h3{text-decoration:underline}}div.blog-article-image{img{height:300px;max-width:none}}div#loader-container{display:flex}.loader{animation:spin 2s linear infinite;border:4px solid #f3f3f3;border-radius:50%;border-top-color:rgba(29,28,28,.63);height:30px;margin:auto;width:30px}.clickable{cursor:pointer}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media screen and (max-width:1300px){main#blog-main{margin:180px auto 160px;width:70vw;div#filter{align-items:center;flex-direction:column-reverse;gap:10px;margin:0;button#reset-filter{width:150px}div#filter-keyword{margin:auto}}section#blog-list{padding:20px 0;div.blog-article{flex-direction:column;height:auto;min-height:350px;div.blog-article-content{width:100%}div.blog-article-image{height:20vh;overflow:hidden;position:relative;width:auto;img{bottom:0;left:0;margin:auto;position:absolute;right:0;top:0}}}}}}@media screen and (max-width:901px){main#blog-main{margin:70px 0 50px;min-width:100vw}}@media screen and (max-width:500px){div#filter-keyword{border:none!important;flex-wrap:wrap;gap:10px;justify-content:center;span.keyword{border:1px solid #000!important;border-radius:20px!important;padding:5px 20px}}}