/* NEW TEXT */

a, a:visited {
	color: #00a0f0;
}

h3 {
	margin-bottom: 0;
	margin-top: 15px;
}

.quote, .pullquote {
        font-size: 16px;
        line-height: 20px;
        color: #666;
        font-family: georgia, times, serif;
        border-top: 1px dotted #bbb;
        padding: 10px;
}

.quote .byline, .pullquote .byline {
        font-size: 11px;
        background-color: transparent;
        color: #999999;
        font-family: arial,helvetica,sans-serif;
}

.pullquote {
	border-top: 0px;
	border-bottom: 1px dotted #bbb;
	color: #666666;
	font: italic 14px/20px Georgia, serif;
}

.bulletpoints {
	float: left;
	font-size: 14px;
	font-weight: bold;
	width: 270px;
	color: #555;
}

.bulletpoints ul li {
padding:3px 0;

}


/* CSS GRID */
/* Sets up basic grid floating and margin. */
.column, div.span-1, div.span-2, div.span-3, div.span-4, div.span-5, div.span-6, div.span-7, div.span-8, div.span-9, div.span-10, div.span-11, div.span-12, div.span-13, div.span-14, div.span-15, div.span-16, div.span-17, div.span-18, div.span-19, div.span-20, div.span-21, div.span-22, div.span-23, div.span-24 {
	float: left;
	margin-right: 10px;
	font: 15px/1.3 Arial,helvetica,sans-serif;	
	color: #222;
	font-weight: normal;

}

/* Use these classes to set the width of a column. */
.span-1 {width: 28px;}
.span-2 {width: 66px;}
.span-3 {width: 104px;}
.span-4 {width: 142px;}
.span-5 {width: 180px;}
.span-6 {width: 218px;}
.span-7 {width: 256px;}
.span-8 {width: 294px;}
.span-9 {width: 332px;}
.span-10 {width: 370px;}
.span-11 {width: 408px;}
.span-12 {width: 446px;}
.span-13 {width: 484px;}
.span-14 {width: 522px;}
.span-15 {width: 560px;}
.span-16 {width: 598px;}
.span-17 {width: 636px;}
.span-18 {width: 674px;}
.span-19 {width: 712px;}
.span-20 {width: 750px;}
.span-21 {width: 788px;}
.span-22 {width: 826px;}
.span-23 {width: 864px;}
.span-24, div.span-24 { width:926px; margin-right:0; }

/* The last column in a row needs this class. */
.last, div.last { margin-right: 0 !important; }

/* END GRID */

#header #psIcon {
	margin-top: 10px;
}

ul#tn { list-style-type: none; margin-bottom: 20px;}

#tn-first, #tn-overview, #tn-organize, #tn-build, #tn-promote, #tn-sell, #tn-distribute, #tn-examples, #tn-pricing, #tn-last {
	background: transparent url(/img/nav/tourNav2.png) no-repeat 0 0;
	width: 100px;
	height: 35px;
	float: left;
}

#tn-overview a, #tn-organize a, #tn-build a, #tn-promote a, #tn-sell a, #tn-distribute a, #tn-examples a, #tn-pricing a, #tn-last a {
	text-indext: -9999px;
	display: block;
	overflow: hidden;
}

#tn-first {
	width: 20px;
}

#tn-overview {
	background-position: -20px 0;
}

#tn-overview:hover {
	background-position: -20px -35px;
}

#tn-overview.on {
	background-position: -20px -70px;
}

#tn-organize {
	background-position: -120px 0;
}

#tn-organize:hover {
	background-position: -120px -35px;
}

#tn-organize.on {
	background-position: -120px -70px;
}

#tn-build {
	background-position: -220px 0;
}

#tn-build:hover {
	background-position: -220px -35px;
}

#tn-build.on {
	background-position: -220px -70px;
}


#tn-promote {
	background-position: -320px 0;
}

#tn-promote:hover {
	background-position: -320px -35px;
}

#tn-promote.on {
	background-position: -320px -70px;
}

#tn-sell {
	background-position: -420px 0;
}

#tn-sell:hover {
	background-position: -420px -35px;
}

#tn-sell.on {
	background-position: -420px -70px;
}


#tn-distribute {
	background-position: -520px 0;
}

#tn-distribute:hover {
	background-position: -520px -35px;
}

#tn-distribute.on {
	background-position: -520px -70px;
}

#tn-examples {
	background-position: -620px 0;
}

#tn-examples:hover {
	background-position: -620px -35px;
}

#tn-examples.on {
	background-position: -620px -70px;
}

#tn-pricing {
	background-position: -720px 0;
}

#tn-pricing:hover {
	background-position: -720px -35px;
}

#tn-pricing.on {
	background-position: -720px -70px;
}

#tn-last {
	width: 20px;
	background-position: -820px 0;
}

#tourNav {
	width: 100%;
	font-size: 11px;
	background: white url('/img/tour/tourNavbg.gif') repeat-x top left;
 
}

#tourNav UL {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

#tourNav LI {
	float: left;
	height: 50px;
	margin: 0;
	padding: 0;
}

#tourNav LI.last {
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	width: 20px;
}

#tourNav li.first {
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
	width: 20px;
}

#tourNav LI A {
	display: block;
	width: 100px;
	height: 22px;
	padding: 5px 0px;
	line-height: 22px;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	border-left: 1px solid #b8b8b8;
	border-right: 1px solid #f6f6f6;
	color: #666;

}

#tourNav LI A:hover {
	color: white;
	background-color: #f49c03;
}

#tourNav UL LI.on {
	background: #fff url(/img/tour/selected.gif) center 0 no-repeat;
}

#tourNav UL LI.on A {
	border-color: transparent;
	color: #fff;
}

#tourNav UL LI.on A:hover {
	background: none;
}

#maincol {
	-moz-border-radius-bottomleft:5px;
	-moz-border-radius-bottomright:5px;
	border: 1px solid #ddd;
	width: auto;
	padding: 15px;
	margin: 0 10px;
	background-color: #dbedf7;
}

h2, h3, h4 {
	color: #00a0f0;
}

h1.gray, h2.gray, h3.gray, h4.gray {
	color: #333;
}


h4.gray {
	margin-bottom: 0;
	font-size: 15px;
	font-weight: bolder;
}

h1 {
	letter-spacing: -0.05em;
	font-size: 40px;
	color:#373737;
	letter-spacing:-2px;
}

h4 { font-size: 16px; }

.right {
	position: relative;
	float: right;
}

.left {
	position: relative;
	float: left;
}

.col-full {
	position: relative;
	width: auto;
	padding: 15px 15px 0 15px;
	margin: 0;
}

.col-left {
	position: relative;
	float: left;
	width: 580px;
	font-size: 15px;
	padding: 15px;
	margin-top: 0px;
}

.col-right {
	position: relative;
	float: right;
	width: 280px;
}


.page-nav {
	width: auto;
	margin: 20px 10px 0 10px;
	clear: both;
}

.page-nav a {
	background: white url(/img/button/bg-page_nav-right-blue-lg.png) no-repeat scroll right top;
	color:#fff;
	display:block;
	float:left;
	font-size:11px;
	font-weight:bold;
	padding-right:9px;
	text-decoration: none;
}

.page-nav a strong {
	background: transparent url(/img/button/bg-page_nav-left-blue-lg.png) no-repeat scroll left top;
	display:block;
	line-height: 36px;
	color:#fff;
	padding-left: 9px;
}

.page-nav a:hover{
	text-decoration: underline;
}

.page-nav a.small strong {
	background:transparent url(/img/button/bg-page_nav-left.png) no-repeat scroll left top;
	line-height:24px;
	color:#333333;
	display:block;
	padding-left:9px;
}

.page-nav a.small {
	background:transparent url(/img/button/bg-page_nav-right.png) no-repeat scroll right top;
	color:#333333;
	display:block;
	float:left;
	font-size:11px;
	font-weight:bold;
	padding-right:9px;
	text-decoration: none;
}

.prevnext {
	margin: 0;
	padding: 0;
	width: 80px;
	height: 36px;
}

.prevnext a img {
	border: none;
}

.prevnext a.prev, prevnext a.prev:visited {
	background: #fff url(/img/tour/prevnext.gif) no-repeat 0 0;
	padding: 0;
}

.prevnext a.prev:hover {
	background-position: 0 -36px;
}

.prevnext a.next {
	background: #fff url(/img/tour/prevnext.gif) no-repeat -80px 0;
	padding: 0;
}

.prevnext a.next:hover {
	background-position: -80px -36px;
}

table.matrix {
	padding: 0;
	margin: 10px 0;
}

table.matrix, table.matrix td, table.matrix th {
	border: 1px solid #ddd;
	border-collapse: collapse;
}

table.matrix th, table.matrix td {
	padding: 5px;
	text-align: center;
}

table.matrix thead tr th {
	font-size: 24px;
	font-weight: bold;	
	color: #00a0f0;
}

table.matrix thead tr th .price {
	font-size: 11px;
	font-weight: normal;
	color: #777;
}

table.matrix thead tr th {
	position: relative;
	vertical-align: top;
	height: 80px;
}

table.matrix thead tr th .boxhack {
	position: relative;
	height: 80px;
	text-align: center;
}

table.matrix thead tr th .join {
	position: absolute;
	bottom: 0;
	left: 5px;
}

table.matrix th {
	vertical-align: bottom;
}

table.matrix .divider {
	color: white;
	background-color: #00a0f0;
	text-align: left;
	font-weight: bold;
	text-transform: uppercase;
}

table.matrix tbody tr:hover {
	background-color: #e9f8ff;
}

table.matrix thead tr th {
	background-color: #e9f8ff;
}

table.matrix td {
	width: 100px;
	font-size: 11px;
	color: #666;
}

table.matrix td.feature, table.matrix th.feature {
	width: 300px;
	text-align: left;	
	font-size: 13px;
}

table.matrix p, table.matrix li {
	font-size: 11px;
}


a.joinnow, a.joinnow:visited {
	position: absolute;
	width: 150px;
	height: 40px;
	right: 94px;
	top: 10px;
/* 
	blue version
	background: #404040 url(/img/tour/joinnow.gif) no-repeat 0 0;

*/
	background: #404040 url(/img/tour/joinnow-green.gif) no-repeat 0 0;

}

a.joinnow:hover {
	background-position: 0 -40px;
}

a.joinnow-sm, a.joinnow-sm:visited {
	background: #fff url(/img/tour/joinnow-sm.gif) no-repeat 0 0;
	width: 91px;
	height: 19px;
	display: block;
}

a.joinnow-sm:hover {
	background-position: 0 -19px;
}

a.starttrial, a.starttrial:visited {
	margin-left: 20px;
	width: 250px;
	height: 35px;
	background: #fff url(/img/tour/starttrial.png) no-repeat 0 0;
	display: block;
}

a.starttrial:hover {
	background-position: 0 -35px;
}

a.dollar, a.dollar:visited {
	margin-left: 20px;
	display:block;
	height:35px;
	width:250px;
	background: transparent url(/img/button/try-it-for-dollar.png) no-repeat scroll 0 0;
	text-indent: -9999px;
}

a.dollar:hover {
	background-position: 0 -35px;
}

.caption {
	font-size: 11px;
	color: #777;
	padding: 6px;
}


/* user examples */
ul.extab {
	list-style-type: none;
	padding: 0;
	margin: 0 10px;
}

ul.extab li {
	background: white url(/img/tour/example-on.gif) no-repeat scroll 0 0; 
	float: left;
	height: 37px; 
	width: 126px;
	margin-right: 3px;
	margin-bottom: 0;
}

ul.extab li.off {
	background: white url(/img/tour/example-off.gif) no-repeat scroll 0 0; 
}

ul.extab a {
	padding: 15px 10px; 
	text-transform: uppercase; 
	text-decoration: none;
	color: #00a0f0; 
	font-size: 10px; 
	font-weight: bold;
	display: block;
}

ul.extab a.on, ul.extab a.on:hover {
	color: #333;
}

ul.extab a:hover {
	color: white;
}

a.examples {font: italic 14px Georgia, serif; text-decoration:none;float:right;}

ul.examples {
	list-style-type: none;
	margin: 20px 0 0 0;
	padding: 0 20px;
	background-color: white;
	width: 830px;
	float: left;
        -moz-border-radius-bottomleft:5px;
        -moz-border-radius-bottomright:5px;
        -moz-border-radius-topleft:5px;
        -moz-border-radius-topright:5px;

}

ul.examples li {
	margin-bottom: 10px;
	color: #333;
	float: left;
	width: 370px;
	height: 370px;
	margin-right: 65px;
}

ul.examples li.rt {
	margin-right: 0;
}

ul.examples .photog a {
	font-weight: bold;
}

ul.examples li img {
	margin: 20px 0;
	border: 1px solid #eee;
}


DIV.blockToggle DIV {
	font-size: 12px;
}

/* evil hack for twitter-like login form in ie. for some reason it behaves differently on the tour pages than other pages */
/*#header .signin a#signin_button.ie {
	padding-top: 7px;
	padding-bottom: 5px;
}

#header #signin_menu.ie {
	right: 12px;
}*/