html {height: 100%;margin-bottom: 1px;}
body {margin: 0;padding: 0;background: #000;color: #666;}
p {margin-top: 10px;margin-bottom: 15px;}
h1, h2, h3, h4, h4 {padding-bottom: 5px;margin: 15px 0 0 0;}
body {font-size: 13px}
h1 {font-size: 200%;}
h2 {font-size: 180%;}
h3 {color: #BD2E00;font-size: 150%;}
body#tutorials h3 {color: #5E9712;}
body#labs h3 {color: #999;}
body#drupal h3 {color: #056FA3;}
body#extensions h3 {color: #056FA3;}
body#magento h3 {color: #953894;}
body#phpbb3 h3 {color: #566D7F;}
h4 {font-size: 120%;color: #fff;}
.small, .modifydate, .createdate, div.mosimage_caption {font-size: 95%;}
body {line-height: 135%;font-family: Helvetica, Arial, sans-serif;}
.contentheading, .componentheading {font-weight: bold;}
a:link, a:visited {text-decoration: none;color: #c12c04;}
body#tutorials a:link, body#tutorials a:visited {color: #5E9712;}
body#labs a:link, body#labs a:visited {color: #999;}
body#drupal a:link, body#drupal a:visited {color: #056FA3;}
body#extensions a:link, body#extensions a:visited {color: #056FA3;}
body#phpbb3 a:link, body#phpbb3 a:visited {color: #566D7F;}
body#magento a:link, body#magento a:visited {color: #953894;}
a:hover {text-decoration: underline;}
div#showcase a:link, div#showcase a:visited, div#bottom a:link, div#bottom a:visited {color: #fff;}

/* @group Structure */

#component {position: relative;}
#astroboy {position: absolute;top: -50px;right: 0px;width: 190px;height: 240px;background: url(astroboy.png) 0 0 no-repeat;}
.wrapper {margin: 0 auto;width: 996px;}
#header .wrapper, #banner .wrapper, #navigation .wrapper {width: 970px;}
#banner .wrapper {position: relative;width: 960px;padding-top: 1px;}
#footer .wrapper {width: 900px;}
div#header {background: url(header-bg.png) 50% 0 repeat-x;height:  90px;}
#logo {background: url(logo-3.png) 0 0 no-repeat;float: left;width: 377px;height: 90px;margin-left: 6px;border: 0;}
body#tutorials #logo {background: url(logo-6.png) 0 0 no-repeat;}
body#labs #logo {background: url(logo-2.png) 0 0 no-repeat;}
body#drupal #logo {background: url(logo.png) 0 0 no-repeat;}
body#extensions #logo {background: url(logo-1.png) 0 0 no-repeat;}
body#phpbb3 #logo {background: url(logo-5.png) 0 0 no-repeat;}
body#magento #logo {background: url(logo-4.png) 0 0 no-repeat;}
#banner {background: #000 url(banner2.jpg) 50% -1px no-repeat;height: 212px;}

#navigation {background: #101010 url(tab-bg-5.png) 0 0 repeat-x;height: 47px;overflow: hidden;}
#navigation-sub {height: 37px;background: #C23C00 url(tab-bg-5.png) 0 -47px repeat-x;overflow: hidden;}
body#tutorials #navigation {background: #101010 url(tab-bg-6.png) 0 0 repeat-x;height: 47px;overflow: hidden;}
body#tutorials #navigation-sub {background: #5E9712 url(tab-bg-6.png) 0 -47px repeat-x;}
body#labs #navigation {background: #101010 url(tab-bg-2.png) 0 0 repeat-x;height: 47px;overflow: hidden;}
body#labs #navigation-sub {background: #767676 url(tab-bg-2.png) 0 -47px repeat-x;}
body#drupal #navigation {background: #101010 url(tab-bg.png) 0 0 repeat-x;height: 47px;overflow: hidden;}
body#extensions #navigation {background: #101010 url(tab-bg-1.png) 0 0 repeat-x;height: 47px;overflow: hidden;}
body#drupal #navigation-sub {background: #056FA3 url(tab-bg.png) 0 -47px repeat-x;}
body#extensions #navigation-sub {background: #056FA3 url(tab-bg-1.png) 0 -47px repeat-x;}
body#phpbb3 #navigation {background: #101010 url(tab-bg-4.png) 0 0 repeat-x;height: 47px;overflow: hidden;}
body#phpbb3 #navigation-sub {background: #566D7F url(tab-bg-4.png) 0 -47px repeat-x;}
body#magento #navigation {background: #101010 url(tab-bg-3.png) 0 0 repeat-x;height: 47px;overflow: hidden;}
body#magento #navigation-sub {background: #953894 url(tab-bg-3.png) 0 -47px repeat-x;}

.showcase-wrapper {width: 977px;margin: 0 auto;}
.showcase-module {background: url(showcase-mod-bg.png) 0 0 no-repeat;height: 325px;overflow: hidden;position: relative;}
.showcase-module .module {color: #fff;overflow: hidden;}
.showcase-module2 {color: #fff;overflow: hidden;margin: 0;}

#featured-showcase {background: #C43A00 url(showcase-bg.png) 0 0 repeat-x;height: 325px;}
#featured-showcase h2.module-title {background: none;position: absolute;top: 0;left: 475px;color: #fff;font-size: 140%;font-weight: normal;}
#featured-showcase h2.module-title span {color: #FF9F77;}

.main-content-bg {background: #fff;}
#content-area {background: #ECECEC;}

.shadow-top {background: url(body-bg-top.png) 50% 0 repeat-x;}
.shadow-1 {background: #ececec url(body-shadow-l.png) 0 0 repeat-y;}
.shadow-2 {background: url(body-shadow-r.png) 100% 0 repeat-y;}
.shadow-3 {background: url(body-shadow-tl.png) 0 0 no-repeat;}
.shadow-4 {background: url(body-shadow-tr.png) 100% 0 no-repeat;}

/* Template Scroller */

.template-scroller {width: 900px;height: 241px;background: url(template-scroller-bg.png) 0 0 no-repeat;margin-bottom: 15px;margin-top: 5px;position: relative;}
.template-scroller .date-options {position: absolute;top: 152px;width: 100%;text-align: center;height: 16px;}
.template-scroller .date {color: #fff !important;font-size: 110%;font-weight: bold;padding-left: 20px;padding-right: 26px;height: 16px;background: url(date-div.png) 100% 50% no-repeat;}
.template-scroller .date a {color: #fff !important;}
body#phpbb3 .date-options .first {background: none;}
.template-scroller .date.last {background: none;}
.template-scroller .date a.active {color: #000 !important;}
.template-scroller .scroller-wrapper {width: 735px;margin: 0 auto;}
.template-scroller .scroller-wrapper .spinner {background: transparent url(spinner.gif) no-repeat scroll center center;}
.template-scroller .scroller-listing {float: left;width: 25%;height: 140px;text-align: center;position: relative;}
.template-scroller .scroller-listing.last {margin-right: 0;}
.template-scroller .title {text-transform: uppercase;margin-top: -16px;font-size: 90%;}
.template-scroller .title a {color: #000 !important;}
.template-scroller .title a.active-thumb {background: url(active-thumb-l.png) left center no-repeat;height: 23px;padding: 5px 0 5px 5px;}
.template-scroller .title a.active-thumb span {background: url(active-thumb-r.png) right center no-repeat;height: 23px;padding: 5px 10px 5px 5px;color: #fff;}
.template-scroller .scroller-controls {position: absolute;top: 197px;left: 78px;width: 748px;}
.template-scroller .scrollbar {background: url(template-scroller-bar.png) 50% 0 repeat-x;width: 686px;height: 27px;margin: 0 auto;position: relative;}
.scrollbar-arrow-left {width: 30px;height: 27px;position: absolute;top: 0;left: 1px;background: url(template-scroller-arrow-l.png) 0 0 no-repeat;}
.scrollbar-arrow-right {width: 30px;height: 27px;position: absolute;top: 0;right: 1px;background: url(template-scroller-arrow-r.png) 0 0 no-repeat;}
.scrollbar-handle {width: 686px;height: 23px;position: absolute;top: 1px;left: 0;background: url(template-scroller-handle.png) 50% 0 no-repeat;}
.scrollbar-handle2 {height: 23px;background: url(template-scroller-handle-l.png) 0 0 no-repeat;}
.scrollbar-handle3 {height: 23px;background: url(template-scroller-handle-r.png) 100% 0 no-repeat;}

/* End Template Scroller */

.surround {margin: 0 32px;padding: 20px 15px 10px 15px;overflow: hidden;}
.padding {overflow: hidden;}
#inset {padding: 0;}
#inset p {margin: 0;padding: 0;}
#mainbody {width: 609px;float: left;}
#sidebar {margin-left: 624px;}
#mainbody .padding {padding: 0 15px;}
#mainbody p.buttonheading {float: left;}
#sidefoot {padding:15px;}

.block-bg {background: #fff;margin: 0 13px;height: 13px;}
.block-tr {background: url(corner-white-tr.png) 100% 0 no-repeat;margin-right: -13px;}
.block-tl {background: url(corner-white-tl.png) 0 0 no-repeat;height: 13px;margin-left: -13px;}
.block-br {background: url(corner-white-br.png) 100% 0 no-repeat;margin-right: -13px;}
.block-bl {background: url(corner-white-bl.png) 0 0 no-repeat;height: 13px;margin-left: -13px;}

#mainbody .spacer {background: #ECECEC;height: 15px;}
#footer .spacer {clear: both;height: 15px;}
#footer {background: #000 url(footer-bg.png) 0 0 repeat-x;}

#legal-footer .block-tr {background: url(corner-grey-tr.png) 100% 0 no-repeat;height: 13px;margin-right: 0;}
#legal-footer .block-tl {background: url(corner-grey-tl.png) 0 0 no-repeat;height: 13px;margin-left: 0;}
#legal-footer .block-br {background: url(corner-grey-br.png) 100% 0 no-repeat;height: 13px;margin-right: 0;}
#legal-footer .block-bl {background: url(corner-grey-bl.png) 0 0 no-repeat;height: 13px;margin-left: 0;}
#legal-footer {background: #0D0D0D;margin-bottom: 20px;}
#footer #legal-footer .module {padding: 0 15px;}   
#legal-footer a { color: #999;}
#footer .legal-padding div.module {padding: 0;}
#footer .legal-padding {margin-top: 25px;padding: 16px 0 5px 0;border-top: 1px solid #1B1B1B;position: relative;}
#footer .legal-padding p {padding: 0;margin: 0;color: #3D3D3D;}
#footer .legal-padding a {color: #666;}
.legal-block {margin: 0 auto;width: 500px;text-align: center;}

#sitemap .block-tr {background: url(corner-grey-tr.png) 100% 0 no-repeat;height: 13px;margin-right: 0;}
#sitemap .block-tl {background: url(corner-grey-tl.png) 0 0 no-repeat;height: 13px;margin-left: 0;}
#sitemap .block-br {background: url(corner-grey-br.png) 100% 0 no-repeat;height: 13px;margin-right: 0;}
#sitemap .block-bl {background: url(corner-grey-bl.png) 0 0 no-repeat;height: 13px;margin-left: 0;}
#sitemap {background: #0D0D0D;margin-bottom: 20px;}
#sitemap a, body#tutorials #sitemap a, body#labs #sitemap a, body#drupal #sitemap a, body#phpbb3 #sitemap a, body#magento #sitemap a, body#extensions #sitemap a {color: #888;}
#sitemap a:hover, #sitemap a.header:hover {color: #fff;text-decoration: none;}
#sitemap a.header, body#tutorials #sitemap a.header, body#labs #sitemap a.header, body#drupal #sitemap a.header, body#phpbb3 #sitemap a.header, body#magento #sitemap a.header, body#extensions #sitemap a.header {color: #ccc;font-weight: bold;font-size: 110%;}
#sitemap .column {margin-right: 60px;float: left;height: 150px;margin-top: 10px;font-size: 95%;line-height: 150%;}
#sitemap .row {margin-right: 60px;float: left;height: 50px;margin-top: 10px;font-size: 95%;line-height: 150%;}
#sitemap .column.last {margin-right: 0;}
#sitemap .row.last {margin-right: 0;}
#sitemap .bottom-feed {background: url(rss-icon.png) 0 0 no-repeat;padding-left: 22px;}
#sitemap .rss-feeds a:hover {text-decoration: none;color: #fff;}
#sitemap-mods .module {overflow: hidden;float: left;}

/* @group menus */

/* @group Horiz Menu */

#horiz-menu ul {margin: 0;padding: 0;padding-left: 20px;}
#horiz-menu li.active {background: url(tab-r-5.png) 100% 0 no-repeat;}
#horiz-menu li.active a {background: url(tab-l-5.png) 0 0 no-repeat;}
body#tutorials #horiz-menu li.active {background: url(tab-r-6.png) 100% 0 no-repeat;}
body#labs #horiz-menu li.active {background: url(tab-r-2.png) 100% 0 no-repeat;}
body#drupal #horiz-menu li.active {background: url(tab-r.png) 100% 0 no-repeat;}
body#extensions #horiz-menu li.active {background: url(tab-r-1.png) 100% 0 no-repeat;}
body#phpbb3 #horiz-menu li.active {background: url(tab-r-4.png) 100% 0 no-repeat;}
body#magento #horiz-menu li.active {background: url(tab-r-3.png) 100% 0 no-repeat;}
body#tutorials #horiz-menu li.active a {background: url(tab-l-6.png) 0 0 no-repeat;}
body#labs #horiz-menu li.active a {background: url(tab-l-2.png) 0 0 no-repeat;}
body#drupal #horiz-menu li.active a {background: url(tab-l.png) 0 0 no-repeat;}
body#extensions #horiz-menu li.active a {background: url(tab-l-1.png) 0 0 no-repeat;}
body#phpbb3 #horiz-menu li.active a {background: url(tab-l-4.png) 0 0 no-repeat;}
body#magento #horiz-menu li.active a {background: url(tab-l-3.png) 0 0 no-repeat;}

#horiz-menu li.active a, #horiz-menu li.active a:hover, body#tutorials #horiz-menu li.active a,
body#tutorials #horiz-menu li.active a:hover, body#drupal #horiz-menu li.active a, body#drupal #horiz-menu li.active a:hover, body#extensions #horiz-menu li.active a, body#extensions #horiz-menu li.active a:hover, body#phpbb3 #horiz-menu li.active a, body#phpbb3 #horiz-menu li.active a:hover, body#magento #horiz-menu li.active a, body#magento #horiz-menu li.active a:hover, body#labs #horiz-menu li.active a, body#labs #horiz-menu li.active a:hover {color: #fff;}
#horiz-menu li {margin: 0;padding: 0;padding-right: 2px;float: left;list-style: none;position: relative;background: url(tab-div.png) 100% 0 no-repeat;}
div#horiz-menu a, body#tutorials #horiz-menu a, body#labs #horiz-menu a, body#drupal #horiz-menu a, body#extensions #horiz-menu a, body#phpbb3 #horiz-menu a, body#magento #horiz-menu a {display: block;float: left;padding: 0 15px;height: 50px;line-height: 45px;text-decoration: none;color: #ccc;font-size: 130%;font-weight: normal;border-bottom:  0;font-family: Arial Narrow, Helvetica, sans-serif;}
div#horiz-menu a:hover, body#tutorials #horiz-menu a:hover, body#labs #horiz-menu a:hover, body#drupal #horiz-menu a:hover, body#extensions #horiz-menu a:hover, body#phpbb3 #horiz-menu a:hover, body#magento #horiz-menu a:hover {color: #fff;}
#horiz-menu li.active.item184 a, body#tutorials #horiz-menu li.active.item184 a, body#labs #horiz-menu li.active.item184 a, body#drupal #horiz-menu li.active.item184 a, body#extensions #horiz-menu li.active.item184 a, body#phpbb3 #horiz-menu li.active.item184 a, body#magento #horiz-menu li.active.item184 a, #horiz-menu li.active.item184 a:hover, #horiz-menu li.active.item202 a, body#tutorials #horiz-menu li.active.item202 a, body#labs #horiz-menu li.active.item202 a, body#drupal #horiz-menu li.active.item202 a, body#extensions #horiz-menu li.active.item202 a, body#phpbb3 #horiz-menu li.active.item202 a, body#magento #horiz-menu li.active.item202 a, #horiz-menu li.active.item202 a:hover {color: #fff;}
#horiz-menu li.item184 a, #horiz-menu li.item184 a:hover, #horiz-menu li.item202 a, #horiz-menu li.item202 a:hover {color: #FF6311;}
body#tutorials #horiz-menu li.item184 a, body#tutorials #horiz-menu li.item184 a:hover, body#tutorials #horiz-menu li.item202 a, body#tutorials #horiz-menu li.item202 a:hover {color: #94C000;}
body#labs #horiz-menu li.item184 a, body#labs #horiz-menu li.item184 a:hover, body#labs #horiz-menu li.item202 a, body#labs #horiz-menu li.item202 a:hover {color: #999;}
body#drupal #horiz-menu li.item184 a, body#drupal #horiz-menu li.item184 a:hover, body#drupal #horiz-menu li.item202 a, body#drupal #horiz-menu li.item202 a:hover {color: #23AFE5;}
body#extensions #horiz-menu li.item184 a, body#extensions #horiz-menu li.item184 a:hover, body#extensions #horiz-menu li.item202 a, body#extensions #horiz-menu li.item202 a:hover {color: #23AFE5;}
body#phpbb3 #horiz-menu li.item184 a, body#phpbb3 #horiz-menu li.item184 a:hover, body#phpbb3 #horiz-menu li.item202 a, body#phpbb3 #horiz-menu li.item202 a:hover {color: #6FA0BF;}
body#magento #horiz-menu li.item184 a, body#magento #horiz-menu li.item184 a:hover, body#magento #horiz-menu li.item202 a, body#magento #horiz-menu li.item202 a:hover {color: #BC45B9;}

/* @end */

/* @group Sub Menu */

#horiz-subnav {clear: both;height: 34px;padding-top: 5px;}
#horiz-subnav ul {margin: 0;padding: 0;padding-left: 35px;}
#horiz-subnav ul li {position: relative;list-style: none;float: left;margin: 0;padding: 0;margin-bottom: 5px;margin-left: 0px;background: url(submenu-div-5.png) 100% 0 no-repeat;}

body#tutorials #horiz-subnav ul li {background: url(submenu-div-6.png) 100% 0 no-repeat;}
body#labs #horiz-subnav ul li {background: url(submenu-div-2.png) 100% 0 no-repeat;}
body#drupal #horiz-subnav ul li {background: url(submenu-div.png) 100% 0 no-repeat;}
body#extensions #horiz-subnav ul li {background: url(submenu-div-1.png) 100% 0 no-repeat;}
body#phpbb3 #horiz-subnav ul li {background: url(submenu-div-4.png) 100% 0 no-repeat;}
body#magento #horiz-subnav ul li {background: url(submenu-div-3.png) 100% 0 no-repeat;}
#horiz-subnav li.active a {color:  #fff;background: url(submenu-active-5.png) 50% 100% no-repeat;height: 29px;}
body#tutorials #horiz-subnav li.active a {background: url(submenu-active-6.png) 50% 100% no-repeat;height: 29px;}
body#labs #horiz-subnav li.active a {background: url(submenu-active-2.png) 50% 100% no-repeat;height: 29px;}
body#drupal #horiz-subnav li.active a {background: url(submenu-active.png) 50% 100% no-repeat;height: 29px;}
body#extensions #horiz-subnav li.active a {background: url(submenu-active-1.png) 50% 100% no-repeat;height: 29px;}
body#phpbb3 #horiz-subnav li.active a {background: url(submenu-active-4.png) 50% 100% no-repeat;height: 29px;}
body#magento #horiz-subnav li.active a {background: url(submenu-active-3.png) 50% 100% no-repeat;height: 29px;}
#horiz-subnav ul a, body#tutorials #horiz-subnav ul a, body#drupal #horiz-subnav ul a, body#extensions #horiz-subnav ul a, body#phpbb3 #horiz-subnav ul a, body#magento #horiz-subnav ul a, body#labs #horiz-subnav ul a {display: block;float: left;padding: 0 13px;height: 25px;line-height: 22px;font-weight: normal;text-decoration: none;color: #ddd;font-size: 115%;border-bottom: 0;font-family: Arial Narrow, Helvetica, sans-serif;}
#horiz-subnav a:hover, body#tutorials #horiz-subnav a:hover, body#drupal #horiz-subnav a:hover, body#extensions #horiz-subnav a:hover, body#phpbb3 #horiz-subnav a:hover, body#magento #horiz-subnav a:hover, body#labs #horiz-subnav a:hover {color: #fff;}

/* @end */

/* @end */

/* @group content */

pre {padding: 10px;}
code {color: #0052ca;}

ul li {margin-bottom: 5px;list-style: square;}
blockquote {width: auto;padding: 10px 10px 10px 80px;margin: 15px 0;}
form {border: 0;margin: 0;padding: 0;}
#sidebar form {width: 275px;}
.highlight {background-color: #ffc;}

/* @end */

/* @end */

/* @group Joomla Core */

/* @group modules */

#sidebar .module, #sidebar .module-blog {margin-bottom: 30px;}
#sidebar h2.module-title {background: url(title-rocket-bg-5.png) 0 100% no-repeat;margin: 0;padding: 0;margin-top: 0;height: 33px;line-height: 25px;font-size: 120%;padding-left: 47px;}
body#tutorials #sidebar h2.module-title {background: url(title-rocket-bg-6.png) 0 100% no-repeat;}
body#labs #sidebar h2.module-title {background: url(title-rocket-bg-2.png) 0 100% no-repeat;}
body#drupal #sidebar h2.module-title {background: url(title-rocket-bg.png) 0 100% no-repeat;}
body#extensions #sidebar h2.module-title {background: url(title-rocket-bg-1.png) 0 100% no-repeat;}
body#phpbb3 #sidebar h2.module-title {background: url(title-rocket-bg-4.png) 0 100% no-repeat;}
body#magento #sidebar h2.module-title {background: url(title-rocket-bg-3.png) 0 100% no-repeat;}
h2.module-title, body#tutorials #sidebar h2.module-title, body#labs #sidebar h2.module-title, body#drupal #sidebar h2.module-title, body#extensions #sidebar h2.module-title, body#phpbb3 #sidebar h2.module-title, body#magento #sidebar h2.module-title {color: #333;}
h2.module-title span {color: #C43A00;}

body#tutorials h2.module-title span {color: #5E9712;}
body#labs h2.module-title span {color: #999;}
body#drupal h2.module-title span {color: #056FA3;}
body#extensions h2.module-title span {color: #056FA3;}
body#phpbb3 h2.module-title span {color: #566D7F;}
body#magento h2.module-title span {color: #953894;}

#sidebar div.module, #sidebar div.module-blog {overflow: hidden;padding: 5px 15px;}
#sidebar .latest-div {overflow: hidden;height: 1px;border: 0;background: #ececec;margin-top: 8px;}
#sidebar .main-content-bg div.element {height:0;overflow:hidden;}
#sidebar h4 {color: #666;font-size: 110%;padding: 0;margin: 8px 0 0 0;}

.footer-mod {float: left;width: 33%;}
#footer .module {padding:  40px 15px 15px 15px;color: #bbb;}
#footer h2 {background: url(rocket-black-5.png) 1px 100% no-repeat;height:  32px;color: #fff;font-size: 120%;line-height: 27px;margin: 0;padding: 0;padding-left: 35px;margin-bottom: 15px;}
body#tutorials #footer h2 {background: url(rocket-black-6.png) 1px 100% no-repeat;color: #fff;}
body#labs #footer h2 {background: url(rocket-black-2.png) 1px 100% no-repeat;color: #fff;}
body#drupal #footer h2 {background: url(rocket-black.png) 1px 100% no-repeat;color: #fff;}
body#extensions #footer h2 {background: url(rocket-black-1.png) 1px 100% no-repeat;color: #fff;}
body#phpbb3 #footer h2 {background: url(rocket-black-4.png) 1px 100% no-repeat;color: #fff;}
body#magento #footer h2 {background: url(rocket-black-3.png) 1px 100% no-repeat;color: #fff;}
#footer h2 span {color: #E05700;}
body#tutorials #footer h2 span {color: #94C000;}
body#labs #footer h2 span {color: #999;}
body#drupal #footer h2 span {color: #23AFE5;}
body#extensions #footer h2 span {color: #23AFE5;}
body#phpbb3 #footer h2 span {color: #6FA0BF;}
body#magento #footer h2 span {color: #BC45B9;}
#footer #sitemap .module {padding-top: 0;}
.sitemap-left {float: left;width: 600px;}
.sitemap-right {float: right;}
ul.sitemap {margin: 10px 0 0 0;padding: 0;}
ul.sitemap li {margin: 0;padding: 0 0 2px 12px;background: url(sitemap-bullet.png) 0 7px no-repeat;list-style: none;}

/* @end */

/* @group content */

#pathway {margin-top: 5px;margin-bottom: 15px;padding-left: 5px;}
#pathway b {padding-right: 10px;}
span.pathway {line-height: 20px;}
span.pathway img {margin: 0 5px;vertical-align: middle;}
.clr {clear: both;}
.test {height: 200px;}

a.readon, body#tutorials a.readon, body#labs a.readon, body#drupal a.readon, body#extensions a.readon, body#phpbb3 a.readon, body#magento a.readon {display: block;margin-top: 15px;font-weight: bold;color: #333;font-size: 11px;cursor: pointer;}
a.readon span {color: #C43A00;}
body#tutorials a.readon span {color: #5E9712;}
body#labs a.readon span {color: #999;}
body#drupal a.readon span {color: #056FA3;}
body#extensions a.readon span {color: #056FA3;}
body#phpbb3 a.readon span {color: #566D7F;}
body#magento a.readon span {color: #953894;}
#footer a.readon, body#tutorials #footer a.readon, body#labs #footer a.readon, body#drupal #footer a.readon, body#extensions #footer a.readon, body#phpbb3 #footer a.readon, body#magento #footer a.readon {display: block;margin-top: 15px;font-weight: bold;color: #999;font-size: 11px;cursor: pointer;}
#footer a.readon span, #footer .gopro a {color: #FF640E;}
body#tutorials #footer a.readon span, body#tutorials #footer .gopro a {color: #94C000;}
body#labs #footer a.readon span, body#labs #footer .gopro a {color: #999;}
body#drupal #footer a.readon span, body#drupal #footer .gopro a {color: #23AFE5;}
body#extensions #footer a.readon span, body#extensions #footer .gopro a {color: #23AFE5;}
body#phpbb3 #footer a.readon span, body#phpbb3 #footer .gopro a {color: #6FA0BF;}
body#magento #footer a.readon span, body#magento #footer .gopro a {color: #BC45B9;}

#mainbody h1, div.componentheading {background: url(rocket-white-5.png) 0 100% no-repeat;height:  32px;color: #333;font-size: 120%;line-height: 27px;margin: 0;padding: 0;padding-left: 35px;margin-bottom: 15px;display: block;position: relative;}
body#labs #mainbody h1, body#labs div.componentheading {background: url(rocket-white-2.png) 0 100% no-repeat;}
body#drupal #mainbody h1, body#drupal div.componentheading {background: url(rocket-white.png) 0 100% no-repeat;}
body#extensions #mainbody h1, body#extensions div.componentheading {background: url(rocket-white-1.png) 0 100% no-repeat;}
body#phpbb3 #mainbody h1, body#phpbb3 div.componentheading {background: url(rocket-white-4.png) 0 100% no-repeat;}
body#magento #mainbody h1, body#magento div.componentheading {background: url(rocket-white-3.png) 0 100% no-repeat;}
body#tutorials #mainbody h1, body#tutorials div.componentheading {background: url(rocket-white-6.png) 0 100% no-repeat;}
#mainbody h1 {margin-right: 50px;}
#mainbody h1 a {color: #333;}
#mainbody h1 a:hover {text-decoration: none;}
#mainbody h1 span {color: #C43A00;}
body#labs #mainbody h1 span {color: #999;}
body#drupal #mainbody h1 span {color: #056FA3;}
body#extensions #mainbody h1 span {color: #056FA3;}
body#extensions #mainbody h1, body#extensions #mainbody h1 a {color: #333;}
body#phpbb3 #mainbody h1, body#phpbb3 #mainbody h1 a {color: #333;}
body#phpbb3 #mainbody h1 span {color: #566D7F;}
body#magento #mainbody h1 span {color: #953894;}

/* @group Tutorial Section Stuff */

#mainbody .club-templates h1 {background: none;height:  28px;color: #333;font-size: 120%;line-height: 27px;margin: 25px 0 0px 0;padding: 0 0 0 15px;border-bottom: 1px solid #F3F3F3;}
#mainbody .club-templates h1 span {color: #C43A00;}
body#tutorials #mainbody h1, body#tutorials #mainbody h1 a {color: #333;}
body#tutorials #mainbody h1 span {color: #5E9712;}
body#tutorials #mainbody h2 {color: #5E9712;font-size: 120%;line-height: 26px;padding-left: 10px;}
body#tutorials #mainbody h2 .see-all {background: url(see-all-arrow.png) no-repeat 0 6px;position: absolute;right: 15px;padding-left: 13px;font-size: 90%;}
.see-all a {color: #5E9712;}
body#tutorials .written-j15 {background: url(tut-written-j15.png) 0 0;display: block;width: 289px;height: 78px;float: left;overflow: hidden;margin-top: 25px;}
body#tutorials .written-j10 {background: url(tut-written-j10.png) 0 0;display: block;width: 289px;height: 78px;float: left;overflow: hidden;margin-top: 25px;}
body#tutorials .written-j10j15 {background: url(tut-written-j10j15.png) 0 0;display: block;width: 289px;height: 78px;float: left;overflow: hidden;margin-top: 25px;}
body#tutorials .written-content {padding: 3px 20px 15px 65px;}
body#tutorials .written-content .header, body#tutorials .categories .header {font-size: 110%;font-weight: bold;}
.club-templates .categories .header {font-size: 130%;display: block;font-weight: bold;}
.club-templates .categories .month {display: block;padding-top: 3px;}
body#tutorials .written-content p, body#tutorials .categories p {font-size: 85%;}
body#tutorials a {color: #5E9712;}
body#tutorials a.readon {display: block;margin-top: 15px;font-weight: bold;color: #333;font-size: 11px;cursor: pointer;}
body#tutorials a.readon span {color: #5E9712;}
body#tutorials .categories {background: url(see-all-arrow.png) no-repeat 10px 2px;float: left;width: 288px;margin-top: 25px;overflow: hidden;}

.club-templates .categories {float: left;width: 288px;margin-top: 25px;overflow: hidden;height: 65px;}
body#tutorials .categories-content {padding: 0 15px 0 25px;}
.club-templates .categories-content {padding: 13px 15px 0 0;}
.club-templates img.listing {float: left;margin-right: 10px;border: 0;}
body#tutorials .video-listing {background: url(vid-icon.png) no-repeat 0 0;float: left;width: 190px;margin-top: 15px;overflow: hidden;}
body#tutorials .written-listing {background: url(write-icon.png) no-repeat 0 0;float: left;width: 190px;margin-top: 15px;overflow: hidden;}
body#tutorials .video-listing .content, body#tutorials .written-listing .content {padding: 0 18px 0 20px;}
body#tutorials .video-listing .desc, body#tutorials .written-listing .desc {font-size: 85%;}
body#tutorials .footer-mod a {color: #94C000;}
body#tutorials .joomla-logo, body#labs .joomla-logo {background: url(joomla-logo.png) 0 0 no-repeat;width: 116px;height: 23px;position: absolute;margin: 0;top: 0;right: 0;}
#comp-rokclub .joomla-logo, #comp-rokclub .devjoomla-logo {background: url(joomla-logo.png) 0 0 no-repeat;width: 116px;height: 23px;position: absolute;top: 8px;right: 10px;}
body#tutorials .phpbb3-logo {background: url(phpbb3-logo.png) 0 0 no-repeat;width: 73px;height: 24px;position: absolute;margin: 0;top: 0;right: 0;}
#comp-rokclub .phpbb3-logo, #comp-rokclub .devphpbb3-logo {background: url(phpbb3-logo.png) 0 0 no-repeat;width: 73px;height: 24px;position: absolute;top: 8px;right: 10px;}

body#joomla .club-logo {width: 116px;height: 23px;position: absolute;top: 0;right: 0;background: url(joomla-logo.png) 0 0 no-repeat;}
body#phpbb3 .club-logo {width: 73px;height: 24px;position: absolute;top: 0;right: 0;background: url(phpbb3-logo.png) 0 0 no-repeat;}

body#joomla #mainbody h2 .see-all, body#extensions #mainbody h2 .see-all {background: url(see-all-arrow.png) no-repeat 0 6px;position: absolute;right: 15px;padding-left: 13px;font-size: 70%;}
body#joomla #mainbody h2 .see-all a {color: #C43A00;}
body#phpbb3 #mainbody h2 .see-all {background: url(see-all-arrow.png) no-repeat 0 6px;position: absolute;right: 15px;padding-left: 13px;font-size: 70%;}
body#phpbb3 #mainbody h2 .see-all a {color: #566D7F;}

/* @end */

div.template {overflow: hidden;margin-bottom: 15px;position: relative;}
div.template.column1 {width: 54%;float: left;}
div.template.column2 {width: 46%;float: left;}
div.template.column1 div {padding-right: 45px;background: url(white-divider.png) 100% 0 no-repeat;}
div.template img {float: left;margin-right: 15px;}
div.template h2 img {margin-right: 10px;}
div.single img {width: 281px;height: 263px;}
div.column1 img, div.column2 img {width: 117px;height: 139px;}

div.single ul {float: right;width: 280px;margin: 0;padding: 2px 0 0 0;}
div.column1 ul, div.column2 ul {margin: 0;padding: 0;}
div.template li {margin: 0;list-style: none;background: url(feature-r.png) 100% 0 no-repeat;margin-bottom: 2px;padding-right: 10px;}
div.template li span {display: block;background: url(feature-l.png) 0 0 no-repeat;font-size: 11px;color: #333;height: 20px;line-height: 20px;padding-left: 25px;}

h2 {display: block;background: url(title-bg.png) 0 0 repeat-x;height: 30px;line-height: 25px;color: #C43A00;font-size: 150%;padding-left: 5px;position: relative;}
.club-templates h2 span {color: #666;}
body#tutorials h2 {color: #5E9712;}
body#labs h2 {color: #999;}
body#drupal h2 {color: #056FA3;}
body#extensions h2 {color: #056FA3;}
body#phpbb3 h2 {color: #566D7F;}
body#magento h2 {color: #953894;}

div.template h2 .date {position: absolute;top: 1px;padding-left: 15px;color: #999;font-size: 12px;}
div.template a.button {width: 85px;height: 38px;display: block;float: right;margin-top: 15px;}
div.template a.button:hover {text-decoration: none;}
div.template a.button span {visibility: hidden;}
div.template a.demo {background: url(button-demo.png) 0 0 no-repeat;}
div.template a.download {background: url(button-download.png) 0 0 no-repeat;}
div.template a.details {background: url(button-details.png) 0 0 no-repeat;}
div.template a.forums {background: url(button-forums.png) 0 0 no-repeat;}
body#tutorials div.template a.demo {background: url(button-demo-5.png) 0 0 no-repeat;}
body#tutorials div.template a.download {background: url(button-download-5.png) 0 0 no-repeat;}
body#tutorials div.template a.details {background: url(button-details-5.png) 0 0 no-repeat;}
body#tutorials div.template a.forums {background: url(button-forums-5.png) 0 0 no-repeat;}
body#labs div.template a.demo {background: url(button-demo-3.png) 0 0 no-repeat;}
body#labs div.template a.download {background: url(button-download-3.png) 0 0 no-repeat;}
body#labs div.template a.details {background: url(button-details-3.png) 0 0 no-repeat;}
body#labs div.template a.forums {background: url(button-forums-3.png) 0 0 no-repeat;}
body#drupal div.template a.demo {background: url(button-demo-1.png) 0 0 no-repeat;}
body#drupal div.template a.download {background: url(button-download-1.png) 0 0 no-repeat;}
body#drupal div.template a.details {background: url(button-details-1.png) 0 0 no-repeat;}
body#drupal div.template a.forums {background: url(button-forums-1.png) 0 0 no-repeat;}
body#extensions div.template a.demo {background: url(button-demo-2.png) 0 0 no-repeat;}
body#extensions div.template a.download {background: url(button-download-2.png) 0 0 no-repeat;}
body#extensions div.template a.details {background: url(button-details-2.png) 0 0 no-repeat;}
body#extensions div.template a.forums {background: url(button-forums-2.png) 0 0 no-repeat;}
body#phpbb3 div.template a.demo {background: url(button-demo-4.png) 0 0 no-repeat;}
body#phpbb3 div.template a.download {background: url(button-download-4.png) 0 0 no-repeat;}
body#phpbb3 div.template a.details {background: url(button-details-4.png) 0 0 no-repeat;}
body#phpbb3 div.template a.forums {background: url(button-forums-4.png) 0 0 no-repeat;}
body#magento div.template a.demo {background: url(button-demo-3.png) 0 0 no-repeat;}
body#magento div.template a.download {background: url(button-download-3.png) 0 0 no-repeat;}
body#magento div.template a.details {background: url(button-details-3.png) 0 0 no-repeat;}
body#magento div.template a.forums {background: url(button-forums-3.png) 0 0 no-repeat;}

div.details.columnleft {width: 46%;float: left;margin-right: 25px;height: 225px;}
div.details.columnright {width: 48%;float: left;}
.details-installation ul {padding-left: 15px;}
.details-installation ul li {background: url(see-all-arrow.png) no-repeat 0 2px;padding-left: 15px;}
ul.menu-sidemenu {padding-left: 15px;margin-bottom: 0;}

ul.menu-sidemenu li {list-style: none;font-size: 110%;margin-bottom: 6px;padding-bottom: 6px;border-bottom: 1px solid #ececec;}
ul.menu-sidemenu li a:hover, body#tutorials ul.menu-sidemenu li a:hover, body#labs ul.menu-sidemenu li a:hover, body#drupal ul.menu-sidemenu li a:hover, body#extensions ul.menu-sidemenu li a:hover, body#phpbb3 ul.menu-sidemenu li a:hover, body#magento ul.menu-sidemenu li a:hover {text-decoration: none;color: #333;}
ul.menu-sidemenu li.active a, body#tutorials ul.menu-sidemenu li.active a, body#labs ul.menu-sidemenu li.active a, body#drupal ul.menu-sidemenu li.active a, body#extensions ul.menu-sidemenu li.active a, body#phpbb3 ul.menu-sidemenu li.active a, body#magento ul.menu-sidemenu li.active a {color: #333;}
.dontshow { display: none; }
#page .contentpaneopen_edit span.hasTip {display: none;}

div.error {background: #FCE7E7 url(alert-tl.png) 0 0 no-repeat;padding: 0;margin: 20px 0;color: #c00;font-weight: bold;}
div.error .c2 {background: url(alert-tr.png) 100% 0 no-repeat;}
div.error .c3 {background: url(alert-bl.png) 0 100% no-repeat;}
div.error .c4 {background: url(alert-br.png) 100% 100% no-repeat;padding: 12px;}
div.error span {background: url(alert-icon.png) 0 1px no-repeat;padding-left: 25px;display: block;}
div.error a {color: #c00;}

div.notice, div.message {background: #E9EFFC url(notice-tl.png) 0 0 no-repeat;padding: 0;margin: 20px 0;color: #005CAF;font-weight: bold;}
div.notice .c2, div.message .c2 {background: url(notice-tr.png) 100% 0 no-repeat;}
div.notice .c3, div.message .c3 {background: url(notice-bl.png) 0 100% no-repeat;}
div.notice .c4, div.message .c4 {background: url(notice-br.png) 100% 100% no-repeat;padding: 12px;}
div.notice span, div.message span {background: url(notice-icon.png) 0 1px no-repeat;padding-left: 25px;display: block;}
div.notice a, div.message a {color: #005CAF;}

div.description, div.warn {background: #F5F3D9 url(desc-tl.png) 0 0 no-repeat;padding: 0;margin: 20px 0;color: #73621C;font-weight: bold;}
div.description .c2, div.warn .c2 {background: url(desc-tr.png) 100% 0 no-repeat;}
div.description .c3, div.warn .c3 {background: url(desc-bl.png) 0 100% no-repeat;}
div.description .c4, div.warn .c4 {background: url(desc-br.png) 100% 100% no-repeat;padding: 12px;}
div.description span, div.warn span {background: url(desc-icon.png) 0 1px no-repeat;padding-left: 25px;display: block;}
div.description a, div.warn a {color: #73621C;}
div.warn.mod, div.error.mod, div.notice.mod, div.message.mod, div.description.mod {margin: 0;}

.club-block div.error {background-image: url(alert2-tl.png);}
.club-block div.error .c2 {background-image: url(alert2-tr.png);}
.club-block div.error .c3 {background-image: url(alert2-bl.png);}
.club-block div.error .c4 {background-image: url(alert2-br.png);}
.club-block div.notice, div.message {background-image: url(notice2-tl.png);}
.club-block div.notice .c2, div.message .c2 {background-image: url(notice2-tr.png);}
.club-block div.notice .c3, div.message .c3 {background-image: url(notice2-bl.png);}
.club-block div.notice .c4, div.message .c4 {background-image: url(notice2-br.png);}
.club-block div.description, div.warn {background-image: url(desc-tl.png);}
.club-block div.description .c2, div.warn .c2 {background-image: url(desc-tr.png);}
.club-block div.description .c3, div.warn .c3 {background-image: url(desc-bl.png);}
.club-block div.description .c4, div.warn .c4 {background-image: url(desc-br.png);}

img#joomla-badge {width: 100px;height: 17px;background: url(joomla-badge.png) 0 0 no-repeat;position: absolute;top: 23px;left: 20px;border: 0;}
img#moo-badge {width: 100px;height: 17px;background: url(moo-badge.png) 0 0 no-repeat;position: absolute;top: 23px;left: 125px;border: 0;}

img#xhtml-badge {width: 100px;height: 17px;background: url(xhtml-badge.png) 0 0 no-repeat;position: absolute;top: 23px;right: 125px;border: 0;}
img#css-badge {width: 100px;height: 17px;background: url(css-badge.png) 0 0 no-repeat;position: absolute;top: 23px;right: 20px;border: 0;}

/* Pagination */

div.pagination {height: 21px;line-height: 21px;margin-top: 10px;}
div.pagination div.tab {background: url(page-tab-r.png) 100% 0 no-repeat;float: left;margin-right: 6px;}
div.pagination div.tab2 {background: url(page-tab-l.png) 0 0 no-repeat;padding: 0 8px;}
div.pagination div.page-block {padding: 0 4px;float: left;margin-right: 6px;}

.module-allupdates {margin-top: -30px;margin-bottom: 15px;}
.module-allupdates ul.menu-sidemenu {margin-right: 15px;}
.module-allupdates ul.menu-sidemenu li {padding-bottom: 10px;}

.front-break {height: 58px;background: url(front-break.png) 0 0 no-repeat;margin-left: -15px;margin-right: -15px;position: relative;}
.front-break2 {height: 45px;background: url(front-break2.png) 50% 0 no-repeat;margin-left: -15px;margin-right: -15px;}
ul.front-page li {background: url(front-list.png) 0 5px no-repeat;padding-left: 20px;padding-bottom: 2px;font-weight: bold;font-size: 90%;}
#mainbody span.front-joomla-color, #mainbody span.front-phpbb3-color {background: none;margin: 0;padding: 0;display: inline;font-style: normal;font-size: inherit;}
body#home span.front-joomla-color {color: #C43A00;}
body#home span.front-phpbb3-color {color: #566D7F;}
.sidecol-bottom {height: 28px;background: url(sidecol-bottom.png) 50% 0 no-repeat;}
.maincol-bottom {height: 28px;background: url(maincol-bottom.png) 50% 0 no-repeat;}
.phpbb3-block-surround {position: relative;}
a.what-joomla {position: absolute;top: 4px;left: 240px;color: #999;text-decoration: none;display: block;font-style: italic;}
a.what-phpbb3 {position: absolute;top: 4px;left: 206px;color: #999;text-decoration: none;display: block;font-style: italic;}
a.what-joomla:hover, a.what-phpbb3:hover {color: #666;}

/* Extensions */

div.column1 img.icon, div.column2 img.icon {width: auto;height: auto;float: none;margin-right: 0;}
body#extensions .ext-mainimg {float: left;margin-right: 20px;width: 100px;height: 100px;background: none;padding: 0;margin-bottom: 30px;}
div.single img.icon-show, div.single img.icon-show2 {width: auto;height: auto;margin-bottom: 20px;margin-top: 5px;margin-right: 25px;}
div.single img.icon-show2 {margin-bottom: 0;float: none;}
div.single ul.list-left {float: left;width: 175px;margin-right: 10px;}
div.single ul.list-right {width: 175px;float: left;}
body#extensions div.template a.button {float: left;}
body#extensions .showcase-container {float: left;width: 190px;}
body#extensions .ext-divider {background-position: 100% 7px;padding-bottom: 15px;}
body#extensions .column2 div {padding-bottom: 15px;}
body#extensions .ext-version {font-size: 12px;color: #666;position: absolute;top: 0;right: 10px;font-weight: normal;}
body#extensions .ext-version span {font-weight: bold;font-size: 14px;color: #666;}

body#extensions .extensions-intro {display: block;font-weight: bold;color: #056FA3;font-size: 120%;margin-bottom: 15px;}
body#extensions .info-indent {width: 95px;height: 25px;float: left;background: url(inset2.png) 0 0 no-repeat;padding: 2px 0;font-size: 80%;font-weight: bold;margin-left: 5px;margin-top: 5px;text-align: center;color: #999;}
body#extensions .info-indent span {font-size: 110%;color: #666;}
body#extensions ul.front-page {padding-left: 15px;}
body#extensions ul.front-page li {list-style: none;}
body#extensions div.ext-header {padding: 0;margin: 0;background: url(ext-header.png) 0 0 repeat-x;overflow:hidden;padding-top: 5px;}
body#extensions .template h2, body#extensions .club-templates h2 {padding-bottom: 0;}
body#extensions #rokbox-caption h2 {background: none;margin: 0;height: auto;font-size: 110%;line-height: 110%;}
body#extensions .club-templates .categories {height: 100px;margin-top: 20px;}
body#extensions .month {font-size: 11px;padding-top: 0;padding-bottom: 10px;}
body#extensions .ext-desc {font-size: 11px;line-height: 100%;}
body#extensions .categories-content {padding: 10px 25px 0 0;}
body#extensions .ext-type {height: 15px;position: absolute;top: 5px;right: 0px;text-align: right;font-weight: bold;font-size: 16px;color: #999;}

#sidebar div.module ul{
	padding:0px;
	margin:0px;
	list-style:none;
}
#sidebar div.module ul li{
	border-bottom:1px solid #ccc;
	list-style:none;
	padding-top:2px;
	padding-bottom:3px;
}
#sidebar div.module ul li a{

}
span.link{
	font-size:14px;
	font-weight:bold;
}
span.link a{
	color:#ff7501;
	text-decoration:none;
}

span.link a:hover{
	color:#ff7501;
	text-decoration:underline;
}