/* CSS Document */

* {
	margin:0; padding:0;
	font-size:100%;
}

body
{

    background:#fff url(images/background.1.jpg) repeat-x center top;
	text-align:center;
}
.home
{

    background:#fff url(images/background.1.jpg) repeat-x center top;
}
.about{

    background:#fff url(images/background.2.jpg) repeat-x center top;
}
.solutions
{

    background:#fff url(images/background.3.jpg) repeat-x center top;
}
.solutions2
{

    background:#fff url(images/background.jpg) repeat-x;
}
.methods
{
    background:#fff url(images/background.4.jpg) repeat-x center top;
}

img {vertical-align:top;}
a img { border:0;}

ul { list-style:none;}

.left { float:left !important;}
.right {float:right;}
.clear  { clear:both;}

html, textarea
	{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 0.85em;
		line-height: 1.35em;
		color: #ccd8e2;
	}

input {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 0.85em;
		line-height: 1.35em;
		color: black;
}

td
{
	vertical-align: top;
}
.headline1
	{
		font-family:Arial, Helvetica, sans-serif;
		font-weight: bold;
        font-style: italic;
        font-size:13px;
		line-height:14px;
		color: #fff;
	}

input, select { vertical-align:middle; font-weight:normal;}

a {color:#66ade8;text-decoration:none;}
a:hover{color: #FFBB00;}
p {padding: 15px 25px 0 0;}
strong {color:#fff; white-space: nowrap;}

/* ============================= main layout ====================== */

.link {background:url(images/link-bg.gif) top right no-repeat; padding-right:10px; float:right; display:block; margin-top:24px;}

.link3 {color: #FFBB00; font-size: 12px; font-weight: bold; background:url(images/link-bg.gif) top right no-repeat; padding-right:10px;}

#header .link {background:url(images/header-link-bg.gif) top right no-repeat; color:#070707;}

.link2 {background:url(images/link-bg.gif) top right no-repeat; padding-right:10px; float:left; display:block; margin-top:6px; color:#fff;}

h3 {font-size:1.385em; color:#fff; line-height:1em; font-weight:normal; margin-bottom:10px;}

li { background:url(images/list-bg.gif) no-repeat 0 7px; padding-left: 10px; line-height:1.35em; margin-bottom: 15px;}
li a {color: #fff; text-decoration:none;}
li a:hover {text-decoration:none;}

.imgindent {margin:0 25px 50px 0; float:left; border: 1px #66ade8 dotted;}
.border {border: 1px #66ade8 dotted;}
.borderLink {border: 1px #66ade8 dotted;}
.borderLink:hover {border: 1px #fff solid;}
.title {margin-bottom:20px;}
cite {font-style:normal;}
.divider {height: 1px; border-bottom: 1px #66ade8 dotted; margin: 25px 0;}

/* ============================= header ====================== */

.portfolio
{
	margin: 80px 0 0 0;
	float: left;
}
.portfolioLeft, .portfolioRight
{
	width: 100%;
	height: 287px;
	margin: 0;
	padding: 50px 0;
	background:url(images/line-hor.gif) bottom left repeat-x;
}
.portfolioLeft IMG
{
	float: left;
	margin: 0 25px 10px 0;
	border: 1px #66ade8 dotted;
}
.portfolioRight IMG
{
	float: right;
	margin: 0 0 10px 25px;
	border: 1px #66ade8 dotted;
}
.logo {margin: 75px 50px 95px 0; float: right;}

.chat
{
	position: relative;
	width: 887px;
}
.chat div
{
	z-index: 100;
	position: absolute;
	top: 89px;
	right: 1px;
	width: 224px;
	height: 35px;
	background: url(images/button.livechat.png) no-repeat;
}
.chat div:hover
{
	cursor: pointer;
	background: url(images/button.livechat.on.png) no-repeat;
}

.logoSubMenu {margin: 80px 40px 0 0; float: right; text-align: center; color:#333;}
.logoSubMenu div{margin: 0 0 5px 0;}
.logoSubMenu span{margin: 0 40px 0 0;}
.logoSubMenu a{color:#0C60A5; text-decoration:none; margin: 0 40px 0 0;}
.logoSubMenu a:hover{color:#66ade8; text-decoration:none; margin: 0 40px 0 0;}

.logoSubMenu2 {margin: 80px 40px 0 0; float: left; text-align: center; color:#333;}
.logoSubMenu2 div{margin: 0 0 5px 0;}
.logoSubMenu2 span{margin: 0 40px 0 0;}
.logoSubMenu2 a{color:#0C60A5; text-decoration:none; margin: 0 65px 0 0;}
.logoSubMenu2 a:hover{color:#66ade8; text-decoration:none; margin: 0 65px 0 0;}

.caseStudy1 {margin: 15px 0 30px 0; float: left;}
.caseStudy2 {margin: 15px 0 30px 55px; float: left;}
.caseStudy3 {margin: 15px 0 30px 0; float: left;}

.menu {float:left;}
.menu li {float:left; text-decoration:none; display:block; text-align:center; background: url(images/menu.seperator.png) no-repeat right; width:175px; color:#666;font-size:18px; line-height: 90px; padding: 0; margin: 0;}
.menu li:hover, .menu li.active {text-decoration:none; color:#fff; background:#0c60a5 url(images/grad.blue.jpg) repeat-x; cursor: pointer;}

.slogan {margin:111px 0 0 641px;}
#header .padding {padding:0;}

/* ============================= content ====================== */

.col-pad {padding-right:36px;}
.main-indent {padding: 25px 5px 25px 5px;}

.line {background:url(images/line-hor.gif) bottom left repeat-x; padding:0 0 15px 0;}
.line15 {background:url(images/line-hor.gif) bottom left repeat-x; padding: 15px 0;}
.line30 {background:url(images/line-hor.gif) bottom left repeat-x; padding: 30px 0;}
.line2 {border-bottom:1px dotted #66ade8; padding-bottom:25px; margin-bottom:25px;}

.lineV {border-right:1px dotted #66ade8; padding-right:25px;}

.padding1 {padding-top:26px;}
.padding2 {padding-top:18px;}
.padding3 {padding-bottom:30px;}

.banner {padding: 15px; margin: 0 25px 25px 0;}
.banner div.title {text-align: center; height: 21px; margin: 0 0 10px 0;}
.banner1 {background:url(images/banner1-bg.jpg) top left repeat-y; border: 1px solid #084272;}
.banner1:hover {background:url(images/banner2-bg.jpg) top left repeat-y; cursor: pointer; border: 1px dotted #66ade8;}
.banner2 {background:url(images/banner1-bg.jpg) top left repeat-y;}
.banner3 {background:url(images/banner1-bg.jpg) top left repeat-y;}
.phone {float:right; margin-right:112px;}

/* ============================= footer ====================== */

#footer {color:#5b5b5b;}
#footer a {color:#0c60a5; text-decoration:none; font-weight:bold;}
#footer a:hover {text-decoration:none;}

/* ============================= forms ============================= */

#ContactForm {padding:20px 0 0 0;}
#ContactForm .rowi {height:48px;}
#ContactForm .link {color:#e6e4cf; background:url(images/list-bg.gif) no-repeat 0 4px ; padding:0 0 0 12px; text-decoration:none; margin:14px 0 0 15px;}
#ContactForm .link:hover {text-decoration:none;}

.input {width:232px; height:19px; border:1px solid #e6e4cf; background:#fff; padding:0 0 0 5px; font-size:1em; color:#070707;}
textarea {width:249px; height:115px; border:1px solid #e6e4cf; background:#fff; padding:0 0 0 5px; overflow:auto; font-size:1em; color:#070707;}


.title
{
    height: 28px;
    padding: 0;
    margin: 0 0 30px 0;

    color: #fff;
    font-size: 21px;
    line-height: 20px;
    font-weight: normal;

    text-align: left;
    vertical-align: middle;
	white-space: nowrap;
}
h2
{
    height: 28px;
    padding: 0;
    margin: 0 0 30px 0;

    color: #fff;
    font-size: 21px;
    line-height: 24px;
    font-weight: normal;

    text-align: left;
    vertical-align: middle;
	white-space: nowrap;
}
h2.withSubTitle
{
    margin-bottom: 0;
	height: 21px;
}
.titleBigIcon
{
    color: #fff;
    font-size: 21px;
    font-weight: normal;

    text-align: left;
    vertical-align: middle;
}

.whyUs
{
	background: url(images/icon.whyus.png) no-repeat left;
    line-height: 24px;
	height: 115px;
    padding: 40px 0 0 175px;
    margin: 0 0 30px 75px;
}

.iconTitle
{
    background: url(images/icon.png) no-repeat left;
    height: 28px;
    padding: 7px 0 0 35px;
    margin: 0 0 15px 0;

    color: #fff;
    font-size: 21px;
    line-height: 21px;
    font-weight: normal;

    text-align: left;
    vertical-align: middle;
	white-space: nowrap;
}

.highlightText {
    font-size:medium;
    color: red;
    display:inline;

}

.litrimmed {
     line-height:inherit;
     padding: 0 25px 15px 15px;
}

.litrimmed2 {
     line-height:inherit;
     padding-bottom:5px;
}



#case1 {
	display: block;
	padding: 0 30px 30px 30px;
    cursor: pointer;
}
#case1-button {
	opacity: 1.0;

}

#case2 {
	display: none;
	padding: 0 30px 30px 30px;
    cursor: pointer;
}
#case2-button {
	opacity: 0.5;

}

#case3 {
	display: none;
	padding: 0 30px 30px 30px;
    cursor: pointer;
}
#case3-button {
	opacity: 0.5;


}

.comment {
    padding-bottom:10px;
}

.thread-even {
   background:transparent url(images/banner1-bg.jpg) repeat-y scroll left top 
}

.thread-odd {
      padding-top:10px;
}

.categories {

    padding-bottom:15px;
}

.twoColList tr td
{
	vertical-align: top;
	padding-left: 30px;
}
.twoColList tr td:first-child
{
	width: 52%;
	padding: 0 25px 0 0;
	border-right: 1px #66ade8 dotted;
}
.twoColList tr td span
{
	color: #ffbb00;
	font-weight: bold;
	margin-bottom: 0;
}

#app-screens
{
	float: left;
	display: inline;
	width: 205px;
	height: 355px;
	margin: 0 20px 0 0;
	display: block;
	overflow: hidden;
	background: url(images/services.iphone.png) 0 0 no-repeat;
}
#app-slideshow
{
	width: 141px;
	height: 211px;
	margin: 94px 25px 0 25px;
	text-align: center;
	overflow: hidden;
	top: -41px;
	left: 8px;
}
#app-slideshow div
{
	position: absolute;
	top: 0px;
	left: 250px;
	display: none;
	margin: 0;
}

.yellow
{
	color: #ffbb00;
}
.white
{
	color: #fff;
}
.bold
{
	font-weight: bold;
}
.arrowDown
{
    width: 100%;
	height: 59px;
	background: url(images/arrow.down.png) no-repeat center;
	margin: 30px 0;
}
.top
{
	vertical-align: top;
}
.middle
{
	vertical-align: middle;
}
.bottom
{
	vertical-align: bottom;
}

.wrap
{
	white-space: normal;
}

.postmetadata a {
    color:gray;
}

.floatRight
{
	float: right;
}

.floatLeft
{
	float: left;
}

.buttonYellow
{
	background: url(images/button.grad.yellow.jpg) repeat-x bottom;
	font-size: 21px;
	line-height: 35px;
	font-weight: normal;
	color: #000;
	text-transform: uppercase;
	padding: 15px 15px 5px 15px;
}
.buttonYellow:hover
{
	background: url(images/button.grad.black.jpg) repeat-x bottom;
	color: #fff;
}

.relative
{
	position: relative;
}
.absolute
{
	position: absolute;
}

