body,html{--blog-mobile-max-width:400px;--blog-desktop-max-width:150px;background-color:var(--bluexxxxlight)}body section,html section{width:100%;max-width:calc(var(--blog-mobile-max-width) - 20px)}body section .blog-content,html section .blog-content{display:flex;flex-direction:column;gap:1.5rem;margin-left:.5rem;margin-right:.5rem;padding-inline:1rem;width:100%;max-width:calc(var(--blog-mobile-max-width) - 50px)}body section .blog-content .blog-content__article-box,html section .blog-content .blog-content__article-box{display:flex;flex-direction:column;background-color:var(--white);border-radius:12px;padding:10px;border:1px solid transparent;box-shadow:0 0 10px rgba(0,0,0,.1);cursor:pointer;max-width:var(--blog-mobile-max-width)}body section .blog-content .blog-content__article-box:hover,html section .blog-content .blog-content__article-box:hover{border:1px solid var(--blue);transition:.4s}body section .blog-content .blog-content__article-box:hover .blog-content__article-box--img,html section .blog-content .blog-content__article-box:hover .blog-content__article-box--img{transform:scale(.95);transition:.4s}body section .blog-content .blog-content__article-box .blog-content__article-box--img,html section .blog-content .blog-content__article-box .blog-content__article-box--img{max-height:var(--blog-mobile-max-width);width:auto}body section .blog-content .blog-content__article-box .blog-content__article-box__details,html section .blog-content .blog-content__article-box .blog-content__article-box__details{display:flex;flex-direction:column}body section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--date,html section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--date{text-align:left;margin:15px 0 0 8px;font-size:12px}body section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--title,html section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--title{text-align:center;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.6em;max-height:calc(1.6em * 2)}body section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--description,html section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--description{margin:0;height:80px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;line-height:1.5em;max-height:calc(1.5em * 3)}@media only screen and (min-width:768px){body section,html section{width:auto;max-width:none}body section .blog-content,html section .blog-content{max-width:none}body section .blog-content .blog-content__article-box,html section .blog-content .blog-content__article-box{flex-direction:row;gap:20px;max-width:1000px;align-items:center}body section .blog-content .blog-content__article-box .blog-content__article-box--img,html section .blog-content .blog-content__article-box .blog-content__article-box--img{max-height:var(--blog-desktop-max-width)}body section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--date,html section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--date{text-align:left;margin-top:0}body section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--title,html section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--title{text-align:left}body section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--description,html section .blog-content .blog-content__article-box .blog-content__article-box__details .blog-content__article-box__details--description{text-align:left}}