#blogs_all {
  background: #f9f9f9;
  margin-top: -20px;
  padding-bottom: 30px; }
  #blogs_all .blog_title {
    margin-top: 0;
    padding: 20px 0; }
    #blogs_all .blog_title h1 {
      color: #646464;
      font-size: 1.6rem;
      font-weight: 400;
      line-height: 40px;
      margin: 0; }
  @media (min-width: 768px) {
    #blogs_all .blog_articles > div {
      padding: 15px; } }
  #blogs_all .blog {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    padding: 0 0 20px; }
    #blogs_all .blog:last-child {
      border-bottom: none; }
  #blogs_all .article {
    background: #fff;
    display: grid;
    grid-template-rows: 262.5px auto 60px 40px;
    grid-template-areas: "image" "date" "title" "readmore"; }
    #blogs_all .article .article_image {
      grid-area: image; }
      #blogs_all .article .article_image a {
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        display: inline-block;
        height: 100%;
        overflow-y: hidden;
        width: 100%; }
    #blogs_all .article .article_date, #blogs_all .article .article_title, #blogs_all .article .article_content, #blogs_all .article .article_readmore {
      padding: 5px 20px; }
    #blogs_all .article .article_date {
      color: #a3a3a3;
      font-size: 13px;
      font-weight: 200;
      grid-area: date;
      line-height: 25px; }
    #blogs_all .article .article_title {
      grid-area: title; }
      #blogs_all .article .article_title a {
        color: #565656;
        font-size: 19px;
        line-height: 25px;
        display: -webkit-box;
        display: block\0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical; }
    #blogs_all .article .article_content {
      grid-area: content;
      color: #a3a3a3;
      font-size: 15px;
      font-weight: 200; }
    #blogs_all .article .article_readmore {
      grid-area: readmore;
      align-self: center; }
      #blogs_all .article .article_readmore a {
        color: #a3a3a3;
        font-size: 0.8rem; }
  #blogs_all .mobile_more_article {
    display: none; }
  #blogs_all .more_article, #blogs_all .mobile_more_article {
    border: 1px solid #565656;
    border-radius: 25px;
    color: #565656;
    font-size: 15px;
    padding: 8px 0px;
    text-align: center;
    text-decoration: none;
    width: 150px; }
    #blogs_all .more_article:hover, #blogs_all .mobile_more_article:hover {
      background-color: #565656;
      color: #fff; }
  #blogs_all .swiper-container {
    display: none; }
  @media (max-width: 1199px) {
    #blogs_all .article {
      grid-template-rows: 217.5px auto 60px 50px 40px; } }
  @media (max-width: 991px) {
    #blogs_all .article {
      grid-template-rows: 247.5px auto 60px 40px; } }
  @media (max-width: 767px) {
    #blogs_all .article {
      grid-template-rows: 382.5px auto 60px 40px; }
    #blogs_all .blog_title h1 {
      font-size: 25px;
      line-height: 30px; }
    #blogs_all .blog_articles {
      display: none; }
    #blogs_all .swiper-container {
      display: block; }
    #blogs_all .article .article_readmore {
      grid-area: readmore; }
    #blogs_all .more_article {
      display: none; }
    #blogs_all .mobile_more_article {
      display: block;
      margin: 20px auto 0; } }
  @media (max-width: 575px) {
    #blogs_all .article {
      grid-template-rows: calc(75vw - 22.5px) auto auto auto 40px; }
      #blogs_all .article .article_title {
        max-height: 50px;
        overflow: hidden; }
      #blogs_all .article .article_content {
        max-height: 50px;
        overflow: hidden; } }

