/*------------------------------------*\
    #Blog
\*------------------------------------*/
.blog {
    @media screen and (min-width:992px) {
        padding: 127px 0 70px;
    }
}

.blog-entry {
    margin-bottom: 40px;
    position     : relative;

    &:hover {
        .entry-img {
            img {
                transform: scale(1.1);
            }
        }

        .entry-more {
            a {
                color       : $color-theme;
                padding-left: 22px;

                &::before {
                    opacity   : 1;
                    visibility: visible;
                    transform : translateX(0);
                    color     : $color-theme
                }
            }
        }
    }

    .entry-img {
        position     : relative;
        overflow     : hidden;
        border-radius: 4px;

        img {
            transition: 300ms all linear;
            max-width : 100%;
            height    : auto;
        }
    }

    .entry-content {
        padding : 22px 29px 0;
        position: relative;
    }

    .entry-category {
        color         : $color-theme;
        font-family   : $font-body;
        font-size     : 13px;
        font-weight   : 400;
        line-height   : 26px;
        text-transform: capitalize;
        margin-bottom : 4px;

        a {
            position: relative;

            &::before {
                content         : '';
                height          : 1px;
                width           : 100%;
                background-color: $color-theme;
                position        : absolute;
                bottom          : -2px;
                left            : 0;
                opacity         : 0;
                transition      : 0.3s ease-in-out;
            }

            &::after {
                content : ", ";
                position: relative;
            }

            &:last-of-type {
                &::after {
                    content: "";
                }
            }

            &:hover {
                color: $color-theme;

                &::before {
                    opacity: 1;
                }
            }
        }
    }

    .entry-title {
        margin-bottom: 4px;

        h4 {
            color        : $color-heading;
            font-size    : 18px;
            font-weight  : 500;
            line-height  : 26px;
            margin-bottom: 0;
        }

        a {
            color: $color-heading;

            &:hover {
                color: $color-theme;
            }
        }
    }

    .entry-bio {
        p {
            font-family  : $font-body;
            font-size    : 15px;
            font-weight  : 400;
            line-height  : 26px;
            margin-bottom: 2px;
        }
    }

    .entry-date {
        display       : inline-flex;
        color         : $color-body;
        font-size     : 13px;
        font-weight   : 400;
        line-height   : 25px;
        text-transform: capitalize;
        font-family   : $font-body;
        margin-bottom : 15px;

        span {
            &::after {
                content : ", ";
                position: relative;
            }

            &:last-of-type {
                &::after {
                    content: "";
                }
            }
        }
    }

    .entry-author {
        display       : inline-flex;
        align-items   : center;
        text-transform: capitalize;
        margin-right  : 25px;

        span {
            font-family  : $font-body;
            font-size    : 13px;
            font-weight  : 400;
            line-height  : 26px;
            color        : #616161;
            margin-bottom: 0;

            i {
                font-style: normal;
                color     : #333333;
            }
        }
    }

    .entry-more {
        a {
            font-family   : $font-body;
            font-weight   : bold;
            text-transform: capitalize;
            font-size     : 14px;
            line-height   : 49px;
            ;
            color       : $color-heading;
            position    : relative;
            padding-left: 0px;
            transition  : all 300ms ease-in-out;

            &::before {
                content    : "\e901";
                font-size  : 11px;
                font-family: "icomoon";
                font-weight: 700;
                position   : absolute;
                left       : 0;
                opacity    : 0;
                visibility : hidden;
                transform  : translateX(-8px);
                transition : all 300ms ease-in-out;
                color      : $color-heading;
            }
        }

    }
}

/* Blog Standard */

.blog-standard {
    .entry-img {
        margin-bottom: 17px;
    }

    .blog-entry {
        margin-bottom: 43px;

        &:last-of-type {
            margin-bottom: 50px;
        }

        .entry-type {
            margin-bottom: 0;
            display      : inline-block;
            margin-right : 12px;
        }
    }

    .entry-content {
        padding: 14px 25px 0 0;
    }

    .entry-meta-container {
        padding-left: 0;
    }

    .entry-meta-author,
    .entry-meta-comment,
    .entry-meta {
        display    : inline-block;
        font-family: $font-body;
        font-size  : 14px;
        font-weight: 600;
        line-height: 26px;
        color      : #616161;
    }

    .entry-meta-author {
        img {
            margin-right: 8px;
        }
    }

    .entry-title {
        margin-top   : 6px;
        margin-bottom: 0px;

        h4 {
            font-size  : 28px;
            line-height: 36px;
        }
    }

    .entry-bio {
        margin-bottom: 18px;

        p {
            font-family  : $font-body;
            color        : $font-heading;
            font-size    : 16px;
            line-height  : 25px;
            margin-bottom: 16px;
        }
    }
}

/* Blog Single */
.blog-single {
    @media screen and (min-width:992px) {
        padding-top   : 128px;
        padding-bottom: 110px;
    }

    .blog-entry {
        &:last-of-type {
            margin-bottom: 0px;
        }

        &:hover {
            .entry-img {
                transform: translateY(0);
            }
        }

        .entry-meta-container {
            margin-bottom: 5px;

            @media #{$minLarge} {
                transform: translateY(-7px);
            }

            .entry-category {
                margin-bottom: 0;
                display      : inline-flex;
                margin-right : 25px;
            }

            .entry-date {
                margin-bottom: 0;
            }
        }
    }

    .entry-container {
        padding-top  : 19px;
        border-bottom: 2px solid #eaeaea;

        .entry-share {
            display  : flex;
            flex-wrap: nowrap;

            @media #{$maxTablet} {
                flex-wrap: wrap;
            }

            a {
                color           : $color-white;
                background-color: $color-heading;
                border-radius   : 4px;
                padding         : 18px 12px;
                margin-right    : 15px;
                transition      : 0.3s ease-in-out;
                margin-bottom   : 20px;

                @media #{$minLarge} {
                    margin-right: 20px;
                    padding     : 18px 25px;
                    width       : 250px;
                }

                &:last-child {
                    margin-right: 0;
                }

                &:hover {
                    background-color: $color-theme;
                }
            }

            i {
                margin-right: 22px;
            }

            .share-title {
                font-size     : 14px;
                font-weight   : 700;
                font-family   : $font-body;
                margin-bottom : 0;
                display       : inline-block;
                text-transform: capitalize;
            }
        }

        .entry-tags {
            margin-bottom: 20px;

            span {
                color         : #222;
                font-size     : 14px;
                font-weight   : 700;
                text-transform: capitalize;
                display       : inline-block;
                margin-right  : 10px;
            }

            a {
                display       : inline-block;
                font-family   : $font-body;
                font-size     : 14px;
                font-weight   : 400;
                line-height   : 28px;
                color         : $color-theme;
                text-transform: capitalize;
                transition    : 0.3s ease-in-out;

                &:hover {
                    color: $color-heading;
                }

                &::after {
                    content     : ',';
                    margin-right: 4px;
                }

                &:last-of-type {
                    &:after {
                        content: none;
                    }
                }
            }
        }
    }


    .entry-bio {
        p {
            margin-bottom: 25px;
        }
    }

    .entry-img {
        margin-top   : 10px;
        margin-bottom: 33px;
    }

    .nav-posts {
        display        : flex;
        justify-content: space-between;
        align-items    : center;
        padding-top    : 40px;
        padding-bottom : 38px;
        text-transform : capitalize;

        @media screen and (max-width: 991.98px) {
            flex-direction : column;
            justify-content: center;
        }

        .prev-post,
        .next-post {
            display: flex;

            img {
                width        : 70px;
                height       : 70px;
                border-radius: 4px;
                margin-right : 20px;
            }

            .post-body {
                span {
                    display    : block;
                    font-family: $font-body;
                    font-size  : 13px;
                    line-height: 26px;
                    color      : $color-body;
                }

                .post-link {
                    font-family: $font-heading;
                    font-weight: 500;
                    font-size  : 16px;
                    line-height: 24px;
                    color      : $color-heading;
                    transition : 300ms ease-in-out;

                    &:hover {
                        color: $color-theme;
                    }
                }
            }

            @media #{$minLarge} {
                flex-basis: 50%;
            }
        }

        .prev-post {
            @media #{$maxTablet} {
                margin-bottom: 38px;
            }
        }

        .next-post {
            text-align: right;

            img {
                margin-right: 0;
                margin-left : 20px;
            }
        }
    }

    .entry-content {
        padding-bottom: 0;
        border-bottom : 0;
    }

    .entry-widget {
        .entry-widget-title {
            position     : relative;
            padding-top  : 52px;
            margin-bottom: 21px;

            h4 {
                font-family   : $font-heading;
                font-size     : 20px;
                font-weight   : 500;
                line-height   : 30px;
                margin-bottom : 0;
                position      : relative;
                text-transform: capitalize;
            }
        }
    }

    .entry-widget-bio {
        padding      : 40px 40px 35px;
        border       : 3px solid $color-theme;
        border-radius: 4px;

        .entry-widget-content {
            position: relative;
            display : flex;

            @media #{$maxSmall} {
                flex-direction: column;
                align-items   : center;
            }

            img {
                width        : 70px;
                height       : 70px;
                border-radius: 50%;
                margin-right : 30px;

                @media #{$maxSmall} {
                    margin-right : 0;
                    margin-bottom: 20px;
                }
            }

            .entry-bio-desc {
                @media #{$maxSmall} {
                    text-align: center;
                }

                h4 {
                    font-family  : $font-heading;
                    color        : #222222;
                    font-size    : 18px;
                    font-weight  : 500;
                    line-height  : 30px;
                    margin-bottom: 14px;
                }

                p {
                    color        : $color-body;
                    font-size    : 15px;
                    font-family  : $font-body;
                    font-weight  : 400;
                    line-height  : 23px;
                    margin-bottom: 17px;
                }

                a {
                    color       : #5d5d5d;
                    font-size   : 15px;
                    font-weight : 400;
                    line-height : 1;
                    margin-right: 25px;
                    transition  : 0.3s ease-in-out;

                    &:hover {
                        color: $color-theme
                    }
                }

                a:last-child {
                    margin-right: 0;
                }
            }
        }
    }

    .entry-comments {
        .entry-widget-content {
            .comments-list {
                width        : 100%;
                list-style   : none;
                overflow     : hidden;
                padding-left : 0;
                margin-bottom: 0;

                .comment-body {
                    position     : relative;
                    display      : flex;
                    margin-bottom: 30px;

                    @media #{$maxTablet} {
                        flex-direction: column;
                        align-items   : flex-start;
                    }

                    &:last-child {
                        border-bottom : none;
                        padding-bottom: 0;
                        margin-bottom : 0;

                        .comment {
                            border-bottom: none;
                        }

                        .replies-list {
                            margin-top : 25px;
                            padding-top: 30px;
                            border-top : 2px solid #eaeaea;
                        }
                    }

                    .replies-list {
                        margin-top : 25px;
                        padding-top: 30px;
                        border-top : 2px solid #eaeaea;

                        @media #{$maxSmall} {
                            padding-left: 15px;
                        }

                        li {
                            position     : relative;
                            margin-bottom: 30px;

                            &:last-child {
                                border-bottom : none;
                                padding-bottom: 0;
                                margin-bottom : 0;

                                .comment {
                                    border-bottom: none;
                                }
                            }
                        }

                        .comment-body {
                            .comment {
                                border-bottom: 2px solid #eaeaea;
                            }

                            &:last-child {
                                .comment {
                                    border: 0;
                                }
                            }
                        }
                    }

                    .avatar {
                        flex-shrink  : 0;
                        width        : 70px;
                        height       : 70px;
                        padding      : 3px;
                        border       : 3px solid $color-theme;
                        border-radius: 50%;
                        overflow     : hidden;
                        display      : flex;

                        @media #{$maxTablet} {
                            margin-bottom: 20px;
                        }

                        img {
                            border-radius: 50%;
                        }
                    }

                    .comment {
                        margin-left   : 20px;
                        padding-bottom: 10px;
                        border-bottom : 2px solid #eaeaea;

                        h6 {
                            font-family   : $font-heading;
                            color         : $color-heading;
                            font-size     : 15px;
                            font-weight   : 700;
                            text-transform: capitalize;
                            margin-bottom : 5px;
                            line-height   : 16px;
                        }

                        .date {
                            color        : #616161;
                            font-family  : $font-body;
                            font-size    : 12px;
                            font-weight  : 400;
                            line-height  : 24px;
                            margin-bottom: 5px;
                        }

                        p {
                            font-size    : 15px;
                            font-weight  : 400;
                            line-height  : 24px;
                            margin-bottom: 8px;
                        }

                        a.reply {
                            font-family   : $font-body;
                            font-size     : 14px;
                            font-weight   : 700;
                            text-transform: capitalize;
                            color         : $color-theme;
                            line-height   : 20px;
                            display       : inline-block;

                            &:hover {
                                color: $color-heading;
                            }
                        }
                    }
                }
            }
        }
    }

    .entry-add-comment {
        border-top: 2px solid #eaeaea;

        .form-control {
            margin-bottom: 30px;
        }

        .btn {
            font-size     : 14px;
            font-family   : $font-body;
            font-weight   : 700;
            text-transform: capitalize;
            border-radius : 4px;
            border        : 1px solid $color-theme;
        }
    }

}

/* Custom, iPhone Retina */
@media only screen and (min-width: 320px) and (max-width: 767px) {
    .blog-entry {
        max-width: 370px;
        margin   : 0 auto 30px;

        .entry-content {
            padding-left : 0;
            padding-right: 0;
        }
    }

    .blog-standard {
        .blog-entry {
            &:hover {
                .entry-img {
                    transform: translateY(0);
                }
            }
        }

        .entry-meta-container {
            padding-left: 0;
        }

        .entry-meta-author,
        .entry-meta-comment,
        .entry-meta,
        .entry-date {
            margin-right : 7px;
            margin-bottom: 10px;
        }

        .entry-title {
            h4 {
                font-size  : 20px;
                line-height: 28px;
            }
        }
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .blog-entry {
        .entry-content {
            padding-left : 0;
            padding-right: 0;
        }
    }

    .col-md-4 {
        .blog-entry {
            .entry-title {
                h4 {
                    font-size: 15px;
                }
            }
        }
    }

    .blog-standard {
        .entry-meta-container {
            padding-left: 0;
        }
    }
}