Modelos para area de comentário

Boa tarde cheirosos (♥￫ｏ￩♥) Como vão? Cara como eu amo essas mudanças bruscas de temperatura, eu amo! Um dia está um calor da porra e no outro de repente fica um gelo do cão, isto é ótimo para pegar uma boa gripe ¬¬ Então, estou bem triste e desanimada pois minhas férias estão acabando e eu estou ficando louca já, não quero mais voltar a trabalhar hahaha. Quem me dera se eu fosse dondoca e só precisasse fazer faculdade, dai sim minha vida seria perfeita não que não seja boa mas que dá um trabalho e cansa trabalhar e estudar dá. Mas por enquanto é só no sonho mesmo, tenho que me contentar e acordar para a realidade haha. Vamos ao tutorial? ^-^

Uma leitora havia me pedido modelos para comentários, eu tenho muita preguiça meu, e como não quero ficar aqui passando frio e quero ir para a cama, eu fiz um modelo exclusivo que é o primeiro modelo a ser mostrado e os outros três eu peguei de temas anteriores meus, no caso para vocês também meio que são exclusivos né até porque eu não postei nenhum deles antes. Vocês podem fazer o que quiser neles tá? Mudar tudo, cores, fontes, backgrounds e escambau só quero que credite o resto é por sua imaginação. É isso meus amores, espero que gostem, até mais e Chu!

1º Modelo 

/* Comments
----------------------------------------------- */
#comments {
padding: 15px;
background: #F8F8F8 none repeat scroll top center;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
#comments .comment-author {
padding-top: 1.5em;
}
@font-face {src: url('https://dl.dropboxusercontent.com/s/1ja1ouy48me3l4b/LaserMetal.ttf?dl=0');font-family: CK;}
#comments h4,
#comments .comment-author a,
#comments .comment-timestamp a {
background: url(http://imageshack.com/a/img661/7695/U9irH1.png)repeat;
border: solid 1px #ebe5d9;
padding:8px 8px 8px 8px;
color: #666;
font-family: CK;
font-size:30px;
font-weight: 300;
text-align: left;
text-decoration: none;
text-transform:none;
line-height:17px;
letter-spacing: 2px;
text-shadow: 1px 1px 1px #;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
#comments .comment-author:first-child {
padding-top: 0;
border-top: none;
}
/* Comments
----------------------------------------------- */
.comments{clear:both;margin-top:10px;margin-bottom:10px;
line-height:18px; font-family: Muli, sans-serif;font-size:13px;color: #A7A7A7;
text-align: justify;}
.comments .comments-content{margin-bottom:16px;font-weight:normal;}
.comments .comment .comment-actions a,.comments .comment .continue a{
display:inline-block;
margin-left:5px;
margin-bottom:5px;
margin-top:10px;
padding-bottom: 4px; padding-left: 4px; padding-right: 4px;
color: #666;
font-family: Georgia;
font-size:10px;
font-weight: 300;
text-align: center;
text-decoration: none;
text-transform:uppercase;
letter-spacing: 2px;
text-shadow: 1px 1px 1px #fff;
background: url(http://imageshack.com/a/img661/7695/U9irH1.png)repeat;
border: solid 1px #ebe5d9;
border-radius:1px;
-moz-border-radius:1px;
font-weight:normal;
cursor:pointer;
-webkit-transition-duration: .80s;
}
.comments .comment .comment-actions a:hover,.comments .comment .continue a:hover {
text-decoration: none;
background:#ebe5d9;
border: solid 1px #dfd3ba;
color: #c9bea9;
text-shadow: 1px 1px 1px #fff;
-webkit-transition-duration: .80s;
}
.comments .comments-content .comment-thread ol{
list-style-type:none;padding:0;text-align:none}
.comments .comments-content .inline-thread{padding:0}
.comments .comments-content .comment-thread{margin:8px 0}
.comments .comments-content .comment-thread:empty{display:none}
.comment-replies{margin-top:1em;margin-left:40px;}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:0}
.comments .comments-content .comment:first-child{padding-top:16px}
.comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0}
.comments .comments-content .comment-body{position:relative;
}
.comments .comments-content .user{font-style:normal;font-weight:normal}
.comments .comments-content .user a{font-weight:normal;text-decoration:none;}
.comments .comments-content .icon.blog-author{
background-repeat: no-repeat;
background-image: url('');
width:5px;
height:5px;
display:inline-block;
margin:0 0 -4px 6px;
float:right;
}
.comments .comments-content .datetime a{
font-family: Georgia;
font-size:10px;
font-weight: 300;
text-align: right;
text-decoration: none;
text-transform:uppercase;
text-shadow: 1px 1px 1px #fff;
letter-spacing: 2px;
color: #777;
float:right;
-webkit-transition-duration: .80s;
}
.comments .comments-content .datetime a:hover{
color: #c9bea9;
text-shadow: 1px 1px 1px #fff;
-webkit-transition-duration: .80s;
}
.comment-content{margin:0 0 8px;padding:0 5px;
}
.comments .comment-block{
font-family: Muli, sans-serif;
font-size:13px;
color: #666;
text-align: justify;
margin-left:50px;
position:relative;
background:#F8F8F8;
border-left: 1px solid #ebe5d9;
border-right: 1px solid #ebe5d9;
border-bottom: 1px solid #ebe5d9;
border-radius:1px;
-moz-border-radius:1px;
}
.comment-header{
background:#ebe5d9;
border: solid 1px #dfd3ba;
font-family: Georgia;
font-size:12px;
font-weight: bold;
text-align: left;
text-decoration: none;
text-transform:uppercase;
letter-spacing: 2px;
text-shadow: 1px 1px 1px #BBAAC7;
padding:5px;
border-radius:1px;
-moz-border-radius:1px;
-webkit-transition-duration: .80s;
}
.comment-header a{
color: #777;
text-shadow: 1px 1px 1px #fff;
-webkit-transition-duration: .80s;
}
.comment-header a:hover{
color: #c9bea9;
text-shadow: 1px 1px 1px #fff;
-webkit-transition-duration: .80s;
}
.comments .comments-content .owner-actions{position:absolute;right:0;top:0}
.comments .comments-replybox{border:none;height:230px;width:100%}
.comments .comment-replybox-thread{margin-top:0}
.comments .comment-replybox-single{margin-top:5px;margin-left:48px}
.comments .comments-content .loadmore a{display:block;padding:10px 16px;text-align:center}
.comments .thread-toggle{cursor:pointer;display:inline-block}
.comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:0}
.comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden}
.comments .thread-chrome.thread-collapsed{display:none}
.comments .thread-toggle{display:inline-block}
.comments .thread-toggle .thread-arrow{
display:inline-block;
height:6px;
width:7px;
overflow:visible;
margin:0.3em;
padding-right:4px;
}
.comments .thread-expanded .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent;
}
.avatar-image-container img{
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
border-radius:1%;
}
.avatar-image-container img:hover{
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
}
.avatar-image-container{
display:inline;
margin-left:-5px;
padding: 5px;
background:#ebe5d9;
border: solid 1px #dfd3ba;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;-webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
-webkit-transition-duration: .90s;
transition-duration: .90s;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.avatar-image-container:hover{
margin-left:-5px;
padding: 5px;
background: url(http://imageshack.com/a/img661/7695/U9irH1.png)no-repeat;
border:solid 1px #dfd3ba;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;opacity: 1;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}

2º Modelo 

Para usar este modelo vocês tem que por esta fonte abaixo de <head>

<link href='http://fonts.googleapis.com/css?family=Comfortaa' rel='stylesheet' type='text/css'/>

/* Comments
----------------------------------------------- */
#comments {
padding: 15px;
background: #f4f4f4 none repeat scroll top center;
}
#comments .comment-author {
padding-top: 1.5em;
}
#comments h4,
#comments .comment-author a,
#comments .comment-timestamp a {
background: #D7C7DB;
box-shadow: 0px 0px 5px #B9A7BE;
border: solid 1px #A591AB;
padding:3px;
font-family: 'Comfortaa', cursive;
font-size:12px;
color: #fff;
text-shadow: 1px 1px 1px #997BA1;
font-weight: 300;x;
text-transform:uppercase;
text-decoration: none;
text-align: center;
}
#comments .comment-author:first-child {
padding-top: 0;
border-top: none;
}
/* Comments
----------------------------------------------- */
.comments{clear:both;margin-top:10px;margin-bottom:10px;
line-height:18px; font:10px consolas;color: #5f5f5f;text-align:justify;}
.comments .comments-content{margin-bottom:16px;font-weight:normal;}
.comments .comment .comment-actions a,.comments .comment .continue a{
display:inline-block;
margin:0px 0px 10px 10px;
padding-bottom: 5px; padding-left: 5px; padding-right: 5px;
color:#fff !important; /*--- cor da fonte do botão reply--- */
font-size: 10px;
font-family: 'Comfortaa', cursive;
text-transform: uppercase;
letter-spacing: 1px;
text-align:center;
text-decoration:none;
background:#E8DDEC; /*--- cor de fundo do botão reply--- */
border:1px solid #DDCFE0; /*--- cor da borda do botão reply--- */
box-shadow: inset 0 0 2px #eee, 0 0 6px #fff;
text-shadow: 1px 1px 1px #8E7196;
border-radius:1px;
-moz-border-radius:1px;
font-weight:normal;
cursor:pointer;
-webkit-transition-duration: .80s;
}
.comments .comment .comment-actions a:hover,.comments .comment .continue a:hover {
text-decoration: none;
background:#CDBCD2; /*--- cor de fundo do botão reply hover--- */
border:1px solid #C5B4CA; /*--- cor da borda do botão reply--- */
box-shadow: inset 0 0 2px #D3CDD5, 0 0 6px #fff;
color:#fff !important; /*--- cor da fonte do botão reply--- */
text-shadow: 1px 1px 1px #7D5A87;
}
.comments .comments-content .comment-thread ol{
list-style-type:none;padding:0;text-align:none}
.comments .comments-content .inline-thread{padding:0}
.comments .comments-content .comment-thread{margin:8px 0}
.comments .comments-content .comment-thread:empty{display:none}
.comment-replies{margin-top:1em;margin-left:40px;}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:0}
.comments .comments-content .comment:first-child{padding-top:16px}
.comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0}
.comments .comments-content .comment-body{position:relative;
}
.comments .comments-content .user{font-style:normal;font-weight:normal}
.comments .comments-content .user a{font-weight:normal;text-decoration:none;}
.comments .comments-content .icon.blog-author{
background-repeat: no-repeat;
background-image: url('');
width:5px;
height:5px;
display:inline-block;
margin:0 0 -4px 6px;
float:right;
}
.comments .comments-content .datetime a{
font-family: 'Comfortaa', cursive;
font-size:10px;
text-transform: none;
letter-spacing: 1px;
text-align:left;
text-transform: uppercase;
text-decoration:none;
float:right;
margin-top:3px;
color:#FFF; /* -- cor do link da data do comentário -- */
text-shadow: 1px 1px 1px #997BA1;
}
.comments .comments-content .datetime a:hover{
color: #8C6D94; /*--- cor do link nome do autor do comentario --- */
text-shadow: 1px 1px 1px #FFF;
}
.comment-content{margin:0 0 8px;padding:0 5px;
}
.comments .comment-block{
font-family: Muli;
font-size:13px;
color: #5f5f5f;
margin-left:50px;
position:relative;
background:#F7F3F8; /* -- cor de fundo do comentário -- */
border: solid 1px #EAE3EC;
box-shadow: 1px 1px 1px #FFDCDC, inset 0px 0px 5px #eee;
border-radius:1px;
-moz-border-radius:1px;
}
.comment-header{ /*--- linha onde fica o nome do autor do comentário --- */
background: #D7C7DB;
box-shadow: 0px 0px 5px #B9A7BE;
border: solid 1px #A591AB;
font-family: 'Comfortaa', cursive;
font-size:12px;
text-transform: none;
letter-spacing: 1px;
text-align:left;
text-transform: uppercase;
text-decoration:none;
color: #fff;
padding:5px;
border-radius:1px;
-moz-border-radius:1px;
}
.comment-header a{
color: #FFF; /*--- cor do link nome do autor do comentario --- */
text-shadow: 1px 1px 1px #997BA1;
}
.comment-header a:hover{
color: #8C6D94; /*--- cor do link nome do autor do comentario --- */
text-shadow: 1px 1px 1px #FFF;
}
.comments .comments-content .owner-actions{position:absolute;right:0;top:0}
.comments .comments-replybox{border:none;height:230px;width:100%}
.comments .comment-replybox-thread{margin-top:0}
.comments .comment-replybox-single{margin-top:5px;margin-left:48px}
.comments .comments-content .loadmore a{display:block;padding:10px 16px;text-align:center}
.comments .thread-toggle{cursor:pointer;display:inline-block}
.comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:0}
.comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden}
.comments .thread-chrome.thread-collapsed{display:none}
.comments .thread-toggle{display:inline-block}
.comments .thread-toggle .thread-arrow{
display:inline-block;
height:6px;
width:7px;
overflow:visible;
margin:0.3em;
padding-right:4px;
}
.comments .thread-expanded .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent;
}
.avatar-image-container img{
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
border-radius:50%;
-webkit-border-top-right-radius: 1px;
}
.avatar-image-container img:hover{
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
-webkit-border-radius: 100%;
}
.avatar-image-container{
display:inline;
margin-left:1px;
padding: 2px;
background: #D7C7DB;
box-shadow: 0px 0px 5px #B9A7BE;
border: solid 1px #A591AB;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-webkit-border-radius:50%;
-webkit-border-radius:50% 50% 0% 50%;
-webkit-border-radius: 100px;
-webkit-border-top-right-radius: 1px;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;-webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
-webkit-transition-duration: .90s;
transition-duration: .90s;}
.avatar-image-container:hover{
margin-left:-5px;
padding: 2px;
background: #D7C7DB;
box-shadow: 0px 0px 5px #B9A7BE;
border: solid 1px #A591AB;
-webkit-border-radius: 100px;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;opacity: 1;
}

3º Modelo

/* Comments
----------------------------------------------- */
#comments {
padding: 15px;
background: #fff none repeat scroll top center;
}
#comments .comment-author {
padding-top: 1.5em;
}
#comments h4,
#comments .comment-author a,
#comments .comment-timestamp a {
font-family: 'Open Sans Condensed', sans-serif;
color:#FFB2B2;
text-shadow: 1px 1px 1px #fff;
font-weight: 300;
letter-spacing: 2px;
font-size: 15px;
color: #FFB7B7;
text-align: center;
text-transform: uppercase;
}
#comments .comment-author:first-child {
padding-top: 0;
border-top: none;
}
/* Comments
----------------------------------------------- */
.comments{clear:both;top:10px;margin-bottom:30px;line-height:10px;font: normal normal 12px calibri;
color:#999;text-align:justify;font-weight: none;}
.comments .comments-content{margin-bottom:16px;font-weight:normal;text-align:justify;margin-top:-15px;}
.comments .comment .comment-actions a,.comments .comment .continue a{
display:inline-block;
margin:0px 2px 4px 4px;
padding-bottom: 5px; padding-left: 4px; padding-right: 4px; padding-top: 5px;
text-align:justify;
font-family: 'calibri', sans-serif;
font-size: 10px;
color: #FFB7B7;
font-weight: 300;
text-align: center;
letter-spacing: 2px;
text-transform: uppercase;
text-shadow: 1px 1px 1px #fff;
background-color:#FFDDDD; border: 1px #FFC3C3 solid;
border-radius:1px;
-moz-border-radius:1px;
cursor:pointer;
text-decoration:none;
-webkit-transition-duration: .80s;
}
.comments .comment .comment-actions a:hover,.comments .comment .continue a:hover {
display:inline-block;
margin:0px 2px 4px 4px;
padding-bottom: 5px; padding-left: 4px; padding-right: 4px; padding-top: 5px;
text-align:justify;
font-family: 'calibri', sans-serif;
font-size: 10px;
color: #FF9191;
font-weight: 300;
text-align: center;
letter-spacing: 2px;
text-transform: uppercase;
text-shadow: 1px 1px 1px #fff;
background-color:#FFDDDD; border: 1px #FFC3C3 solid;
border-radius:1px;
-moz-border-radius:1px;
cursor:pointer;
text-decoration:none;
-webkit-transition-duration: .80s;
}
.comments .comments-content .comment-thread ol{
list-style-type:none;padding:0;text-align:none}
.comments .comments-content .inline-thread{padding:0}
.comments .comments-content .comment-thread{margin:8px 0}
.comments .comments-content .comment-thread:empty{display:none}
.comment-replies{margin-top:1em;margin-left:40px;}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:0}
.comments .comments-content .comment:first-child{padding-top:16px}
.comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0}
.comments .comments-content .comment-body{position:relative;
}
.comments .comments-content .user{font-style:normal;font-weight:normal}
.comments .comments-content .user a{font-weight:normal;text-decoration:none;}
.comments .comments-content .icon.blog-author{
position:absolute;
top: 4px;
float:right;
margin:0;
background-image: url();width:14px;height:14px;
}
.comments .comments-content .datetime a{
font-family: 'calibri', sans-serif;
font-size: 9px;
color: #FFBABA;
font-weight: 300;
text-align: center;
letter-spacing: 2px;
text-transform: uppercase;
text-shadow: 1px 1px 1px #fff;
position:absolute;
float:right;
top: -2px;
}
.comment-content{margin:0 0 8px;padding:0 5px;
}
.comments .comment-block{
font: normal normal 12px calibri;
color:#999;
text-shadow: 0px 0px 0px #fff !important;
text-align:justify;
margin-left:65px;
position:relative;
background-color:#FFF0F0;
border: 1px #FFD4D4 solid;
border-radius:1px;
-moz-border-radius:0px;
}
.comment-header{ /*--- linha onde fica o nome do autor do comentário --- */
color:#FFB2B2;
text-shadow: 1px 1px 1px #fff;
background: #FFE4E4;
border-bottom: 1px solid #FFCBCB;
padding:4px;
border-radius:1px;
}
.comment-header a{
text-transform: uppercase;
font-family: 'Open Sans Condensed', sans-serif;
color:#FFB2B2;
text-shadow: 1px 1px 1px #fff;
font-weight: 300;
letter-spacing: 2px;
font-size:11px;
border-radius:1px;
padding:8px;
}
.comments .comments-content .owner-actions{position:absolute;right:0;top:0}
.comments .comments-replybox{border:none;height:230px;width:100%}
.comments .comment-replybox-thread{margin-top:0}
.comments .comment-replybox-single{margin-top:5px;margin-left:48px}
.comments .comments-content .loadmore a{display:block;padding:10px 16px;text-align:center}
.comments .thread-toggle{cursor:pointer;display:inline-block}
.comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:0}
.comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden}
.comments .thread-chrome.thread-collapsed{display:none}
.comments .thread-toggle{display:inline-block}
.comments .thread-toggle .thread-arrow{
display:inline-block;
height:6px;
width:7px;
overflow:visible;
margin:0.3em;
padding-right:4px;
}
.comments .thread-expanded .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent;
}
.avatar-image-container{
display:inline;
margin-left:4px;
padding: 4px;
background: #fff;
border:solid 1px #FFCACA;
border-radius: 1px;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out; -webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
-webkit-transition-duration: .90s;
transition-duration: .90s;opacity: 0.6;}
.avatar-image-container:hover{
display:inline;
margin-left:4px;
padding: 4px;
background: #fff;
border:solid 1px #FFA4A4;
border-radius: 1px;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;opacity: 0.9;
}

4º Modelo

/* Comments
----------------------------------------------- */
#comments {
padding: 15px;
background: #F8F8F8 none repeat scroll top center;
}
#comments .comment-author {
padding-top: 1.5em;
}
#comments h4,
#comments .comment-author a,
#comments .comment-timestamp a {
text-transform: capitalize;
letter-spacing: 2;
font-family: 'Georgia', cursive;
font-weight: 300;
font-size: 22px;
font-style:italic;
color:#F8CED8;
text-align: center;
}
#comments .comment-timestamp a:hover {
font-family: 'Yanone Kaffeesatz', sans-serif;
font-weight: 300;
letter-spacing: 2px;
text-transform: uppercase;
font-size: 22px;
color: # !important;
text-align: center;
}
#comments .comment-author:first-child {
padding-top: 0;
border-top: none;
}
/* Comments
----------------------------------------------- */
.comments{clear:both;top:10px;margin-bottom:30px;line-height:10px;font: normal normal 12px calibri;
color:#d8d8d8;text-align:justify;}
.comments .comments-content{margin-bottom:16px;font-weight:normal;text-align:justify;margin-top:-15px;}
.comments .comment .comment-actions a,.comments .comment .continue a{
display:inline-block;
margin:0px 2px 4px 4px;
padding-bottom: 5px; padding-left: 4px; padding-right: 4px; padding-top: 5px;
text-align:justify;
font-family: 'Pf Arma Five'; font-size: 8px; text-shadow: 1px 1px 0px # !important;
text-decoration:none;
color:#fff;
text-shadow: 1px 1px 1px #ccc;
background:#FCDDE6;border: solid 1px #F9CFDB;
box-shadow: inset 1px 1px 0px #ffbfd0;
box-shadow:1px 2px 2px #fad5de;
border-radius:1px;
-moz-border-radius:1px;
font-weight:normal;
cursor:pointer;
-webkit-transition-duration: .80s;
}
.comments .comment .comment-actions a:hover,.comments .comment .continue a:hover {
display:inline-block;
margin:0px 2px 4px 4px;
padding-bottom: 5px; padding-left: 4px; padding-right: 4px; padding-top: 5px;
font-family: 'Pf Arma Five'; font-size: 8px; text-shadow: 1px 1px 0px # !important;
text-decoration:none;
color:#fff;
text-shadow: 1px 1px 1px #ccc;
background: #ebe7f9;border: solid 1px #e2dcf8;
box-shadow: inset 1px 1px 0px #D4E3E8;
box-shadow:1px 2px 2px #D4E3E8;
border-radius:2px;
-moz-border-radius:2px;
font-weight:normal;
cursor:pointer;
-webkit-transition-duration: .100s;
}
.comments .comments-content .comment-thread ol{
list-style-type:none;padding:0;text-align:none}
.comments .comments-content .inline-thread{padding:0}
.comments .comments-content .comment-thread{margin:8px 0}
.comments .comments-content .comment-thread:empty{display:none}
.comment-replies{margin-top:1em;margin-left:40px;}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:0}
.comments .comments-content .comment:first-child{padding-top:16px}
.comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0}
.comments .comments-content .comment-body{position:relative;
}
.comments .comments-content .user{font-style:normal;font-weight:normal}
.comments .comments-content .user a{font-weight:normal;text-decoration:none;}
.comments .comments-content .icon.blog-author{
position:absolute;
top: 2px;
float:right;
margin:0;
}
.comments .comments-content .datetime a{
font-family: 'Pf Arma Five';
font-size:8px;
color:#fff; /* -- cor do link da data do comentário -- */
text-shadow: 1px 2px 2px #A4B9BE;
position:absolute;
float:left;
top: -1px;
}
.comment-content{margin:0 0 8px;padding:0 5px;
}
.comments .comment-block{
font: normal normal 12px calibri;
color:#D0D0D0;
text-shadow: 0px 0px 0px #fff !important;
margin-left:65px;
position:relative;
background:#F8F8F8;
border:1px solid #;
box-shadow: 0px 0px 1px #;
border-radius:1px;
-moz-border-radius:0px;
}
.comment-header{ /*--- linha onde fica o nome do autor do comentário --- */
color:#fff;
text-shadow: 1px 2px 2px #A4B9BE;
background: #ebe7f9;border: solid 1px #e2dcf8;
box-shadow: inset px 0px 0px #D4E3E8;
box-shadow: inset 0px 2px 2px #;
border-bottom:solid 2px #FAD6E0;
padding:4px;
border-radius:1px;
}
.comment-header a{
text-transform: uppercase;
font-family: 'Open Sans Condensed', sans-serif;
text-shadow: 1px 2px 2px #A4B9BE;
font-weight: 300;
letter-spacing: 2px;
font-size:11px;
border-radius:1px;
color: #fff;
padding:8px;
}
.comments .comments-content .owner-actions{position:absolute;right:0;top:0}
.comments .comments-replybox{border:none;height:230px;width:100%}
.comments .comment-replybox-thread{margin-top:0}
.comments .comment-replybox-single{margin-top:5px;margin-left:48px}
.comments .comments-content .loadmore a{display:block;padding:10px 16px;text-align:center}
.comments .thread-toggle{cursor:pointer;display:inline-block}
.comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:0}
.comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden}
.comments .thread-chrome.thread-collapsed{display:none}
.comments .thread-toggle{display:inline-block}
.comments .thread-toggle .thread-arrow{
display:inline-block;
height:6px;
width:7px;
overflow:visible;
margin:0.3em;
padding-right:4px;
}
.comments .thread-expanded .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent;
}
.avatar-image-container{
display:inline;
margin-left:4px;
padding: 2px;
background:#FAC5D3;border: solid 1px #F9B6C8;
box-shadow: inset 1px 1px 0px #ffbfd0;
box-shadow:1px 2px 2px #fad5de;
border-radius: 1px;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;opacity: 0.6; -webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
-webkit-transition-duration: .90s;
transition-duration: .90s;}
.avatar-image-container:hover{
display:inline;
margin-left:8px;
padding: 2px;
background: #ebe7f9;border: solid 1px #e2dcf8;
box-shadow: inset 1px 1px 0px #D4E3E8;
box-shadow:1px 2px 2px #D4E3E8;
border-radius: 1px;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;opacity: 1;
}