/* Univer360 blog metadata layout */

/*
  Desktop: show the published date / comment count in a narrow column
  to the LEFT of each blog post, similar to the original legacy site layout.
*/
#blogTable .blog-post {
  position: relative !important;
  box-sizing: border-box !important;
  padding-left: 125px !important;
  min-height: 60px !important;
}

#blogTable .blog-header {
  position: static !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

#blogTable .univer-blog-meta {
  position: absolute !important;
  left: 0 !important;
  top: 2px !important;
  float: none !important;
  display: block !important;
  width: 105px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 10px 0 0 !important;
  box-sizing: border-box !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  color: #666 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  text-align: left !important;
}

#blogTable .univer-blog-date-text,
#blogTable .univer-blog-comments-text {
  position: static !important;
  float: none !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 3px 0 !important;
  padding: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #666 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  text-align: left !important;
}

#blogTable .univer-blog-meta-separator {
  display: none !important;
}

/* Disable any remaining old legacy site metadata positioning. */
#blogTable p.blog-date,
#blogTable p.blog-comments,
#blogTable .blog-comments-bottom {
  display: none !important;
}

/*
  On narrow screens there is not enough room for a left metadata column.
  Put the metadata above the post title/content instead.
*/
@media screen and (max-width: 650px) {
  #blogTable .blog-post {
    padding-left: 0 !important;
  }

  #blogTable .univer-blog-meta {
    position: static !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 0 10px 0 !important;
  }

  #blogTable .univer-blog-date-text,
  #blogTable .univer-blog-comments-text {
    display: inline !important;
    margin-right: 7px !important;
  }
}