/* 
Basic layout derived from http://www.positioniseverything.net/articles/pie-maker/pagemaker_form.php.
I've changed many so things that I won't put a full copyright notice. However all hacks (and comments!) are far beyond my knowledge and this deserves full credits:

Original copyright notice:
Parts of these notes are
(c) Big John @ www.positioniseverything.net and (c) Paul O'Brien @ www.pmob.co.uk, all of whom contributed significantly to the design of
the css and html code.

Reworked for TWiki:(c) Arthur Clemens @ visiblearea.com
*/

/*
Reworked for new appearance August 2009 by Bradley Mellen of Kosada, Incorporated (kosada.com)
changes marked with comment tag: KOSADA-2009
*/

html, body {
	margin:0; /*** Do NOT set anything other than a left margin for the page
as this will break the design ***/
	padding:0;
	border:0;
/* \*/
	height:100%;
/* Last height declaration hidden from Mac IE 5.x */
}
body {
	background:#fff;
	min-width:100%; /*** This is needed for moz. Otherwise, the header and patternBottomBar will
slide off the left side of the page if the screen width is narrower than the design.
Not seen by IE. Left Col + Right Col + Center Col + Both Inner Borders + Both Outer Borders ***/
	text-align:center; /*** IE/Win (not IE/MAC) alignment of page ***/
}
.clear {
	clear:both;
	/*** these next attributes are designed to keep the div
	height to 0 pixels high, critical for Safari and Netscape 7 ***/
	height:0px;
	overflow:hidden;
	line-height:1%;
	font-size:0px;
}

#patternWrapper {
	height:100%; /*** moz uses this to make full height design. As this #patternWrapper is inside the #page which is 100% height, moz will not inherit heights further into the design inside this container, which you should be able to do with use of the min-height style. Instead, Mozilla ignores the height:100% or min-height:100% from this point inwards to the center of the design - a nasty bug.
If you change this to height:100% moz won't expand the design if content grows.
Aaaghhh. I pulled my hair out over this for days. ***/
/* \*/
	height:100%;
/* Last height declaration hidden from Mac IE 5.x */
/*** Fixes height for non moz browsers, to full height ***/
}
#patternWrapp\65	r{ /*** for Opera and Moz (and some others will see it, but NOT Safari) ***/
	height:auto; /*** For moz to stop it fixing height to 100% ***/
}
/* \*/
* html #patternWrapper{
	height:100%;
}

#page {
	margin-left:auto; /*** Mozilla/Opera/Mac IE 5.x alignment of page ***/
	margin-right:auto; /*** Mozilla/Opera/Mac IE 5.x alignment of page ***/
	text-align:left; /*** IE Win re-alignment of page if page is centered ***/
	position:relative;
	width:100%; /*** Needed for Moz/Opera to keep page from sliding to left side of
page when it calculates auto margins above. Can't use min-width. Note that putting
width in #page shows it to IE and causes problems, so IE needs a hack
to remove this width. Left Col + Right Col + Center Col + Both Inner Border + Both Outer Borders ***/
/* \*/

/* Last height declaration hidden from Mac IE 5.x */
/*** Needed for Moz to give full height design if page content is
too small to fill the page ***/
}
/* Last style with height declaration hidden from Mac IE 5.x */
/*** Fixes height for IE, back to full height,
from esc tab hack moz min-height solution ***/
#outer {
	z-index:1; /*** Critical value for Moz/Opera Background Column colors fudge to work ***/
	position:relative; /*** IE needs this or the contents won't show outside the parent container. ***/

	height:100%;
/* Last height declaration hidden from Mac IE 5.x */
/*** Needed for full height inner borders in Win IE ***/
}

#floatWrap {
	width:100%;
	float:left;
	display:inline;
}
#main {
	width:100%;							/* KOSADA-2009 */
	float:right;
	display:inline;
}

/* TWiki base CSS */

.twikiMakeVisible,
.twikiMakeVisibleInline,
.twikiMakeVisibleBlock {
	display:none; /* will be made visible with javascript */
}
.left {
	float:left;
	position:relative;
}
.right {
	position:relative;
	float:right;
	display:inline;
	margin:0;
}
.clearfloat {
	/* to clean up floats */
	margin:0;
	padding:0;
	height:0;
	line-height:0px;
	clear:both;
	display:block;
}
.hidden {
	display:none;
}

* {
	padding:0;
	margin:0;
}
html body {
	font-size:104%; /* to change the site's font size, change #page below */
	voice-family:"\"}\""; 
	voice-family:inherit;
	font-size:small;
}
html>body { /* Mozilla */
	font-size:small;	
}
p {
	margin:1em 0 0 0;
}

/* Text */

a:link,
a:visited {
	text-decoration:underline;
	color:#f60;
}
a:hover {
	color:#d41f28;
}
/*
dotted lines:
position 0:black link #000
position -600:link hover red #d41f28
position -1200:gray link #7d8ca5
position -1800:orange link #f60
*/

#contentInner a:link,
#contentInner a:visited {
	color:#b1bac9;				/* KOSADA-2009 */
	background-image:url(dotted_line.gif);
	background-repeat:repeat-x;
	background-position:-1200px 100%;	/* KOSADA-2009 */
	text-decoration:none;
}
#contentInner a:link {				/* added KOSADA-2009 */
	color:#578acc;				/* added KOSADA-2009 */
}						/* added KOSADA-2009 */
#contentInner a:hover {
	color:#d41f28;
	text-decoration:none;
	background-position:-600px 100%;
}
#contentInner a.noBorder:link,
#contentInner a.noBorder:visited {
	background:none;
}
#contentInner .actionbutton a,			/* added KOSADA-2009 */
#contentInner .nolinkline a {			/* added KOSADA-2009 */
	background-image:none;			/* added KOSADA-2009 */
}						/* added KOSADA-2009 */
img {
	border:0;
}
html body {
	background-color:#f1f3f5;					/* KOSADA-2009 */
//	background-image:url(background_pattern.gif);		/* KOSADA-2009 */
}
#screen {
	background-image:url(background_gradient.gif);		/* KOSADA-2009 */
	background-repeat:repeat-x;
	padding-bottom:60px;					/* KOSADA-2009 */
	background-color:#f1f3f5;				/* added KOSADA-2009 */
}
#page {
//	width:776px;		/* KOSADA-2009 */
	width:1000px;		/* KOSADA-2009 */
	min-height:400px;
	font-family:arial, verdana, sans-serif;
	line-height:1.35em;
	font-size:99%;
	color:#3f4e67;
}
h1, h2, h3, h4, h5, h6 {
	color:#3f4e67;		/* KOSADA-2009 */
	margin:15px 0 10px 0;
	line-height:1.1em;
}
h1 {
	margin:0;
	font-size:180%;
}
h2 {
	font-weight:normal;
}
h3 {
	font-size:120%;
	color:#3f4e67;
}

/* Top of page */

#topbar {
	position:relative;
	height:84px;
	padding-bottom:10px; /* 28 - 5 sticking out of menu bar */		/* KOSADA-2009 (was margin instead of padding) */
}

/* Logo */

#logo {
	position:absolute;
	top:16px;
	left:18px;		/* KOSADA-2009 */
}

/* Top menu */

#topmenu {
	position:absolute;
	top:12px;		/* KOSADA-2009 (was a bottom: tag) */
	right:30px;		/* KOSADA-2009 */
	text-align:right;
}
#topmenu p {
	display:none;
}
#topmenu ul {
	padding:0 0px 0 0;	/* KOSADA-2009 */
}
#topmenu ul li {
	margin:0 0 0 20px;	/* KOSADA-2009 */
	font-size:96%;
}
#topmenu ul li a {
	color:#acb5c4;		/* KOSADA-2009 */
}
#topmenu ul li a:link,
#topmenu ul li a:visited {
	text-decoration:none;
}
#topmenu ul li a:hover {
//	text-decoration:underline;	/* KOSADA-2009 */
	color:#d41f28;			/* KOSADA-2009 */
}

/* Main menu */

#mainmenu {
	padding:0 30px;		/* added KOSADA-2009 */
	width:940px;		/* KOSADA-2009 */
}
#mainmenuContents {
	/* to restrain the table height*/
	position:relative;
}
#mainmenuContents p {
	/* in case of accidental newlines in menu topic */
	display:none;
}
#mainmenuItems {
	height:36px;		/* KOSADA-2009 */
	background-image:url(menu_bar.png);
	background-repeat:no-repeat;
	background-position:0 0px;
	/* background image for IE6 is set in css.twikidotnetsite.tmpl */
}
/* ugly, but necessary to align vertically */
#mainmenuItems table {
	width:100%;
	height:36px; /* height of the visible gray bar */
}
#mainmenuItems td {
	vertical-align:middle;
	height:100%;
}
#mainmenuItems ul {
//	padding-top:5px; /* height of the top shadow */									/* KOSADA-2009 */
//	padding-left:20px; padding-right:20px; /* width of sticking out to the left (10) plus left padding (10) */	/* KOSADA-2009 */
}
#mainmenuItems ul li {
	display:block;
	float:left;
	position:relative; z-index:1; /* to make the links clickable after having used AlphaImageLoader in IE6 */ 
	font-weight:bold;
	font-size:13.5px;
	letter-spacing:.05em;
	text-align:left;
}
#mainmenuItems ul li a {
	color:#7d8ca5;		/* KOSADA-2009 */
	display:block;
	float:left;
	height:36px;
	line-height:36px;
	padding:0 25px;		/* KOSADA-2009 */
	vertical-align:middle;
}
#mainmenuItems ul li a:link,
#mainmenuItems ul li a:visited {
	text-decoration:none;
}
#mainmenuItems ul li a:hover {
	text-decoration:none;
	color:#d41f28;		/* KOSADA-2009 */
}

/* Indicate state in main menu */
/* State identifiers are set in the page form, field PageSection */
.home #mainmenuItems ul li#mainmenuhome a,
.why #mainmenuItems ul li#mainmenuwhy a,
.customers #mainmenuItems ul li#mainmenucustomers a,
.products #mainmenuItems ul li#mainmenuproducts a,
.hosting #mainmenuItems ul li#mainmenuhosting a,
.sales #mainmenuItems ul li#mainmenusales a,
.support #mainmenuItems ul li#mainmenusupport a,
.partners #mainmenuItems ul li#mainmenupartners a {
	color:#d41f28;					/* KOSADA-2009 */
	background-image:url(menu_triangle.png);	/* added KOSADA-2009 */
	background-position:center;			/* added KOSADA-2009 */
	background-repeat:no-repeat;
	background-position:50% 0px;
}

/* Indicate state in top menu */
/* State identifiers are set in the page form, field PageSection */
.news #topmenu ul li#topmenunews a,
.blog #topmenu ul li#topmenublog a,
.about #topmenu ul li#topmenuabout a,
.jobs #topmenu ul li#topmenujobs a,
.faq #topmenu ul li#topmenufaq a,
.contact #topmenu ul li#topmenucontact a {
	color:#3f4e67;
}

/* Indicate state in footer menu */
.legal #footer ul li#footermenulegal a {
	color:#3f4e67;

}

/* Main content */

// #mainmenu,				/* KOSADA-2009 */
#contentOuter,
#contentBottom {
	width:1000px;			/* KOSADA-2009 */
}

#topbar,						/* added KOSADA-2009 */
#mainmenu,						/* added KOSADA-2009 */
#contentBottom,						/* added KOSADA-2009 */
#contentOuter {
	background-image:url(content_background.png);
	background-repeat:repeat-y;
	/* background image for IE6 is set in css.twikidotnetsite.tmpl */
}
#contentOuter {
	padding:0 0 20px 0;
}
#home #contentOuter {
	padding:0 0 30px 0;
}
#contentInner {
	margin:0 30px 0 30px;			/* KOSADA-2009 */
	padding:24px 10px 0 10px;
}
#home #contentInner {
	padding:10px 0 0 0;
}

#contentInner ul {
	margin-left:1em;
}
#contentBottom {
	height:19px; /* height of image, including shadow */		/* KOSADA-2009 */
	background-image:url(content_background_bottom.png);
	background-repeat:no-repeat;
	/* background image for IE6 is set in css.twikidotnetsite.tmpl */
}

/* Footer */

#footer {
	margin:4px 0;
	font-size:90%;
}
#footer ul {
	text-align:center;
}
#footer .separator {
	color:#b1bac9;		/* KOSADA-2009 */
}
#footer ul li {
	margin:0 4px;
}
#footer ul li,
#footer ul li a:link,
#footer ul li a:visited {
	text-decoration:none;
	color:#b1bac9;		/* KOSADA-2009 */
}
#footer ul li a:hover {
//	text-decoration:underline;	/* KOSADA-2009 */
	color:#d41f28		/* KOSADA-2009 */
}

/* buttons block can be used on any page */

#contentInner .buttons {}
#contentInner .buttons a,
#contentInner .buttons a:focus,
#contentInner .buttons a:active {
	outline:none;
	border:none;
	background-position:0px 0px;
}
#contentInner .buttons ul {
	list-style:none;
}
#home .buttons ul li {
	float:left;
	padding:0 10px;
	position:relative; z-index:1; /* to make the links clickable in IE6 */ 
}
#home .buttons ul li {
	margin:20px 0 0 0;
}
#contentInner .buttons ul li,
#contentInner .buttons ul li a {
	height:38px;
	display:block;
}
#contentInner .buttons ul li a {
	text-indent:-1234em;
}
#contentInner .buttons ul li.buttonwhy,
#contentInner .buttons ul li.buttonwhy a {
	width:150px;
    background-repeat:no-repeat;
}
#contentInner .buttons ul li.buttonwhy a {
	background-image:url(button_why.gif);
}
#contentInner .buttons ul li.buttonwhy a:link,
#contentInner .buttons ul li.buttonwhy a:visited {
	background-position:0px 0px;
}
#contentInner .buttons ul li.buttonwhy a:hover {
	background-position:-150px 0px;
}
#contentInner .buttons ul li.buttonsay,
#contentInner .buttons ul li.buttonsay a {
	width:233px;
}
#contentInner .buttons ul li.buttonsay a {
	background-image:url(button_say.gif);
}
#contentInner .buttons ul li.buttonsay a:link,
#contentInner .buttons ul li.buttonsay a:visited {
	background-position:0px 0px;
}
#contentInner .buttons ul li.buttonsay a:hover {
	background-position:-233px 0px;
}
#contentInner .buttons ul li.buttontry,
#contentInner .buttons ul li.buttontry a {
	width:117px;
}
#contentInner .buttons ul li.buttontry a {
	background-image:url(button_try.gif);
}
#contentInner .buttons ul li.buttontry a:link,
#contentInner .buttons ul li.buttontry a:visited {
	background-position:0px 0px;
}
#contentInner .buttons ul li.buttontry a:hover {
	background-position:-117px 0px;
}

.section {
	padding:10px 0px 10px 0px;			/* KOSADA-2009 */
	width:940px; /* 745 - 10 - 10 */		/* KOSADA-2009 */
	_width:939px; /* for IE6 */			/* KOSADA-2009 and i've no idea if it's right */
	margin:20px -10px 0 -10px;
	background-image:url(background_section.png);	/* KOSADA-2009 */
	background-repeat:no-repeat;
}
.section h2 {
	margin-top:0;
	margin-bottom:0;
}
.section .buttons ul li {
	float:right;
	padding:0 10px;
	position:relative; z-index:1; /* to make the links clickable in IE6 */ 
}
.introduction {
	font-weight:bold;
	font-size:110%;
}
.small {
	font-size:90%;
}
.imagewide {
	margin:13px -10px 10px -10px;
	width:555px;
	clear:all;
}
.imagewide .halfimage {
	float:left;
	display:block;
	width:270px;
}
.imagewide .leftimage {
	margin-right:15px;
}
.imageside {
	margin:0 -10px 10px -10px;
	float:left;
	width:175px;
	margin-right:15px;
}
.imageright {
	float:right;
	margin-right:-10px;
}

/* Generally useful */

/* Rounded buttons */

#contentInner a.button:link,
#contentInner a.button:visited {
	background-image:none;
}
#contentInner .buttons .button {
	/* default right margin */
	margin:0 15px 0 0;
	text-align:center;
}
#contentInner a.button {
	float:left;
	padding:0 0 0 9px;
	margin:0 0 20px 0;
	font-size:1.05em;
	font-weight:bold;
	text-align:center;
	line-height:1.05em;
	text-decoration:none;
	white-space:nowrap;
}
#contentInner a.button:link,
#contentInner a.button:visited {
	background-position:0 0;
}
#contentInner a.button span {
	float:left;
	margin:0 -9px 0 0;
	padding:9px 0 0 0;
	background-position:100% 0;	
	cursor:pointer;position:relative;;
}
#contentInner a.button span span {
	float:left;
	margin:0 0 -9px 0;
	padding:0 12px 0 0;
	background-position:100% 100%;	
}
#contentInner a.button span span span {
	float:left;
	margin:0 0 0 -9px;
	padding:0 6px 12px 15px;
	background-position:0 100%;	
}
#contentInner a.button span span span span {
	float:left;
	text-decoration:none;
	margin:0;
	padding:0;
	background:none !important;
}
#contentInner a.button:hover span span span {
	text-decoration:none;
}

/* Orange button */
#contentInner a.buttonOrange span span span span {
	color:#fff;
}
#contentInner a.buttonOrange:link,
#contentInner a.buttonOrange:visited,
#contentInner a.buttonOrange span {
	background-image:url("button_orange.gif");
}
#contentInner a.buttonOrange:hover,
#contentInner a.buttonOrange:hover span {
	background-image:url("button_orange_over.gif");
}

/* Gray button */
#contentInner a.buttonGray span span span span {
	color:#273348;
}
#contentInner a.buttonGray:link,
#contentInner a.buttonGray:visited,
#contentInner a.buttonGray span {
	background-image:url("button_gray.gif");
}
#contentInner a.buttonGray:hover,
#contentInner a.buttonGray:hover span {
	background-image:url("button_gray_over.gif");
}

/* Dark gray button */
#contentInner a.buttonDarkGray span span span span {
	color:#fff;
}
#contentInner a.buttonDarkGray:link,
#contentInner a.buttonDarkGray:visited,
#contentInner a.buttonDarkGray span {
	background-image:url("button_dark_gray.gif");
}
#contentInner a.buttonDarkGray:hover,
#contentInner a.buttonDarkGray:hover span {
	background-image:url("button_dark_gray_over.gif");
}

/* Horizontal bullet lists */

.horizontalList ul {
	list-style:none;
	white-space:nowrap;
}
.horizontalList li {
	display:inline;
}

/* Vertical centering */
.vCenterOuter {overflow:hidden; position:relative;}
.vCenter[id] {display:table; position:static;}

.vCenterMiddle {position:absolute; top:50%;} /* for explorer only*/
.vCenterMiddle[id] {display:table-cell; vertical-align:middle; position:static;}

.vCenterInner {position:relative; top:-50%} /* for explorer only */
/* optional:#inner[id] {position:static;} */


/* Grids code by Yahoo */

/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version:2.2.0
*/

/*grids.css*/
#ft {
	clear:both;
}
#text,
#doc2,
#doc3,
.yui-t1,
.yui-t2,
.yui-t3,
.yui-t4,
.yui-t5,
.yui-t6,
.yui-t7 {
	margin:auto;
	text-align:left;
	width:57.69em;
	*width:56.3em;
	min-width:750px;
}
#doc2 {
	width:73.074em;
	*width:71.313em;
	min-width:950px;
}
#doc3 {
	margin:auto 10px;
	width:auto;
}
.yui-b {
	position:relative;
}
.yui-b {
	_position:static;
}
#yui-main .yui-b {
	position:static;
}
#yui-main {
	width:100%;
}
.yui-t1 #yui-main,
.yui-t2 #yui-main,
.yui-t3 #yui-main {
	float:right;
	margin-left:-25em;
}
.yui-t4 #yui-main,
.yui-t5 #yui-main,
.yui-t6 #yui-main {
	float:left;
	margin-right:-25em;
}
.yui-t1 .yui-b {
	float:left;
	width:12.3207em;
	*width:12.0106em;
}
.yui-t1 #yui-main .yui-b {
	margin-left:13.3207em;
	*margin-left:13.0106em;
}
.yui-t2 .yui-b {
	float:left;
	width:13.8456em;
	*width:13.512em;
}
.yui-t2 #yui-main .yui-b {
	margin-left:14.8456em;
	*margin-left:14.512em;
}
.yui-t3 .yui-b {
	float:left;
	width:23.0759em;
	*width:22.52em;
}
.yui-t3 #yui-main .yui-b {
	margin-left:24.0759em;
	*margin-left:23.52em;
}
.yui-t4 .yui-b {
	float:right;
	width:13.8456em;
	*width:13.512em;
}
.yui-t4 #yui-main .yui-b {
	margin-right:14.8456em;
	*margin-right:14.512em;
}
.yui-t5 .yui-b {
	float:right;
	width:18.4608em;
	*width:18.016em;
}
.yui-t5 #yui-main .yui-b {
	margin-right:19.4608em;
	*margin-right:19.016em;
}
.yui-t6 .yui-b {
	float:right;
	width:23.0759em;
	*width:22.52em;
}
.yui-t6 #yui-main .yui-b {
	margin-right:24.0759em;
	*margin-right:23.52em;
}
.yui-t7 #yui-main .yui-b {
	display:block;
	margin:0 0 1em 0;
}
#yui-main .yui-b {
	float:none;
	width:auto;
}
.yui-g .yui-u,
.yui-g .yui-g,
.yui-gc .yui-u,
.yui-gc .yui-g .yui-u,
.yui-ge .yui-u,
.yui-gf .yui-u {
	float:right;
	display:inline;
}
.yui-g div.first,
.yui-gc div.first,
.yui-gc div.first div.first,
.yui-gd div.first,
.yui-ge div.first,
.yui-gf div.first {
	float:left;
}
.yui-g .yui-u,
.yui-g .yui-g {
	width:49.1%;
}
.yui-g .yui-g .yui-u,
.yui-gc .yui-g .yui-u {
	width:48.1%;
}
.yui-gb .yui-u,
.yui-gc .yui-u,
.yui-gd .yui-u {
	float:left;
	margin-left:2%;
	*margin-left:1.895%;
	width:32%;
}
.yui-gb div.first,
.yui-gc div.first,
.yui-gd div.first {
	margin-left:0;
}
.yui-gc div.first,
.yui-gd .yui-u {
	width:66%;
}
.yui-gd div.first {
	width:32%;
}
.yui-ge .yui-u {
	width:24%;
}
.yui-ge div.first,
.yui-gf .yui-u {
	width:74.2%;
}
.yui-gf div.first {
	width:24%;
}
.yui-ge div.first {
	width:74.2%;
}
#bd:after,
.yui-g:after,
.yui-gb:after,
.yui-gc:after,
.yui-gd:after,
.yui-ge:after,
.yui-gf:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
#bd,
.yui-g,
.yui-gb,
.yui-gc,
.yui-gd,
.yui-ge,
.yui-gf {
	zoom:1;
}

/* Site customizations */

.yui-gb .yui-u,
.yui-g .rightsmallcol,
.yui-ge .rightsmallcol {
	padding:0;
}
.yui-gb {				/* added KOSADA-2009 - this is worse than most of the hacks already in here - */
	width:940px;			/* added KOSADA-2009 - it's to fix a particular page (the 'why twiki' one) */
}					/* added KOSADA-2009 */
.yui-gb .yui-u {
	padding-left:10px;
	padding-right:10px;
	width:325px; 			/* KOSADA-2009 */
	margin-left:15px;
}
.yui-gb div.first {
	margin-left:0px;
}
.yui-g .rightsmallcol,
.yui-ge .rightsmallcol {
	padding-left:20px;			/* KOSADA-2009 */
	padding-right:20px;			/* KOSADA-2009 */
	min-width:180px; /* 220 -20 -20 */	/* KOSADA-2009 (was width, not min-width, but the 'products' page was breaking on me */
	_width:178px; /* for IE6 */		/* KOSADA-2009 and i've no clue if it's right, especially given the modification to the last line */
}
.yui-g .yui-gb .rightsmallcol {			/* added KOSADA-2009 - because the fix for the 'products' page broke the 'why twiki' page */
	width:180px;				/* added KOSADA-2009 - all this hacking the YUI grid stuff makes for a real mess */
}						/* added KOSADA-2009 - but I dare not try to fix it right now */
.yui-ge {
	width:940px;			/* KOSADA-2009 */
	_width:939px; /* for IE6 */	/* KOSADA-2009 and i've no clue if it's right */
}
.yui-ge div.first {
//	padding-left:10px;		/* KOSADA-2009 */
//	padding-right:10px;		/* KOSADA-2009 */
	width:680px;			/* KOSADA-2009 */
}
.yui-ge div.first .section {
	width:555px;
	background-image:url(background_section_leftwide.gif);
	background-repeat:no-repeat;
}
.columnwide {
	background-image:url(column_wide_background.png);	/* KOSADA-2009 */
	background-repeat:no-repeat;
	width:700px;
}
.rightsmallcol {
	background-image:url(column_small_background.gif);
	background-repeat:no-repeat;
}
.rightsmallcol h3 {
	color:#3f4e67;		/* KOSADA-2009 */
}
.column2part {
	background-image:url(column_2part_background.png);	/* KOSADA-2009 */
	background-repeat:no-repeat;
}

#text {
	margin:20px -10px 0 -10px;
}
#home #text {
	margin:20px 0 0 0;
}
#text .image {
	float:left;
	margin:4px 0 0 7px;
	width:80px;
	height:80px;
	background-repeat:no-repeat;
}
#text ul {
	margin-left:15px;
}


/* PAGE SPECIFIC */

/* PAGE Home */

#splash {
	position:relative;
	background-image:url(home_splash_background.jpg);
	background-repeat:no-repeat;
	height:291px;
	width:745px;
	margin:0 -1px 0 0; /* to prevent IE6 to bulge out to the right */
}
#splash h1 {
	position:absolute;
	margin:0;
	padding:0;
    width:100%;
	height:98px;
	display:block;
	background-image:url(home_splash_header_small.gif);
    background-repeat:no-repeat;
	text-indent:-1234em;
}

/* "Try for free" image */
#splash ul#tryforfree {
	position:absolute;
	width:180px;
	height:122px;
	list-style:none;
	margin:0;
}
#splash ul#tryforfree li,
#splash ul#tryforfree a {
	height:122px;
	display:block;
	text-indent:-1234em; 
}
#splash ul#tryforfree a {
	background-image:url(home_splash_ctva.gif);
    background-repeat:no-repeat;
	background-position:0px 0px;
}
#splash ul#tryforfree a:hover {
	background-position:-180px 0px;
}

/* Tabs */

/* Left side */
#benefits {
	position:absolute;
	top:117px;
	left:7px;
	background-image:url(home_tabs_background.png);
    background-repeat:no-repeat;
}
#splash #benefits {
	width:737px;
	height:171px;
}
#benefits ul {
	overflow:hidden;
}
#benefits ul#lefttabs {
	margin:0;
	padding:4px 11px 12px 5px; /* shadow border */
	list-style:none;
	white-space:nowrap;
}
#benefits ul#lefttabs {
	/* subtract padding */
	width:721px; /* 737 - 11 - 5 */
	height:155px; /* 171 -4 - 12 */
}
#benefits ul#lefttabs li {
	font-style:italic;
	vertical-align:middle;
}
#benefits ul#lefttabs li {
	width:274px;
}
#benefits ul#lefttabs li a.tab {
	position:relative; z-index:1; /* to make the links clickable after having used AlphaImageLoader in IE6 */ 
	font-size:15.5px;
	font-weight:bold;
	display:block;
	padding-left:14px;
	color:#7d8ca5;
	text-decoration:none;
}
#benefits ul#lefttabs li a.tab strong {
	color:#3f4e67;
}
#benefits ul#lefttabs li a.tab:hover,
#benefits ul#lefttabs li a.tab:hover strong,
#benefits ul#lefttabs li a.hover,
#benefits ul#lefttabs li a.hover strong {
	color:#d41f28;
	text-decoration:none;
}
#benefits ul#lefttabs li#top a.tab {
	height:50px;
	line-height:50px;
	border-bottom:2px solid #ebedf1;
	background-image:url(home_tabs_shade_background.gif);
	background-repeat:no-repeat;
	background-position:0px 0px;
}
#benefits ul#lefttabs li#middle a.tab {
	height:51px;
	line-height:51px;
	border-bottom:2px solid #ebedf1;
	background-image:url(home_tabs_shade_background.gif);
	background-repeat:no-repeat;
	background-position:0px -80px;
}
#benefits ul#lefttabs li#bottom a.tab {
	height:50px;
	line-height:50px;
	background-image:url(home_tabs_shade_background.gif);
	background-repeat:no-repeat;
	background-position:0px -160px;
}
#benefits ul#lefttabs li#top a.tab:hover,
#benefits ul#lefttabs li#middle a.tab:hover,
#benefits ul#lefttabs li#bottom a.tab:hover {
	background-position:0px -999px;
}

/* Right side */
#benefits ul#lefttabs li ul {
	list-style:none;
	position:absolute;
	margin:0;
	padding:10px 0;
	top:4px; /* top shadow border */
	left:276px;
	width:450px;
	height:135px; /* 155 - 2* 10px */
	background:none;
}
#benefits ul#lefttabs li ul li {
	padding:2px 50px;
	font-size:14px;
	font-style:italic;
	font-weight:bold;
	vertical-align:middle;
	color:#3f4e67;
}
#benefits ul#lefttabs li ul {
	display:none; /* only show on rollover... */
}
#benefits ul#lefttabs li:hover ul,
#benefits ul#lefttabs li ul:hover {
	display:block;
}
#benefits ul#lefttabs li#top ul {
	background-image:url(home_tab_portrait1.gif);
	background-repeat:no-repeat;
	background-position:100% 0px;
}
#benefits ul#lefttabs li ul a {
	font-size:12px;
	font-weight:normal;
	font-style:normal;
	text-decoration:none;
}
#benefits ul#lefttabs li ul a:link,
#benefits ul#lefttabs li ul a:visited {
	color:#7d8ca5;
	background-position:-1200px 100%;
}
#benefits ul#lefttabs li ul a:hover {
	color:#d41f28;
	background-position:-600px 100%;
}


/* news column homepage */
#text .newsbites ul {
	list-style:none;
	margin:0;
}
#text .newsbites li {
	margin:0 0 .5em 0;
}
#text .newsbites li a:link,
#text .newsbites li a:visited {
	font-weight:bold;
	color:#f60;
	background-position:-1800px 100%;
}
#text .newsbites a:link,
#text .newsbites a:visited {
	color:#7d8ca5;
	background-position:-1200px 100%;
}
#text .newsbites li a:hover,
#text .newsbites a:hover {
	color:#d41f28;
	background-position:-600px 100%;
}
#text .newsbites p {
	margin:1.5em 0 0 0;
}
#home #text h2 .what a:link,
#home #text h2 .what a:visited {
	font-size:80%;
	font-weight:normal;
	color:#f60;
	background-position:-1800px 100%;
}
#home #text h2 .what a:hover {
	color:#d41f28;
	background-position:-600px 100%;
}
#home #text h2 {
	font-size:115%;
	font-weight:bold;
	margin:15px 0 8px 0;
}
#home #text h2 {
	color:#3f4e67;
}
#home #text h2 a:link,
#home #text h2 a:visited {
	color:#3f4e67;
	background-position:0px 100%;
}
#home #text h2 a:hover {
	color:#d41f28;
	background-position:-600px 100%;
}

/* PAGE Why */

ul#properties {
	list-style:none;
	margin:38px 0 20px 0;
	font-size:110%;
	width:445px;
}
ul#properties li {
	font-weight:bold;
	padding:0 0 20px 90px;
}
ul#properties li ul {
	list-style:none;
	margin:0;
}
ul#properties li ul li {
	font-weight:normal;
	margin:0;
	padding:0;
}
ul#properties li#installs {
	background-image:url(image_benefits.gif);
	background-repeat:no-repeat;
	background-position:0px 0px;
}
ul#properties li#communication {
	background-image:url(image_benefits.gif);
	background-repeat:no-repeat;
	background-position:0px -200px;
}
ul#properties li#business {
	background-image:url(image_benefits.gif);
	background-repeat:no-repeat;
	background-position:0px -400px;
}
ul#properties li#certified {
	background-image:url(image_benefits.gif);
	background-repeat:no-repeat;
	background-position:0px -600px;
}
ul#properties a:link,
ul#properties a:visited {
	color:#7d8ca5;
	background-position:-1200px 100%;
}
ul#properties a:hover {
	color:#d41f28;
	background-position:-600px 100%;
}
#why #screen {
	margin-right:-10px;
}
#why .buttons ul li {
	margin:0;
}
#why #text h2 {
	font-size:140%;
	color:#3f4e67;
	margin-bottom:20px;
	font-weight:normal;
}
#why #text ul li {
	margin-bottom:5px;
}
#why #text {
	z-index:1;
}
#why #triggerfeaturelist {
	position:relative;
	width:745px;
	margin:0 -1px 0 0; /* to prevent IE6 to bulge out to the right */
	margin:0 -10px 30px -10px;
	height:47px;
	background-image:url(trigger_feature_list.gif);
	background-repeat:no-repeat;
	margin-top:-30px;
}
#why #triggerfeaturelist a {
	position:absolute;
	top:15px;
	left:217px;
	font-weight:bold;
}

/* PAGE Customers */

.speechBalloon {
	width:555px;
	margin:32px 5px;
}

.speechBalloonTop {
	background-image:url(speech_balloon_top.gif);
	background-repeat:none;
	padding:10px 0 0 0;
}
.speechBalloon p {
	margin:0 10px;
	padding:0 0 0 90px;
	background-repeat:no-repeat;
}
.speechBalloon p b,
.speechBalloon p strong {
	display:block;
	margin:0 0 2px 0;
}
.speechBalloonBottom {
	background-image:url(speech_balloon_bottom.gif);
	background-repeat:none;
	width:555px;
	height:25px;
}
.rightsmallcol {
	margin-bottom:32px;
}
.rightsmallcol h2,
.rightsmallcol h3 {
	color:#3F4E67;
}

/* PAGE News */

#news .newsItem {
	margin:0 -10px 30px -10px;
	padding:18px 10px 0 10px;
}
#news .newsItem a:link,
#news .newsItem a:visited {
	color:#7d8ca5;
	background-position:-1200px 100%;	
}
#news .newsItem a:hover {
	color:#d41f28;
	background-position:-600px 100%;
}
#news .newsItem p {
	margin:8px 0 3px 0;
	line-height:150%;
}
#news .newsItem b,
#news .newsItem strong {
	display:block;
	margin:0 0 5px 0;
	font-size:115%;
}
#news .rightsmallcol ul {
	list-style:none;
	margin:10px 0;
}
#news .rightsmallcol li {
	padding-left:1em;
	background-repeat:no-repeat;
	background-position:0 .5em;
	background-image:url(bullet_news_archive.gif);
	background-repeat:no-repeat;
	background-position:0 .4em;
}
#news .rightsmallcol li.selected {
	font-weight:bold;
	background-image:url(bullet_news_archive_selected.gif);
	color:#d41f28;
}


/* PAGE Pricing */

#pricing #contentInner {
	background-image:url(pricing_woman.gif);
	background-repeat:no-repeat;
	background-position:100% 100%;
}
#pricing .introduction {
	font-weight:normal;
	margin:22px 0 0 0;
}
#contentInner .comparisonTable {
	width:745px;
	_width:744px; /* for IE6 */
	margin:15px -10px;
}
#contentInner .comparisonTable table {
	margin:0;
	padding:0;
	border:0;
	width:100%;
	font-size:100%;
	background-image:url(pricing_table_background.gif);
	background-repeat:repeat-x;
	background-position:0px 100%;
}
#contentInner .comparisonTable th,
#contentInner .comparisonTable td {
	padding-left:3px;
	padding-right:3px;
	font-weight:normal;
	width:169px; /* 175 - 3 - 3 */
	border-bottom:1px solid #d8dce4;
	vertical-align:top;
	text-align:center;
	line-height:140%;
}
#contentInner .comparisonTable th.labels,
#contentInner .comparisonTable td.labels,
#contentInner .comparisonTable th.space,
#contentInner .comparisonTable td.space {
	background-color:#fff;
}
#contentInner .comparisonTable tr.headers th {
	padding-top:13px;
	padding-bottom:7px;
}
#contentInner .comparisonTable td {
	padding:8px 3px;
}
#contentInner .comparisonTable td.labels {
	text-align:right;
}
#contentInner .comparisonTable th.space,
#contentInner .comparisonTable td.space {
	width:15px;
	border:none;
	padding:0;
}
#contentInner .comparisonTable tr.last td.space {
	border-bottom:1px solid #d8dce4;
}
#contentInner .comparisonTable tr.headers th.labels {
	background-image:url(pricing_table_screen.gif);
	background-repeat:no-repeat;
	height:102px;
}
#contentInner .comparisonTable tr.headers th.columnOne,
#contentInner .comparisonTable tr.headers th.columnTwo,
#contentInner .comparisonTable tr.headers th.columnThree {
	background-image:url(pricing_table_top_background.gif);
	background-repeat:no-repeat;
}
#contentInner .comparisonTable tr.headers {
	font-size:100%;
}
#contentInner .comparisonTable tr.headers b,
#contentInner .comparisonTable tr.headers strong {
	display:block;
	font-size:130%;
	color:#d41f28;
}
#contentInner .comparisonTable tr.headers .small {
	font-size:100%;
	color:#d41f28;
	font-weight:bold;
}
#contentInner .comparisonTable tr.headers th {
	padding-left:0;
	padding-right:0;
}
#contentInner .comparisonNo,
#contentInner .comparisonYes {
	display:block;
	text-align:center;
	text-indent:-1234em;
	background-repeat:no-repeat;
	background-image:url(pricing_icon_yesno_higher.gif);
}
#contentInner .comparisonNo {
	background-position:0px -100px;
}
#contentInner .comparisonYes {
	background-position:0px 0px;
}
/* smaller rounded buttons in table */
#contentInner .comparisonTable .button {
	font-size:100%;
}

/* Center align left-floating buttons */

#contentInner .comparisonTable .buttonContainerInner {
	position:relative;
	left:50%;
	float:left;
}
#contentInner .comparisonTable .buttonContainer p {
	position:relative;
	right:50%;
}
.alreadyuser {
	background-image:url(pricing_already_user_background.gif);
	background-repeat:repeat-x;
	background-position:0px 100%;
	border-bottom:1px solid #d8dce4;
	padding:20px;
	font-size:110%; /* same as #contentInner .comparisonTable table */
	text-align:center;
}
.alreadyuser strong,
.alreadyuser b {
	color:#d41f28;
}
.how {
	width:520px;
}
.how h2 {
	font-weight:bold;
	margin-top:0;
	padding-top:0;
}

/* New styles 5 Sep 2007

/* TablePlugin */
.twikiTable {
	border-style:solid;
	border-width:1px;
	margin:1em 0;
	border-collapse:collapse;
}
.twikiTable td {
	padding:.35em 1em;
	border-width:1px;
}
.twikiTable th {
	border-left-style:solid;
	border-width:1px;
	padding:.35em 1em;
}
.twikiTable th.twikiFirstCol {
	border-left-style:none;
}
.twikiTable a:link,
.twikiTable a:visited {
	text-decoration:underline;
}
.twikiTable a:hover {
	text-decoration:underline;
}
/* Table colors */
.twikiTable,
.twikiTable td {
	border-color:#e7e9ef;
}
.twikiTable th {
	border-color:#fff;
}
.twikiTable th.twikiFirstCol {
	border-left-color:#f4f5f9;
}
.twikiTable th.twikiLastCol {
	border-right-color:#f4f5f9;
}
#contentInner .twikiTable th a:link,
#contentInner .twikiTable th a:visited,
#contentInner .twikiTable th a font {
	color:#252b37;
}
#contentInner .twikiTable th a:link,
#contentInner .twikiTable th a:visited {
	text-decoration:none;
	background-image:none;
	border-bottom:1px solid #a9b4c8;
}
/* Table background graphics */
.twikiTable th {
	background-image:url(bg_table_header_gradient.gif);
	background-repeat:repeat-x;
}
.twikiTable th.twikiSortedCol {
	background-image:url(bg_table_header_sorted_gradient.gif);
	background-repeat:repeat-x;
}

/* Ruler */
hr {
	height:0px;			/* KOSADA-2009 */
	border:none;
	color:#cdd4de;			/* KOSADA-2009 */
	background-color:#cdd4de;	/* KOSADA-2009 */
}

.rightsmallcol hr {			/* added KOSADA-2009 */
	height:1px;			/* added KOSADA-2009 */
	margin-left:-22px;		/* added KOSADA-2009 */
	width:220px;			/* added KOSADA-2009 */
}					/* added KOSADA-2009 */


/* Numbered list */
#contentInner ul {
	margin-left:18px;
}
#contentInner ol {
	margin-left:25px;
}



/*
 *
 * the following is all KOSADA-2009
 *
 */

.bluecheckbox ul {
//	list-style-image:url('bluecheckbox.png');
	list-style:none;
	margin:0;
}
.bluecheckbox li {
	margin-bottom:10px;
	background-image:url('bluecheckbox.png');
	background-repeat:no-repeat;
	background-position: 0px 2px;
	padding-left:23px;
	min-height:20px;
}
.greycheckbox ul {
//	list-style-image:url('greycheckbox.png');
	list-style:none;
	margin:0;
}
.greycheckbox li {
	margin-bottom:10px;
	background-image:url('greycheckbox.png');
	background-repeat:no-repeat;
	background-position: 0px 2px;
	padding-left:23px;
	min-height:20px;
}


/*
 * the following is all KOSADA-2009, and is related to
 * BannerPlugin and ActionButtonPlugin (which couldn't
 * use their own CSS files on twiki.net because the
 * publishing plugin they use obliterates anything in the
 * <head> of the document
 */

        .actionbutton
        {
                width:226px;
                height:58px;
                margin-top:2px;
                margin-bottom:10px;
                margin-left:-2px;
                margin-right:-4px;
                overflow:hidden;
                background-image:url('actionbutton.png');
        }
        .actionbuttoncol .actionbutton
        {
                margin-left:-22px;
        }
        .actionbuttonname
        {
                font-weight:bold;
                margin-left:14px;
                margin-top:10px;
                height:20px;
                margin-bottom:-30px;
                width:165px;
                overflow:hidden;
                margin-right:-173px;
                padding:0;
        }
        .actionbuttontext
        {       
                margin-left:14px;
                margin-top:28px;
                height:20px;
                margin-bottom:-48px;
                width:165px;
                overflow:hidden;
                margin-right:-173px;
                padding:0;
        }
        .actionbuttonrollover
        {
                opacity:0;
                filter:alpha(opacity=0); // IE has to be different of course
        }
        .actionbuttoncol
        {
                background-image:none;
        }


	.slideshowwrapper {
		padding:0;
		margin:0;
		margin-bottom:20px;
		height:280px;
		width:700px;
		overflow:hidden;
	}
        .slideshow {
		position:absolute;
		padding:0;
		margin:0;
                height: 280px;
                width: 700px;
                overflow:hidden;
                background-color:#e1e5e6;
        }
        .slideshow .slide {
		position:absolute;
		padding:0;
		margin-left:0;
		margin-top:0;
                height: 280px;
                width: 700px;
                margin-right: -700px;
                margin-bottom: -280px;
                overflow:hidden;
        }
        .overlay {
		position:absolute;
		padding:0;
                height: 115px;
                width: 660px;
                margin-left: 20px;
                margin-top: 135px;
                margin-right: -680px;
                margin-bottom: -250px;
        }
        .startquote {
		position:absolute;
                height:80px;
                padding-top:10px;
                width:30px;
                margin-left: 53px;
                margin-right: -83px;
                margin-top: 145px;
                margin-bottom: -225px;
        }
        .quote {
		position:absolute;
                font-size:36px;
                color:white;
                font-family:arial,sans-serif;
                height: 90px;
                width: 360px;
                margin-left: 85px;
                margin-right: -425px;
                margin-top: 148px;
                margin-bottom: -238px;
		line-height:normal;
		overflow:hidden;
        }
	.quotesmalltext {
		position:absolute;
                font-size:22px;
                color:white;
                font-family:arial,sans-serif;
                height: 79px;
                width: 360px;
                margin-left: 85px;
                margin-right: -425px;
                margin-top: 148px;
                margin-bottom: -238px;
		line-height:normal;
		overflow:hidden;
	}
	.quote img {
		position:absolute;
		margin-top:9px;
		margin-left:10px;
	}
	.quotesmalltext img {
		position:absolute;
		margin-top:5px;
		margin-left:10px;
	}
        .quotelogo {
		position:absolute;
                overflow:hidden;
                height: 33px;
                width: 100px;
                margin-top: 157px;
                margin-bottom: -190px;
                margin-left: 485px;
                margin-right: -585px;
        }
        .quotelink {
		position:absolute;
                font-size:15px;
                color:white;
                font-family:arial,sans-serif;
                height: 20px;
                width: 180px;
         	margin-top: 207px;
                margin-bottom: -227px;
                margin-left: 485px;
                margin-right: -665px;
        }
        .quotelink a:link,
	.quotelink a:visited,
        #contentInner .quotelink a:link,
	#contentInner .quotelink a:visited
	{
                color:white;
                text-decoration:none;
		background-image:none;
        }
        .actiontitle {                                                                           
		position:absolute;
                font-family:arial,verdana,sans-serif;
                font-size:33px;
                color:white;
                height:32px;
                width:610px;
                margin-top: 165px;
                margin-bottom:-197px;
                margin-left:45px;
                margin-right:-655px;
                text-align:center;
        }
        .actionlink {
		padding:0;
		position:absolute;
                font-family:arial,verdana,sans-serif;
                font-size:19px;
                color:white;
                height:20px;
                width:610px;
                margin-top:205px;
                margin-bottom:-225px;
                margin-left: 45px;
                margin-right:-665px;
                text-align:center;
        }
	.actionlink a:link,
	.actionlink a:visited,
	#contentInner .actionlink a:link,
	#contentInner .actionlink a:visited
	{
                color:white;
                text-decoration:none;
		background-image:none;
	}
        #nav {
		padding:0;
		position:absolute;
		margin-top:252px;
		padding-top:0px;
		margin-left:17px;
		height:20px;
		width:666px;
                font-size:23px;
                font-family:arial,sans-serif;
		line-height:1em;
		z-index:10;
        }
        #nav a {
                color:#818285;
                text-decoration:none;
                margin:3px;
        }
	#nav a:link,
	#nav a:visited {
		background-image:none;
		color:#818285;
	}
        #nav a:hover, #nav a.activeSlide {
                color:white;
        }
        .slideshowcorneroverlay img {
        }
        .slideshowcorneroverlay {
		position:absolute;
                height:280px;
                width:700px;
		margin-bottom:-280px;
		margin-right:-700px;
        }