blog/_src/assets/less/content.less

.page-title {
    &:extend(.h2, .heading-band);
    color: @brand-grey-light;
    margin-top: @line-height-computed/2;
    margin-bottom: @line-height-computed/2;

    // icons
    &:before {
        font-size: 32px;
        color: fade(@text-color-dimmed, 70%);
        margin-right: .5em
    }

    @media @breakpoint2 {
        margin-left: -108%;
        .page-photos & { margin-bottom: @line-height-computed*4; }
    }
}

.hentry {
    &:extend(.divider-bottom);
	padding: @line-height-computed*2 0;

	@media @breakpoint2 {
		padding: @line-height-computed*4 0;
	}

	&:first-child {
        padding-top: @line-height-computed;
    }

    .page-single & {
        padding-bottom: @line-height-computed*2;
        border: none;
        &:before { .hide; }
    }
}

// post title
.entry-title {
    &:extend(.h1, .textcenter);
	color: @headings-color;
	margin-top: 0;
	margin-bottom: @line-height-computed;

	.format-link & { &:extend(.h3); }
}

// post content
.entry-content {
	h1, h2 {
        &:extend(.heading-band);
	}
    h1 { font-size: ceil(@font-size-base * 2.5) }

    p:last-child {
        margin-bottom: 0;
    }
}


// post category icons
/////////////////////////////////////

.posttype {
	display: block;
	width: 20px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: @line-height-computed/2;
	margin-top: -@line-height-computed;

	// icon adjustments
	&:before {
		font-size: 20px;
		color: @text-color-light
	}

	&:hover:before {
		color: @link-color
	}
}

// POST META
/////////////////////////////////////

.entry-meta {
    &:extend(.clearfix all);
    margin-top: @line-height-computed*2;
    font-size: @font-size-small;
}

.byline,
time,
.categories {
    &:extend(.textcenter);
}

.byline,
time {
	font-style: italic;
	color: @text-color-light;
}

.byline {
	margin-bottom: 0;

    .by { display: block }
}

time {
    display: block;
    color: @text-color-dimmed
}

.categories {
    margin-top: @line-height-computed;
}

.avatar {
    width: 80px;
    height: 80px;
    .border-radius(80px);
    border: 2px solid #fff;
}

//
// Goodies download
//
.goodie-actions {
    &:extend(.clearfix all);
    max-width: 640px;
    margin: 0 auto;

    p,
    .btn { margin-bottom: 0 }

    .btn { display: block; }

    .download {
        margin-top: @line-height-computed/2;

        @media @breakpoint2 {
            margin-top: 0;
            text-align: right
        }
    }
}



// Masonry

.masonry {

    @media @breakpoint2 {
        width: 125%;
        margin-left: -12.5%;
        .clearfix();
    }

    .hentry {

        @media @breakpoint1 {
            width: 49%;
    		float: left;
    		clear: none;
    		padding-top: 0;
    		padding-bottom: 0;
    		margin-bottom: .7em;
    		margin-top: 0;
    		margin-left: 0;
    		margin-right: 1%;
    		border: none;

    		&:before { display: none; }

            &:nth-child(2n+1) {  margin-right: 0; }

    		&:last-child { margin-bottom: 3em; }
        }
    }
}

.grid-sizer {
    width: 100%;

    @media screen and (min-width: 480px) {
        width: 50%;
    }
}