.blog-column { margin-bottom: -80px; background: #fff; position: relative; z-index: 5; } .hentry { &:extend(.subtemplate); border-bottom: 2px solid @blueLight; &:last-child { border: none } } .entry-title { margin-top: 0; } .entry-teaser { width: 100%; img { display: block; width: 100%; } } .entry-lead { &:extend(.large); margin-bottom: @spacer; } .entry-content { } .entry-meta { .chevron-divider; opacity: 1; line-height: 75px; height: 75px; padding-left: 15px; margin-bottom: 35px; font-weight: 500; font-size: 16px; .avatar { width: 48px; height: 48px; border-radius: 50%; vertical-align: middle; display: inline-block; margin: 0; margin-right: (@spacer / 4); border: 1px solid #CFEEF3; } } // // WP Media // .wp-caption, .alignnone, .alignleft, .alignright { margin-left: auto; margin-right: auto; display: block; margin-bottom: (@spacer/2); } .alignright { @media (@screen-sm) { float: right; margin: 5px 0 (@spacer/2) (@spacer/2); } } .alignleft { @media (@screen-sm) { float: left; margin: 5px (@spacer/2) (@spacer/4) 0; } } .wp-caption-text { &:extend(.small); color: @greyHr; font-style: italic; } // // Categories list // .post-categories { &:extend(.list-unstyled all, .small); margin-bottom: (@line-height-small / 2); } // // Related Posts // .yarpp-related { margin: 0 !important; } .related { padding-top: (@spacer / 2); .featured__title { &:extend(.bold); font-size: @font-size-h6; } a { display: block; } .grid { margin-bottom: 0; } } .related__title { &:extend(.h3, .text-center); margin-bottom: 0; padding-bottom: @spacer; } // // Art Radar MailChimp Signup // #mc-embedded-subscribe-form, #subForm { position: relative; .button, button { &:extend(.button.small all); font-size: @font-size-base; height: 46px; border: 1px solid @greyHr; } // try to deal with the existing messy markup #mce-EMAI, #fieldEmail { margin-bottom: 0; } .button, button { &:extend(.button all, .button.blue); width: 100%; } @media (@screen-sm) { #mce-EMAIL, #fieldEmail { width: 60%; } .button, button { position: absolute; top: 0; right: 0; width: 41%; } } } #subForm { button { margin-top: (@spacer/2); @media (@screen-sm) { top: 24px; margin-top: 0; } } } // // Pagination // .pagination { background: @white; margin-top: (@spacer/2); padding-bottom: (@spacer/2); a { &:extend(.button all, .button.small); } } .pagination__next { &:extend(.text-right); } // // Blog header // .blog-categories { background-color: @blueBright; border-top: 2px solid fade(@white,50); ul { &:extend(.list-unstyled all); display: table; padding: 0 10px; width: 100%; } li { width: 20%; display: table; text-align: center; vertical-align: middle; padding: 0; height: 88px; float: left; transition: .2s ease-out; &:hover, &:focus { background-color: fade(@white,50); } } a { &:extend(.text-center, .small); display: table-cell; color: @white; height: 88px; width: 100%; vertical-align: middle; padding: 0 10px; &:hover, &:focus { color: @blueMedium; } } @media screen and (max-width: 450px) { li { width: 50%; } } } // // Featured Blog Posts // .subtemplate--featured { @media (@screen-sm) { .grid__col { flex: 33%; } } .grid__col > a { display: block; } } .subtemplate--featured--more { &:extend(.text-center); margin-bottom: 0; } .featured { position: relative; transition: .2s ease-out; a:hover &, a:focus & { transform: scale(1.01); box-shadow: 0 4px 8px fade(#000, 20%); } a:active & { top: 1px; transform: none; transition: none; box-shadow: none; } } .featured__title { &:extend(.h4); margin: 0; font-size: @font-size-base; color: #fff; position: absolute; left: 0; bottom: 0; background: fade(@blueDeep, 70%); padding: (@spacer / 4); transition: .2s ease-out; a:hover &, a:focus & { color: @link-color; } } .featured__image { max-height: 175px; display: block; }