article{ border-bottom: 1px solid $border; border-top: 1px solid $light-shadow; padding: 30px 0; position: relative; h1.title{ font-size: 25px; font-weight: 300; line-height: 35px; margin-bottom: 20px; a{ color: $font-main; } } .entry{ line-height: 2; text-align: justify; a{ &:hover{ text-decoration: underline; } } .more-link{ display: block; margin-top: 20px; padding-left: 30px; background: image-url('more.png') 0 center no-repeat; } strong{ font-weight: bold; } ol, ul{ margin-left: 20px; margin-top: 10px; ol, ul{ margin-top: 0; } } p{ margin-top: 10px; } h2{ font-weight: 300; margin-top: 10px; border-bottom: 1px solid $border; position: relative; &:before{ content: ""; position: absolute; bottom: -2px; border-bottom: 1px solid $light-shadow; width: 100%; } } h3{ margin-top: 10px; } img{ max-width: 100%; height: auto; } blockquote{ background: $border; border-left: 5px solid #ccc; padding: 15px 20px; margin-top: 10px; & > p:first-of-type{ margin-top: 0; } } iframe[src*="youtube"]{ margin-top: 10px; } ol, ul, p, blockquote{ code{ background: $border; border: 1px solid #ccc; padding: 1px 3px; border-radius: 5px; margin: 0 3px; } } code{ font-family: $monospace; } pre{ line-height: 1.5; } .caption{ background: image-url('caption.png') 0 4px no-repeat; display: block; font-size: 12px; color: #999; padding-left: 25px; } } } .share{ padding: 15px 0; @include border-shadow(); } @media screen and (max-width: 800px){ article{ padding-bottom: 15px; } } @media screen and (max-width: 600px){ article{ padding: 15px 0; h1.title{ font-size: 20px; } } }