//Indexpage
.blog-index {
    padding: 60px 0;
}

.blog {
    background-color: @light-background;
    
    &-post-info {
        border-bottom: 1px solid lighten(@black-color, 90%);
        padding: 10px 25px;
        color: lighten(@black-color, 60%);
        font-size: 0.8em;
        font-style: italic;
        
        .time {
            float:left;
        }
        .comments {
            float:right;
            a {
                color: lighten(@black-color, 60%);
                &:hover {
                    color: @theme-color;
                }
            }
        }
        i {
            margin-right: 5px;
        }
    }
    
    &-post-body {
        padding: 15px 25px 25px;
        
        h4 {
            text-transform: capitalize;
            a {
                color: lighten(@dark-color, 10%);
                &:hover {
                    color: @theme-color;
                }
            }
        }
        a.read-more {
            font-weight: 700;
        }
    }
}


//Blog Single Page
.postSingle {
    
    .postTitle {
        padding-bottom: 10px;
        h1 {
            font-size:24px;
            margin-bottom:5px;
        }
    }
    
    .postMeta {
        color: lighten(@black-color, 50%);
        font-size: 0.9em;
        font-style: italic;
        padding: 10px 20px;
        margin-bottom: 30px;
        background: @light-background;
        a {
            color: lighten(@black-color, 50%);
            &:hover {
                color: @theme-color;
            }
        }
        &-info {
            float:left;
            span {
                margin-right: 15px;
                i {
                   margin-right: 3px;
                }
            }
        }
        &-date {
            float:right;
            span {
                i {
                   margin-right: 3px;
                }
            }
        }
    }
    
    .postMedia {
        padding: 0;
    }
    
    .postTags {
        margin-top:30px;
        
        h4 {
            font-size: 14px;
            float: left;
            margin-right: 10px;
            margin-top: 4px;
            text-transform: capitalize;
            i {
                margin-right: 5px;
            }
        }
        ul {
            li {
                a {
                    background: @theme-color;
                    color: @white-color;
                    display: inline-block;
                    padding: 5px 12px;
                	font-size: 11px;
                	margin-bottom: 10px;
                }
            }
        }
    }
    
}

.entriesContainer {
    margin-top: 40px;
    
    .comments-list {
        padding: 0;
        margin-top: 40px;
        .img {
            border: 2px solid @theme-color;
            color: @theme-color;
            float: left;
            height: 35px;
            width: 35px;
            line-height: 31px;
            margin-top: 5px;
            text-align: center;     
        }
        .commentContent {
            margin-bottom: 15px;
            margin-left: 50px;
            p.expert {
                font-size: 13px;
                line-height: 23px;
                margin-top: 10px;
            }
            .date a {
                color: @theme-color;
                font-size: 11px;
            	display: inline-block;
            }
        }
    }
}

.comment {
    padding: 20px 20px 50px;
    position: relative;
    background: @light-background;
    &.children {
        margin-top: 30px;
    }
}

.comments {
    a {
    	display:inline-block;
    }
    .author a{
    	color: @dark-color;
    }
    .replys {
        margin-left: 40px;
        &.children {
            margin-left: 80px;
        }
    }
    .reply-btn {
        float: right;
        a {
            color: @dark-color;
            display: inline-block;
            font-size: 13px;
            font-weight: 600;
            padding: 8px 12px;
        }
    }
}

/*Respond*/
.respond {    
    .replyForm {
        input[type="text"], input[type="email"], textarea {    
            background: @light-background;
            border: 0 none;
            color: @dark-color;
            font-family: inherit;
            font-size: 13px;
            margin: 0 0 28px;
            outline: 0 none;
            padding: 12px 10px;
            resize: none;
            width: 100%;
            border: 1px solid #f2f2f1;
        }
        #success, #error {display: none;}
    }   
}

/*Sidebar*/
.widget{
	margin-bottom:20px;
	background-color: @light-background;
	padding: 25px 25px 12px;
    h4{
    	margin-bottom:20px;
    }
    
    .search-form{
    	position:relative;   	
    	input[type="text"]{
            border:none;
            padding: 12px 10px;
        	font-size: 13px;
            width: 100%;
        	background: @light-background;
            border: 0 none;
            outline:0;
            color: @dark-color;
        	border:1px solid @light-background;
        }
        .submit-search {
            border: medium none;
            cursor: pointer;
            position: absolute;
            right: 0;
            top: 0;
            padding: 12px 15px;
            font-weight: 600;
        	color: @white-color;
        	background: @dark-color;
        	&:hover {       	    
        	    background: @theme-color;
        	}
        }
    }
    
    .cat-list li, .cat-archives li, .meta li {
        border-bottom: 1px solid lighten(@black-color, 92%);
        line-height: 30px;
        padding: 5px 0;
        a {
            color: lighten(@dark-color, 30%);
            font-weight: 600;
            &:hover {
                color: @theme-color;
            }
        }
        &:last-child {
            border-bottom: none;
        }
    }
    
    .cat-list li {
        span.countCat {
            color:@theme-color;
        	font-size: 12px;
        }
    }
        
    .meta abbr {
        color: @theme-color;
    }
    
    .tag-list li {
        display: inline-block;
        margin-bottom: 5px;
        margin-right: 1px;
        a {
            background: darken(@light-background, 4%);
            color: lighten(@dark-color, 30%);
            font-weight: 600;
            display: inline-block;
            padding: 5px 12px;
            transition: all 0.3s ease-in-out;
            &:hover {
                background: @theme-color;
                color: @white-color;
            }
        }
    }
    
    .cat-list li:last-child, .cat-archives li:last-child {
        border-bottom: medium none;
    }
    
    .meta {
        abbr {
            border-bottom: 1px dotted @dark-color;
            cursor: help;
        }
    }

    &.widget-bottom {
        background-color: transparent;
        h4 {
            padding-bottom: 5px;
            border-bottom: 1px solid lighten(@black-color, 92%);
        }
        .cat-list li, .cat-archives li, .meta li {
            border-bottom: 0px;
        }
    }
    
}

.widget-search {
    padding: 0;
}


//Pagination for Blog Index
.pagination {
    border-radius: 0;
    margin-top:0;
    li {
        &:last-child, &:first-child {
            a, span {
                border-radius: 0;
            }
        }
        a, span {
            color: @theme-color;
        }
    }
    .active {
        span {
            background-color: @theme-color;
            border-color: @theme-color;
            &:focus, &:hover {
                background-color: @theme-color;
                border-color: @theme-color;
            }
        }
    }
}


//Responsive

@media screen and (max-width: 768px) {
   .blog-index {
        padding: 30px 0;
    }
    
}

@media screen and (max-width: 480px) {
   .postSingle {
        .postMeta {
            &-info, &-date {
                float:none;
            }
        }
   }
    
}