* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

body {
  background-color: #ddd; }

.row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 10px; }

.centercolumn {
  width: 70%;
  background-color: white;
  padding: 10px;
  margin-right: 10px; }
  .centercolumn .post .info-cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    .centercolumn .post .info-cont .info-autor {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      width: 90%; }
      .centercolumn .post .info-cont .info-autor span {
        font-size: 12px;
        padding: 5px; }
        .centercolumn .post .info-cont .info-autor span a {
          text-decoration: none; }
      .centercolumn .post .info-cont .info-autor img {
        border-radius: 5px;
        border: .5px solid #333; }
    .centercolumn .post .info-cont .btnmenu, .centercolumn .post .info-cont .icon-menu {
      cursor: pointer;
      padding: 0 10px;
      text-align: center;
      width: 60px; }
      .centercolumn .post .info-cont .btnmenu:hover .btnmenu-content, .centercolumn .post .info-cont .icon-menu:hover .btnmenu-content {
        display: block; }
      .centercolumn .post .info-cont .btnmenu .icon-menu, .centercolumn .post .info-cont .icon-menu .icon-menu {
        height: 20px;
        font-size: 1.4em;
        text-align: right; }
    .centercolumn .post .info-cont .btnmenu-content {
      display: none;
      position: absolute;
      background-color: #eee;
      z-index: 1;
      width: inherit; }
      .centercolumn .post .info-cont .btnmenu-content a {
        color: black;
        padding: 5px 10px;
        text-decoration: none;
        display: block; }
        .centercolumn .post .info-cont .btnmenu-content a:hover {
          background-color: #aaa;
          color: #eee; }
  .centercolumn .post .post-contenido {
    overflow: hidden; }
    .centercolumn .post .post-contenido p {
      color: black;
      font-size: 1em; }
      .centercolumn .post .post-contenido p img {
        max-width: 100%; }
    .centercolumn .post .post-contenido blockquote p {
      font-family: cursive;
      color: #666;
      padding-left: 15px; }
    .centercolumn .post .post-contenido pre {
      background: #ffd;
      padding: 10px;
      overflow-x: scroll;
      max-width: 100%; }
    .centercolumn .post .post-contenido ul {
      margin-left: 20px;
      padding-left: 20px; }
  .centercolumn .btnshare {
    clear: both;
    width: 100%;
    text-align: center;
    padding: 10px 0 6px 0;
    background-color: #eee; }
    .centercolumn .btnshare a {
      text-decoration: none;
      padding: 5px 5px 0 5px;
      font-size: 1.2em;
      border: .5px solid #333;
      border-radius: 5px;
      color: #eee;
      background-color: #888; }
      .centercolumn .btnshare a:nth-child(1) {
        background-color: blue; }
      .centercolumn .btnshare a:nth-child(2) {
        background-color: deepskyblue; }
      .centercolumn .btnshare a:nth-child(3) {
        background-color: red; }
  .centercolumn .icon-menu1 {
    padding: 0 5px;
    cursor: pointer;
    display: inline-block;
    float: right;
    font-size: 2em;
    height: 20px;
    margin-top: -6px; }
    .centercolumn .icon-menu1:hover {
      color: blue; }
  .centercolumn #formComentarios {
    width: 100%;
    display: inline-block;
    padding: 5px; }
    .centercolumn #formComentarios img {
      border-radius: 50%; }
    .centercolumn #formComentarios textarea {
      border: none;
      outline: none;
      width: calc(100% - 60px);
      overflow: hidden; }
    .centercolumn #formComentarios .enviar {
      text-align: right; }
      .centercolumn #formComentarios .enviar a {
        text-decoration: none;
        margin-left: 10px;
        font-size: 20px;
        padding: 0 5px; }
  .centercolumn .cont-comentarios,
  .centercolumn .sub-comentarios {
    background-color: #ddd;
    padding: 5px;
    margin: 5px 0;
    border-radius: 45px;
    border-top-left-radius: 0; }
    .centercolumn .cont-comentarios #user-info,
    .centercolumn .sub-comentarios #user-info {
      display: inline-block;
      font-size: 12px; }
      .centercolumn .cont-comentarios #user-info img,
      .centercolumn .sub-comentarios #user-info img {
        border-radius: 50%; }
      .centercolumn .cont-comentarios #user-info a,
      .centercolumn .sub-comentarios #user-info a {
        padding: 3px;
        text-decoration: none; }
      .centercolumn .cont-comentarios #user-info .icon-like, .centercolumn .cont-comentarios #user-info .icon-delete,
      .centercolumn .sub-comentarios #user-info .icon-like,
      .centercolumn .sub-comentarios #user-info .icon-delete {
        text-decoration: none;
        font-size: 16px;
        padding: 2px;
        color: black; }
      .centercolumn .cont-comentarios #user-info .icon-delete:hover,
      .centercolumn .sub-comentarios #user-info .icon-delete:hover {
        background: red;
        border-radius: 2px; }
      .centercolumn .cont-comentarios #user-info i,
      .centercolumn .sub-comentarios #user-info i {
        font-size: 10px;
        padding: 5px;
        padding-left: 0; }
        .centercolumn .cont-comentarios #user-info i:nth-child(3),
        .centercolumn .sub-comentarios #user-info i:nth-child(3) {
          padding-left: 10px; }
    .centercolumn .cont-comentarios p,
    .centercolumn .sub-comentarios p {
      margin: 0 15px 5px 15px;
      font-size: 14px;
      color: #333; }
  .centercolumn .sub-comentarios {
    margin-left: 40px;
    background-color: #aaa; }
  .centercolumn #loading img {
    display: block;
    margin: auto; }

.rightcolumn {
  width: 30%; }
  .rightcolumn .dropdown-content {
    background-color: #ccc;
    width: auto;
    width: 100%;
    overflow: auto;
    border: 1px solid #aaa;
    z-index: 1; }
    .rightcolumn .dropdown-content #filtro {
      width: inherit;
      border-box: box-sizing;
      font-size: 16px;
      padding: 10px 5px;
      border: none;
      border-bottom: 1px solid #ddd; }
      .rightcolumn .dropdown-content #filtro:focus {
        outline: 3px solid dodgerblue; }
    .rightcolumn .dropdown-content a {
      padding: 5px;
      text-decoration: none;
      display: block; }
      .rightcolumn .dropdown-content a:hover {
        background-color: #ddd; }

@media screen and (max-width: 700px) {
  .row {
    display: -ms-grid;
    display: grid; }
  .centercolumn,
  .rightcolumn {
    width: 100%;
    margin: 10px 0; } }