html, body { margin: 0; padding: 0; min-height: 100%; } body { font-family: "Lucida Grande", Tahoma, sans-serif; font-size: 11px; background: #dedede url(../img/background.png) center center no-repeat; } a { text-decoration: none; color: #00317a; } ol { list-style-type: none; margin: 0; padding: 0; } ol li, .error, header.profile { clear: both; padding: 8px; background: #eee; border-top: 1px solid #fefefe; border-bottom: 1px solid #c9c9c9; position: relative; } .hidden { display: none; } .error h1 { color: red; } body > ol > li { } body > ol > li:first-child { border-top: 0; } body > ol > li:nth-child(odd), .error, header.profile { background: #fafafa; } body > ol > li:nth-child(even) { background: #f2f2f2; } body > ol > li:hover { background: #dedede; } body > ol > li.highlighteffect { background-color: #FFFBD0; -webkit-transition: background-color 200ms linear; } body > ol > li.highlighteffect-after { -webkit-transition: background-color 1000ms linear; } body > ol > li:after, header.profile:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } header.profile img { float: left; margin: 0 10px 10px 0; max-width: 100px; border-radius: 10px; } header.profile table { border-collapse: collapse; margin-top: 10px; } header.profile th { text-align: left; padding-right: 1em; } header.profile h1 + p { color: #aaa; margin-bottom: 10px; } .highlight { border-right: 5px solid #f17779; } h1 { font-size: 1em; font-weight: bold; margin: 0; padding: 0; } h1 img { vertical-align: middle; } p { margin: 0; padding: 0; word-wrap: break-word; } .image { float: left; margin-left: 2px; width: 48px; height: 48px; border: 0px solid #f00; -webkit-border-radius: 8px; cursor: pointer; } .image a { display: block; width: 48px; height: 48px; } .images:empty { display: none; } .images { padding-top: 5px; } .images img { border-radius: 5px; max-height: 75px; margin-right: 5px; } .images img.photo { max-width: 100%; max-height: inherit; margin-right: 0; border-radius: 3px; box-shadow: 0 0 1px black; } .data { margin-left: 62px; } .is_private { color: white; padding: 0 4px 0 2px; background: #09F; border-radius: 3px; font-style: italic; font-weight: bold; } li .date { position: absolute; top: -1.8em; right: 10px; display: none; padding: 0.3em 0.9em; -webkit-border-top-left-radius: 8px; -webkit-border-top-right-radius: 8px; -webkit-box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.1); border: 1px solid white; border-bottom: 0; background: #ddd; font-size: 0.9em; } li:hover .date { display: block; } li:first-child:hover .date { top: auto; bottom: -1.6em; z-index: 2; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-left-radius: 8px; -webkit-border-bottom-right-radius: 8px; -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1); border: 1px solid #b9b9b9; border-top: 0; } aside { float: right; margin: 0 3px 3px 3px; visibility: hidden; } .reply_to, .repost, .remove { width: 15px; height: 12px; background: url(../img/sprite-icons.png) no-repeat -16px 0; float: right; margin-left: 2px; } li:hover aside { visibility: visible; } .repost { background-position: -192px 0; } .remove { background-position: -128px 0; } li.mentioned { border-right: 5px solid #00317a; } .mentions li.mentioned { border-right: 0; } .reposted_by:before { content: " "; display: inline-block; background: url(../img/sprite-icons.png) no-repeat -192px 0; height: 12px; width: 15px; margin-right: 5px; } .reposted_by { position: relative; color: #00317a; } .reposted_by ul { display: none; position: absolute; list-style-type: none; margin: 0; padding: 3px 6px; background: black; border-radius: 3px; box-shadow: 0 0 5px rgba(0,0,0,0.7); z-index: 2; } .reposted_by:hover ul { display: block; } .reposted_by:hover ul:empty { display: none; } .reposted_by li { margin: 0; padding: 0; background: black; text-align: center; border: 0; } .reposted_by li:hover { background: black; } .reposted_by li a { color: white; background: black; font-weight: normal; text-decoration: none; border: none; white-space: nowrap; text-shadow: none; } .reposted_by ul:after { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .reposted_by ul:after { border-color: rgba(0, 0, 0, 0); border-bottom-color: #000000; border-width: 5px; left: 50%; margin-left: -5px; } .name { font-weight: bold; } header.profile button { background: #09F; float: right; color: white; cursor: pointer; padding: 6px 10px; border: 0; border-radius: 3px; font-weight: bold; clear: right; } header.profile button.following { background: #D84A38; }