/**************************************************************************************************************** Default styles for Comments **************************************************************************************************************** Table of Contents **************************************************************************************************************** 1. Comments 2. Comment Form /**************************************************************************************************************** 1. Comments ****************************************************************************************************************/ #comments { width:640px; } #comments h3 { display:block; text-transform:capitalize; padding:5px 0; margin:15px 0; } .h3-link, .h3-link:visited { font:8pt Arial; } #comments-list {} .commentlist, .commentlist .children { list-style: none; margin:0; } .comments { margin-bottom:10px; } .commentlist li { position:relative; clear:both; padding: 10px 0 10px 160px; overflow:hidden; } .comment-wrap { position:relative; } .comment-meta { position:absolute; width:160px; left:-160px; } .avatar { margin:0 5px 5px 0; } .commentlist .fn, #commentform .fn { display:block; color:#514d42; font:bold 1em Arial,sans-serif; font-style:none; clear:left; } .comment-author-name, .comment-author-name:visited { color:#514d42; } .comment-author-name:hover, .comment-author-name:active { color:#aaa; } .comment-date { font-size:.8em; line-height:1.2em; color:#8d8982; } .commentlist li .comment-entry { background:#fff; border:1px solid #ccc; padding:20px; position:relative; } .commentlist li .comment-entry p { width:auto; } .comment-arrow { display:block; background:url('../../images/comments/comment_arrow.png') no-repeat 0 0; width:34px; height:38px; position:absolute; left:-32px; top:15px; z-index:5; } .reply-author { margin:0; } .bypostauthor {} .comment-entry blockquote { background: #eee; font-family:inherit; font-size:1em; padding:15px; } .comment-entry blockquote blockquote { background:#ddd; margin:1.5em; } .comment-entry blockquote p { margin:0; } .comment-reply-link, .comment-edit-link { font:8pt Arial; text-transform:uppercase; } #trackbacks-list { clear:both; margin-top:15px; } #trackbacks-list ol { margin-left:50px; } .commentlist .children { padding-left:0!important; } .commentlist .children li { padding-left:25px; border-left:1px solid #ccc; } .children .comment-arrow { height:1px; width:27px; left:-27px; } .children .entry-content { z-index:10; padding-bottom:60px; } .children .comment-meta { height:40px; width:200px; left:auto; right:10px; bottom:10px; z-index:15; text-align:right; } .children .comment-meta .avatar { width:40px; height:40px; position:relative; float:right; margin-left:5px; } .children .comment-meta .fn { display:inline-block; clear:none; font-size:.8em; } .children .entry-content { position:relative; } .comment-footer { padding-top:10px; } /**************************************************************************************************************** 2. Comment Form ****************************************************************************************************************/ #respond { position:relative; margin: 0; overflow:hidden; } #respond h3 { margin:0; } #commentform { margin:0 0 30px; padding: 2px 0 0 160px; position:relative; overflow:hidden; } #commentform .comment-meta { left:0; width:162px; z-index:20; overflow:hidden; } #commentform .comment-arrow { right:0; left:auto; } #commentform p { margin-bottom:8px; position:relative; } #commentform label { display:none; } #commentform input, #commentform textarea { background:#fff; color:#333; width:442px; font-size:1em; padding:5px 5px 5px 30px; margin:0; border:1px solid #ccc; position:relative; z-index:1; } #commentform textarea { width:457px; height:180px; top:-2px; padding:10px; } #login { position:relative; margin:0; float:left; } #commentform #author {background:#fff url('../../images/comments/comments_name.png') no-repeat 5px 50%;} #commentform #email {background:#fff url('../../images/comments/comments_email.png') no-repeat 5px 50%;} #commentform #url {background:#fff url('../../images/comments/comments_url.png') no-repeat 5px 50%;} #commentform span.required { color:#f55; z-index:5; } #commentform .comment-form-author .required, #commentform .comment-form-email .required, #commentform .comment-form-url .required { position:absolute; right:5px; top:0; } #commentform .comment-notes { font-size:.8em; } #commentform .form-allowed-tags { font-size:.8em; } #commentform .form-allowed-tags code { display:block; } #commentform #submit { position:relative; float:right; width:auto; } #commentform #submit { display:inline-block; background-color: #333; background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, #555), color-stop(1, #222) ); background: -moz-linear-gradient( center top, #555 20%, #222 100% ); border-color:#444; color:#fff!important; line-height:1em; text-align:center; text-decoration:none!important; padding:6px 15px; margin: 1.4em 0; -moz-border-radius:15px; -webkit-border-radius:15px; border-radius:15px; border-width:1px; border-style:solid; text-shadow: 0 -1px 0 rgba(0,0,0,.3); -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), inset 0 0 2px rgba(255,255,255,.3), 0 1px 3px rgba(0,0,0,.5); -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), inset 0 0 2px rgba(255,255,255,.3), 0 1px 2px rgba(0,0,0,.3); box-shadow: inset 0 1px 0 rgba(255,255,255,.3), inset 0 0 2px rgba(255,255,255,.3), 0 1px 2px rgba(0,0,0,.3); } #commentform #submit:hover { -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -5px 30px rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.3); -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -5px 30px rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.3); box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -5px 30px rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.3); } #commentform #submit:active { border-color: #20559a; -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255, 0); -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255, 0); box-box-shadow: inset 0 3px 7px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255, 0); }