html,
body {
  background-color: #1d1d1d;
}
::-webkit-scrollbar {
  display: none;
}
ul.pagination {
  display: none;
}
div.posts {
  min-height: 30px;
  margin: auto;
  margin-top: 70px;
  padding: 15px;
  padding-top: 0px;
  max-width: 100%;
}
div.posts .grid-item {
  width: 450px;
  background-color: white;
  margin: 15px 0;
  padding: 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
  border-radius: 1px;
}
div.posts .grid-item.post {
  padding-left: 0px;
  padding-right: 0px;
}
div.posts .grid-item.expanded {
  width: 930px;
  -webkit-box-shadow: 0px 0px 115px -19px rgba(0, 0, 0, 0.16);
          box-shadow: 0px 0px 115px -19px rgba(0, 0, 0, 0.16);
}
div.posts .grid-item.expanded .expand-button {
  display: none;
}
div.posts .grid-item .expand-button {
  position: absolute;
  width: 15px;
  font-size: 14px;
  text-align: center;
  top: 9px;
  right: 9px;
  cursor: pointer;
}
div.posts .grid-item .expand-button i {
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
  bottom: 0;
  color: #ababab;
}
div.posts .grid-item .expand-button:hover > i {
  -webkit-transform: scale(1.3) rotate(225deg);
          transform: scale(1.3) rotate(225deg);
  color: #757575;
}
div.posts .grid-item .expand-button:active > i {
  -webkit-transform: scale(0.9) rotate(225deg);
          transform: scale(0.9) rotate(225deg);
  -webkit-transition-duration: 0.15s;
          transition-duration: 0.15s;
}
div.posts .grid-item .tags-wrapper {
  position: absolute;
  height: 22px;
  max-height: 22px;
  width: 82%;
  max-width: 82%;
  top: 3.5px;
  left: 10px;
  cursor: default;
  overflow: hidden;
  font-size: 11px;
  line-height: 22px;
}
div.posts .grid-item .tags-wrapper span.tag {
  display: inline-block;
  height: 100%;
  line-height: 22px;
  padding: 0 3px;
  color: #ababab;
  font-size: 11px;
  cursor: pointer;
  -webkit-transition-duration: 0.15s;
          transition-duration: 0.15s;
}
div.posts .grid-item .tags-wrapper span.tag:hover {
  color: #de8600;
  font-weight: bold;
}
div.posts .grid-item .content {
  font-size: 14px;
  max-height: 500px;
  margin-bottom: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 2px 0;
  word-wrap: break-word;
  background-color: white;
}
div.posts .grid-item .content.expanded {
  max-height: 6000px;
}
div.posts .grid-item .content img {
  max-width: 100%;
  max-height: 600px;
  display: block;
}
div.posts .grid-item .content img:first-child {
  margin-top: 15px;
}
div.posts .grid-item .content h1,
div.posts .grid-item .content h2,
div.posts .grid-item .content h3,
div.posts .grid-item .content h4,
div.posts .grid-item .content h5,
div.posts .grid-item .content h6 {
  margin: auto 15px;
  margin-top: 10px;
}
div.posts .grid-item .content p {
  text-align: left;
  padding: 15px;
}
div.posts .grid-item .content p code {
  color: #383838;
  font-size: 13px;
  background-color: #e6e6e6;
  padding: 1px 5px;
}
div.posts .grid-item .content pre {
  overflow: hidden;
  background-color: #282C34;
  padding-right: 0;
  font-family: 'Inconsolata', monospace;
  padding: 30px 15px;
}
div.posts .grid-item .content code {
  padding: 15px;
  color: #ABB2BF;
  font-size: 15px;
  font-family: 'Inconsolata', monospace;
}
div.posts .grid-item .content code * {
  font-family: 'Inconsolata', monospace;
}
div.posts .grid-item .content code.hljs {
  margin: -15px;
}
div.posts .grid-item .content table {
  margin: 15px 10px;
  border-spacing: 0px;
  border: 1px solid #e9e9e9;
}
div.posts .grid-item .content th {
  background-color: #ececec;
}
div.posts .grid-item .content th,
div.posts .grid-item .content td {
  padding: 10px 15px;
}
div.posts .grid-item .content tbody tr:nth-child(even) {
  background-color: #f4f4f4;
}
div.posts .grid-item .content hr {
  border: none;
  border-top: 2px solid #e9e9e9;
  margin: 15px 50px;
}
div.posts .grid-item .by {
  cursor: pointer;
  display: inline-block;
  float: right;
  font-size: 15px;
  font-weight: bold;
  max-width: 90px;
  height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  text-align: right;
  margin-right: 15px;
}
div.posts .grid-item .date {
  display: inline-block;
  float: right;
  font-size: 15px;
  margin: 0 5px;
  color: #ababab;
}
div.posts .grid-item .status {
  color: #ababab;
  margin-left: 15px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
div.posts .grid-item .status * {
  margin: 0 5px;
}
div.posts .grid-item .status .likes {
  color: #ababab;
  cursor: pointer;
}
@-webkit-keyframes heartbeat {
  20% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  26% {
    -webkit-transform: scale(1.15);
            transform: scale(1.15);
  }
  40% {
    -webkit-transform: scale(0.85);
            transform: scale(0.85);
  }
  53% {
    -webkit-transform: scale(1.25);
            transform: scale(1.25);
  }
  67% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes heartbeat {
  20% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  26% {
    -webkit-transform: scale(1.15);
            transform: scale(1.15);
  }
  40% {
    -webkit-transform: scale(0.85);
            transform: scale(0.85);
  }
  53% {
    -webkit-transform: scale(1.25);
            transform: scale(1.25);
  }
  67% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@-webkit-keyframes like {
  60% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  80% {
    -webkit-transform: scale(2);
            transform: scale(2);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes like {
  60% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  80% {
    -webkit-transform: scale(2);
            transform: scale(2);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
div.posts .grid-item .status .likes * {
  color: #ababab;
}
div.posts .grid-item .status .likes span.scorecount {
  margin: 0;
  padding: 0;
}
div.posts .grid-item .status .likes:hover > i {
  -webkit-animation-name: heartbeat;
          animation-name: heartbeat;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
div.posts .grid-item .status .likes.liked,
div.posts .grid-item .status .likes:hover {
  color: #eb72be;
  font-weight: bold;
}
div.posts .grid-item .status .likes.liked *,
div.posts .grid-item .status .likes:hover * {
  color: #eb72be;
}
div.posts .grid-item .status .likes i {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
}
div.posts .grid-item .status .edit i {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
@-webkit-keyframes write {
  0% {
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
  10% {
    -webkit-transform: rotate(-45deg) translateY(-3.5px) translateX(3.5px);
            transform: rotate(-45deg) translateY(-3.5px) translateX(3.5px);
  }
  30% {
    -webkit-transform: rotate(0deg) translateY(-3.5px) translateX(4px);
            transform: rotate(0deg) translateY(-3.5px) translateX(4px);
  }
  50% {
    -webkit-transform: rotate(0) translateY(0) translateX(0) scale(1.2);
            transform: rotate(0) translateY(0) translateX(0) scale(1.2);
  }
  100% {
    -webkit-transform: rotate(0) translateY(0) translateX(0) scale(1.3);
            transform: rotate(0) translateY(0) translateX(0) scale(1.3);
  }
}
@keyframes write {
  0% {
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
  10% {
    -webkit-transform: rotate(-45deg) translateY(-3.5px) translateX(3.5px);
            transform: rotate(-45deg) translateY(-3.5px) translateX(3.5px);
  }
  30% {
    -webkit-transform: rotate(0deg) translateY(-3.5px) translateX(4px);
            transform: rotate(0deg) translateY(-3.5px) translateX(4px);
  }
  50% {
    -webkit-transform: rotate(0) translateY(0) translateX(0) scale(1.2);
            transform: rotate(0) translateY(0) translateX(0) scale(1.2);
  }
  100% {
    -webkit-transform: rotate(0) translateY(0) translateX(0) scale(1.3);
            transform: rotate(0) translateY(0) translateX(0) scale(1.3);
  }
}
div.posts .grid-item .status .edit {
  cursor: pointer;
}
div.posts .grid-item .status .edit:hover i {
  cursor: pointer;
  color: #25be79;
  -webkit-animation-name: write;
          animation-name: write;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
div.posts .grid-item .status .delete {
  cursor: pointer;
  position: absolute;
  top: 7.5px;
  right: 30px;
}
div.posts .grid-item .status .delete i {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
  font-size: 18px;
}
div.posts .grid-item .status .delete:hover > i {
  -webkit-transform: scale(1.3) rotate(10deg);
          transform: scale(1.3) rotate(10deg);
  color: #e25d4a;
}
div.posts .grid-item .status .delete:active > i {
  -webkit-transform: scale(0.8) rotate(-5deg);
          transform: scale(0.8) rotate(-5deg);
  color: #e25d4a;
}
div.posts .grid-item .status .comments {
  color: #ababab;
  cursor: pointer;
}
@-webkit-keyframes comments {
  0% {
    -webkit-transform: scale(0) translateX(-15px) translateY(15px);
            transform: scale(0) translateX(-15px) translateY(15px);
    opacity: 0;
    color: #c2c2c2;
  }
  12.5% {
    -webkit-transform: scale(0.7) translateX(-1);
            transform: scale(0.7) translateX(-1);
  }
  25% {
    -webkit-transform: scale(1.5) translateX(0) translateY(0);
            transform: scale(1.5) translateX(0) translateY(0);
    opacity: 1;
  }
  37.5% {
    -webkit-transform: scale(0.7) translateX(-1);
            transform: scale(0.7) translateX(-1);
  }
  49% {
    -webkit-transform: scale(0) translateX(15px) translateY(-15px);
            transform: scale(0) translateX(15px) translateY(-15px);
    opacity: 0;
    color: #c2c2c2;
  }
  50% {
    -webkit-transform: scale(0) scaleX(-1) translateX(-15px) translateY(15px);
            transform: scale(0) scaleX(-1) translateX(-15px) translateY(15px);
    opacity: 0;
    color: #5dadda;
  }
  62.5% {
    -webkit-transform: scale(0.7) scaleX(-1) translateX(-1);
            transform: scale(0.7) scaleX(-1) translateX(-1);
  }
  75% {
    -webkit-transform: scale(1.5) scaleX(-1) translateX(0) translateY(0);
            transform: scale(1.5) scaleX(-1) translateX(0) translateY(0);
    opacity: 1;
  }
  88% {
    -webkit-transform: scale(0.7) scaleX(-1) translateX(11);
            transform: scale(0.7) scaleX(-1) translateX(11);
  }
  100% {
    -webkit-transform: scale(0) scaleX(-1) translateX(15px) translateY(-15px);
            transform: scale(0) scaleX(-1) translateX(15px) translateY(-15px);
    opacity: 0;
    color: #5dadda;
  }
}
@keyframes comments {
  0% {
    -webkit-transform: scale(0) translateX(-15px) translateY(15px);
            transform: scale(0) translateX(-15px) translateY(15px);
    opacity: 0;
    color: #c2c2c2;
  }
  12.5% {
    -webkit-transform: scale(0.7) translateX(-1);
            transform: scale(0.7) translateX(-1);
  }
  25% {
    -webkit-transform: scale(1.5) translateX(0) translateY(0);
            transform: scale(1.5) translateX(0) translateY(0);
    opacity: 1;
  }
  37.5% {
    -webkit-transform: scale(0.7) translateX(-1);
            transform: scale(0.7) translateX(-1);
  }
  49% {
    -webkit-transform: scale(0) translateX(15px) translateY(-15px);
            transform: scale(0) translateX(15px) translateY(-15px);
    opacity: 0;
    color: #c2c2c2;
  }
  50% {
    -webkit-transform: scale(0) scaleX(-1) translateX(-15px) translateY(15px);
            transform: scale(0) scaleX(-1) translateX(-15px) translateY(15px);
    opacity: 0;
    color: #5dadda;
  }
  62.5% {
    -webkit-transform: scale(0.7) scaleX(-1) translateX(-1);
            transform: scale(0.7) scaleX(-1) translateX(-1);
  }
  75% {
    -webkit-transform: scale(1.5) scaleX(-1) translateX(0) translateY(0);
            transform: scale(1.5) scaleX(-1) translateX(0) translateY(0);
    opacity: 1;
  }
  88% {
    -webkit-transform: scale(0.7) scaleX(-1) translateX(11);
            transform: scale(0.7) scaleX(-1) translateX(11);
  }
  100% {
    -webkit-transform: scale(0) scaleX(-1) translateX(15px) translateY(-15px);
            transform: scale(0) scaleX(-1) translateX(15px) translateY(-15px);
    opacity: 0;
    color: #5dadda;
  }
}
div.posts .grid-item .status .comments * {
  color: #ababab;
}
div.posts .grid-item .status .comments:hover,
div.posts .grid-item .status .comments.liked {
  color: #5dadda;
  font-weight: bold;
}
div.posts .grid-item .status .comments:hover > i,
div.posts .grid-item .status .comments.liked > i {
  color: #5dadda;
  -webkit-animation-name: comments;
          animation-name: comments;
  -webkit-animation-duration: 1.3s;
          animation-duration: 1.3s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
div.posts .grid-item .status .bookmark > i {
  cursor: pointer;
  -webkit-transition-duration: 0.15s;
          transition-duration: 0.15s;
}
div.posts .grid-item .status .bookmark > i:hover {
  color: #fe4b4b;
  -webkit-transform: translateY(-2.5px);
          transform: translateY(-2.5px);
}
div.posts .grid-item .status .bookmark > i:active {
  -webkit-transform: translateY(2.6px);
          transform: translateY(2.6px);
}
div.posts .grid-item .status .bookmark > i.bookmarked {
  color: #fe4b4b;
}
div.posts .grid-item.newpost {
  height: 210px;
  font-size: 30px;
  background-color: #66e8dc;
  color: #ffffff;
  padding: 30px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  -webkit-box-shadow: 0 0 0 0 #66e8dc;
          box-shadow: 0 0 0 0 #66e8dc;
  border: 1px solid #3ae1d2;
}
div.posts .grid-item.newpost * {
  color: #ffffff;
}
div.posts .grid-item.newpost:hover {
  background-color: #59e6d9;
}
div.posts .grid-item.discover {
  height: 210px;
  font-size: 30px;
  background-color: #e26b5a;
  color: #ffffff;
  padding: 30px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  -webkit-box-shadow: 0 0 0 0 #e26b5a;
          box-shadow: 0 0 0 0 #e26b5a;
  border: 1px solid #da442f;
}
div.posts .grid-item.discover * {
  color: #ffffff;
}
div.posts .grid-item.discover:hover {
  background-color: #e05f4d;
}
div.posts .grid-item.writebio {
  height: 210px;
  font-size: 30px;
  background-color: #d24dd5;
  color: #fcf2fc;
  padding: 30px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  -webkit-box-shadow: 0 0 0 0 #d24dd5;
          box-shadow: 0 0 0 0 #d24dd5;
  border: 1px solid #be2ec1;
}
div.posts .grid-item.writebio * {
  color: #ffffff;
}
div.posts .grid-item.writebio:hover {
  background-color: #cf41d2;
}
div.posts .grid-item.greeting {
  font-size: 60px;
  background-color: white;
  color: #1d1d1d;
  height: 450px;
  width: 930px;
  padding: 30px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: default;
}
div.posts .grid-item.greeting * {
  color: #1d1d1d;
}
div.posts .grid-item.greeting span.username {
  font-weight: bold;
}
div.posts .grid-item.greeting span.details {
  text-align: center;
  font-size: 20px;
  position: absolute;
  bottom: 55px;
  display: inline-block;
}
div.posts .grid-item.greeting span.details span.sect {
  display: inline-block;
  width: 120px;
  cursor: pointer;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
}
div.posts .grid-item.greeting span.details span.sect > * {
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
}
div.posts .grid-item.greeting span.details span.sect:hover {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}
button.loadposts {
  background-color: transparent;
  border: none;
  color: #4e4e4e;
  display: block;
  margin: 30px auto;
  font-size: 18px;
  cursor: pointer;
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
  outline: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
button.loadposts:hover {
  color: #7c7c7c;
  -webkit-transform: scale(1.15);
          transform: scale(1.15);
}
button.loadposts:active {
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
}
