* {
margin: 0;
padding: 0;
}



/* =============== Page centered using body element =============== */

body {
margin: 0 auto;
width: 900px;
padding-bottom: 50px;
font-size: 62.5%;
font-family: trebuchet MS, verdana, helvetica, arial, sans-serif;
}




/* =============== Header =============== */

#header {
position: relative;
width: 900px;
height: 75px;
}

#logo {
position: absolute;
left: 12px;
top: 28px;
display: block;
width: 212px;
height: 34px;
}

#phone {
position: absolute;
right: 0px;
bottom: 4px;
width: 200px;
height: 30px;
color: #666;
font-size: 2em;
font-weight: bold;
text-align: right;
margin-bottom: 0;
}



/* =============== Navigation =============== */

#navigation-wrapper {
width: 900px;
height: 46px;
background: url(/static/images/structure/navigation-wrapper-bg.jpg) top left no-repeat;
margin-bottom: 4px;
}

#navigation-wrapper ul {
width: 550px;
margin-left: 325px;
height: 40px;
list-style: none;
background: url(/static/images/structure/navigation-li-bg.gif) top left no-repeat;
overflow: hidden;
}

#navigation-wrapper ul li {
float: left;
padding-right: 1px;
height: 40px;
background: url(/static/images/structure/navigation-li-bg.gif) top right no-repeat;
}

#navigation-wrapper ul li a {
display: inline-block;
height: 40px;
padding: 0 24px;
text-decoration: none;
font-size: 1.4em;
font-weight: bold;
line-height: 290%;
}

#navigation-wrapper ul li a:link, #navigation-wrapper ul li a:visited {
color: #333;
}

#navigation-wrapper ul li a:hover, #navigation-wrapper ul li a:active {
color: #FFF;
background: url(/static/images/structure/navigation-over.gif) center bottom no-repeat;
}



/* =============== Banners =============== */

#banner {
width: 900px;
}

.banner-home {
position: relative;
height: 254px;
background: url(/static/images/structure/banner-home.jpg);
}

.banner-home h1 {
color: #CCC;
font-family: helvetica, arial, trebuchet MS, verdana, sans-serif;
font-size: 2.8em;
padding: 40px 50px 0 385px;
margin-bottom: 10px;
}

.banner-home p {
color: #CCC;
font-size: 1.4em;
padding: 0 50px 0 385px;
}

#solutions-btn {
position: absolute;
right: 185px;
bottom: 60px;
display: block;
width: 123px;
height: 32px;
background: url(/static/images/structure/solutions-btn.gif) no-repeat;
text-indent: -9999px;
}

#pricing-btn {
position: absolute;
right: 50px;
bottom: 60px;
display: block;
width: 123px;
height: 32px;
background: url(/static/images/structure/pricing-btn.gif) no-repeat;
text-indent: -9999px;
}

.banner-info-at-hand {
width: 900px;
height: 192px;
background: url(/static/images/structure/banner-info-at-hand.jpg) no-repeat;
}



/* =============== Home Product Info =============== */

#products {
width: 900px;
overflow: hidden;
margin: 20px 0;
}

#sugar-crm {
float: left;
width: 436px;
background: url(/static/images/structure/product-bg.gif) repeat-y;
}

#sugar-crm h2 {
width: 216px;
height: 38px;
text-indent: -9999px;
background: url(/static/images/structure/sugar-crm-logo.gif) top left no-repeat;
}

#info-at-hand {
float: right;
width: 436px;
background: url(/static/images/structure/product-bg.gif) repeat-y;
}

#info-at-hand h2 {
width: 180px;
height: 38px;
text-indent: -9999px;
background: url(/static/images/structure/info-at-hand-logo.gif) no-repeat;
}

.product-wrapper {
background: url(/static/images/structure/product-top-bg.gif) top left no-repeat;
}

.product-content {
position: relative;
background: url(/static/images/structure/product-bot-bg.gif) bottom left no-repeat;
padding: 20px 40px;
}

.product-content a {
position: absolute;
top: 20px;
right: 25px;
display: block;
width: 123px;
height: 32px;
background: url(/static/images/structure/learn-more-btn.gif) no-repeat;
text-indent: -9999px;
}

ul.ticklist {
margin: 20px 0 20px 0;
list-style: none;
}

ul.ticklist li {
color: #333;
background: url(/static/images/structure/tick.gif) center left no-repeat;
padding-left: 25px;
margin-bottom: 5px;
line-height: 140%;
}



/* =============== Home Feature Info =============== */

#features {
width: 900px;
overflow: hidden;
margin-bottom: 20px;
}

.feature {
float: left;
margin-right: 17px;
width: 210px;
border: 1px solid #D5D5D5;
padding: 12px 0;
background: url(/static/images/structure/feature-wrapper-bg.gif) top left repeat-x;
overflow: hidden;
}

.feature-last {
float: right;
width: 210px;
border: 1px solid #D5D5D5;
padding: 12px 0;
background: url(/static/images/structure/feature-wrapper-bg.gif) top left repeat-x;
overflow: hidden;
}

.feature-icon {
float: left;
margin: 0 10px;
height: 80px;
}

#features h3 {
margin-bottom: 5px;
font-size: 1.6em;
}

#features h3 a:link, #features h3 a:visited {
color: #2A66A7;
text-decoration: none;
}

#features h3 a:hover, #features h3 a:active {
color: #2A66A7;
text-decoration: underline;
}

#features p {
color: #333;
font-size: 1.2em;
margin: 0 16px 0 0;
}



/* =============== Content Area =============== */

#content-wrapper {
width: 900px;
overflow: hidden;
padding: 20px 0 40px 0;
font-family: helvetica, arial, trebuchet MS, verdana, sans-serif;
}

#content {
float: right;
width: 690px;
}

#sidebar {
float: left;
width: 190px;
}



/* =============== Breadcrumbs =============== */

#content ul#breadcrumbs {
list-style: none;
width: 690px;
overflow: hidden;
font-size: 1em;
margin: 0 0 8px 0;
}

#content ul#breadcrumbs li {
float: left;
margin: 0 6px 0 0;
padding-left: 6px;
border-left: 1px solid #000;
color: #000;
}

#content ul#breadcrumbs li.first {
padding-left: 0;
border-left: none;
}




/* =============== Sub Navigation =============== */

.sub-nav-wrapper {
background: url(/static/images/structure/sub-nav-wrap-bg.gif) repeat-y;
margin-bottom: 12px;
}

.sub-nav-inner {
background: url(/static/images/structure/sub-nav-wrap-top-bg.gif) top left no-repeat;
width: 190px;
}

.sub-nav-inner ul {
list-style: none;
padding: 16px 12px;
background: url(/static/images/structure/sub-nav-wrap-bot-bg.gif) bottom left no-repeat;
}

.sub-nav-inner ul li {
background: url(/static/images/structure/sub-nav-li-bg.gif) bottom right no-repeat;
font-size: 1.2em;
width: 166px;
padding-bottom: 2px;
}

.sub-nav-inner ul li a {
display: block;
text-decoration: none;
padding-left: 12px;
background: url(/static/images/structure/sub-nav-arrow.gif) center left no-repeat;
}

.sub-nav-inner ul li a span {
display: block;
width: 154px;
padding: 8px 0;
cursor: pointer;
}

.sub-nav-inner ul li a:link span, .sub-nav-inner ul li a:visited span {
color: #333;
}

.sub-nav-inner ul li a:hover span, .sub-nav-inner ul li a:active span, .sub-nav-inner ul li a#current span {
color: #3379C5;
background: url(/static/images/structure/sub-nav-over.gif) top center repeat-y;
}



/* =============== Big Sidebar Links =============== */

.big-sidebar-link {
display: block;
width: 190px;
height: 73px;
margin-bottom: 14px;
font-size: 1.6em;
font-weight: bold;
color: #4A638D;
line-height: 120%;
}

.big-sidebar-link:link, .big-sidebar-link:visited {
text-decoration: none;
}

.big-sidebar-link:hover, .big-sidebar-link:active {
text-decoration: underline;
}

#request-quote {
background: url(/static/images/structure/quote-link-bg.gif) no-repeat;
}

#request-quote span, #trial span {
display: block;
padding: 18px 30px 0 80px;
}

#trial {
background: url(/static/images/structure/trial-link-bg.gif) no-repeat;
}



/* =============== Typography =============== */

#content h1, #content h2 {
font-size: 2.4em;
color: #3379C5;
font-weight: normal;
margin-bottom: 20px;
padding-top: 16px;
background: url(/static/images/structure/content-h2-bg.gif) top left no-repeat;
}

#content ul {
margin-left: 20px;
font-size: 1.2em;
line-height: 140%;
color: #333;
}

#content ul li {
#margin-bottom: 16px;
}

p {
font-size: 1.2em;
color: #333;
line-height: 140%;
margin-bottom: 20px;
}

#content a:link, #content li a:visited {
color: #3379C5;
text-decoration: none;
}

#content li a:hover, #content li a:active {
color: #3379C5;
text-decoration: underline;
}



/* =============== Contact Form =============== */

form {
width: 530px;
}

form p, form div {
width: 530px;
overflow: hidden;
margin-bottom: 12px;
}

form p label {
float: left;
width: 80px;
}

form p span.dropdown {
display: block;
width: 428px;
float: right;
}

form p span.required {
color: red;
}

form p span input {
float: none;
display: inline;
}

form p span label {
float: none;
width: 380px;
display: inline;
}

form p input.checkbox {
float: none;
}


form p input {
float: right;
}

span.checkbox input {
clear: both;
margin-left: 100px;
margin-right: 5px;
margin-top: 5px;
margin-bottom: 5px;
}

form p input.customer-info {
width: 420px;
padding: 4px;
background: #E9F2F3;
border: 1px solid #CCC;
}

form p textarea {
float: right;
width: 420px;
padding: 4px;
background: #E9F2F3;
border: 1px solid #CCC;
height: 80px;
}

form div input#submit {
float: left;
margin-left: 100px;
}


/* =============== Footer =============== */

#footer {
width: 900px;
padding: 5px 0;
border-top: 1px solid #D5D5D5;
border-bottom: 1px solid #D5D5D5;
}

#footer p {
color: #666;
font-size: 1.2em;
text-align: center;
margin-bottom: 0;
}



/* =============== Misc =============== */

img {
border: none;
}

a {
outline: none;
}

img.floatleft {
	float: left;
	margin: 10px;
}

img.floatright {
	float: right;
	margin: 10px;
}

#featureCompare {
	width: 100%;
	border: 1px solid #ccc;
}

#featureCompare td {
	padding: 5px;
	text-align: center;
}

#featureCompare th {
	padding: 5px;
	font-size: 12px;
	font-weight: bold;
}

#featureCompare tr:nth-child(even) {
	background: #fff;
}

#featureCompare tr:nth-child(odd) {
	background: #eee;
}

#featureCompare tr:first-child {
	background: #ddd;
}

#featureCompare td.yes {
	background: url(/static/images/stock/icons/tick.png) center center no-repeat;
}

#featureCompare td.no {
	background: url(/static/images/stock/icons/cross.png) center center no-repeat;
}
div.thumbnails img {
	width: 30%;
	float: left;
	border: 2px solid black;
	margin: 5px;
	height: 100px;
}
.clearboth {
	clear: both;
}
a.documentation {
	float: left;
	margin: 10px;
}