.apl-admin-content { h2 { margin: 30px 0; font-size: 1.6em; } section { table { tr { th { text-align: right; } td { } } } h3 { font-size: 1.1em; font-weight: normal; margin-right: 20px; } input[type="text"] { width: 250px; } } } .add-post-link { border-width: 1px; border-style: solid; margin: 15px 0; &:after { content: " "; display: table; clear: both; } .add-post-link-description { padding: 10px; width: 100%; .add-post-link-title { position: relative; font-weight: normal; text-decoration: none; margin: 0 0 10px 0; border-bottom-width: 2px; border-bottom-style: solid; &:after { content: ""; display: block; width: 30%; min-width: 100px; height: 2px; position: absolute; bottom: -2px; left: 0; } } p { line-height: 1.4em; margin: 0; } a { text-decoration: none; box-shadow: none; } .add-post-link-more { text-align: right; margin: 20px 0 0 0; a { font-size: 0.8em; display: inline-block; border-width: 1px; border-style: solid; padding: 5px 10px; } } } &.has-thumbnail { div { float: left; &:after { content: ""; display: table; clear: both; } } .add-post-link-thumbnail { padding: 10px; width: 35%; img { width: 100%; height: auto; } } .add-post-link-description { padding: 10px; width: 65%; } } } @media screen and (max-width: 640px) { .add-post-link { &:after { } .add-post-link-description { .add-post-link-title { &:after { } } p { } a { } .add-post-link-more { a { } } } &.has-thumbnail { div { float: none; &:after { } } .add-post-link-thumbnail { width: 100%; img { width: 100%; height: auto; } } .add-post-link-description { width: 100%; } } } }