﻿@charset "UTF-8";
/* CSS Document */

/**************************************************************************************************/
/**************************************************************************************************/
/* Reset CSS for all broswers*/

/* DO NOT CHANGE ANYTHING WITHIN THIS BLOCK */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td 
{margin: 0;	padding: 0;	border: 0; outline: 0; font-weight: normal; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
	
/* remember to define focus styles! */
:focus 	{ outline: 0;}
body 	{ line-height: 1; color: black; background: white;}
ol, ul 	{ list-style: none;}

/* tables still need 'cellspacing="0"' in the markup */
table 	{ border-collapse:collapse; border-spacing: 0;}

caption, th, td { text-align: left; font-weight: normal;}
blockquote:before, blockquote:after,q:before, q:after { content: "";}
blockquote, q 	{ quotes: "" "";}

/* fix images in IE*/

.ie6 img	{behavior: url("pngbehavior.htc"); border:none; outline:none;}
.ie5 img	{behavior: url("pngbehavior.htc"); border:none; outline:none;}

address {font-style:normal;}

.clrflt	{clear:both; line-height:1px; height:0; margin:0; padding:0; font-size:1px}
.clrrt	{clear:right; line-height:1px; height:0; margin:0; padding:0; font-size:1px;}
.clrlft	{ clear:left; line-height:1px; height:0; margin:0; padding:0; font-size:1px; }
.fltrt		{float:right;}
.fltlft		{float:left; }

/* CSS color guide */
/*
Red : #C02325  
Grey: #808080
lt Grey Bkgrd: #F2F2F2
lt Grey: #CCCCCC
dk Grey Bkgrd: #B3B3B3
*/


.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 */ 

/**************************************************************************************************/

/**************************************************************************************************/
/**************************************************************************************************/
/* jscript CSS hacks */



/**************************************************************************************************/
/**************************************************************************************************/
/**************************************************************************************************/


/* set tag styles*/

body 				{background:#B3B3B3; font-family:Times; font-size:.9em;}
h1					{font-size:1em; font-family: sans-serif; font-weight: bold}
h2					{font-size:2em;}
h3					{font-size:1.5em; padding:5px 0; }
h4 					{font-size:1.6em; color:#000; line-height:1.7em;}
h5					{font-size:1.1em; padding:10px 25px; }
h6					{font-size:2.5em; color: #C02325}
p					{font-family:Arial; padding:5px 25px; font-size:14px; line-height:17px;}

.red 				{color: #C02325}
.grey 				{color: #808080}

h4.red								{font-size:2em;}
.caseStudy p.summary				{font-size:1.2em; line-height:1.4em;}

.caseStudy p a 						{padding:0; margin:0;}
.caseStudy p a img					{border:2px solid #eee; margin:0;}
.caseStudy p a:hover img			{border:2px solid #C02325;}

p a 								{color:#C02325; text-decoration:underline;}
h1 a						        {font-weight: bold; color:black; text-decoration:none;}
a:hover 							{color:#C02325; text-decoration:none;}







/**************************************************************************************************/
/**************************************************************************************************/
/* CSS Box Model for Static Pages */
#wrapper							{width: 1000px; margin:0 auto; background:#fff; border-top:5px solid #C02325; border-bottom:10px solid #C02325;  position:relative; zoom:1;}

#wrapper div#header					{padding:5px 20px 0px 20px;}
#wrapper hr							{margin:0 20px 0 20px; padding:0; color:#eee; background:#eee;}
.ie #wrapper hr						{margin:0px 20px 0 20px; padding:0; color:#eee; background:#eee;}
#header img							{float:left; margin:-10px 75px 5px 10px;}
#header div.customerSupport			{float:right; width:300px; text-align:right; padding:0; margin:0; font-family:Arial; color:#C02325;}






/**************************************************************************************************/
/**************************************************************************************************/
/* menus and copyright info */

div#menuBr 						{ margin: 0; padding: 0;  clear:right; padding-top:30px;  float:left; zoom:1;}
div#menuBr ul 					{float:left; overflow:visible; width:600px; }

div#menuBr ul li				{ margin-left:10px; padding: 4px 0; background:url(../images/common/arrowRight.gif) left center no-repeat;   font-size:1.2em; overflow:visible; float:left;  height:1.4em; zoom:1; line-height:1.4em;}
div#menuBr ul li a				{ display:block; margin:0; padding-left:20px; background: #fff; text-align:left; text-decoration:none; color:#808080;width:110px; z-index:1000; height:1.4em;  zoom:1; font-family:Times;}

div#menuBr ul li ul				{  position:absolute; top:1.5em; z-index:5001; overflow:hidden; visibility:hidden;  border:1px solid #ccc; float:none; width:250px; background:#fff; zoom:1; padding-bottom:3px; display:block;}
div#menuBr ul li ul li			{  background:#fff; font-size:.8em;   overflow:hidden; padding:0; margin:0;   height:1.6em; float:none; zoom:1;}
div#menuBr ul li.hasSub			{ z-index:2000; position:relative;}

div#menuBr ul li ul li:hover	{}
div#menuBr ul li ul li a		{   background:fff; width:230px;  height:1.6em; line-height:1.6em; margin:0; padding: 0 0 0 20px; display:block; zoom:1; height:1.6em;}
div#menuBr ul li ul li iframe	{	position: absolute;	z-index: 5000;}


		
#copyright						{text-align:center; font-size:.8em; color:#fff; font-family:Arial; margin:0px auto 20px auto;}
#copyright a					{color:#fff; text-decoration:none;}
#copyright a:hover				{color:#fff; }

div#bottomMenu 							{font-size:.9em;margin:0 auto 10px auto; padding:5px 0 0 0; text-align:center; }
		div#bottomMenu ul				{padding: 0; margin: 0 auto; list-style:none; width:960px;}
		div#bottomMenu ul li			{list-style: none; display: inline;}
		div#bottomMenu ul li a			{display: inline-block; color:#fff; padding:1px 8px; border-left:1px dotted #fff;
										text-decoration:underline;font-family:Arial; font-weight:bold;}
		div#bottomMenu ul li a:hover	{color:#fff; text-decoration:none;}
		div#bottomMenu ul li.first a	{border-left:none;}

/**************************************************************************************************/
/**************************************************************************************************/

#wrapper div#content				{margin:5px 0;padding:0 20px;}


/* Home Page Special Tags */
#content div#homePage								{ background: url(../images/splashImages/homeSplash.jpg) top right no-repeat; height:261px; overflow:hidden; width:960px;}
#content div#homePage .AppMaker 					{ background: url('../images/splashImages/homeSplash-AppMaker.jpg') top right no-repeat; }
#content div#homePage p								{ font-size:12px; line-height:14px;}
#content div#homePage div.columnOne					{ display:block; height:250px; width:345px;float:left; padding:0; margin:0;}
#content div#homePage div.section-title				{ padding-top:40px; padding-right:0; width:305px; background:none; float:left;}
#content div#homePage div.service-list				{ float:left; width:250px; padding-top:40px; background:none;}
#content div#homePage div.service-list ul			{ list-style:outside; font-size:.8em; line-height:auto;}
#content div#homePage div.service-list ul li		{ color:#C02325; font-size:1.4em; padding-bottom:7px;}
#content div#homePage div.service-list ul li b		{ color:#808080; font-weight:normal;}
#content div#homePage div.service-list ul li.more 	{ text-align:right; padding:0px 20px; font-size:1em; list-style:none; }

#footer div#greyFtr 				{background:url(../images/common/gradientPageFooter.gif) top left repeat-x; width:960px; padding:10px 0; margin:0 20px 10px 20px;}
#footer div#greyFtr div 			{border-right:1px solid #B3B3B3;}
#footer div#greyFtr div div 		{border-right:none;}
#footer div#greyFtr div.columnThree {border-right:none;}


.threeColumn div.section-title 		{ background-color:#F2F2F2;margin:0 10px; display:block;}

div.greyBox							{ font-size:.9em; margin:5px 10px; padding:10px; background:#F2F2F2;}
div.greyBox	h5						{ font-size:1.2em; padding:0; margin:0; color:#4D4D4D; }
div.greyBox	p						{ font-family:Arial; padding:0; margin:0; }
div.greyBox p a.more				{ display:inline-block; font-size:.9em; text-align:right;}


.threeColumn p						{padding:15px 25px 0 25px; color:#808080; font-size:12px; line-height:14px; }

.threeColumn div.columnTwo			{width:340px; float:left; padding:5px;}
.threeColumn div.columnOne			{width:340px; float:left; padding:5px; }
.threeColumn div.columnThree 		{width:240px; float:left; padding:5px;  }

.section-title	h2					{color:#808080; font-size:3.5em;}
.section-title	h3					{color:#C02325; font-size:2.5em; padding-left:60px; font-style:italic;}
.section-title	h4					{color:#C02325; font-size:1.75em; padding:10px 15px; }
.section-title	img					{margin:15px 0 0 90px; }


/************  General Pages Stuff ****************/


#content #contentPage 			{ padding:10px 20px;}
#content #contentPage h1		{ font-size:1em; font-family: sans-serif; font-weight: bold; line-height: 200%}
#content #contentPage h6		{ color:#C02325; font-size:3em;}
#content #contentPage h2		{ padding: 10px 25px;}


#content #contentPage div.grey		{background:url(../images/common/gradientPageFooter2.jpg) top left repeat-x;  padding:10px;  border:1px solid #fff;}
#content #contentPage div.grey p	{padding:10px 25px; font-family:Arial; font-size:14px; line-height:18px;}

#content #contentPage div.grey2		{background:#F2F2F2;  padding:10px;  border:1px solid #fff;}


#content #contentPage ul		{ font-size:16px; padding:10px 50px;}
#content #contentPage li 		{ list-style:disc outside; margin:0 0 0 25px; padding:0 0 10px 0;}
#content #contentPage li p 		{ font-family:arial; font-size:14px; padding:5px 25px; margin-left:175px;}
#content #contentPage li span	{ float:left; width:150px; padding-top:5px;}
#content #contentPage li.tech	{ list-style:none; padding:10px 0;}
#content #contentPage li hr		{ clear:both;}


/************  Process ****************/
div.process div.lftColumn				{float:left; width:250px; padding:0 50px 0 0; clear:left;}
div.process div.lftColumn img.flowchart {margin:0 35px 10px 35px;}
div.process div.rtColumn				{float:left; width:600px; padding:10px 0 0 0;}



/************  Case Studies ****************/
.style2 {color: #C02325}
.section1	{width:920px; margin:0 auto; padding:0; background:url(../images/common/section.jpg) repeat-x top left; height:46px;}
.caseStudy p	{padding:10px; background:#eee; border:1px solid #ddd; line-height:18px; margin-right:530px;}
.cslink			{margin:0 25px 10px 25px; }


/************  Form  ****************/
#formcontainer			{ width:305px; padding:30px; background:#eee; border:1px solid #ddd;   position:relative;}
/* Above was originally just 'form' but has been changed for SI form system */
/* and to allow for the H3 tag to appear within the grey div */
#susco-main-form {
	padding-bottom: 20px;
}

#susco-main-form label.error {
	color: red;
	font-size: 12px;
	float: left;
	width: auto;
}

#susco-main-form label	{ width:95px; padding:5px 0 10px 0;  float:left;  line-height:19px; font-size:16px;  clear:left;}

#susco-main-form input		{ width:200px; padding:0; margin: 0 0 10px 0; float:right; height:18px;  }
#susco-main-form select		{ width:200px; padding:0; margin: 0 0 10px 0; float:right; /* height:18px; */  }
#susco-main-form textarea	{ display:block; width:300px; padding:0; margin: 0 0 10px 0; /* Added by SI */ clear: both;}
#susco-main-form .required	{ }
#susco-main-form input.submit, form input.but	{ padding:7px 10px; width:auto; background:#C02325; color:#fff; border:none; float:right; height:auto;}

#alertPanel		{ position:absolute; top:50px;  left:10px; filter: alpha(opacity=90);-moz-opacity:.9;opacity:.9; -khtml-opacity:.9; color:#fff;  width:345px;}
input.alertBut	{ padding:7px 10px; width:auto; background:#fff; color:#C02325; border:none; height:auto; float:none; margin:0 auto;}

/************  Contact Us  ****************/

div.contact div.rtColumn	{ float:right; width:480px; padding-right:25px;}
div.contact div.rtColumn address	{font-size:1.3em; line-height:1.4em; color:#808080;  padding:10px 20px;}
img#map								{margin-left:20px;}

/************  News  ****************/
#content #contentPage .newsArticle		{background:url(../images/common/gradientPageFooter.gif) top left repeat-x; padding:20px 10px ; margin-bottom:15px;}
#content #contentPage .newsArticle h2	{color:#666666; margin-right:150px; }
#content #contentPage .newsArticle h2 a	{text-decoration:none; color:#666666;}
#content #contentPage .newsArticle hr	{border:none; outline:none; background:#666; height:1px; margin:2px 5px; padding:0; }
#content #contentPage .newsArticle p	{padding:5px 0; margin:0 10px 0 250px; font-family:Arial; line-height:1.2em; color:#808080;}
#content #contentPage .newsArticle a.more	{float:left; clear:left; padding:10px 0 0 175px; text-decoration:none;}
#content #contentPage .newsArticle img	{float:left; margin-top:15px;}

#content #contentPage .case			{background:url(../images/common/gradientPageFooter.gif) top left repeat-x; padding:20px 10px ; margin-bottom:15px;}
#content #contentPage .case h2		{color:#666666; margin-left:250px; }
#content #contentPage .case h2 a	{text-decoration:none; color:#666666;}
#content #contentPage .case hr		{border:none; outline:none; background:#666; height:1px; margin:2px 5px 2px 50px; padding:0; }
#content #contentPage .case p		{padding:5px 0; margin:0 10px 0 250px; font-family:Arial; line-height:1.2em; color:#808080;}
#content #contentPage .case a.more	{float:left; clear:left; padding:10px 0 0 175px; text-decoration:none;}
#content #contentPage .case img		{float:left; margin-top:15px;}
.textlink {color:#808080; text-decoration:none;}



/************  Sidebar for blog ****************/

#sideBarDiv {
	float: right;
	width: 180px;
	margin: 0px;
	padding: 0px !important;
	background:#eee; border:1px solid #ddd;
}

#sideBarDiv ul {
	padding-left: 0px;
}
#sideBar {
	padding: 0px;
}
#content #contentPage #sideBarContainer {
	padding: 2px;
	color: #666; 
	text-align: left;
}
#content #contentPage #sideBarContainer ul		{ padding:0px 0px; font-size: 15px;  }
/*#content #contentPage #sideBarContainer ul ul	{ list-style-type: circle; }*/
#content #contentPage #sideBarContainer li		{ list-style-type: none; padding:0px 0px; padding-bottom: 3px;}
#content #contentPage #sideBarContainer li li	{ list-style-type: none; margin: 2px; margin-left: 10px; }
#content #contentPage #sideBarContainer form	{ border: none; background-color: inherit; width: 100px; margin: 0px; padding-top: 0px; padding-left: 8px;  }
#content #contentPage #sideBarContainer input 	{ width: 80px; margin: 0px; padding: 0px; height: 20px; }
#content #contentPage .post img {
	border: 1px solid #666;
}
#content #contentPage .post img.tweetme {
	border: 0px solid #666;
}

#content #contentPage #sideBarContainer h2 {
	padding: 5px;
}

.widgettitle {
	text-align: left;
	font-size: 17px;
}

#wp-calendar {	
	background-color: #fff;
	margin: 2px;
	border: 1px solid #ccc;
	font-size: 14px;
}

#wp-calendar td {	
	padding: 2px;
}


/*********** Comments in blog *************/

#suscoPostComments {
	text-align: left;
	color: #666;
}

#content #contentPage h3 {
	color: #666;
}

#content #contentPage #suscoPostComments li {
	list-style-type: none;
}

#content #contentPage #suscoPostComments li p {
	background-color: #EEE;
	margin: 0px;
	border: 1px solid #CCC;
}


#content #contentPage div.grey { /***/ }
#content #contentPage .grey2 { text-align: left; }
#content #contentPage #suscoPostComments form	{ border: 1px solid #CCC; background-color: #EEE; width: 300px; margin: auto; padding-top: 0px; padding-left: 8px;  }
#content #contentPage #suscoPostComments input	{ height: 24px;  }
#content #contentPage #suscoPostComments #respond { margin: auto; text-align: center; }

#blogAuthorAvatarDiv { float: right; padding-right: 21px; }
#blogAuthorAvatarDiv #authorName { padding-top: 3px; }

/*********** Form Dropdown *************/
#mini-form-button {
	position: absolute;
	top: 1px;
	left: 520px;
	width: 170px;
  font-size: 14px;
	font-weight: bold;
	font-family: arial;
  background-color: #C02325;
  color: #FFF;
  padding: 6px 10px;
  border-radius: 4px;
  -moz-border-radius: 4px;
  cursor: pointer;
	border: 1px solid gray;
}

#mini-form-container {
  display: block;
  position: absolute;
	width: 200px;
  left: 496px;
  top: -500px;
  border: 1px solid gray;
  border-radius: 4px;
  -moz-border-radius: 4px;
  background-color: #919396;
  color: #FFF;
  padding: 10px;
  z-index: 2600;
}

#mini-form-container #susco-mini-form {
  margin-left: 10px;
}

#mini-form-container #susco-mini-form label {
}

/* #susco-mini-form {
   margin-left: 30px;
} */

#susco-mini-form .textbox input, #susco-mini-form .textarea textarea, #susco-mini-form select {
  width: 170px;
	clear: both;
  display:block;
  font: 12px Arial, Helvetica, sans-serif !important;
  padding-left: 3px;
  margin-bottom: 5px;
}

#susco-mini-form select {
	width: 177px !important;
}

#susco-mini-form label {
	display: block;
	background: none;
	color: #FFF;
	width: 100px;
	font: 12px Arial, Helvetica, sans-serif !important;
	padding: 6px 0 0 4px !important;
	cursor: text;
	clear: both;
}

#susco-mini-form input.submit{
  background-color: #C02325;
  color: #FFF;
}

#susco-mini-form  label.error{
  color: #C02325;
  z-index: 999;
  border: none;
	text-align: left;
	font-size: 0.7em !important;
	width: 100% !important;
}

button#hide-form {
	float: right;
	background: none;
	border: 0px;
	color: white;
	font-size: 0.75em;
	cursor: pointer;
	margin: 0px;
	padding: 0px;
}

