diff --git a/core/modules/comment/comment-rtl.css b/core/modules/comment/comment-rtl.css
deleted file mode 100644
index 39c3929..0000000
--- a/core/modules/comment/comment-rtl.css
+++ /dev/null
@@ -1,5 +0,0 @@
-
-.indented {
-  margin-left: 0;
-  margin-right: 25px;
-}
diff --git a/core/modules/comment/comment-wrapper.tpl.php b/core/modules/comment/comment-wrapper.tpl.php
index d855631..dd71983 100644
--- a/core/modules/comment/comment-wrapper.tpl.php
+++ b/core/modules/comment/comment-wrapper.tpl.php
@@ -38,14 +38,14 @@
 <section id="comments" class="<?php print $classes; ?>"<?php print $attributes; ?>>
   <?php if ($content['comments'] && $node->type != 'forum'): ?>
     <?php print render($title_prefix); ?>
-    <h2 class="title"><?php print t('Comments'); ?></h2>
+    <h2><?php print t('Comments'); ?></h2>
     <?php print render($title_suffix); ?>
   <?php endif; ?>
 
   <?php print render($content['comments']); ?>
 
   <?php if ($content['comment_form']): ?>
-    <h2 class="title comment-form"><?php print t('Add new comment'); ?></h2>
+    <h2 class="comment-form"><?php print t('Add new comment'); ?></h2>
     <?php print render($content['comment_form']); ?>
   <?php endif; ?>
 </section>
diff --git a/core/modules/comment/comment.css b/core/modules/comment/comment.css
deleted file mode 100644
index a55f527..0000000
--- a/core/modules/comment/comment.css
+++ /dev/null
@@ -1,13 +0,0 @@
-
-#comments {
-  margin-top: 15px;
-}
-.indented {
-  margin-left: 25px; /* LTR */
-}
-.comment-unpublished {
-  background-color: #fff4f4;
-}
-.comment-preview {
-  background-color: #ffffea;
-}
diff --git a/core/modules/comment/comment.info b/core/modules/comment/comment.info
index 949ffc2..b23f38e 100644
--- a/core/modules/comment/comment.info
+++ b/core/modules/comment/comment.info
@@ -8,4 +8,4 @@ dependencies[] = entity
 files[] = comment.module
 files[] = comment.test
 configure = admin/content/comment
-stylesheets[all][] = comment.css
+stylesheets[all][] = comment.theme.css
diff --git a/core/modules/comment/comment.module b/core/modules/comment/comment.module
index ae9278c..2d2cfb2 100644
--- a/core/modules/comment/comment.module
+++ b/core/modules/comment/comment.module
@@ -2270,7 +2270,7 @@ function template_preprocess_comment(&$variables) {
   $variables['changed']   = format_date($comment->changed);
 
   $variables['new']       = !empty($comment->new) ? t('new') : '';
-  $variables['picture']   = theme_get_setting('toggle_comment_user_picture') ? theme('user_picture', array('account' => $comment)) : '';
+  $variables['user_picture']   = theme_get_setting('toggle_comment_user_picture') ? theme('user_picture', array('account' => $comment)) : '';
   $variables['signature'] = $comment->signature;
 
   $uri = entity_uri('comment', $comment);
@@ -2290,18 +2290,19 @@ function template_preprocess_comment(&$variables) {
 
   // Set status to a string representation of comment->status.
   if (isset($comment->in_preview)) {
-    $variables['status'] = 'comment-preview';
+    $variables['status'] = 'preview';
   }
   else {
-    $variables['status'] = ($comment->status == COMMENT_NOT_PUBLISHED) ? 'comment-unpublished' : 'comment-published';
+    $variables['status'] = ($comment->status == COMMENT_NOT_PUBLISHED) ? 'unpublished' : 'published';
   }
   // Gather comment classes.
   if ($comment->uid == 0) {
     $variables['classes_array'][] = 'comment-by-anonymous';
+    $variables['classes_array'][] = $variables['status'];
   }
   else {
-    // Published class is not needed. It is either 'comment-preview' or 'comment-unpublished'.
-    if ($variables['status'] != 'comment-published') {
+    // Published class is not needed. It is either 'preview' or 'unpublished'.
+    if ($variables['status'] != 'published') {
       $variables['classes_array'][] = $variables['status'];
     }
     if ($comment->uid === $variables['node']->uid) {
diff --git a/core/modules/comment/comment.theme-rtl.css b/core/modules/comment/comment.theme-rtl.css
new file mode 100644
index 0000000..c121023
--- /dev/null
+++ b/core/modules/comment/comment.theme-rtl.css
@@ -0,0 +1,13 @@
+
+/**
+ * @file
+ * RTL styles for comment module.
+ */
+
+/**
+ * Indent threaded comments.
+ */
+.indented {
+  margin-left: 0;
+  margin-right: 25px;
+}
diff --git a/core/modules/comment/comment.theme.css b/core/modules/comment/comment.theme.css
new file mode 100644
index 0000000..6a32a63
--- /dev/null
+++ b/core/modules/comment/comment.theme.css
@@ -0,0 +1,12 @@
+
+/**
+ * @file
+ * Basic styling for comment module.
+ */
+
+/**
+ * Indent threaded comments.
+ */
+.indented {
+  margin-left: 25px; /* LTR */
+}
diff --git a/core/modules/comment/comment.tpl.php b/core/modules/comment/comment.tpl.php
index a483813..c7d8fd7 100644
--- a/core/modules/comment/comment.tpl.php
+++ b/core/modules/comment/comment.tpl.php
@@ -23,7 +23,7 @@
  * - $picture: Authors picture.
  * - $signature: Authors signature.
  * - $status: Comment status. Possible values are:
- *   comment-unpublished, comment-published or comment-preview.
+ *   unpublished, published or preview.
  * - $title: Linked title.
  * - $classes: String of classes that can be used to style contextually through
  *   CSS. It can be manipulated through the variable $classes_array from
@@ -31,9 +31,9 @@
  *   - comment: The current template type, i.e., "theming hook".
  *   - comment-by-anonymous: Comment by an unregistered user.
  *   - comment-by-node-author: Comment by the author of the parent node.
- *   - comment-preview: When previewing a new or edited comment.
+ *   - preview: When previewing a new or edited comment.
  *   The following applies only to viewers who are registered users:
- *   - comment-unpublished: An unpublished comment visible only to administrators.
+ *   - unpublished: An unpublished comment visible only to administrators.
  *   - comment-by-viewer: Comment by the user currently viewing the page.
  *   - comment-new: New comment since last the visit.
  * - $title_prefix (array): An array containing additional output populated by
@@ -57,21 +57,22 @@
  * @see theme_comment()
  */
 ?>
-<div class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>>
-  <?php print $picture ?>
+<article class="<?php print $classes; ?>"<?php print $attributes; ?>>
+
+  <?php print $user_picture ?>
 
   <?php if ($new): ?>
-    <span class="new"><?php print $new ?></span>
+    <strong class="new"><?php print $new ?></strong>
   <?php endif; ?>
 
   <?php print render($title_prefix); ?>
   <h3<?php print $title_attributes; ?>><?php print $title ?></h3>
   <?php print render($title_suffix); ?>
 
-  <div class="submitted">
+  <footer>
     <?php print $permalink; ?>
     <?php print $submitted; ?>
-  </div>
+  </footer>
 
   <div class="content"<?php print $content_attributes; ?>>
     <?php
@@ -80,11 +81,11 @@
       print render($content);
     ?>
     <?php if ($signature): ?>
-    <div class="user-signature clearfix">
+    <div class="user-signature">
       <?php print $signature ?>
     </div>
     <?php endif; ?>
   </div>
 
   <?php print render($content['links']) ?>
-</div>
+</article>
diff --git a/core/modules/system/system.theme.css b/core/modules/system/system.theme.css
index 786d1f5..be6f2a2 100644
--- a/core/modules/system/system.theme.css
+++ b/core/modules/system/system.theme.css
@@ -38,6 +38,16 @@ tr.odd {
 }
 
 /**
+ * Publishing states.
+ */
+.unpublished {
+  background-color: #fff4f4;
+}
+.preview {
+  background-color: #ffffea;
+}
+
+/**
  * Markup generated by theme_tablesort_indicator().
  */
 th.active img {
diff --git a/core/themes/bartik/css/style-rtl.css b/core/themes/bartik/css/style-rtl.css
index d25006f..b41823f 100644
--- a/core/themes/bartik/css/style-rtl.css
+++ b/core/themes/bartik/css/style-rtl.css
@@ -121,7 +121,7 @@ ul.tips {
 .comment ul.links li {
   padding: 0 0 0.5em;
 }
-.comment-unpublished {
+.comment.unpublished {
   margin-left: 5px;
   margin-right: 0;
   padding: 5px 5px 5px 2px;
diff --git a/core/themes/bartik/css/style.css b/core/themes/bartik/css/style.css
index a66b95b..19dbde7 100644
--- a/core/themes/bartik/css/style.css
+++ b/core/themes/bartik/css/style.css
@@ -737,11 +737,11 @@ ul.links {
 .comment ul.links li {
   padding: 0 0.5em 0 0; /* LTR */
 }
-.comment-unpublished {
+.comment.unpublished {
   margin-right: 5px; /* LTR */
   padding: 5px 2px 5px 5px; /* LTR */
 }
-.comment-unpublished .comment-text .comment-arrow {
+.comment.unpublished .comment-text .comment-arrow {
   border-left: 1px solid #fff4f4;
   border-right: 1px solid #fff4f4;
 }
diff --git a/core/themes/bartik/templates/comment-wrapper.tpl.php b/core/themes/bartik/templates/comment-wrapper.tpl.php
index 864dc41..f76fb11 100644
--- a/core/themes/bartik/templates/comment-wrapper.tpl.php
+++ b/core/themes/bartik/templates/comment-wrapper.tpl.php
@@ -35,10 +35,10 @@
  * @see theme_comment_wrapper()
  */
 ?>
-<div id="comments" class="<?php print $classes; ?>"<?php print $attributes; ?>>
+<section id="comments" class="<?php print $classes; ?>"<?php print $attributes; ?>>
   <?php if ($content['comments'] && $node->type != 'forum'): ?>
     <?php print render($title_prefix); ?>
-    <h2 class="title"><?php print t('Comments'); ?></h2>
+    <h2><?php print t('Comments'); ?></h2>
     <?php print render($title_suffix); ?>
   <?php endif; ?>
 
@@ -48,4 +48,4 @@
     <h2 class="title comment-form"><?php print t('Add new comment'); ?></h2>
     <?php print render($content['comment_form']); ?>
   <?php endif; ?>
-</div>
+</section>
diff --git a/core/themes/bartik/templates/comment.tpl.php b/core/themes/bartik/templates/comment.tpl.php
index d64487d..cdf8d77 100644
--- a/core/themes/bartik/templates/comment.tpl.php
+++ b/core/themes/bartik/templates/comment.tpl.php
@@ -23,7 +23,7 @@
  * - $picture: Authors picture.
  * - $signature: Authors signature.
  * - $status: Comment status. Possible values are:
- *   comment-unpublished, comment-published or comment-preview.
+ *   unpublished, published or preview.
  * - $title: Linked title.
  * - $classes: String of classes that can be used to style contextually through
  *   CSS. It can be manipulated through the variable $classes_array from
@@ -31,9 +31,9 @@
  *   - comment: The current template type, i.e., "theming hook".
  *   - comment-by-anonymous: Comment by an unregistered user.
  *   - comment-by-node-author: Comment by the author of the parent node.
- *   - comment-preview: When previewing a new or edited comment.
+ *   - preview: When previewing a new or edited comment.
  *   The following applies only to viewers who are registered users:
- *   - comment-unpublished: An unpublished comment visible only to administrators.
+ *   - unpublished: An unpublished comment visible only to administrators.
  *   - comment-by-viewer: Comment by the user currently viewing the page.
  *   - comment-new: New comment since last the visit.
  * - $title_prefix (array): An array containing additional output populated by
@@ -57,11 +57,11 @@
  * @see theme_comment()
  */
 ?>
-<div class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>>
+<article class="<?php print $classes; ?>"<?php print $attributes; ?>>
 
-  <div class="attribution">
+  <footer class="attribution">
 
-    <?php print $picture; ?>
+    <?php print $user_picture; ?>
 
     <div class="submitted">
       <p class="commenter-name">
@@ -74,13 +74,13 @@
         <?php print $permalink; ?>
       </p>
     </div>
-  </div>
+  </footer>
 
   <div class="comment-text">
     <div class="comment-arrow"></div>
 
     <?php if ($new): ?>
-      <span class="new"><?php print $new; ?></span>
+      <strong class="new"><?php print $new; ?></strong>
     <?php endif; ?>
 
     <?php print render($title_prefix); ?>
@@ -94,7 +94,7 @@
         print render($content);
       ?>
       <?php if ($signature): ?>
-      <div class="user-signature clearfix">
+      <div class="user-signature">
         <?php print $signature; ?>
       </div>
       <?php endif; ?>
@@ -102,4 +102,4 @@
 
     <?php print render($content['links']); ?>
   </div> <!-- /.comment-text -->
-</div>
+</article>