/**
 Product name styles
*/
strong.pulse
{
    text-transform: capitalize;
}

h1 strong.pulse
{
	text-transform: lowercase;	
}

a strong.pulse
{
	text-transform: lowercase;
}

li strong.pulse
{
    text-transform: lowercase;
}

li p strong.pulse 
{
    text-transform: capitalize;
}

em.keyword
{
    font-style: normal; 
}

li em
{
    font-style: normal; 
    font-weight: bold;
}

img
{
    border: none;
}

img.ss, img.ssb, .demo
{
    text-align: center;
    margin-left: 6px;
}

img.ssb, .demo
{
    border: solid 1px #caced4;
}

.demo
{
    margin: 15px;
    display: block;
}

.demo-thumb
{
     text-align: center;
}

@media screen {
	#header{ position: relative; text-align: right; vertical-align: top; width: 760px; height: 70px; }
}

#nav{ position: absolute; bottom: 0px; margin-left: 0; left: 260px; }

@media screen {
	#header h1.banner { display: none; }
}

@media print {
	#header h1.banner { 
		font-size: 2.5em;
		color: #212b45;
	}
}

@media print
{
	#nav{ display: none; } 
}

#nav ul
{
    margin: 0;
    padding: 0;
    list-style: none;
    float: left;
    width: 100%;
}

#nav li
{ float: left; margin: 0 4px 0 0; display: block; padding: 0; }

#nav a
{
    float: left;
    padding: 3px 8px 6px 8px;
    font-weight: bold;
    text-decoration: none;
    border: solid 1px;
    border-width: 1px 1px 0 1px;
}

.please
{
    clear: both;
}

.clear
{
    clear: both;
}

.hide
{
    display:none;
}

@media screen {
	#container {
    	background-color: #fff;
    	width: 760px;
    	margin: 15px auto 0;
    	padding: 0;
    	text-align: left;
    	/*overflow: auto;*/
    	position: relative;
    	min-height: 90%;
	}
}

* html #container
{
    height: 90%;
}

#footer
{
    clear: both;
    margin: 0 auto 8px;
    font-weight: bold;
    text-align: center;
    vertical-align: bottom;
    font-size: 80%;
    background-position: 0 bottom;
    width: 760px;
    height: 30px;
    position: relative;
    /*margin-top: -60px;*/
}

@media screen {
	#sidebar {
    	width: 200px;
    	margin-top: 20px;
    	margin-left: 535px;
    	padding: 0;
	}
}

@media print
{
	#sidebar{ display: none;}
}

#sidebar h1
{
    font-size: 16px;
    border-bottom: solid 2px;
}

#sidebar h2
{
    font-size: 14px;
    margin: 2px;
    padding: 2px;
    border-bottom: solid 1px;
}

#sidebar h3
{
    font-size: 12px;
    margin: 0;
}

#sidebar p {
    margin-top:0.5em;
}

#sidebar a
{
    font-weight: bold;
    text-decoration: none;
    border-bottom: dotted 1px;
}

#sidebar a:hover
{
    border-bottom: solid 2px;
}

/*
Sidebar styles for news and testimonial blocks.
- the styles define and place the images.
*/
#sidebar ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

#sidebar li {
    padding-left: 20px;
    padding-top: 3px;
    padding-bottom: 3px;
}

#news li
{
    padding-left: 0px;
}

#plinks li
{
    font-size: 130%;
    padding: 5px;
    margin-left: 10px;
}

#plinks img
{
    vertical-align: middle;
}

#sidebar h2.news {
    background-image: url(../images/newspaper.png);
    background-repeat: no-repeat;
    padding-left: 20px;
    background-position: 0 .20em;
}

#sidebar h2.testimonial, #testimonials li {
    background-image: url(../images/comment.png);
    background-repeat: no-repeat;
    padding-left: 20px;
    background-position: 0 .20em;
}

@media screen {
	#content {
    	width: 485px;
    	padding: 0;
    	margin-top: 5px;
    	padding-left: 28px;
    	float: left;
	}
}

@media print {
	#content {
		width: 80%;
		margin-left: 15%;
	}
}

#content h1
{
    font-size: 18px;
    margin-top: 1.2em;
    margin-bottom: 0.3em;
    border-bottom: dotted 1px #c90;
}

#content h2
{
    font-size: 14px;
    border-bottom: dotted 1px #c90;
    margin-top:1.6em;
}

#content h3
{
    font-size: 12px;
    margin: 0;
}

#content h4
{
    font-size: 12px;
    font-style: italic;
    margin: 0 0 4px 0;
}

@media screen {
	#content a
	{
    	font-weight: bold;
    	text-decoration: none;
    	border-bottom: dotted 1px;
	}
}

#content p
{
    margin-top: 0.8em;
    margin-bottom: 0.8em;
}

#content a:hover
{
   border-bottom: solid 2px;
}

#content a.unadorned, #content a.unadorned:hover, #sidebar a.unadorned, #sidebar a.unadorned:hover
{
    border-bottom: none;
}

@media print {
	#content a:link, #content a:visited {
		color: #333333;
		border-bottom: none;
		text-decoration: none;
	}
	
	/** 
	  Print fully qualified links as part of the document 
	*/
	#content a[href^="http://"]:link:after, #content a[href^="http://"]:visited:after {
		content: " [" attr(href) "]";
		font-size: 90%;
		text-decoration: none;
		border-bottom: none;
		font-family: Courier, monospace;
	}

	/**
	  Links relative to / on the Zutubi site can also be printed.
	  (links of the form "./blah" or simply "blah" are not printed.)
	*/
	#content a[href^="/"]:after,  #content a[href^="/"]:visited:after {
		content: " [http://www.zutubi.com" attr(href)"]";
		font-size: 90%;
		text-decoration: none;
		border-bottom: none;
		font-family: Courier, monospace;
   }

	/**
	  Local # links are not useful in a printed document
	*/
	#content a[href^="#"]:after,  #content a[href^="#"]:visited:after {
		content: "";
	}

/**
	Even with a not selector, we can't catch relative urls.
	#content a:not([href^="/"]):after,  #content a:not([href^="/"]):visited:after
	{
		content: " (http://www.zutubi.com/" attr(href)") ";
		font-size: 90%;
		text-decoration: none;
		border-bottom: none;
		font-family: Courier, monospace;
   }
*/
}

.box
{ width: 180px; padding: 5px 10px; border-right: 1px solid #667e9f; border-left: 1px solid #667e9f; }

#sidebarfooter { background-image: url(../images/sidebarfooter.gif); width: 202px; height: 13px; }

#newsheader { background-image: url(../images/news.gif); width: 202px; height: 39px; margin-top: 0px; }
#testimonialsheader { background-image: url(../images/testimonials.gif); width: 202px; height: 39px; margin-top: 0px; }

html
{
    height: 100%;
}

body
{
    font-family: "Lucida Grande", Verdana, sans-serif;
    font-size: 12px;
    line-height: 1.5em;
    margin: 0px;
    height: 100%;
}

.paginate {
    border-top: solid 1px #CACED4;
    margin-top: 20px;
    text-align: center;
    font-weight: bold;
    color: #999;
}

@media screen
{
    ul.feature li, ul.tick li
    {
    	list-style-type: none;
    	background-repeat: no-repeat;
        margin: 4px 0 4px 0;
    }

    ul.feature li
    {
    	background-image: url(../images/li.gif);
    	background-position: 0 .40em;
    	padding-left: 15px;
    }

    ul.tick li
    {
    	background-image: url(../images/tick-bullet.png);
    	padding-left: 20px;
    }
}

ul.line {
    padding-left: 0;
}

ul.line li {
    display: inline;
    margin-right: 4px;
    background: url(../images/li.gif) no-repeat .40em;
    padding-left: 20px;
    font-size: 1.1em;
}

/* 
  Lead in emphasis for a feature-list items: special handling is performed 
  for the first em element in each list item.
  Note: the > child selector does not work in IE 6.
*/  
ul.feature > li > em:first-child
{
   font-size: 110%;
   text-transform: lowercase;
}

ul.feature > li > a:first-child
{
   font-size: 110%;
   text-transform: lowercase;
}

#tour ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

#tour li {
    padding-left: 20px;
}

@media screen
{
	ul#tour.feature li {
    	float:left;
    	width:15em;
    	height:7.5em;
    	margin:0 0.5em 0em 0.5em;
	}
}

#tour li.feature p {
    margin: 0.5em 0 0.5em 0;
}

@media screen {
	.license {
    	float:left;
    	width: 19em;
    	margin:0 0.2em 0.4em 0.2em;
	}
}

#content .license h2 {
    margin: 0;
    font-size: 1.1em;
    background: #f7f9fb url(../images/feature-header.gif) repeat-x scroll center top;
    text-align: center;
    padding: 6px;
    border: solid 1px #ddd;
}

#content .license h2 a {
    border-bottom: none;
    color: #000;
}

#content .license {
    padding:0.2em 0.2em 0.2em 0.2em;
}

#content .license p, #content .license ul {
    border: solid 1px #ddd;
    border-top: dotted 1px #bbb;
    margin: 0;
    padding: 5px;
}

#content .license ul {
    padding-left: 8px;
}

table.download {
    border: 1px solid #bbb;
    margin-top: 8px;
    margin-bottom: 8px;
    border-collapse: collapse;
    width: 100%;
}

.column, .download th, .download td {
    border-collapse: separate;
    padding:6px;
    border: 1px solid #bbb;
}

.tournav {
    margin-top: 10px;
    text-align: center;
    font-weight: bold;
}

li.articles {
    list-style-type: none;
}

#content p.article {
    margin-bottom: 0.2em;
}

#content p.quote { 
    margin-top: 2px;
    padding: 0px 4px;
}

#content p.author em {
    font-weight: normal;
    font-style: italic;
}

#content p.author {
    margin-bottom: 2px;
    padding: 0px 4px;
}

#content p.organisation { 
    margin-top: 2px;
    padding: 0px 4px;
}

#testimonials li {
    margin: 10px 0px;
}

#content p.posted {
    font-style: italic;
    margin-top: 0.2em;;
    line-height: 1;
}

#content p.articletail {
    margin-top: 20px;
    border-top: solid 1px;
}

table.shaded th, table.shaded td {
    padding: 5px;
    background: #eee;
}

.right {
    text-align: right;
}

.frontbox {
    border-bottom: dotted 1px #bbb;
    margin: 8px;
    margin-bottom: 16px;
}

#content .frontbox h1, #content .frontbox h2 {
    background-color: #f2f2ff;
    border-top: solid 1px #caced4;
    padding: 5px;
}

#content .frontbox h1 a, #content .frontbox h2 a {
    float: right;
    border-bottom: none;
}

#content .frontbox h1 a {
    font-size: 0.7em;
}

#content .frontbox h2 a {
    font-size: 0.9em;
}

#content .frontbox h1, .frontbox img {
    margin-top: 8px;
}

#content .frontbox p, .frontbox h3, .frontbox h4 {
    padding-left: 7px;
}

#content .frontbox ul {
    margin-left: 0;
    padding-left: 20px;
}

blockquote p {
    padding: 0px 15px 0px 0px;
}

blockquote {
    padding: 1.2em;
}

.small {
    font-size: 0.8em;
}

ul.errorlist {
    margin: 0;
    padding: 0;
}

ul.errorlist li {
    margin: 0;
    padding: 3px;
    list-style-type: none;
}

table.form {
    border: dotted 1px #ccc;
    margin: 12px;
    padding: 4px;
}

table.form th {
    white-space: nowrap;
    padding: 3px;
    vertical-align: top;
    text-align: right;
}

.understated {
    font-style: italic;
}

.note { 
    border: solid 1px;
    padding: 5px;
}