/*
Company:	Cherwell Software
File:		main.css - This contains all the main styles for the website.

All the styles are separted into the following groups:
Global Browser Reset - this is handled by the reset-fonts.css file from YUI
HTML, Body - for the html and body tags
Layout - styles that define the layout of the site
Modules - styles for content modules
Common Text Styles - Styles for text
Default Headings - headings like h1, h2, etc
Default Lists - unordered and ordered lists
Nav - navigation bar
Forms - html forms
Default Links - links
Misc - anything that doesn't fit elsewhere
*/

/* @group HTML, Body */

html {
	background: url(/images/page-bkg.gif) repeat-x 0 0 #0e3e6b;
}

body {
	padding: 30px 0 0 0;
}

/* @end */

/* @group Layout */

/* Head */

div#hd {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

/* Body */

div#bd {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

/* Footer */

div#ft {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

div#ft p.ft-nav {
	color: #fff;
	font-size: 95%;
	font-weight: bold;
	margin: 0;
	padding: 25px 0;
	text-align: center;
}

div#ft p.ft-nav a:link, div#ft p.ft-nav a:visited {
	color: #fff;
	text-decoration: underline;
}

div#ft p.ft-nav a:hover {
	text-decoration: none;
}

div#ft p.copyright {
	color: #5b89b3;
	font-size: 85%;
	font-weight: bold;
	text-align: justify;
	padding: 0 30px;
	margin: 0 0 20px 0;
}

/* ITIL */

div.itil {
	width: 139px;
	height: 140px;
	background: url(/images/itil-logo.gif) no-repeat 0 0;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	text-indent: -9000px;
}

/* @end */

/* @group Modules */

/* Logo */

div#logo {
	width: 450px;
	height: 130px;
	text-indent: -9000px;
	float: left;
	display: inline;
}

div#logo a {
	display: block;
	height: 100%;
}

/* Head Box */

div.head-box {
	width: 1000px;
	height: 134px;
	background: url(/images/hd-bkg.jpg) no-repeat 0 0;
	margin: 0 0 10px 0;
}

/* Social Links */

div.social-links {
	width: 200px;
	padding: 78px 0 0 0;
	float: right;
	display: inline;
}

div.social-links ul {
	margin: 0;
	padding: 0;
}

div.social-links ul li {
	list-style: none;
	float: left;
	display: inline;
}

div.social-links ul li a {
	display: block;
	height: 50px;
	text-indent: -9000px;
}

div.social-links ul li.sn-twitter a {
	width: 34px;
	background: url(/images/icon-twitter.png) no-repeat 0 0;
}

div.social-links ul li.sn-linkedin a {
	width: 35px;
	background: url(/images/icon-linkedin.png) no-repeat 0 0;
}

div.social-links ul li.sn-youtube a {
	width: 34px;
	background: url(/images/icon-utube.png) no-repeat 0 0;
}

div.social-links ul li.sn-facebook a {
	width: 34px;
	background: url(/images/icon-facebook.png) no-repeat 0 0;
}

div.social-links ul li.sn-b a {
	width: 34px;
	background: url(/images/icon-b.png) no-repeat 0 0;
}

/* Search */

div.search {
	width: 172px;
	height: 25px;
	background: url(/images/search-box-bkg.png) no-repeat 0 0;
	margin: 4px 30px 0 0;
	float: right;
	display: inline;
}

div.search input {
	width: 120px;
	margin: 4px 0 0 30px;
	font-size: 85%;
	border: none;
	padding: 2px;
	background-color: transparent;
}

div.search-result {
	font-size: 90%;
}

div.search-result h4 {
	font-size: 12px;
	padding: 0 0 0 5px;	
}

div.search-result p {
	border-bottom: 1px solid #ccc;
	padding: 0 10px 10px 25px;
}

div.search-result img {
	vertical-align: middle;
}		

/* Content */

div.content-top {
	width: 1000px;
	height: 5px;
	overflow: hidden;
	background: url(/images/content-top.png) no-repeat 0 0;
}

div.content-btm {
	width: 1000px;
	height: 6px;
	overflow: hidden;
	background: url(../images/content-btm.png) no-repeat 0 0;
	margin-bottom: 5px;
}

div.content {
	width: 1000px;
	background: url(/images/content-bkg.png) repeat-y 0 0;
	padding: 25px 0;
}

/* Side */

div.side {
	width: 240px;
	margin: 0 0 0 30px;
	padding: 0 0 10px 0;
	float: left;
	display: inline;
}

/* Side Box */

div.side-box-top {
	width: 240px;
	height: 6px;
	background: url(/images/side-box-top.gif) no-repeat 0 0;
	overflow: hidden;
}

div.side-box-btm {
	width: 240px;
	height: 6px;
	background: url(/images/side-box-btm.gif) no-repeat 0 0;
	overflow: hidden;
	margin-bottom: 10px;
}

div.side-box {
	width: 240px;
	background: url(/images/side-box-bkg.gif) repeat-y 0 0;
	overflow: hidden;
	min-height:125px;
	height:auto !important;
	height:125px;
}

div.lower-side div.side-box {
	min-height:198px;
	height:auto !important;
	height:198px;
}

/* Forrester */

div.forrester a {
	display: block;
	text-indent: -9000px;
	width: 217px;
	height: 112px;
	background: url(/images/forrester.gif) no-repeat 0 0;
	margin-left: auto;
	margin-right: auto;
	margin-top: 6px;
}

/* Banner */

div.banner {
	margin-bottom: 10px;
}

/* Webinar */

div.webinar h2 {
	color: #666;
	font-size: 182%;
	font-weight: bold;
	margin: 0 0 5px 20px;
	padding: 10px 0 0 0;
}

div.webinar .image {
	margin: 0 15px 5px 5px;
	float: right;
	display: inline;
}

div.webinar p {
	font-size: 85%;
	color: #999;
	font-weight: normal;
	margin: 0 10px 10px 20px;
}

/* Testimonial */

div.testimonial h3.testimonials {
	color: #e4fed1;
	font-size: 138.5%;
	font-weight: bold;
	font-style: italic;
	margin: 0;
	padding: 20px 0 10px 0;
}

div.testimonial blockquote {
	color: #666666;
	font-size: 128%;
	font-weight: normal;
	font-style: italic;
	width: 1000px;
	height: 79px;
	background: url(/images/testimonial-bkg.gif) no-repeat 0 0;
	padding: 10px 0 0 0;
	line-height: 79px;
	text-align: center;
	margin: 0 0 20px 0;
}

/* Main */

div.main {
	width: 670px;
	margin: 0 0 0 30px;
	padding: 0 0 10px 0;
	overflow: hidden;
	float: left;
	display: inline;
}

/* Screenshots */

div.screenshots {
	width: 940px;
	margin: 0 30px 0 30px;
	padding: 0 0 10px 0;
	float: left;
}

/* Video */

div.video {
	width: 338px;
	margin: 0 20px 0 0;
	float: left;
	display: inline;
}

/* Blog */

div.latest-posts {
	width: 300px;
	float: left;
	display: inline;
}

div.latest-posts ul {
	margin: 0;
	padding: 0;
}

div.latest-posts ul li {
	list-style: none;
	margin-bottom: 10px;
}

div.latest-posts p {
	font-size: 110%;
	font-weight: bold;
	color: #444;
	margin-bottom: 10px;
}

div.latest-posts h3 {
	color: #cc0000;
	font-size: 24px;
	font-weight: bold;
	margin: 0 0 10px 0;
	padding: 20px 0 0 0;
}

/* Sub Content */

div.sub-content {
	background: url(/images/sub-content-bkg.gif) no-repeat 0 0;
	width: 1000px;
	height: 173px;
}

/* News */

div.news {
	width: 585px;
	padding: 26px 0 0 30px;
	float: left;
	display: inline;
}

div.news h4 {
	color: #fff;
	font-size: 138.5%;
	margin: 0 0 10px 0;
	font-weight: bold;
}

div.news a:link, div.news a:visited {
	color: #5b89b3;
	text-decoration: underline;
}
div.news a:hover {
	color: #fff;
	text-decoration: none;
}

div.news ol, ul, {
	list-style: none;
	margin-left: 0;
}

div.news li {
	list-style: none;
	margin-left: 0;	
}		

/* Tweets */

div.tweet {
	width: 226px;
	height: 120px;
	background: url(/images/twitter-feed-bkg.gif) no-repeat 0 0;
	margin: 26px 30px 0 0;
	padding: 15px 0 0 100px;
	float: right;
	display: inline;
}

div.tweet p {
	color: #666666;
	font-size: 100%;
	margin: 0 15px 3px 0;
	line-height: 140%;
}

div.tweet p.posted {
	color: #999999;
	font-size: 85%;
	margin: 0;
}

/* Feature */

div.feature {
	width: 670px;
	height: 430px;
	background: url(/images/feature-bkg.gif) no-repeat 0 0;
}

div.feature h1 {
	font-size: 138.5%;
	color: #000;
	margin: 10px 0 10px 0;
}

div.feature p {
	color: #444;
	font-size: 105%;
	line-height: 138%;
	margin: 0 0 10px 0;
}

div.feature div.item a {
	display: block;
}

div.feature span.caption {
	display: block;
	font-size: 93%;
	padding: 5px 0 0 0;
	text-align: center;
	color: #333;
	text-decoration: underline;
}

div.feature div.item {
	padding: 30px 0 0 0;
}

div.feature div.scrollable {
	margin-left: auto;
	margin-right: auto;
	float: none;
	height: 150px;
}

div.box-wrap {
	padding: 30px 20px 0 20px;
	height: 242px;
	text-align: left;
    width:630px;
    margin:0 0 0 0;
    overflow: hidden;
}

.box-wrap div.box-pane {
	display: none;
}
/* active item */

.scrollable .active {
	background: url(/images/active-arrow.gif) no-repeat 50% 0;
	z-index:9999;
	position:relative;
}

div.feature-left-col {
	width: 314px;
	float: left;
	display: inline;
}

div.feature-right-col {
	width: 309px;
	float: right;
	display: inline;
}

.feature-right-img {
	float: right;
	display: inline;
}

div.feature a.prev {
	display: block;
	width: 31px;
	height: 31px;
	background: url(/images/btn-prev-feature.gif) no-repeat 0 0;
	text-indent: -9000px;
	float: none;
	position: absolute;
	z-index: 100;
	margin: -100px 0 0 8px;
}

div.feature a.next {
	display: block;
	width: 31px;
	height: 31px;
	background: url(/images/btn-next-feature.gif) no-repeat 0 0;
	text-indent: -9000px;
	position: absolute;
	z-index: 100;
	margin: -100px 0 0 626px;
}

/* @end */

/* @group Common Text Styles */

.center {
	text-align: center;
}
/* @end */


/* @group Nav */

div#nav-bar {
	width: 1000px;
	height: 35px;
	background: url(/images/nav-bkg.png) no-repeat 0 0;
	margin: 0 0 10px 0;
}

/* Nav */

div#nav ul {
	margin: 0;
	padding: 0 0 0 23px;
	float: left;
	display: inline;
}

div#nav ul li {
	float: left;
	display: inline;
}

div#nav ul li a {
	display: block;
	font-size: 117%;
	text-transform: uppercase;
	font-weight: bold;
	line-height: 35px;
	padding: 0 10px;
}

div#nav ul a:link, div#nav ul a:visited {
	color: #fff;
	text-decoration: none;
	text-shadow: 0 1px 2px #333;
}

div#nav ul a:hover {
	text-decoration: none;
	background: url(/images/over-bkg.gif) repeat-x;
	color: #fff;
}

/* Nav Drop Down */

div#nav ul ul {
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1.25;
	background: url(/images/drop-nav-bkg.png) no-repeat 0 100%;
	width: 199px;
	z-index: 500;
}

div#nav ul li ul {
	position: absolute;
	/*left: -999em;*/
	display: none;
	left: auto;
	padding-top: 5px;
	padding-bottom: 10px;
}

div#nav ul li ul li {
	background-image: none;
	display: block;
	float: none;
	margin: 0;
	padding: 0;
}

div#nav ul li ul li a {
	text-align: left;
	text-transform: none;
	line-height: 24px;
	padding: 0 15px;
	margin: 0;
	font-size: 90%;
	display: block;
	font-weight: bold;
	background-image: none!important;
	width: 159px;
}

div#nav ul ul a:link, div#nav ul ul a:visited {

}

div#nav ul li:hover ul, div#nav ul li.sfhover ul {
	left: auto;
}

div#nav ul li ul a:hover {
	text-decoration: underline;
}

/* Fix for sticky IE drop downs */

div#nav ul li:hover, div#nav ul li.sfhover {position: static;}

/* @end */

/* @group Forms */
	
/* @end */

/* @group Default Links - link visited hover active */

a:link, a:visited {
	color: #336699;
	text-decoration: underline;
}
a:hover {
	color: #5b89b3;
	text-decoration: none;
}
/* @end */

/* @group Misc */

.clear {
	clear: both;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/

* html .clearfix {height: 1%;}
.clearfix {display: block;}

/* End hide from IE-mac */

/* HIGHTOUCH ADDITIONS ============================================================ */

h1 a, h1 a:link, h1 a:visited, h1 a:focus, h1 a:hover, h1 a:active,
h2 a, h2 a:link, h2 a:visited, h2 a:focus, h2 a:hover, h2 a:active,
h3 a, h3 a:link, h3 a:visited, h3 a:focus, h3 a:hover, h3 a:active,
h4 a, h4 a:link, h4 a:visited, h4 a:focus, h4 a:hover, h4 a:active {
	text-decoration : none;
}

hr {
	border: 0;
	height: 1px;
	width: 100%;
	background-color: transparent;
	border-bottom: #ccc solid 1px;
	margin: 3px 0 6px 0;
}

/* One Column */

div.one-column {
	width: 940px;
	margin: 0 30px 0 30px;
	padding: 0 0 10px 0;
	float: left;
	color: #333;
	line-height: 1.5;
}

div.one-column h1 {
	font-size: 24px;
	color: #000;
	font-weight: normal;
	margin: 15px 0 10px 0;	
}

div.one-column h2 {
	color: #666;
	font-size: 18px;
	font-weight: bold;
	border-bottom: #ccc solid 1px;
}

div.one-column h3 {
	color: #10497e;
	font-size: 16px;
	margin: 5px 0 5px 0;		
}

div.one-column h4 {
	color: #10497e;
	font-size: 14px;
	margin: 5px 0 2px 0;		
}

/* Two Column */

#sidebar-cell {
	width: 210px;
	vertical-align: top;
	padding: 0 30px 0 0;
	border-right: 1px solid #ccc;
}

#main-cell {
	width: 630px;
	vertical-align: top;
	padding: 0 0 0 30px;
	color: #333;
	line-height: 1.5;
}

#main-cell h1 {
	font-size: 24px;
	color: #000;
	font-weight: normal;
	margin: 15px 0 10px 0;	
}

#main-cell h2 {
	color: #666;
	font-size: 18px;
	font-weight: bold;
	border-bottom: #ccc solid 1px;
}

#main-cell h3 {
	color: #10497e;
	font-size: 16px;
	margin: 5px 0 5px 0;		
}

#main-cell h4 {
	color: #10497e;
	font-size: 14px;
	margin: 5px 0 2px 0;		
}

/* @group sidebar nav */

.nav {
	background: url(/images/sidenav-bkg-line.gif) no-repeat;
	height: 30px;
	width: 195px;
	font-size: 14px;
	font-weight: normal;
	color: #555;
	text-decoration: none;
	padding: 5px 0 5px 15px;
}

.nav-hover {
	background: url(/images/sidenav-bkg-line.gif) no-repeat;
	height: 30px;
	width: 195px;
	font-size: 14px;
	font-weight: bold;
	color: #336699;
	text-decoration: none;
	padding: 5px 0 5px 15px;
	cursor: pointer;
}

.nav-select {
	background: url(/images/sidenav-bkg.gif) no-repeat;
	height: 30px;
	width: 195px;
	font-size: 14px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	padding: 5px 0 5px 15px;
	text-shadow: 0 1px 2px #333;
}

/* @group Screenshots*/

ul.list-3by3 {
    margin: 0 0 0 -9px ;
    width: 974px;
}

.list-3by3 li {
    background: #f6f6f6;
	border: #dedede solid 1px;	
    float: left;
    font-size: 11px;
    height: 210px;
    margin: 0 0 12px 12px;
    overflow: hidden;
    padding: 12px;
    width: 280px;
    _display: inline;
}

.list-3by3 h3 {
    font-size: 14px;
	color: #000;
    text-align: center;
}

.list-3by3 img {
    border: 1px solid #dedede;
    display: block;
    margin: 0 0 12px;
}

/* @web apps*/

#web-app {
	margin: 0 20px 0 20px;
	padding: 0 0 10px 0;
	color: #333;
	line-height: 1.5;
}

#web-app h1 {
	font-size: 24px;
	color: #000;
	font-weight: normal;
	margin: 15px 0 10px 0;	
}

#web-app h2 {
	color: #666;
	font-size: 18px;
	font-weight: bold;
	border-bottom: #ccc solid 1px;
}

#web-app h3 {
	color: #10497e;
	font-size: 16px;
	margin: 5px 0 5px 0;		
}

#web-app h4 {
	color: #10497e;
	font-size: 14px;
	margin: 5px 0 2px 0;		
}

/* Competitors */

.remedy {
	font-size: 14px;
	font-weight: bold;
	color: #354b5d;
	line-height: 1.75;	
}

.hp {
	font-size: 14px;
	font-weight: bold;
	color: #000;
	line-height: 1.75;
}		

/* Special Classes */

.alert {
	color: #cc0000;
	font-weight: bold;
}

.req {
	color: #cc0000;
	font-weight: bold;
	font-size: 16px;
	padding-left: 2px;
}

.blue {
	color: #10497e;
	font-size: 16px;
	font-weight: bold;
}

.grey {
	color: #666666;
	font-size: 14px;
	font-weight: bold;
}

.quote {
	font-family: "Times New Roman", Times, serif;
	font-size: 110%;
	margin: 10px 0 10px 0;
	border-left: 8px solid #ccc;
	padding: 10px;
	font-style: italic;
	color: #545454;
}

.quote-big {
	font-family: "Times New Roman", Times, serif;
	border-top: 1px dotted #ccc;
	margin: 10px 0 10px 0;
	padding: 10px 0 0 0;
	font-size: 140%;
	font-style: italic;
	color: #333;
}

.citation {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	font-style: normal;
	color: #666666;
}	

.sidebar-btn {
	margin-top: 20px;
}

.sidebar-callout {
	margin-top: 15px;
	border: 1px solid #ccc;
	background: #f5f5f5;
	width: 190px;
	padding: 10px;
}	

.inset {
	background: url(/images/bg-inset.gif) no-repeat;
	padding: 15px;
	float: right;
	margin: 0 0 0 10px;
}

/* Registration Form */

label {
  	font-weight: bold;
  	color: #333;
  	font-size: 12px;
	padding: 0 0 0 1px;
}

input {
	margin: 2px 0 0 0;
 	color: #000;
  	font-weight: bold;
  	padding: 3px;
}

select {
	background: #ccff99;
	margin: 10px 0 2px 0;
 	color: #000;
  	font-weight: bold;
  	padding: 2px;
}

textarea {
  	xborder: 1px solid #999;
	margin-top: 3px;
 	color: #000;
  	font-weight: normal;
  	padding: 3px;
}

fieldset {
  	border: 1px solid #ccc;
	width: 555px;
  	padding: 30px;
  	margin: 15px 0 15px 15px;
}

fieldset legend {
  	font-weight: normal;
  	color: #000;
	font-size: 24px;
  	padding: 3px;
}

fieldset legend span {
  	color: #999;
  	font-weight: normal;
}

.csm {
	background: url(/images/csm.png) no-repeat;
	height: 14px;
	width: 146px;
	float: right;
	margin-top: 2px;
}	

.credits {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #003366;
	text-align: center;
	margin: 20px 0 2px 0;
}

.blogsitesummary {
	color: #5b89b3;
	font-size: 12px;
	padding-left: 3px 0 3px 0;
	list-style: none;
	line-height: 1.5; 
	margin-left: 0;
}	

.author {
	display: none;
}

.date {
	color: #6689a8;
	font-size: 10px;
}	

.hightlight {
	padding: 2px;
	background: #ffffdd;
	color: #000;
}

.callout {
	margin: 5px 0 0 0;
	background: #ffffcc;
	border: 1px solid #ffcc66;
	padding: 20px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px 5px 5px 5px;
}

.zoom {
	font-size: 14px;
}	

/* @end */

/* ============================================================================== */

/* @end */