﻿ /**************************************************************
 *    ____            _            _                    _      *
 *   / __ \          | |          | |                  | |     *
 *  | |  \_| ___   __| | ___ ____ | | ____  _ __   ___ | |_    *
 *  | |   _ / _ \ / _  |/ _ \  _ \| |/ _  || '_ \ / _ \| __|   *
 *  | |__/ | (_) | (_| |  __/ |_) | | (_| || | | |  __/| |_    *
 *   \____/ \___/ \__._|\___|  __/|_|\____||_| |_|\___| \__|   *
 *                          | |                                *
 *                          |_|                                *
 *                                                             *
 * File: template.css                                          *
 * Description: The main style css file.                       *
 * URL: http://www.codeplanet.eu/                              *
 * Copyright © 2005 - 2008 CodePlanet. All rights reserved.    *
 **************************************************************/


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
	GLOBAL
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

body {
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 12px;
	line-height: 1.3;
	color: #444444;
	margin: 0;
	padding: 0;
}

#body_bg {
	background: #263840 url(../images/background.gif) top left repeat-x;
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 12px;
	line-height: 1.3;
	margin: 20px 0px;
}

.clr {
	clear: both;
}

h1, h2, h3, h4, h5, h6 {
	margin: 20px 0px 10px 0px;
	font-weight: bold;
	color: #CC3333;
}

h1 {
	font-size: 24px;
}

h2 {
	font-size: 22px;
}

h3 {
	font-size: 18px;
}

h4 {
	font-size: 16px;
}

h5 {
    font-size: 14px;
}

h6 { 
    font-size: 12px;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
	JOOMLA SYSTEM-MESSAGE STYLES
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

.message, .error, .fade {
    font-family: Arial, Tahoma, Verdana, sans-serif; 
    font-size: 11px;
    font-weight: bold;
    text-align: left;
}

.message ul, .error ul, .fade ul {
    margin-left: -40px; /* li correction, because of indention of <ul> */
}

/* Hack to hide a string in all system messages */
#system-message dt {
    display: none;
}

/* System Standard Messages */
#system-message dd.message ul {
    list-style-type: none;
    color: #0055BB;
    display: block;
	background: #C3D2E5 url(../images/wr_information.png) 8px center no-repeat;
	padding: 5px 20px 5px 30px;
	border-top: 2px solid #84A7DB;
	border-bottom: 2px solid #84A7DB;	
}

/* System Error Messages */
#system-message dd.error ul {
    list-style-type: none;
    color: #E25F53;
	display: block;
	background: #FDBE95 url(../images/wr_exclamation.png) 8px center no-repeat;
	padding: 5px 20px 5px 30px;
	border-top: 2px solid #E25F53;
	border-bottom: 2px solid #E25F53;
}

/* System Notice Messages */
#system-message dd.notice ul { 
    list-style-type: none;
    color: #ffd324;
	display: block;
	background: #fff6bf url(../images/wr_message.png) 8px center no-repeat;
	padding: 5px 20px 5px 30px;
	border-top: 2px solid #ffd324;
	border-bottom: 2px solid #ffd324;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
	JOOMLA DEFAULT STYLE
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

a:link, a:visited {
	color: #00469b;
	text-decoration: none;
	position: relative; /* Internet Explorer: a cancer on the web that must be stopped!!! */
}

a:hover {
	color: #CC3333;
	text-decoration: underline;
}

table {
	text-align: left;
}

td {
	font-size: 12x;
}

ul {
	margin: 0px;
	padding: 0px;
}

ul a:link, ul a:visited {
	color: #00469B;
	text-decoration: none;
}

ul a:hover {
	color: #CC3333;
	text-decoration: underline;
}

ol {
	margin: 0px 0px 0px 10px;
	padding: 0px;
}

/* TEXT */
p.alert {
	border-top: 2px solid #E53F26;
	border-bottom: 2px solid #E53F26;
	padding: 1em 1em 1em 4.5em;
	background: #FFDFDF url(../images/icon_text_alert.png) no-repeat 1.5em;
}

p.info {
	border-top: 2px solid #2076C7;
	border-bottom: 2px solid #2076C7;
	padding: 1em 1em 1em 4.5em;
	background: #DBE7F8 url(../images/icon_text_info.png) no-repeat 1.5em;
}

p.tip {
	border-top: 2px solid #FFE600;
	border-bottom: 2px solid #FFE600;
	padding: 1em 1em 1em 4.5em;
	background: #FFFFAD url(../images/icon_text_tip.png) no-repeat 1.5em;
}

p.note {
	border-top: 2px solid #FF7E28;
	border-bottom: 2px solid #FF7E28;
	padding: 1em 1em 1em 4.5em;
	background: #FFED97 url(../images/icon_text_note.png) no-repeat 1.5em;
}

p.download {
	border-top: 2px solid #16A500;
	border-bottom: 2px solid #16A500;
	padding: 1em 1em 1em 4.5em;
	background: #D8FFC2 url(../images/icon_text_download.png) no-repeat 1.5em;
}

.contentheading {
	
	/*font-weight: bold;*/
	/*letter-spacing: -0.02em; 
	font-style: italic;
	font-size: 26px;	
	
	color: #0C110D;*/
	
	font-family: Arial, Tahoma, Verdana, sans-serif;
	letter-spacing: -0.05em;
	font-size: 20px;
	color: #383838;
	margin: 5px 0px;	
}

.contentheading a:link, .contentheading a:visited {
	font-family: Arial, Tahoma, Verdana, sans-serif;
	letter-spacing: -0.05em;
	font-size: 20px;
	color: #383838;
	text-decoration: none;
}

.contentheading a:hover {
	color: #383838;
	text-decoration: underline;
}

.modifydate {
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 10px;
	color: #aaa;
	padding-top: 15px;
}

.small {
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 10px;
	color: #aaa;
}

.createdate {
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 10px;
	color: #aaa;
}

.readon {
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 11px;
	color: #00469B;
}

a.readon:link, a.readon:visited {
	text-decoration: none;
	color: #00469B;
}

a.readon:hover {
	color: #CC3333;
	text-decoration: underline;
}

td.buttonheading {
	width: 12px;
}

td.buttonheading img {
	border: none;
}

.sectiontableheader {
	background-color : #E8E8E8;
	background-repeat: repeat;
	border-bottom: solid 1px #999999;
	padding: 2px;
	color : #808080;
	font-weight : bold;
	padding: 2px;
}

.sectiontableentry1 {
	background-color: #FAFAFA;
	height: 20px;
}

.sectiontableentry2 {
	background-color: #F5F5F5;
	height: 20px;
}

.sectiontableentry1 td, .sectiontableentry2 td {
	padding: 4px;
	border-bottom: 1px solid #ddd;
}

td.sectiontableentry1, td.sectiontableentry2 {
	padding: 4px;
	border-bottom: 1px solid #ddd;
}

.mosimage {
	margin: 15px 15px 15px 0!important;
	margin: 15px 10px 15px 0;
	padding: 0;
}

.mosimage img {
	margin: 0 6px 0 0!important;
	margin: 0 0 0 -6px;
	border: 1px solid #ccc;
	padding: 2px;
}

.mosimage_caption {
	margin-top: 3px;
	color: #aaa;
	font-size: 10px;
}

.componentheading {
	font-family: Arial, Tahoma, Verdana, sans-serif;
	letter-spacing: -0.05em;
	font-size: 18px;
	color: #cbcbcb;
	margin: 5px 0px;
}

table.contenttoc {
	margin: 0 0 30px 30px;
	padding: 0;
	width: 200px;
	float: right;
}

table.contenttoc th {
	padding: 5px;
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 12px;
	background-color : #e8e8e8;
	border-bottom: solid 1px #999999;
	color: #808080;
	text-indent: 5px;
}

table.contenttoc td a:link, table.contenttoc td a:visited {
	display: block;
	width: auto;	
}

table.contenttoc td a:hover {
	background: #f1f1f1;
	color: #000;
	text-decoration: none;
	display: block;
	width: auto;
}

table.contenttoc td {
	text-align: center;
	background: #FCFCFC;
	border-left: solid 1px #ddd;
	border-right: solid 1px #ddd;
	border-bottom: solid 1px #ddd;
}

.toclink {
	font-size: 10px;
	padding: 5px;
}

.contentpaneopen {
    width: 100%;
    text-align: left;
}

.contentpaneopen ul {
    margin-left: 15px;
}

table.contentpane {
	width: 100%;
	margin-bottom: 30px;
}

table.contentpane ul {
	list-style-type: none;
}

table.contentpane li {
	margin: 25px;
}

.highlight {
	background-color: #ffff99;
}

.contentpane {
	width: auto;
}

form {
	margin: 0;
	padding: 0;
	position: relative;
}

table.poll {
	padding: 0;
	width: 100%;
	border-collapse: collapse;
}

table.poll td {
	font-size: 11px;
}

table.pollstableborder {
	padding: 0;
	width: 100%;
	border: none;
	text-align: left;
}

table.pollstableborder img {
	vertical-align: baseline;
}

table.pollstableborder td {
	padding: 2px!important;
}

#mod_login_password, #mod_login_username {
	width: 120px;
}

#mod_login_remember.inputbox{
	border: none;
	background: none;
}

#mod_search_searchword{
	width: 150px;
}

input, select {
	font: 11px "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
}

.input {
    border: none;
}

select, .inputbox {
	padding: 2px;
}

.inputbox{
	margin: 1px 0;
}

.inputbox:focus {
	border: 1px solid #BABDB6;
	background: #FFFFDD;
}

textarea {
	padding-left: 2px;
}

textarea.inputbox {
	font: 11px "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	width: 95%;
}

fieldset {
	background: #fff;
	border: 1px solid #d5d5d5;
	padding: 10px;
}

table.searchintro {
	margin: 20px 0 10px 0;
}

.button {
	padding: 1px 4px;
	border-top: 1px solid #E1E1E1;
	border-left: 1px solid #E1E1E1;
	border-bottom: 1px solid #BABDB6;
	border-right: 1px solid #BABDB6;
	background: #f5f5f5;
	color: #999;
	cursor: pointer;
}

.button:hover, .button:focus {
	border-top: 1px solid #BABDB6;
	border-right: 1px solid #E1E1E1;
	border-bottom: 1px solid #E1E1E1;
	border-left: 1px solid #BABDB6;
	color: #000;
}

.inputbox {
	border-top: 1px solid #BABDB6;
	border-right: 1px solid #EDEEEC;
	border-bottom: 1px solid #EDEEEC;
	border-left: 1px solid #BABDB6;
}

.inputbox:hover, .inputbox:focus {
	border: 1px solid #BABDB6;
}

.pagenav {
	padding: 2px;
	color: #999;
}

a.pagenav, .pagenav_prev a, .pagenav_next a, .pagenavbar a {
	padding: 1px 4px;
	border-top: 1px solid #E1E1E1;
	border-left: 1px solid #E1E1E1;
	border-bottom: 1px solid #BABDB6;
	border-right: 1px solid #BABDB6;
	text-decoration: none;
	font-size: 11px;
	background: #f5f5f5;
	color: #999;
	height: 100%;
}

a.pagenav:hover, a.pagenav:active, .pagenav_prev a:hover, .pagenav_prev a:active, .pagenav_next a:hover, .pagenav_next a:active, .pagenavbar a:hover, .pagenavbar a:active {
	padding: 1px 4px;
	border-top: 1px solid #BABDB6;
	border-right: 1px solid #E1E1E1;
	border-bottom: 1px solid #E1E1E1;
	border-left: 1px solid #BABDB6;
	text-decoration: none;
	color: #000;
}

th.pagenav_prev a, th.pagenav_next a{
	color: #999;
	font-weight: normal;
}

th.pagenav_prev a:hover, th.pagenav_next a:hover{
	color: #000;
	font-weight: normal;
}

.pagenavbar {
	padding-left: 14px;
	font-size: 11px;
}

.pagenavcounter {
	padding: 10px 0 0 0;
	color: #aaa;
}

.blog table{
	padding: 0 5px;
}

.blog_more {
	margin-top: 5px;
	margin-left: 20px;
	margin-bottom: 30px;
}

.back_button{
	font-size: 11px;
	text-align: left;
}

hr {
	border: none 0;
	border-top: 1px solid #d5d5d5;
	height: 1px;
}

.adminform textarea {
	width: 911px !important;
}

.adminform textarea.inputbox {
	width: 911px !important;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    CUSTOM STYLING
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#wrapper {
	width: 970px;
	margin: 0px;
}

span.alert {
	display: block;
	background: #FDBE95 url(../images/wr_information.png) center no-repeat;
	background-position: 15px 50%;
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #E25F53;
	border-bottom: 2px solid #E25F53;
}

span.info {
	display: block;
	background: #f8fafc url(../images/wr_information.png) center no-repeat;
	background-position: 15px 50%;
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #b5d4fe;
	border-bottom: 2px solid #b5d4fe;
}

span.download {
	display: block;
	background: #e2f3de url(../images/wr_download.png) center no-repeat;
	background-position: 15px 50%;
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #3C6;
	border-bottom: 2px solid #3C6;
}

pre {
	display: block;
	line-height: 100%;
	overflow: auto !important;
	overflow: scroll;
	width: 610px;
	/*height: 500px;*/
}

pre.grey {
	border-left: 5px solid #ccc;
	background: #f2f2f2;
	padding: 10px;
	font-family: Monaco, "Courier New", monospace;
	font-size: 11px;
}

pre.blank {
	overflow: hidden !important;
	overflow: hidden;
}

blockquote {
	margin: 20px 0;
	padding: 0 30px 0 40px;
	background: url(../images/wr_quote.png) no-repeat;
	background-position: 10px 0;
	border: none;
	font-style: oblique;
	color: #888;
}

.readon {
    /* background: url(../images/readon.gif) center right no-repeat; 
    padding-right: 15px;
    color: #AAAAAA; */
}

.moduletablehomefeed {
    font-size: 12px;
    border-top: 3px solid #C1C1C1;
    width: 210px;
    background: #f0f0f0 url(../images/community_rss_bg.gif) repeat-x bottom left; 
    padding: 10px;
    margin: 10px;
}

.newsfeedhomefeed {
    list-style-type: none;
    margin-left: 0;
}

.newsfeedhomefeed li {
    background: url(../images/icon_news.png) top left no-repeat;
    padding-left: 30px;   
    margin: 10px 0 0 0;  
}

div#home_column_left {
    float: left;
    width: 400px;
}

div#home_column_right {
    padding-top: 5px;
    float: right;
    width: 240px;
}

div#home_column_middle {
    padding: 0px 160px 5px 400px;
    margin: 0;
}

.latesttutorials_tut_title {
    font-weight: bold;
    border-top: 3px solid #C1C1C1;
    border-bottom: 1px dotted #C1C1C1;
    margin: 10px 10px 0 10px;
    padding: 3px;
}

.latesttutorials_tut_content {
    padding: 10px;
}

.latesttutorials_tut_content ul {
    list-style-type: none;
    margin-left: 0;    
}

.latesttutorials_tut_content li {
    font-size: 12px;
    border-bottom: 1px dotted #C1C1C1;
    margin-top: 10px;  
}

.latesttutorials_tut_content li a {
    font-size: 14px;
    text-decoration: none;
    color: #00469b;
    font-weight: normal;
    font-style: normal;
}

/* Tutorials menu table */
#tut_menu {
	width: 230px;
    margin-top: 30px;   
}

#tut_menu a {
    font-size: 10px;
}

.menu_td {
	height: 22px;
    vertical-align: middle;
}

.tcat_head {
    font-size: 11px;
    font-weight: bold;
	border: 1px #DDDDDD solid;
	width: 400px;
	background: #F5F5F5;
	text-align: left;
	padding: 2px 0 2px 5px;
	text-transform: uppercase;
	background-image: url(../images/caro1.png);
}

.tcat_body {
	padding: 3px;
    background: #F5F5F5;
    border-left: 1px #DDDDDD solid;
    border-right: 1px #DDDDDD solid;
    border-bottom: 1px #DDDDDD solid;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    TOP HEADER
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#top_header_wrap {

}

div.top_header {
	background: url(../images/wr_top_header.png) top left no-repeat;
	height: 111px;
}

/* ---- logo --- */
div#logo_wrap {
	position: relative;
	width: 970px;
}

div#logo {
	background: url(../images/logo.png) no-repeat;
	width: 400px;
	height: 70px;
	position: absolute;
	left: 46px;
	top: 33px;
}

/* ---- rss feed icon--- */
div#rss_wrap {
	position: relative;
	width: 970px;
}

div#rss {
	background: url(../images/wr_rss.png) no-repeat;
	width: 110px;
	height: 20px;
	position: absolute;
	right: 52px;
	top: 24px;
	cursor: pointer;
}

/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    CONTENT LAYOUT
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#content_layout_wrap {

}

div.content_layout {
	background: url(../images/wr_content_layout.png) top left repeat-y;
	height: 1%;
}

div.content_layout_sidebar {
	background: url(../images/wr_content_layout_sidebar.png) top left repeat-y;
	height: 1%;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    TOP MENU
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#top_menu_wrap {
	padding: 0px 25px;
}

div.top_menu {
	background: url(../images/wr_topmenu.png) top left repeat-x;
	height: 33px;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    DROP DOWN MENU
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#ddmenuwrap {
	background: url(../images/wr_topmenu.png) repeat-x;
	height: 33px;
	position: relative;
	z-index: 100;
}

div#ddmenu {

}

div#nav {
	margin: 0;
	padding: 0;
	height: 33px;
/*	background-color: #1a1a1a; */
}

div#nav a {
	font-size: 12px;
	color: #fff;
	float: left;
	text-decoration: none;
	display: block;
	cursor: pointer;
	line-height: 33px;
	padding: 0 15px;
}

div#nav ul ul .parent {
	background: url(../images/sublink.png) 100% 50% no-repeat;
}

div#nav ul ul .parent:hover {
	background: url(../images/sublink_hover.png) 100% 50% no-repeat;
}

div#nav li a {
	background: url(../images/wr_menu_div.gif) 100% 0 no-repeat;
}

div#nav li a:hover {

}

div#nav li li a {
	background: none;
	font-weight: normal;
	padding: 0;
	text-indent: 15px;
	color: #fff;
	line-height: 25px;
}

div#nav li li {
	background: none;
	font-weight: normal;
	padding: 0;
	text-indent: 15px;
	color: #fff;
	line-height: 25px;
}

div#nav ul li ul li a:hover{
	background: none;
}

div#nav ul li a:hover, div#nav ul li ul li ul li a:hover {
	color: #fefefe;
}

div#nav, div#nav ul {
	float: left;
	list-style: none;
	margin: 0;
	padding: 0;
}

div#nav li li {
	padding: 0;
	background: none;
	border-bottom: 1px solid #01324D;
/*	border-top: 1px solid #01324D; */
}

div#nav a {

}

div#nav ul ul {
	display: block;
	color: #ffffff;
	text-decoration: none;
	width: 167px;
	font-size: 12px;
	text-align: left;
}

div#nav ul ul a {
	display: block;
	color: #ffffff;
	text-decoration: none;
	width: 167px;
	font-size: 12px;
	text-align: left;
}

div#nav li {
	float: left;
	padding: 0;
 	background: none;
	height: 33px;
}

div#nav ul li {
	position: relative;
}

div#nav li ul {
	top: 33px;
	position: absolute;
	left: -999em;
	height: auto;
	width: 170px;
	font-weight: normal;
	border-width: 0;
	margin: 0;
	padding: 0;
	border-right: 1px solid #01324D;
	border-left: 1px solid #01324D;
	border-top: 1px solid #01324D;
}	

div#nav ul {
	padding: 0;
	margin: 0;
}

div#nav li li {
	float: left;
	padding: 0;
   	width: 170px;
	height: 25px;
}

div#nav li ul ul {
	margin: -30px 0 0 170px;
}

div#nav li:hover ul ul, 
div#nav li:hover ul ul ul,
div#nav li:hover ul ul ul ul,  
div#nav li.sfhover ul ul, 
div#nav li.sfhover ul ul ul, 
div#nav li.sfhover ul ul ul ul {
	left: -999em;
}

div#nav li:hover ul, 
div#nav li li:hover ul, 
div#nav li li li:hover ul, 
div#nav li li li li:hover ul,
div#nav li.sfhover ul, 
div#nav li li.sfhover ul, 
div#nav li li li.sfhover ul,
div#nav li li li li.sfhover ul {
	z-index: 100;
	left: 0;
}

div#nav li:hover, div#nav li.sfhover {
    left: 0;
    background: url(../images/wr_menu_active.gif) top left repeat-x;
	height: 33px;
}

div#nav li li:hover, div#nav li li.sfhover {
    left: 0;
    background: #01669A;
	height: 25px;
}

div#nav li:hover a, div#nav li.sfhover a {
    color: #fff;
}

div#nav li li:hover a, div#nav li li.sfhover a {
    color: #fff;
}

div#nav li li:hover a:hover, div#nav li li.sfhover a:hover {
    color: #fff;
}

div#nav a {

}

div#nav ul ul a {
	background: none;
}

div#nav li#current {
    background: url(../images/wr_menu_active.gif) top left repeat-x;
}
/*
div#nav li li#current {
	background: #013F5F;
}*/

div#nav li:hover ul, 
div#nav li li:hover ul, 
div#nav li li li:hover ul, 
div#nav li li li li:hover ul,
div#nav li.sfhover ul, 
div#nav li li.sfhover ul, 
div#nav li li li.sfhover ul,
div#nav li li li li.sfhover ul{
	background: #014B72;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    HEADER
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

/* Inner Navigation */
div#breadcrumbs {
    text-align: left;
	font-size: 11px;
	margin: 13px 9px 0 9px;
	color: #595959;
	margin: 10px 20px 0px 20px;
	padding: 1px;
	line-height: 16px;
	overflow: visible;
}

div#breadcrumbs a, #inav span {
	color: #000;
	font-weight: bold;
}

div#breadcrumbs a:first-child {
	/* background: url(../images/home.png) no-repeat 0px 0;
	padding: 2px 0px 2px 19px; */
}

div#header_wrap {
	padding: 0px 25px;
}

div#header {
	height: 385px;
	background: #0c110d;
	border-bottom: 5px solid #c1c1c1;
}

/* ---- header content --- */
div#header_content_wrap {

}

div#header_content {
	height: 305px;
}

/* ---- scrolling header (user1, user2, user3, user4 and user5 module positions) --- */
#demo-bar {
	margin: 0px auto;
	padding: 0;
	width: 920px;
	text-align: center;
} 

#demo-wrapper {
	margin: 0px auto;
	overflow: hidden; 
	height: 305px; 
	width: 920px;
	position: relative;
} 

#demo-inner {
	width: 4600px;
	height: 305px;
	position: relative;
} 

.scrolling-content {
	background: transparent url(bubble.html) top left no-repeat;
	width: 139px;
	height: 73px;
	text-align: left;
	position: absolute;
} 

.scrolling-content h1 { 
	color: #fff;
	padding: 0;
	font-size: 12px;
} 

#content1 {
	left: 0px; 
	top: 0px;
	width: 920px;
	height: 305px;
	background: url(../images/wr_user1_bg.jpg) top right no-repeat;
}

div#user1, div#user2, div#user3, div#user4, div#user5 {
	font-size: 14px;
	color: #9a9a9a;
	width: 550px;
	padding: 20px 0 0 20px;
}

div#content1 a:link, div#content1 a:visited,
div#content2 a:link, div#content2 a:visited,
div#content3 a:link, div#content3 a:visited,
div#content4 a:link, div#content4 a:visited,
div#content5 a:link, div#content5 a:visited {
	color: #9a9a9a;
	text-decoration: underline;
}

div#content1 a:hover,
div#content2 a:hover,
div#content3 a:hover,
div#content4 a:hover,
div#content5 a:hover {
	color: #fff;
}

#content2 {
	left: 920px; 
	top: 0px;
	width: 920px;
	height: 305px;
	background: url(../images/wr_user2_bg.jpg) top right no-repeat;
} 

#content3 {
	left: 1840px; 
	top: 0px;
	width: 920px;
	height: 305px;
	background: url(../images/wr_user3_bg.jpg) top right no-repeat;
} 

#content4 {
	left: 2760px; 
	top: 0px;
	width: 920px;
	height: 305px;
	background: url(../images/wr_user4_bg.jpg) top right no-repeat;
}

#content5 {
	left: 3680px; 
	top: 0px;
	width: 920px;
	height: 305px;
	background: url(../images/wr_user5_bg.jpg) top right no-repeat;
}

/* ---- header buttons --- */
div#header_buttons_wrap {

}

div#header_buttons {
	height: 80px;
	background: url(../images/wr_header_buttons_bg.png) top left repeat-x;
}

/* a#link1, a#link2, a#link3, a#link4, a#link5 {
	width: 184px;
	height: 80px;
	display: block;
}*/

ul#buttons {
	margin: 0;
	padding: 0;
}

ul#buttons li {
	list-style: none;
}

ul#buttons li a:link, ul#buttons li a:visited {
	width: 184px;
	height: 80px;
	display: block;
}

li#but_intro {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_intro.jpg) 0% 0% no-repeat;
}

li#but_intro a:hover {
	background: url(../images/wr_header_but_intro.jpg) 0% 50% no-repeat;
}

li#but_intro a.active {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_intro.jpg) 0% 100% no-repeat;
}

li#but_intro a:active {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_intro.jpg) 0% 100% no-repeat;
}

li#but_flexible {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_flex.jpg) 0% 0% no-repeat;
}

li#but_flexible a:hover {
	background: url(../images/wr_header_but_flex.jpg) 0% 50% no-repeat;
}

li#but_flexible a.active {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_flex.jpg) 0% 100% no-repeat;
}

li#but_support {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_support.jpg) 0% 0% no-repeat;
}

li#but_support a:hover {
	background: url(../images/wr_header_but_support.jpg) 0% 50% no-repeat;
}

li#but_support a.active {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_support.jpg) 0% 100% no-repeat;
}

li#but_pro {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_pro.jpg) 0% 0% no-repeat;
}

li#but_pro a:hover {
	background: url(../images/wr_header_but_pro.jpg) 0% 50% no-repeat;
}

li#but_pro a.active {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_pro.jpg) 0% 100% no-repeat;
}

li#but_w3c {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_w3c.jpg) 0% 0% no-repeat;
}

li#but_w3c a:hover {
	background: url(../images/wr_header_but_w3c.jpg) 0% 50% no-repeat;
}

li#but_w3c a.active {
	width: 184px;
	height: 80px;
	float: left;
	background: url(../images/wr_header_but_w3c.jpg) 0% 100% no-repeat;
}

/* ---- user6 --- */
div#user6_wrap {
	padding: 0 25px;
}
div#user6 {
	background: #000;
	border-bottom: 5px solid #c1c1c1;
	color: #9a9a9a;
	text-align: left;
	padding: 10px 25px;
	font-size: 11px;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    CONTENT
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#content_wrap { /* 1 column layout */
	padding: 0px 25px;
} 

div#content_wrap_sidebar { /* 2 columns layout */
	width: 690px;
	padding: 0px 25px;
	float: left;
}

div#content {
    font-size: 13px;
}

/* ---- top users --- */
div#topusers_wrap {
	height: 1%;
	margin: 20px 0 0 0;
	padding: 0 20px;
}

div#user7wrap, div#user8wrap, div#user9wrap {
	float: left;
}

div#user7, div#user8, div#user9{
	margin: 3px;
}

div#user7wrap div.module h3,
div#user8wrap div.module h3,
div#user9wrap div.module h3 {
	margin: 0px;
	padding-bottom: 2px;
	font-family: Arial, Tahoma, Verdana, sans-serif;
	letter-spacing: -0.05em;
	font-size: 13px;
	color: #CC3333;
}

div#user7wrap div.module,
div#user8wrap div.module,
div#user9wrap div.module {
	background: url('../images/wr_round_mod_b_l.gif') no-repeat bottom left;
	text-align: left;
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 11px;
	color: #808080;
}

div#user7wrap div.module div div,
div#user8wrap div.module div div,
div#user9wrap div.module div div {
    background: url('../images/wr_round_mod_t_l.gif') no-repeat top left;
}

div#user7wrap div.module div,
div#user8wrap div.module div,
div#user9wrap div.module div {
	background: url('../images/wr_round_mod_b_r.gif') no-repeat bottom right;
}

div#user7wrap div.module div div div,
div#user8wrap div.module div div div,
div#user9wrap div.module div div div {
    background: url('../images/wr_round_mod_t_r.gif') no-repeat top right;
	padding: 5px 10px 5px 10px;
}

div#user7wrap div.module div div div h3,
div#user8wrap div.module div div div h3,
div#user9wrap div.module div div div h3 {
	display:block;
}

div#user7wrap div.module div div div div,
div#user8wrap div.module div div div div,
div#user9wrap div.module div div div div {
    background:none;
}

/* ---- newsflash --- */
div#newsflash_wrap {
	padding: 0 25px;
	padding-top: 20px;
}

div#newsflash {

}

div#newsflash .module {
	text-align: left;
	color: #808080;
}

div#newsflash .module h3 {
	font-family: Arial, Tahoma, Verdana, sans-serif;
	letter-spacing: -0.05em;
	font-size: 18px;
	color: #000;
	font-weight: normal;
	margin: 0px 0px;
}


/* ---- mainbody --- */
div#mainbody_wrap {
    
}

div#mainbody {
	padding: 20px 20px 0px 20px;
	text-align: left;
}

#mainbody em {
	border: 1px solid #999999;
	font-size: x-small;
	padding-top: 0px;
	padding-right: 2px;
	padding-bottom: 0px;
	padding-left: 2px;
	background-color: #E0E0E0;
	font-style: normal;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    Bottom users
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#bottomusers_wrap {
	height: 1%;
	margin: 20px 0 0 0;
	padding: 0 20px;
}

div#user10wrap,
div#user11wrap,
div#user12wrap {
	float: left;
}

div#user10,
div#user11,
div#user12 {
	margin: 3px;
}

div#user10wrap div.module h3,
div#user11wrap div.module h3,
div#user12wrap div.module h3 {
	margin: 0px;
	padding-bottom: 2px;
	font-family: Arial, Tahoma, Verdana, sans-serif;
	letter-spacing: -0.05em;
	font-size: 13px;
	color: #CC3333;
}

div#user10wrap div.module,
div#user11wrap div.module,
div#user12wrap div.module {
	background: url('../images/wr_round_mod_b_l.gif') no-repeat bottom left;
	text-align: left;
	font-family: "Lucida Grande", Geneva, Arial, Verdana, sans-serif;
	font-size: 11px;
	color: #808080;
}

div#user10wrap div.module div div,
div#user11wrap div.module div div,
div#user12wrap div.module div div {
    background: url('../images/wr_round_mod_t_l.gif') no-repeat top left;
}

div#user10wrap div.module div,
div#user11wrap div.module div,
div#user12wrap div.module div {
	background: url('../images/wr_round_mod_b_r.gif') no-repeat bottom right;
}

div#user10wrap div.module div div div,
div#user11wrap div.module div div div,
div#user12wrap div.module div div div {
    background: url('../images/wr_round_mod_t_r.gif') no-repeat top right;
	padding: 5px 10px 5px 10px;
}

div#user10wrap div.module div div div h3,
div#user11wrap div.module div div div h3,
div#user12wrap div.module div div div h3 {
	display:block;
}

div#user10wrap div.module div div div div,
div#user11wrap div.module div div div div,
div#user12wrap div.module div div div div {
    background:none;
}

/* ---- list bottom users --- */
div#list_bottom_users_wrap {
	padding: 20px 15px 15px 15px;
	height: 1%; /* ie really sucks */
}

div#list_bottom_users {

}

div#user13 h3, div#user14 h3 {
	font-family: Arial, Tahoma, Verdana, sans-serif;
	letter-spacing: -0.05em;
	font-size: 13px;
	color: #000;
	font-weight: normal;
	margin: 0px 0px;
}

div#user13 .module, div#user14 .module {
	padding: 10px;
	margin: 0;
}

div#user13, div#user14{
	float: left;
	text-align: left;
	color: #a8a8a8;
	font-size: 11px;
}

div#user13 a:link, div#user13 a:visited,
div#user14 a:link, div#user14 a:visited {
	border-bottom: 1px dotted #999;
	color: #a8a8a8;
	text-decoration: none;
}

div#user13 a:hover, div#user14 a:hover {
	color: #3875D7;
	text-decoration: none;
}

div#user13 ul, div#user14 ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

div#user13 li, div#user14 li {
	padding: 0;
	line-height: 20px;
	text-indent: 5px;
	border-bottom: 1px solid #ddd;
}

div#user13 li a:link, div#user13 li a:visited,
div#user14 li a:link, div#user14 li a:visited {
	color: #3875D7;
	display: block;
	border-bottom: none;
	width: 100%;
}

div#user13 li a:hover, div#user14 li a:hover {
	border-bottom: none;
	display: block;
	color: #000;
	text-decoration: none;
	background: #f8f8f8 url(../images/wr_list_bg.gif) 100% 50% no-repeat;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    SIDEBAR
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#sidebar_wrap {
    font-family: Arial, Helvetica, sans-serif;
	float: left;
	text-align: left;
	width: 180px;
	margin-top: 20px;
	margin-left: 40px;
	
}

div#sidebar_wrap ul li {
	list-style-type: none;
}

div#sidebar {
     
}

div#sidebar .module h3 {
	font-family: Arial, Tahoma, Verdana, sans-serif;
	letter-spacing: -0.05em;
	font-size: 14px;
	color: #587788;
	font-weight: bold;
	margin: 0px 0px 10px 0px;
}

div#sidebar .module {
    /* background-image: url(../images/ext_main_28.jpg); 
    background-repeat: repeat-x; 
    border: 0px dotted #D5D5D5; */
    background-color: #F2F6FA;
    padding: 7px;
    margin: 10px 0px 10px 0px;     
	font-size: 11px;
	color: #595959;
	margin-bottom: 30px;
}

div#sidebar fieldset {
	background: none !important;
	border: 0px solid #fff;
	padding: 10px;
}

div#sidebar a:link, div#sidebar a:visited {
	color: #CC3333;
	text-decoration: none;
}

div#sidebar a:hover {
	color: #00469b;
	text-decoration: underline;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    BOTTOM LAYOUT
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#bottom_layout {

}

div.bottom_layout {
	background: url(../images/wr_bottom_layout.png) top left repeat-y;
	height: 41px;
}

div.bottom_layout_sidebar {
	background: url(../images/wr_bottom_layout_sidebar.png) top left repeat-y;
	height: 41px;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    FOOTER
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

div#footer_wrap {
	padding-top: 10px;
}

div#footer {
	color: #c1c1c1;
	font-size: 11px;
}

div#footer a:link, div#footer a:visited {
	color: #fff;
	text-decoration: none;
}

div#footer a:hover {
	color: #fff;
	text-decoration: underline;
}

/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
    TOOLTIPS (+)
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

.tool-tip {
	float: left;
	background: #ffc;
	border: 1px solid #D4D5AA;
	padding: 5px;
	max-width: 200px;
}

.tool-title {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-weight: bold;
	margin-top: -15px;
	padding-top: 15px;
	padding-bottom: 5px;
	background: url(../../system/images/selector-arrow.png) no-repeat;
}

.tool-text {
	font-size: 100%;
	margin: 0;
}