p {
    margin: 0;
}
input.form-control {
    background-color: rgb(44, 44, 44);
    color: #fff;
    border: 0;
}
.article_wrapper {
    font-family: 'Lato', sans-serif;
}
.article_header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width: 100%;
    background-color: rgb(51, 51, 51);
    padding: 0.5rem 2rem;
}
.article_img,
.article_category,
.article_actions {
    background-color: rgb(51, 51, 51);
    padding: 0.5rem 2rem;
}
.article_tags,
.article_pinned {
    background-color: rgb(51, 51, 51);
    padding: 0.5rem 2rem;
}
.article_category,
.article_tags {
    display: inline-block;
    width: 100%;
}
.article_tags .fa-tag {
    position: relative;
    left: 15px;
    top: -26px;
}
.article_title_input {
    width: 85%;
}
.article_title_label {
    width: 15%;
}
.mce-container {
    border: 0;
}
.mce-menubar,
.mce-toolbar,
.mce-container-body,
div.mce-edit-area {
    background-color: rgb(44, 44, 44) !important;
}
.mce-menubar {
    padding: 1rem 1.5rem;
}
.mce-widget,
.mce-panel {
    background-color: transparent;
    color: #fff;
}
.mce-ico,
.mce-txt,
.mce-menu-item .mce-text {
    color: #fff !important;
}
div.mce-menu .mce-menu-item-sep {
    background-color: #fff;
}
.mce-menubar .mce-menubtn button {
    font-size: 1.2rem;
    background-color: rgb(75, 75, 75);
    width: 8rem;
}
.category_input,
.tags_input {
    padding-left: 40px;
}
.publish_btn,
.trash_btn {
    border: 0;
    padding: 1rem 4rem;
    margin: 0 0.5rem;
    border-radius: 0.4rem;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.2rem;
}
.publish_btn,
.article-meta-counter,
.article-tags ul li a {
    background-color: rgb(11, 197, 186);
}
.article-meta-counter,
.article-tags ul li a {
    color: #fff;
    transition: 0.5s;
}
.article-meta-counter:hover,
.article-tags ul li a:hover {
    background-color: #fff;
    color: #000;
}
.article-meta-counter:hover strong {
    color: #000;
}
.trash_btn {
    background-color: rgb(121, 121, 121);
}
.onstellar_articles {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
}
.btn-social-icon svg {
    margin: auto 0;
}
textarea {
    background-color: rgb(51, 51, 51);
}
.comment-form {
    border: 0;
}
.post-media-meta .title {
    color: rgb(11, 197, 186);
}
.post {
    margin: 0;
    width: 100%;
}
.read_more_list .post-media-meta .info {
    display: flex;
    align-items: center;
    justify-content: start;
    font-size: 12px;
}
.selectize-input > input,
.selectize-dropdown-content .create {
    color: #fff !important;
}
.selectize-dropdown-content .active {
    color: rgb(11, 197, 186) !important;
}
a {
    cursor: pointer;
}
@media (max-width: 500px) {
    .article_header {
        flex-direction: column-reverse;
    }
    .article_title_input,
    .article_title_label {
        width: 100%;
    }
    .article_title_input {
        margin-top: 1rem;
    }
    .onstellar_articles {
        flex-direction: column;
        justify-content: center;
    }
    .article_wrapper {
        padding: 0;
    }
    .article-wrapper {
        padding: 1rem;
    }
    .article_header,
    .article_img,
    .c,
    .article_actions,
    .mce-menubar {
        padding: 2rem 1rem;
    }
    .mce-toolbar-grp {
        overflow: auto;
    }
    .x-image,
    .article_actions button {
        margin: 0 auto;
        width: 100%;
    }
    .article_actions button {
        border-radius: 0;
    }
    .post-meta {
        display: flex;
        flex-direction: column-reverse;
    }
    .post-meta .pull-right {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .post-meta .pull-right .article-meta-counter {
        width: 100%;
        margin: 0.5rem 0;
        border-radius: 0;
        text-align: center;
    }
}

.article-meta-counter.active,
.article-meta-counter svg.active {
	color: #000;
}
.article-meta-counter strong {
    color: #fff;
}
div.onstellar_article {
        width: 320px;
        height: auto;
        margin: 0.5rem;
        background-color: rgb(51, 51, 51);
        border-radius: 4px;
        border: 0;
        font-size: 1.5rem;
    }
    .onstellar_article_author,
    .onstellar_article_data {
        padding: 1.5rem;
    }
    .onstellar_share_btn,
    .onstellar_favorite_btn {
        cursor: pointer;
        transition: 0.5s;
    }
    .fa-clock,
    .fa-share-alt,
    .fa-star,
    .fa-chevron-up,
    .fa-chevron-down,
    .fa-comment,
    .fa-retweet,
    .fa-eye {
        color: rgb(126, 126, 126);
        transition: 0.5s;
    }
    .fa-share-alt:hover,
    .fa-star:hover,
    .fa-retweet:hover,
    .active {
        color: rgb(11, 198, 187);
    }
    a.onstellar_article_author_name {
        margin-left: 1rem;
        transition: 0.5s;
    }
    a.onstellar_article_author_name:hover {
        color: #fff;
        text-decoration: none;
    }
    p.onstellar_article_time_text,
    p.onstellar_article_views_text {
        margin: 0 0 0 1rem;
        font-size: 1.2rem;
    }
    .onstellar_article_data,
    .onstellar_article_footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background-color: rgb(44, 44, 44);
    }
    .onstellar_article_time,
    .onstellar_article_views {
        display: flex;
        align-items: center;
        flex-direction: row;
    }
    .onstellar_article_img {
        height: 250px;
        width: 100%;
    }
    .onstellar_article_title {
        font-size: 1.2rem;
        color: #fff;
        padding: 1.5rem;
        word-wrap: break-word;
    }
    .onstellar_article_title:hover {
        color: #fff;
    }
    .onstellar_article_footer {
        padding: 1.5rem;
        margin-bottom: 0.5rem;
    }
    .onstellar_article_footer strong {
        margin-left: 1rem;
        font-size: 1.2rem;
    }
    .onstellar_article_upvote,
    .onstellar_article_downvote,
    .onstellar_article_comments,
    .onstellar_article_share {
        display: flex;
        align-items: center;
        cursor: pointer;
    }
    .onstellar_article_comments {
       /* cursor: default;*/
    }
    @media (max-width: 400px) {
        .onstellar_article {
            width: 100%;
        }
    }
    /****** THE GOOD STUFF *******/
    /** https://codepen.io/nilsynils/pen/KgaRBo?editors=1100 **/

    /* OK, here's the good stuff. Start with fallback for browsers that don't support -webkit-line-clamp */
    .clampMe {
      position: relative;
      /*height: 2.4em; */
      overflow: hidden;
      white-space:nowrap;
      text-overflow: ellipsis;
      display:inline-block;
      width: 100%;
    }
    .clampMe:after {
      content: "";
      text-align: right;
      position: absolute;
      bottom: 0;
      right: 0;
      width: 50%;
      /*height: 1.2em;*/
      background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 80%);
    }
    /* Now add in code for the browsers that support -webkit-line-clamp and overwrite the non-supportive stuff */
    @supports (-webkit-line-clamp: 2) {
      .clampMe {
          overflow: hidden;
          white-space:nowrap;
          text-overflow: ellipsis;
          width: 100%;
          display:inline-block;
          -webkit-line-clamp: 1;
          -webkit-box-orient: vertical;
      }
      .clampMe:after {
        display: none;
      }
    }

.js_like-comment, .js_dislike-comment {
    color: #FFF;
}

.filter_bar {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
}
.filter_bar select,
div.selectize-input,
.filter_bar ul.chosen-choices {
    height: 36px;
    border: 1px solid #13C4B8;
    border-radius: 1px;
    background: rgb(29, 29, 29);
    margin: 0 0.5rem 0 0.5rem;
    color: #fff;
}
div.selectize-dropdown {
    margin: 0 0.5rem 0 0.5rem;
}
div.selectize-control {
    margin-left: 0.5rem;
}
