diff --git a/template/resources/style.css b/template/resources/style.css
index 7ac83821a622e0494d7f540cf8df8c1f67bf7506..32a4b4dee124cc90da468b331166d474d05c3ed8 100644
--- a/template/resources/style.css
+++ b/template/resources/style.css
@@ -1,360 +1,310 @@
 .body-wrap {
-	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
-	color: #222;
-	background-color:#FFFFFF;
-	margin: 0px;
-	padding: 10px;
-    position:relative;
-}
-.body-wrap {
-	width:95%;
+    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
+    color: #222;
+    background-color: #FFFFFF;
+    margin: 0px;
+    padding: 10px;
+    position: relative;
+    width: 95%;
+}
+.body-wrap,
+.body-wrap td,
+.body-wrap th {
+    font-size: 13px;
 }
 
-.body-wrap ul.list {
-   margin-left:20px;
-   margin-bottom:10px;
-}
-.body-wrap ul.list li {
-   list-style:inside square;
-   padding:2px;
-}
-.body-wrap .description p {
-   margin:8px 3px !important;
-}
-.body-wrap .description h4{
-	color:#083772;
-   border-bottom:1px dashed #ccc;
-   margin:8px 0;
-   padding-bottom:3px;
-}
-.body-wrap, .body-wrap td, .body-wrap th {
-	font-size: 13px;
-}
-.body-wrap code {
-	font-family: "Lucida Console", "Courier New", Courier, monospace; 
-	font-size: 12px;
-}
-.body-wrap pre {
-	font-family: "Lucida Console", "Courier New", Courier, monospace; 
-	font-size: 12px;
-}
-.body-wrap th	{
-	text-align: left;
-	vertical-align:middle;
-    border-right:1px solid #d0d0d0;
-	border-top:1px solid #eee;
-	border-left:1px solid #eee;
-    background: #f9f9f9 url(images/default/grid/grid3-hrow.gif) repeat-x 0 top;
-	padding:3px;
-}
-.body-wrap .msource-header {
-    border-right: 0 none;
-}
-.body-wrap .top-tools{
-	font-size:11px;
-	text-align:right;
-}
-.body-wrap table {
-	background-color: white;
-}
 .body-wrap a {
-	color: #083772;
+    color: #083772;
 }
 .body-wrap a:link {
-	color: #083772;
-	text-decoration: none;
+    color: #083772;
+    text-decoration: none;
 }
-
 .body-wrap a:visited {
-   color: #1e4e8f;
-	text-decoration: none;
+    color: #1e4e8f;
+    text-decoration: none;
 }
-
 .body-wrap a:hover {
-	text-decoration: underline;
-	color: #0000CC;
+    text-decoration: underline;
+    color: #0000CC;
 }
-
 .body-wrap a:active {
-	text-decoration: none;
-	color: #1e4e8f;
+    text-decoration: none;
+    color: #1e4e8f;
 }
 
 /* Headings */
-.body-wrap h1, .body-wrap h2, .body-wrap h3, .body-wrap h4, .body-wrap h5, .body-wrap h6	{
-	font-family: "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
-	font-weight: bold;
-	margin:3px 300px 3px 0;
-	letter-spacing: 1px;
-	width: 90%;
-}
-
+.body-wrap h1,
+.body-wrap h2,
+.body-wrap h3,
+.body-wrap h4,
+.body-wrap h5,
+.body-wrap h6 {
+    font-family: "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
+    font-weight: bold;
+    margin: 3px 300px 3px 0;
+    letter-spacing: 1px;
+    width: 90%;
+}
+/* <h1> is used for class name */
 .body-wrap h1 {
-	font-size: 18px;
+    font-size: 18px;
 }
-
+/* <h2> is used for .member-table headings */
 .body-wrap h2 {
-	font-weight: bold;
-	font-size: 15px;
-	padding-top: 20px;
-	padding-bottom: 5px;
+    font-weight: bold;
+    font-size: 15px;
+    padding-top: 20px;
+    padding-bottom: 5px;
 }
-
+/* <h3> is used only by Ext.data.Connection */
 .body-wrap h3 {
-	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
-	font-weight: bold;
-	font-size: 16px;
+    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
+    font-weight: bold;
+    font-size: 16px;
 }
-
+/* <h4> is used only by Ext.DomQuery */
 .body-wrap h4 {
-	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
-	font-weight: bold;
-	font-size: 14px;
-}
-
+    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
+    font-weight: bold;
+    font-size: 14px;
+    color: #083772;
+    border-bottom: 1px dashed #ccc;
+    margin: 8px 0;
+    padding-bottom: 3px;
+}
+/* <h5> is never used */
 .body-wrap h5 {
-	font-size: 11px;
+    font-size: 11px;
 }
 
-.body-wrap .label {
-	font-weight: bold;
-    padding:3px 15px 3px 0;
-    color:#333;
-}
 
-.body-wrap .hd-info {
-	color:#333;
-    padding:3px;
-}
-.body-wrap .hd-info a {
-
-}
-.body-wrap .description{
-	margin: 10px 0px;
-}
-.body-wrap .member-table{
-	width:100%;
-	margin-bottom:10px;
-}
-.body-wrap .member-table td{
-	padding:4px;
-	vertical-align:top;
-	padding-right:15px;
-}
-.body-wrap .member-table td.sig {
-    padding-left:7px;
-}
-.body-wrap  .alt{
-	/*background:#f1f1f1;*/
-}
-.body-wrap .member-table td.micon{
-	width:16px;
-	padding:0px;
-    background: #f9f9f9 url(expand-bg.gif) repeat-y top right;
-    border-right:1px solid #d0d0d0;
-}
-.body-wrap .member-table td.micon a {
-    display:block;
-    height:1px;
-    width:1px;
-    overflow:hidden;
-    cursor:default;
-}
-.body-wrap .member-table .expandable td.micon a {
-    display:block;
-    width:98%;
-    height:30px;
-    text-decoration:none !important;
-    -moz-outline:none;
-    outline:none;
-}
-
-.body-wrap .member-table td.msource{
-	width:100px;
-}
-.mlink{
-	font-weight:bold;
-}
+/* Box containing tree of class parents */
+.body-wrap .inheritance {
+    margin-top: 20px;
+    float: right;
+    width: 210px;
+}
+    .body-wrap .inheritance pre {
+        text-align: left;
+        border: 0 none;
+        margin: 0;
+        font-size: 11px;
+        line-height: 18px !important;
+        background: transparent url(block-bottom.gif) no-repeat left bottom;
+        padding: 0 8px 5px !important;
+    }
+    .body-wrap .inheritance pre img {
+        vertical-align: middle;
+        margin-right: 3px;
+    }
 
-.member-table {
-    border:1px solid #d0d0d0;
+/* Class properties */
+.body-wrap .label {
+    font-weight: bold;
+    padding: 3px 15px 3px 0;
+    color: #333;
 }
-.member-table tr.inherited td.msource{
-	background-image: url(inherited.gif);
-	background-position:2px 4px;
-	background-repeat: no-repeat;
-    padding-left:18px;
+.body-wrap .hd-info {
+    color: #333;
+    padding: 3px;
 }
-.member-table .mdesc{
-	padding:5px 0;
-    color:#444;
+/* Class description */
+.body-wrap .description {
+    margin: 10px 0px;
 }
-.member-table td.micon,.member-table td.sig,.member-table td.msource{
-	border-top:1px solid #d0d0d0;
+.body-wrap .description p {
+    margin: 8px 3px !important;
 }
-.body-wrap .optional{
-	color:#444 !important;
+/* horizontal line after description */
+.body-wrap div.hr {
+    height: 1px;
+    background: #ccc;
+    margin: 5px 0;
+    overflow: hidden;
+    line-height: 1px;
 }
 
-.body-wrap pre {
-	background: #F8F8F8;
-	border: 1px dotted #ccc;
-	margin: 1em ;
-	margin-right: 0;
-	font-size: 12px;
-	line-height:14px;
-	padding:7px;
-	margin-left:0;
-}
-.detail-wrap{
 
+.body-wrap .member-table {
+    width: 100%;
+    margin-bottom: 10px;
+    border: 1px solid #d0d0d0;
+    background-color: white;
+}
+.body-wrap .member-table th {
+    text-align: left;
+    vertical-align: middle;
+    border-right: 1px solid #d0d0d0;
+    border-top: 1px solid #eee;
+    border-left: 1px solid #eee;
+    background: #f9f9f9 url(images/default/grid/grid3-hrow.gif) repeat-x 0 top;
+    padding: 3px;
 }
-.mdetail-head{
-	margin-top:10px;
-}
-.mdetail{
-	padding:7px;
-	border-top:1px dotted #ccc;
-}
-.mdetail h3{
-	margin: 5px 0px;
-	font-size:14px;
-	color:#083772;
-}
-.mdetail-desc{
-	margin:8px;
-}
-.mdetail-def{
-	font-style: italic;
-	font-size: 12px;
-	margin-top:10px;
-	margin-left:8px;
-	display:block;
+.body-wrap .member-table td {
+    padding: 4px;
+    vertical-align: top;
+    padding-right: 15px;
 }
-.sub-desc{
-	margin:5px;
-	margin-left:16px;
+.body-wrap .member-table td.micon,
+.body-wrap .member-table td.sig,
+.body-wrap .member-table td.msource {
+    border-top: 1px solid #d0d0d0;
 }
-.mdetail-params{
-	margin-top:10px;
+.body-wrap .member-table td.micon {
+    width: 16px;
+    padding: 0;
+    background: #f9f9f9 url(expand-bg.gif) repeat-y top right;
+    border-right: 1px solid #d0d0d0;
+}
+    .body-wrap .member-table td.micon a {
+        display: block;
+        height: 1px;
+        width: 1px;
+        overflow: hidden;
+        cursor: default;
+    }
+    .body-wrap .member-table .expandable td.micon a {
+        display: block;
+        width: 98%;
+        height: 30px;
+        text-decoration: none !important;
+        -moz-outline: none;
+        outline: none;
+        background: transparent url(member-collapsed.gif) no-repeat 5px 6px;
+        cursor: pointer;
+    }
+    .body-wrap .member-table .expandable td.micon:hover a {
+        background: transparent url(member-hover.gif) no-repeat 5px 6px;
+        cursor: pointer;
+    }
+    .body-wrap .member-table .expanded td.micon {
+        background: #f9f9f9 url(expand-bg-over.gif) repeat-y top right;
+    }
+    .body-wrap .member-table .expanded td.micon a {
+        background: transparent url(member-expanded.gif) no-repeat 5px 6px;
+        cursor: pointer;
+    }
+.body-wrap .member-table td.sig {
+    padding-left: 7px;
 }
-.mdetail-params strong{
-	display: block;
-	margin-bottom:3px;
-    font-size:11px;
-    font-weight:bold;
-    color:#555;
+    .body-wrap .member-table td.sig .mdesc {
+        padding: 5px 0;
+        color: #444;
+    }
+.body-wrap .msource-header {
+    border-right: 0 none;
 }
-
-.mdetail-params ul{
-	list-style: inside;
-	list-style-type: circle;
-	margin:12px;
-}
-.mdetail-params li{
-	list-style: inside;
-	list-style-type: circle;
-}
-pre code{
-	font-size:12px !important;
-    color:#000;
-    line-height:16px !important;
-}
-pre code b{
-    font-weight: normal;
-	color: #800080;
-}
-pre code em{
-    font-weight: normal;
-	color: #008080;
-    background-color:#eee;
-}
-pre code i,pre code i b,pre code i em{
-	font-weight: normal;
-	font-style: normal;
-	color: #999;
+.body-wrap .member-table td.msource {
+    width: 100px;
 }
+    .body-wrap .member-table tr.inherited td.msource {
+        background-image: url(inherited.gif);
+        background-position: 2px 4px;
+        background-repeat: no-repeat;
+        padding-left: 18px;
+    }
 
-.body-wrap .inheritance {
-    margin-top:20px;
-    float:right;
-    width:210px;
-}
-.body-wrap .inheritance pre {
-    text-align:left;
-    border: 0 none;
-	margin: 0;
-	font-size: 11px;
-	line-height:18px !important;
-    background:transparent url(block-bottom.gif) no-repeat left bottom;
-    padding:0 8px 5px!important;
+/* optional method parameters */
+.body-wrap .optional {
+    color: #444 !important;
 }
 
-.body-wrap .inheritance pre img {
-    vertical-align:middle;
-    margin-right:3px;
-}
+/* Used in ExtJS source for indentation */
+.body-wrap .sub-desc {
+    margin: 5px;
+    margin-left: 16px;
+}
+/* wraps method parameters descriptions */
+/* also used in ExtJS source for wrapping lists */
+.body-wrap .mdetail-params {
+    margin-top: 10px;
+    font-size: 12px;
+    padding-left: 12px;
+}
+    /* Header for parameters description */
+    .body-wrap .mdetail-params strong {
+        display: block;
+        margin-bottom: 3px;
+        font-size: 11px;
+        font-weight: bold;
+        color: #555;
+    }
+    .mdetail-params ul {
+        list-style: inside;
+        list-style-type: circle;
+        margin: 12px;
+    }
+    .mdetail-params li {
+        list-style: inside;
+        list-style-type: circle;
+    }
 
-.expandable .micon a {
-    background: transparent url(member-collapsed.gif) no-repeat 5px 6px;
-    cursor:pointer;
-}
-
-.expandable td.micon:hover a {
-    background: transparent url(member-hover.gif) no-repeat 5px 6px;
-    cursor:pointer;
-}
-.body-wrap .member-table .expanded td.micon{
-	background: #f9f9f9 url(expand-bg-over.gif) repeat-y top right;
-}
-.body-wrap .member-table .expanded td.micon a {
-    background: transparent url(member-expanded.gif) no-repeat 5px 6px;
-    cursor:pointer;
+.body-wrap pre,
+.body-wrap code {
+    font-family: "Lucida Console", "Courier New", Courier, monospace;
+    font-size: 12px;
 }
+.body-wrap pre {
+    background: #F8F8F8;
+    border: 1px dotted #ccc;
+    margin: 1em ;
+    margin-right: 0;
+    line-height: 14px;
+    padding: 7px;
+    margin-left: 0;
+}
+.body-wrap pre code {
+    font-size: 12px !important;
+    color: #000;
+    line-height: 16px !important;
+}
+    .body-wrap pre code b {
+        font-weight: normal;
+        color: #800080;
+    }
+    .body-wrap pre code em {
+        font-weight: normal;
+        color: #008080;
+        background-color:#eee;
+    }
+    .body-wrap pre code i,
+    .body-wrap pre code i b,
+    .body-wrap pre code i em {
+        font-weight: normal;
+        font-style: normal;
+        color: #999;
+    }
 
-.mdesc .long {
-    display:none;
-}
-.mdesc .long .mdetail-params {
-    font-size:12px;
-    padding-left:12px;
-}
-.expanded .mdesc .short {
-    display:none;
+/* Hide long descriptions initially */
+/* When "expanded" class set, hide short and show long */
+.body-wrap .mdesc .long {
+    display: none;
 }
-
-.expanded .mdesc .long {
+.body-wrap .expanded .mdesc .long {
     display: block;
+    line-height: 18px;
 }
-
-.full-details .expandable .micon a {
-    height:1px !important;
-    width:1px !important;
-    overflow:hidden;
-    cursor:default;
+.body-wrap .expanded .mdesc .short {
+    display: none;
 }
 
+/* "full-details" class is set above body-wrap element */
+/* when "Expand All Members" button clicked. */
+/* This will expand all long descriptions, */
+/* and completely hide small expand-arrows. */
 .full-details .mdesc .short {
-    display:none !important;
+    display: none !important;
 }
-
 .full-details .mdesc .long {
     display: block !important;
 }
-
-.full-details .body-wrap .member-table .expanded td.micon{
-	background: #f9f9f9 url(expand-bg.gif) repeat-y top right;
-}
-
-div.hr {
-    height:1px;
-    background:#ccc;
-    margin: 5px 0;
-    overflow:hidden;
-    line-height:1px;
+.full-details .expandable .micon a {
+    height: 1px !important;
+    width: 1px !important;
+    overflow: hidden;
+    cursor: default;
 }
-
-
-.expanded .mdesc .long {
-    line-height:18px;
+.full-details .body-wrap .member-table .expanded td.micon {
+    background: #f9f9f9 url(expand-bg.gif) repeat-y top right;
 }