.archive .detail-article-single{margin-top:50px}.blog-menu{border-bottom:1px solid #dedede;border-top:1px solid #ebebeb}.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.article-item{border:1px solid #e2e8f0;border-radius:12px;background:#fff;overflow:hidden;display:flex;flex-direction:column;height:100%;transition:transform 0.25s ease,box-shadow 0.25s ease,border-color 0.25s ease}.article-item:hover{transform:translateY(-4px);border-color:#0f75bd;box-shadow:0 12px 24px -4px rgb(15 117 189 / .12),0 4px 8px -2px rgb(0 0 0 / .04)}.article-item .article-img{padding:0;position:relative;width:100%;overflow:hidden}.article-item .article-img>a{padding-top:58%;position:relative;width:100%;display:block;overflow:hidden;height:0}.article-item .article-img>a img,.img-sidebox-left a img{position:absolute;display:block;width:100%;max-width:100%;height:100%;max-height:100%;left:0;right:0;top:0;bottom:0;margin:auto;-o-object-fit:cover;object-fit:cover;-webkit-transition:transform 0.35s ease;-moz-transition:transform 0.35s ease;transition:transform 0.35s ease;transform:scale(1)}.article-item:hover .article-img>a img{transform:scale(1.06)}.type-web-badge{position:absolute;top:12px;left:12px;z-index:2;padding:4px 10px;font-size:11px;font-weight:700;line-height:1.2;border-radius:6px;color:#fff;letter-spacing:.03em;text-transform:uppercase;box-shadow:0 2px 8px rgb(0 0 0 / .2);pointer-events:none;transition:transform 0.25s ease}.article-item:hover .type-web-badge{transform:translateY(-1px)}.type-web-template{background-color:#0f75bd}.type-web-tool{background-color:#059669}.type-web-game{background-color:#ea580c}.type-web-blog{background-color:#6366f1}.type-web-theme{background-color:#0284c7}.type-web-plugin{background-color:#e11d48}.article-body{padding:16px 16px 18px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;flex-grow:1}.article-item .article-title{padding:0!important;background:transparent!important;position:static!important;margin-top:0!important;margin-bottom:0!important;width:100%!important;text-align:center!important;box-shadow:none!important}.article-item .article-title>a{height:auto;min-height:44px;font-size:15px;line-height:1.45;overflow:hidden;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#1e293b;font-weight:700;text-decoration:none;text-align:center!important;-webkit-transition:color 0.2s ease;-moz-transition:color 0.2s ease;transition:color 0.2s ease}.article-item:hover .article-title>a{color:#0f75bd}.article-item .article-info{border-top:1px solid #dbdbdd}.article-item .article-info .article-publishDate{padding:10px 0}.article-item .article-info .article-publishDate .publishDate{float:left}.article-item .article-info .article-publishDate .publishDate span{display:inline-block;font-size:32px;font-weight:700;text-align:center;width:50px;height:30px;line-height:30px;color:#0f75bd;border-right:1px solid #dbdbdd}.article-item .article-info .article-publishDate .publishMonth-Year{padding-left:60px;font-size:12px}.article-item .article-info .article-publishDate .publishMonth-Year>span{display:block;color:#929191}.article-item .article-info .info-blog{text-align:right;font-size:12px;color:#929191}.article-item .article-info .article-author{height:50px;line-height:50px;padding-right:5px;display:inline-block;margin-right:5px}nav[aria-labelledby="posts-nav-label"]{margin-top:30px;justify-content:center;display:flex}.pagination{margin:0 auto;font-size:16px;border-radius:5px;overflow:hidden;display:inline-block;white-space:nowrap;padding:0;clear:both;border:1px solid #cfc8d8;border-right:0;margin:1px}.pagination .page-item{display:inline-block;border-right:1px solid #cfc8d8;padding:0;margin:0;float:left;overflow:hidden}.pagination .page-item.active .page-link{background-color:#0f75bd;border-color:#0f75bd;color:#fff}.pagination .page-link:focus{box-shadow:none}.pagination .page-link:hover{background-color:#0f75bd;border-color:#0f75bd;color:#fff}.pagination .page-link{color:#333;margin:0;text-decoration:none;line-height:1;font-size:16px;font-weight:400;padding:.5rem .75rem!important;min-width:1em;display:block}@media (max-width:768px){.post-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}}@media (max-width:576px){.post-grid{grid-template-columns:repeat(2,1fr);gap:12px}.type-web-badge{top:8px;left:8px;padding:3px 8px;font-size:10px;border-radius:4px}.article-body{padding:12px 10px 14px}.article-item .article-title>a{font-size:13px;min-height:38px;line-height:19px}}