/*
IT Software Efficiency CSS
Tom Aston, FUSE (www.fuse.co.uk)
6th May 2008
*/

/*********************************** Global Resets ***********************************/

@import url('reset.css');
@import url('clearfix.css');

/*********************************** SITE ***********************************/

body {
	background:#E7F0F9;
	font-family:Arial, Helvetica, sans-serif;
	font-size:62.5%;
	line-height:130%;
}
#container {
	background:#FFFFFF;
	border:solid 7px #FFFFFF;
	margin:0 auto;
	width:765px;
}

/*********************************** HEADER ***********************************/

#header {
	width:765px;
}
#header img {
	float:left;
}
#header h1, #header h2 {
	display:none;
}

/*********************************** NAVIGATON ***********************************/

#navigation {
	clear:both;
	float:left;
	background:url(../images/nav_background.jpg) left center repeat-x;
	width:765px;
	font-size:1.2em;
	padding:10px 0;
}
#navigation li {
	float:left;
	margin:0 0 0 20px;
	display:inline;
	font-weight:bold;
}
#navigation a {
	color:#FFFFFF;
}
#navigation a:hover,
#navigation a:active,
#navigation a.current {
	color:#102338;
}

/*********************************** MAIN CONTENT ***********************************/

#main_content {
	width:725px;
	clear:both;
	padding:15px 20px 0 20px;
	font-size:1.2em;
	line-height:1.3em;
	min-height:300px;
	height:auto !important;
	height:300px;
}
#main_content a {
	color:#5E6A7C;
	text-decoration:underline;
	font-weight:bold;
}
#main_content a:hover,
#main_content a:active {
	color:#D74200;
}
#main_content #left {
	width:355px;
	float:left;
	margin-right:15px;
}
#main_content #wideleft {
	width:450px;
	float:left;
	margin-right:30px;
}
#main_content #right {
	width:355px;
	float:left;
}
#main_content #thinright {
	width:245px;
	float:left;
}
#main_content h3 {
	color:#D74200;
	font-weight:normal;
	font-size:1.5em;
	line-height:1.2em;
	margin-bottom:10px;
}
#main_content h3 em { 
	color:#D74200;
}
#main_content ul, #main_content p {
	margin-bottom:12px;
}
#main_content li {
	margin-bottom:3px;
	padding-left:29px;
}
#main_content #left ul li {
	background:url(../images/bullet.gif) 0.5em 0.3em no-repeat;
	padding-left:20px;
}
#main_content #left ul.negative li {
	background:url(../images/no.gif) left center no-repeat;
	padding-left:29px;
}
#main_content #left ul#contact {
	
}
#main_content #left ul#contact li#tel {
	background:url(../images/tel.gif) left center no-repeat;
	padding:2px 0 3px 23px;
	font-weight:bold;
}
#main_content #left ul#contact li#mail {
	background:url(../images/email.gif) left center no-repeat;
	padding:2px 0 3px 23px;
	font-weight:bold;
}
#main_content p.highlight {
	color:#DA4F11;
	font-weight:bold;
}
#main_content p.follow {
	clear:both;
	padding:10px 0 20px 0;
	margin:0;
	float:left;
	width:725px;
}
#main_content #thinright #offer {
	background:url(../images/offer_bg.gif) left center repeat-x #0072B8;
	color:#FFFFFF;
	text-align:center;
	padding:15px 20px;
	font-weight:bold;
	font-size:1.4em;
	line-height:1.2em;
	margin-top:30px;
}
#main_content #thinright #offerhigh {
	background:url(../images/offer_bg.gif) left center repeat-x #0072B8;
	color:#FFFFFF;
	text-align:center;
	padding:15px 20px;
	font-weight:bold;
	font-size:1.4em;
	line-height:1.2em;
	margin-bottom:50px;
}
#main_content #right #enable {
	padding:5px 0;
	font-size:1.2em;
	font-weight:bold;
	line-height:1.2em;
	color:#DA4F11;
}

/*********************************** PRODUCTS ***********************************/

#main_content #left #products {
	background:#EEF3F7;
	padding:17px 17px 5px 0;
	margin-bottom:10px;
}
#main_content #left #products img {
	margin-left:17px;
	margin-right:17px;
	float:left;
}
#main_content #productdetail {
	clear:both;
	width:705px;
	background:#EEF3F7;
	float:left;
	padding:10px 10px 0 10px;
	margin:10px 0;
}
* html #main_content #productdetail {
	padding:10px;
}
#main_content #productdetail .panel {
	width:235px;
	float:left;
	background:#EEF3F7;
}
#main_content #productdetail .panel img {
	float:left;
}
#main_content #productdetail .panel h3 {
	margin:0 0 2px 10px;
	float:left;
}
#main_content #productdetail #essentials h3 {
	color:#00B256;
}
#main_content #productdetail #lite h3 {
	color:#0096A9;
}
#main_content #productdetail #standard h3 {
	color:#6125BB;
}
#main_content #productdetail .panel p {
	float:left;
	margin-left:10px;
	width:146px;
	font-size:0.95em;
}
#main_content #productdetail #essentials a {
	color:#00B256;
	font-weight:bold;
	text-decoration:none;
}
#main_content #productdetail #lite a {
	color:#0096A9;
	font-weight:bold;
	text-decoration:none;	
}
#main_content #productdetail #standard a {
	color:#6125BB;
	font-weight:bold;
	text-decoration:none;	
}
#main_content #productdetail #essentials a:hover,
#main_content #productdetail #essentials a:active,
#main_content #productdetail #lite a:hover,
#main_content #productdetail #lite a:active,
#main_content #productdetail #standard a:hover,
#main_content #productdetail #standard a:active {
	color:#D74200;
	font-weight:bold;
}


/*********************************** STEP CAROUSEL ***********************************/

.stepcarousel{
	position: relative; /*leave this value alone*/
	overflow: scroll; /*leave this value alone*/
	width: 345px;
	height: 130px; /*Height should enough to fit largest content's height*/
	padding:17px 0 5px 0;
}
.stepcarousel .belt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}
.stepcarousel .panel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	margin: 0px; /*margin around each panel*/
	width: 345px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}
#main_content #left #mygallery {
	background:#EEF3F7;
	margin-bottom:20px;
}
#main_content #left #mygallery .panel img {
	float:left;
	margin:15px 0 17px 19px;
}
#main_content #left #mygallery .panel h3 {
	margin-top:15px;
	margin-bottom:5px;
	margin-left:17px;
	float:left;
}
* html #main_content #left #mygallery .panel h3 {
	margin-top:12px;
}
#main_content #left #mygallery #essentials h3 {
	color:#00B256;
}
#main_content #left #mygallery #lite h3 {
	color:#0096A9;
}
#main_content #left #mygallery #standard h3 {
	color:#6125BB;
}
#main_content #left #mygallery .panel p {
	width:200px;
	float:left;
	margin-left:17px;
}
#main_content #left #mygallery #essentials a {
	color:#00B256;
	font-weight:bold;
	text-decoration:none;
}
#main_content #left #mygallery #lite a {
	color:#0096A9;
	font-weight:bold;
	text-decoration:none;
}
#main_content #left #mygallery #standard a {
	color:#6125BB;
	font-weight:bold;
	text-decoration:none;
}
#main_content #left #mygallery #essentials a:hover,
#main_content #left #mygallery #essentials a:active,
#main_content #left #mygallery #lite a:hover,
#main_content #left #mygallery #lite a:active,
#main_content #left #mygallery #standard a:hover,
#main_content #left #mygallery #standard a:active {
	color:#D74200;
	font-weight:bold;
}
#main_content #left a#ses_panel {
	display:block;
	background:#5e6A7C;
	font-weight:bold;
	color:#FFFFFF;
	padding:5px 0 3px 7px;
	width:338px;
	text-decoration:none;
}
* html #main_content #left a#ses_panel {
	padding:3px 0 3px 7px;
}
#main_content #left a#ses_panel:hover,
#main_content #left a#ses_panel:active {
	color:#9BA5B4;
}

/*********************************** LEARN MORE ***********************************/

#right #learnmore {
	background:#9BA5B4;
	padding:10px 15px 15px 15px;
	margin-bottom:10px;
}
#right #learnmore p, #right #learnmore h3, #right #learnmore label {
	color:#FFFFFF;
	margin-bottom:0;
}
#right #learnmore p {
	margin-top:0.6em;
}
* html #right #learnmore p {
	margin-top:1.2em;
}
#right #learnmore h3 {
	font-size:1.2em;
	font-weight:bold;
	margin-bottom:15px;
}
#right #learnmore label {
	width:70px;
	float:left;
	clear:both;
	font-weight:bold;
	margin-bottom:0.8em;
}
#right #learnmore input#name, #right #learnmore input#email {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:0.9em;
	padding:3px;
	border:none;
	float:left;
	width:245px;
	margin-bottom:0.8em;
	background:#FFFFFF;
}
#right #learnmore input#submit {
	border:none;
	background:#EC5715;
	color:#FFFFFF;
	padding:2px 3px;
	border-top:solid 1px #f28a5c;
	border-left:solid 1px #f28a5c;
	border-bottom:solid 1px #bb410a;	
	border-right:solid 1px #bb410a;
	font-size:0.9em;
	font-weight:bold;
	float:right;
	margin-top:-5px;
}
#right #learnmore a {
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}
#right #learnmore a:hover,
#right #learnmore a:active {
	color:#5E6A7C;
}

/*********************************** STRETCH LEARN MORE ***********************************/

#lower #learnmore2 {
	background:#9BA5B4;
	padding:10px 15px 15px 15px;
}
#lower #learnmore2 p, #lower #learnmore2 h3, #lower #learnmore2 label {
	color:#FFFFFF;
	margin-bottom:0;
}
#lower #learnmore2 p {
	margin-top:0.5em;
}
* html #lower #learnmore2 p {
	margin-top:1.2em;
}
#lower #learnmore2 h3 {
	font-size:1.2em;
	font-weight:bold;
	margin-bottom:15px;
}
#lower #learnmore2 label {
	width:45px;
	float:left;
	font-weight:bold;
	margin-bottom:0.8em;
}
#lower #learnmore2 input#name2, #lower #learnmore2 input#email2 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:0.9em;
	padding:3px;
	border:none;
	float:left;
	width:200px;
	margin-bottom:0.7em;
	background:#FFFFFF;
	margin-right:40px;
}
#lower #learnmore2 input#submit2 {
	border:none;
	background:#EC5715;
	color:#FFFFFF;
	padding:2px 3px;
	border-top:solid 1px #f28a5c;
	border-left:solid 1px #f28a5c;
	border-bottom:solid 1px #bb410a;	
	border-right:solid 1px #bb410a;
	font-size:0.9em;
	font-weight:bold;
	float:right;
	margin-top:-5px;
}
#lower #learnmore2 a {
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}
#lower #learnmore2 a:hover,
#lower #learnmore2 a:active {
	color:#5E6A7C;
}

/*********************************** AD SPOT ***********************************/

#right #adspot {
	background:#5E6A7C;
	padding:15px;
	margin-bottom:10px;
}
#right #adspot p {
	padding:5px 0 0 0;
	margin:0;
	font-weight:bold;
}
#right #adspot p a {
	color:#FFFFFF;
	text-decoration:none;
}
#right #adspot p a:hover,
#right #adspot p a:active {
	color:#9BA5B4;
}

/*********************************** LOWER ***********************************/

#main_content #lower {
	width:725px;
	float:left;
	border-top:solid 1px #9BA5B4;
	margin-top:10px;
	padding-top:10px;
	padding-bottom:20px;
}
#main_content #lower ul.positive li {
	background:url(../images/yes.gif) left center no-repeat;
}

/*********************************** PRODUCTS RHS ***********************************/

#right .offer_top {
	background:#5E6A7C;
	color:#FFFFFF;
	padding:10px 10px 10px 15px;
	font-weight: bold;
	margin:0;
}
#right #offer_middle {
	background: #E8F0F7;
}
#right #offer_middle img {
	margin:20px 0px 0px 20px;
	float:left;
}
#right #offer_middle p {
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.6em;
	color: #3C4450;
	padding:16px 0 0 20px;
	float:left;
	width:226px;
}
#right #offer_middle strong.essentials {
	color: #02B157;
	font-size:1.4em;
}
#right #offer_middle strong.lite {
	color: #13A8BE;
	font-size:1.4em;
}
#right #offer_middle strong.standard {
	color: #661C8C;
	font-size:1.4em;
}
#right #offer_middle em {
	font-size: 1.4em;
	font-style:normal;
}
#right .offer_buy {
	background: #5E6A7C;
	color: #FFFFFF;
	font-weight: bold;
	clear: both;
	margin: 0;
	padding: 10px 15px;
}
#right .offer_buy strong {
	float:left;
	color: #FFFFFF;
}
#right .offer_buy a {
	color:#FFFFFF;
	font-weight:bold;
}
#right .offer_buy a:hover,
#right .offer_buy a:active {
	color:#99A8BE;
}
#right .offer_buy img {
	float:right;
	margin-left:15px;
}
#right .see_also {
	background: #FFFFFF;
	color: #9BA5B4;
	margin: 0;
	padding: 10px 0px 10px 15px;
}

#right .see_also a {
	color: #9BA5B4;
	font-weight:bold;
	text-decoration:none;
}
#right .see_also a em {
	color:#9BA5B4;
}
#right .see_also a:hover,
#right .see_also a:active,
#right .see_also a:hover em,
#right .see_also a:active em {
	color:#5E6A7C;
}

/*********************************** KEY FEATURES ***********************************/

#right #keyfeatures {
	margin-bottom:15px;
	background:#E8F0F7;
	padding:10px 0;
}
#right #keyfeatures h3 {
	color:#5E6A7C;
	margin:0;
	padding:0 15px 10px 15px;
}
#right #features {
	margin:0;
	padding:0;
}
#right #features p a {
	display:block;
	text-decoration:none;
}
#right #features p.head {
	margin:0;
	padding:1px 15px 2px 30px;
	background:url(../images/head.gif) 1.4em 0.3em no-repeat;
	font-weight:normal;
}
#right #features p.head a {
	font-weight:normal;
}
#right #features p.head a:hover,
#right #features p.head a:active {
	font-weight:bold;
}
#right #features p.selected {
	background:url(../images/selected.gif) 1.4em 0.3em no-repeat;
}
#right #features p.selected a {
	font-weight:bold;
}
#right #features ul {
	margin:0;
	padding:5px 10px 5px 30px;
}
#right #features li {
	margin:0;
	padding:0;
}
#right #features ul li ul {
	padding:0;
}
#right #features ul li ul li {
	background:url(../images/bullet.gif) 0.2em 0.3em no-repeat;
	padding-left:15px;
	margin:2px 0 0 0;
}

/*********************************** CHECKOUT FORM ***********************************/

#right form#paypal {
	background:#5E6A7C;
	color:#FFFFFF;
	padding:10px 15px;
	margin-bottom:10px;
}
#right form#paypal label,
#right form#paypal label a {
	color:#FFFFFF;
}
#right form#paypal label.error {
	display:block;
	background:#D74200;
	color:#FFFFFF;
	padding:2px 4px;
	font-weight:bold;
	margin-top:5px;
}
#right form#paypal p.checkout {
	text-align:right;
	margin-bottom:0;
	margin-top:10px;
}

/*********************************** FOOTER ***********************************/

#footer {
	clear:both;
	width:725px;
	color:#999999;
	padding:10px 20px 3px 20px;
	border-top:solid 1px #9BA5B4;
	margin-top:10px;
}
#footer p {
	color:#999999;
	margin:0;
	padding:0;
	text-align:right;
	width:725px;
}
#footer strong {
	float:left;
	font-weight:normal;
	color:#999999;
}
#footer a {
	color:#999999;
}
#footer a:hover,
#footer a:active {
	color:#102338;
}

