#primary .pen_author_profile { float: left; margin: 2em 0 0; padding: 2em 1em 0; position: relative; width: 100%; z-index: 10; } #primary .pen_author_profile:before { background: -ms-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.5) 50%, rgba(255,255,255,0) 100%); background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.5) 50%, rgba(255,255,255,0) 100%); content: ""; height: 1px; left: 0; opacity: 0.3; position: absolute; top: 0; width: 100%; } #primary .pen_author_profile a:focus, #primary .pen_author_profile a:hover, #primary .pen_author_profile a:active { text-decoration: none; } body.pen_list_plain #primary .pen_author_profile, body.pen_list_masonry #primary .pen_author_profile { border-bottom: 0 none; font-size: 0.857em; } #primary .pen_author_profile.pen_has_avatar { min-height: 100px; padding-left: 130px; } #primary .pen_author_profile .pen_author_avatar { background: #fff; border: 1px solid rgba(170,170,170,0.5); height: 90px; left: 1em; overflow: hidden; position: absolute; top: 1em; width: 90px; } body.pen_round_corners #primary .pen_author_profile .pen_author_avatar { border-radius: 50%; } body.pen_masonry_columns_4 #primary .pen_author_profile { margin: 90px 0 0; } body.pen_masonry_columns_4 #primary .pen_author_profile.pen_has_avatar { padding: 30px 1em 1em; } body.pen_masonry_columns_4 #primary .pen_author_profile .pen_author_avatar { left: 50%; top: -70px; transform: translateX(-50%); } body.pen_masonry_columns_4 #primary .pen_author_profile .pen_author_about h3, body.pen_masonry_columns_5 #primary .pen_author_profile .pen_author_about h3 { text-align: center; width: 100%; } body.pen_masonry_columns_5 #primary .pen_author_profile { margin: 100px 0 0; } body.pen_masonry_columns_5 #primary .pen_author_profile.pen_has_avatar { padding: 50px 1em 1em; } body.pen_masonry_columns_5 #primary .pen_author_profile .pen_author_avatar { left: 50%; top: -80px; transform: translateX(-50%); } #primary .pen_author_profile .pen_author_about h3 { margin: 0; } #primary .pen_author_profile .pen_author_about h3:before { display: none; } #primary .pen_author_profile .pen_author_about p { font-size: 0.857em; } #primary .pen_author_profile .pen_author_about .pen_author_url { display: inline-block; font-size: 0.857em; margin: 0 0 0.5em; } @media only screen and (min-width:728px) { body.single #primary .pen_author_profile .pen_author_about.pen_no_description, body.pen_list_plain #primary .pen_author_profile .pen_author_about.pen_no_description { left: 0; position: absolute; top: 50%; transform: translateY(-50%); } body.single #primary .pen_author_profile.pen_has_avatar .pen_author_about.pen_no_description, body.pen_list_plain #primary .pen_author_profile.pen_has_avatar .pen_author_about.pen_no_description { padding: 0 0 0 120px; } } @media only screen and (max-width:728px) { #primary .pen_author_profile { margin: 100px 0 0; } #primary .pen_author_profile.pen_has_avatar { padding: 50px 1em 1em; } #primary .pen_author_profile .pen_author_avatar { left: 50%; top: -80px; transform: translateX(-50%); } }