diff --git a/doc/source/demo/index.rst b/doc/source/demo/index.rst
index e923dd2..ef68253 100644
--- a/doc/source/demo/index.rst
+++ b/doc/source/demo/index.rst
@@ -91,9 +91,27 @@ Notices take these forms:
 
 .. caution:: Helpful information that prevents the user from making mistakes.
 
+.. seealso::
+
+    A reference to another piece of related information, like a
+    related setting or upstream documentation
+
 .. warning:: Critical information about the risk of data loss or security
              issues.
 
+Configuration addition and deprecation notices
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+.. versionadded:: 9.0.0(Mitaka)
+
+.. versionchanged:: 10.0.0(Newton)
+
+    Added supported for new tags!
+
+.. deprecated:: 11.0.0(Ocata)
+
+    Use `Notices`_ instead.
+
 .. toctree::
     :maxdepth: 1
 
diff --git a/openstackdocstheme/theme/openstackdocs/static/css/combined.css b/openstackdocstheme/theme/openstackdocs/static/css/combined.css
index d8aeb55..87f651e 100644
--- a/openstackdocstheme/theme/openstackdocs/static/css/combined.css
+++ b/openstackdocstheme/theme/openstackdocs/static/css/combined.css
@@ -4192,8 +4192,12 @@ pre .cl {
   background: #eee;
   border-left: 4px solid;
   border-radius: 4px;
-  padding: 20px;
-  margin: 30px 0; }
+  padding: 15px;
+  margin: 15px 0; }
+
+.admonition > .last {
+  margin: 0;
+}
 
 .admonition h3 {
   font-size: 18px;
@@ -4247,6 +4251,18 @@ pre .cl {
   font-weight: 600;
 }
 
+.versionadded {
+  color: #3C763D;
+}
+
+.versionchanged {
+  color: #31708f;
+}
+
+.deprecated {
+  color: #DA422F;
+}
+
 .docs-tags {
   width: 100%;
   margin-bottom: 30px; }
diff --git a/openstackdocstheme/theme/openstackdocs/static/js/docs.js b/openstackdocstheme/theme/openstackdocs/static/js/docs.js
index 2cd84a0..fa27c07 100644
--- a/openstackdocstheme/theme/openstackdocs/static/js/docs.js
+++ b/openstackdocstheme/theme/openstackdocs/static/js/docs.js
@@ -90,9 +90,13 @@ $('a').click(function(){
    and warning. We decorate their title paragraphs with Font Awesome icons
    by adding the appropriate FA classes.                               */
 
-$('div.important > p.admonition-title').prepend('<div class="fa fa-check-circle">&nbsp;</div>');
-$('div.note > p.admonition-title').prepend('<div class="fa fa-check-circle">&nbsp;</div>');
-$('div.warning > p.admonition-title').prepend('<div class="fa fa-exclamation-triangle">&nbsp;</div>');
+$('div.important > p.admonition-title').prepend('<div class="fa fa-fw fa-check-circle">&nbsp;</div>');
+$('div.note > p.admonition-title').prepend('<div class="fa fa-fw fa-check-circle">&nbsp;</div>');
+$('div.seealso > p.admonition-title').prepend('<div class="fa fa-fw fa-info-circle">&nbsp;</div>');
+$('div.warning > p.admonition-title').prepend('<div class="fa fa-fw fa-exclamation-triangle">&nbsp;</div>');
+$('div.versionadded > p').prepend('<div class="fa fa-fw fa-plus-circle">&nbsp;</div>');
+$('div.versionchanged > p').prepend('<div class="fa fa-fw fa-info-circle">&nbsp;</div>');
+$('div.deprecated > p').prepend('<div class="fa fa-fw fa-minus-circle">&nbsp;</div>');
 
 /* BB 150310
    We also insert a space between the icon and the admonition title