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

.techsupport li a strong { font-size:10px; }

body { 
background: url('images/bkg_body.jpg') repeat-x 0 0;
margin: 0;
text-align: center;
font: 11px/12px helvetica, sans-serif;
}

a { outline: none; }
.noTxt { font-size: 0; line-height: 0; text-indent: -9999px; }
.clear { clear: both; }
.hr hr { display: none; }
.hr { height: 1px; display: block; background: #ccc; margin: 16px 0; }

#wrapper {
width: 1000px;
margin: 22px auto;
text-align: left;
background: url('images/bkg_wrapper.jpg') no-repeat 0 0;
position: relative;
}

#home #wrapper { background: url('images/bkg_wrapper_home.jpg') no-repeat 0 0; }

#logo { position: absolute; top: 32px; left: 28px; z-index: 9999; }


/* NAVIGATION STYLES */

#navigation {
height: 145px; 
position: relative;
background: url('images/bkg_navigation.jpg') no-repeat 0 0; 
}

#navigation ul { margin: 0; padding: 0; }
#navigation li { list-style: none; position: absolute; }
#navigation li a { font: bold 11px/18px helvetica, sans-serif; color: #494949; text-decoration: none; }
#navigation strong { color: #3081ae; }

.nav1, .nav2, .nav3, .nav4 { height: 145px; display: block; }

.nav1 { left: 0; }
.nav2 { left: 248px; }
.nav3 { left: 490px; }
.nav4 { left: 735px; }

.nav1 div { width: 277px; }
.nav2 div { width: 272px; }
.nav3 div { width: 272px; }
.nav4 div { width: 265px; }

div.hoverBtn {
	position: relative;
}
div.hoverBtn a {
	position: relative;
	z-index: 2;
	display: block;
	height: 145px;
	font: bold 11px/18px helvetica, sans-serif; color: #494949; text-decoration: none;
}

div.hoverBtn div {
	display: none;
	position: absolute;
	z-index: 1;
	top: 0px;
}

.nav1 div.hoverBtn div { background: url('images/bkg_nav_rolloverFirst.png') no-repeat 0 0; }
.nav2 div.hoverBtn div, .nav3 div.hoverBtn div { background: url('images/bkg_nav_rollover.png') no-repeat 0 0; }
.nav4 div.hoverBtn div { background: transparent; }


.fadeThis {
		position:relative;
		display:block;
		width: 300px;
		height: 145px;
}
	
.fadeThis span.hover {
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		height: 145px;
		width: 300px;
		background:url('images/bkg_nav_rollover.png') 0 0 no-repeat;
		z-index: 1;
}

.nav1 .fadeThis span.hover { background:url('images/bkg_nav_rolloverFirst.png') 0 0 no-repeat; }
.nav4 .fadeThis span.hover { background: transparent; }
	
.navBtnContent { position: absolute; z-index: 9999; }
.navBtnContent div { float: left; }

ul.techsupport {
margin: 0; padding: 0;
}

ul.techsupport li { position: relative !important; }
ul.techsupport li a {
background: url('images/bkg_tech_suppot_li.png') no-repeat 0 0; 
height: 20px; padding: 6px 0 0 18px;
}

h2 { margin: 0; height: 48px; width: 200px; display: block; }
h2.about-us-title { background: url('images/h2_about_us.png') no-repeat left 50%; margin-left: 18px; }
h2.products-title { background: url('images/h2_products.png') no-repeat left 50%; margin-left: 30px; }
h2.solutions-title { background: url('images/h2_solutions.png') no-repeat left 50%; margin-left: 30px; }
h2.technical-support-title { background: url('images/h2_technical_support.png') no-repeat left 50%; margin-left: 26px; }

div.about-us-text { width: 184px; margin:12px 0 0 18px; }
div.products-text { width: 134px; margin:12px 0 0 45px; }
div.solutions-text { width: 158px; margin:12px 0 0 40px; }
div.technical-support-text { width: 160px; margin:0 0 0 36px; }

span.about-us-text, span.products-text, span.solutions-text, span.technical-support-text {
display: block; float: left; }


#footer { 
background: url('images/bkg_footer_ul.jpg') no-repeat 0 0;
position: relative;
min-height:47px;
margin-top: 8px;
text-align: center;
color: #949393;
}

#footer ul { margin: 0; }
#footer li { list-style: none; float: left; display: block; height: 40px; }
ul.bottomnav { width: 750px; height: 21px; display: block; position: absolute; left: 234px; padding-top:19px; }
.bottomnav li a { color: #949393; text-decoration: none; border-right: 1px solid #ddd; padding-right: 6px; margin-left: 6px; }
.bottomnav li a:hover { color: #3081ae; }

p.copyright { text-align: center; color: #949393; }


.lifesize {
position: absolute;
left: 0; top: 1px;
height: 45px; width: 159px; display: block;
}

/* ---------------------------------  Social Link Styles -- */
ul.social { 
position: absolute;
right: 0; top: 8px;
width: 81px;
}

ul.social li a { display: block; width: 27px; height: 30px;
font-size: 0; line-height: 0; text-indent: -9999px;
}
ul.social li a:hover { background-position: bottom; }
.icon-facebook { background: url('images/bkg_icon_facebook.jpg') no-repeat 0 0; }
.icon-linkedin { background: url('images/bkg_icon_linkedin.jpg') no-repeat 0 0; }
.icon-twitter { background: url('images/bkg_icon_twitter.jpg') no-repeat 0 0; }
.icon-rss { background: url('images/bkg_icon_rss.jpg') no-repeat 0 0; }


/* callout */

#callout {
height: 430px;
position: relative;
}

.story { 
font: 15px/20px Verdana, Arial, Helvetica, sans-serif;
color: #373737;
width: 360px;
margin-left: 28px;
}

.h2_image { margin: 112px 0 0 28px; }

.container { 
	width:1000px; height:430px; 
	overflow:hidden; position:relative;
	}

.slides { position:absolute; top:0; left:0; }

.slideContainer {
	position: absolute; 
	width: 1000px; height: 430px; 
	display: block;
	
	}

.storyTitle { margin: 80px 0 4px 0; }

.calloutControls {
width:600px; height: 25px; 
background: url('images/bkg_myController.png') no-repeat 0 0; 
font: 14px/16px helvetica, sans-serif;
position: absolute; bottom: 40px; left: 10px;
}

ul.pagination { float: left; margin: 0; padding: 0; }
ul.pagination li { float: left; list-style: none; }
ul.pagination li a { text-decoration: none; }

.one { width: 35px; left: 0; }
.two { width: 36px; left: 28px; }
.three { width: 36px; left: 57px; }

.one, .two, .three { 
background: url('images/bkg_control.png') no-repeat top right;
cursor:pointer; 
color:#a1a1a1; 
height: 20px; padding-top: 5px;
display: block; position: absolute; 
text-align: center; 
}

.one:hover, .active .one { background: url('images/bkg_control1.png') no-repeat 0 0; color: #FFF; }
.two:hover, .active .two { background: url('images/bkg_control2.png') no-repeat 0 0; color: #FFF; }
.three:hover, .active .three { background: url('images/bkg_control2.png') no-repeat 0 0; color: #FFF; }

.snippet {
bottom: 39px;
left: 112px;
position: absolute;
font: 11px/20px Verdana, Arial, Helvetica, sans-serif;
color: #373737;
height: 25px;
z-index: 1000;
}


/* Products Page */

h3 { font: bold 15px/18px Verdana, Arial, Helvetica, sans-serif; color: #373737; margin: 16px 0 0 28px; }

#productsContainer h3 { margin: 0 0 0 28px; }

#productsContainer { 
min-height:315px;
padding-top:115px;
width:1000px;
}

ul.thumbs {
	clear: both;
	margin: 0;
	padding: 0;
}
ul.thumbs li {
	float: left;
	padding: 0;
	margin: 0;
	list-style: none;
}
a.thumb {
	display: block;
	cursor: pointer;
	padding-left:28px;
}
ul.thumbs li.selected a.thumb {
	color: #1c6893;
}
a.thumb:focus {
	outline: none;
}

#thumbs .selected {
background: url('images/bkg_products_arrow.png') no-repeat 0 0;
cursor: pointer;
}

div.product-headline {
font: 24px/24px Verdana, Arial, Helvetica, sans-serif;
color: #3081ae;
padding-bottom: 16px;
}

div.product-description {
font: 12px/16px Verdana, Arial, Helvetica, sans-serif;
color: #333333;
}

#slideshow { 
background: url('images/bkg_vr.png') no-repeat 0 0;
width: 239px; min-height: 300px;
padding-left: 1px;
float: left; overflow: hidden; }

#caption { 
background: url('images/bkg_vr.png') no-repeat 0 0;
width: 448px; min-height: 300px; 
padding: 0 26px;
float: left; }
	
div.content {
	/* The display of content is enabled by a javascript generated style on the page.
	   This is so that the slideshow content won't display unless javascript is enabled. */
	
	position: absolute; left: 260px;
	width:740px; 
}
div.content a { 
	text-decoration: none;
	font: 13px/19px Verdana, Arial, Helvetica, sans-serif;
	color: #1C6893;
}

div.navigation a {
	text-decoration: none;
	font: 15px/19px Verdana, Arial, Helvetica, sans-serif;
	color: #373737;
}

div.loader {
	background: url('images/loader.gif') no-repeat 50%;
	width: 550px;
	height: 350px
}

div.slideshow img {
	border: none;
	display: block;
}

div.navigation {
	/* The navigation style is set by a javascript generated style on the page.
	   This is so that the javascript specific styles won't be applied unless javascript is enabled. */
	position: absolute; left: -7px;
}

ul.product-options {
margin: 22px 6px; padding: 0;
}

.product-options li {clear: both;
list-style: none;
}
.product-options li a {
font: 11px/14px Verdana, Arial, Helvetica, sans-serif;
color: #333333;
padding-left: 46px;
background: url('images/bkg_product_options.png') no-repeat 0 0;
height: 16px; display: block;
margin-bottom: 6px;
}

.product-options .enlarge { background-position: top left; }
.product-options .pdf { background-position: bottom left; }


/* Contact Styles */

#contactContainer {
min-height:315px; height: 315px;
padding-top:115px;
width:1000px;
}

#cInfo { width: 300px; float: left; padding-left: 20px; }

#cForm { 
background: url('images/bkg_vr.png') no-repeat 0 0;
width: 640px; min-height: 300px; 
padding-left: 40px; float: left; 
font: 12px/18px Verdana, Arial, Helvetica, sans-serif;
color: #333333; }

address {
font: normal 12px/20px Verdana, Arial, Helvetica, sans-serif;
color: #373737;
margin-bottom: 14px;
}

ul.contactInfo, ul.contactDesc { 
width: 150px; float: left; 
margin: 0; padding: 0;
}

.contactInfo li, .contactDesc li {
list-style: none;
height: 16px; display: block;
margin: 4px 0;
}

.contactInfo li a {
font: bold 11px/16px Verdana, Arial, Helvetica, sans-serif;
color: #333333;
text-decoration: none;
}

.contactInfo li { padding-left: 46px; }
.contactInfo .map { background: url('images/bkg_contact_options.png') no-repeat top left; }
.contactInfo .email { background: url('images/bkg_contact_options.png') no-repeat left 50%; }
.contactInfo .phone { background: url('images/bkg_contact_options.png') no-repeat bottom left; }

.contactDesc li { font: bold 10px/16px Verdana, Arial, Helvetica, sans-serif; }
.contactDesc .red { color: #bb1a01; }
.contactDesc .blue { color: #116898; }

/* input label styles */

.right label { float: right; }

.input {
  margin: 2px 0;
  float: left;
  clear: both;
}
.input span {
  position: absolute;
  padding: 5px;
  margin-left: 3px;
  font-size:12px;
  font-weight: bold;
  font-family: helvetica, sans-serif;
  color: #999999;
  z-index: 9999;
}
.input input, .input textarea, .input select {
  position: relative;
  margin: 0;
  border-width: 1px;
  padding: 6px;
  background: transparent;
  font: inherit;
}
/* Hack to remove Safari's extra padding. Remove if you don't care about pixel-perfection. */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .input input, .input textarea, .input select { padding: 4px; }
}

#cForm input, #cForm select, #cForm textarea { 
border: none; 
font: bold 12px/14px helvetica, sans-serif;
color: #333333;
}

input.name, input.company, input.email { 
background: url('images/bkg_input_long.png') no-repeat 0 0; 
width: 435px; height: 19px; display: block; 
padding: 8px 0 0 8px;
}

input.city, input.phone { 
background: url('images/bkg_input_short.png') no-repeat 0 0; 
width: 165px; height: 19px; display: block; 
padding: 8px 0 0 8px;
}

select.state { 
background: url('images/bkg_select_short.png') no-repeat 0 0; 
width: 78px; height: 27px; display: block;
padding: 8px 0 0 8px;
}

textarea.message { 
background: url('images/bkg_textarea.png') no-repeat 0 0; 
width: 427px; height: 79px; display: block;
padding: 8px;
}

input.submit {
background: url('images/btn_submit.png') no-repeat 0 0;
width: 67px; height: 25px; display: block; margin: 0 0 2px 6px;
font-size: 0 !important; line-height: 0 !important; text-indent: -9999px;
outline: none;
}

#cForm h3, #faq h3 { font: normal 24px/24px Verdana, Arial, Helvetica, sans-serif; color: #3081ae; margin:0 0 0 12px; padding: 0; }
#cForm em { font-weight: bold; font-style: normal; color: #bb1a01; }

iframe { border: none; }

iframe.loader { 
border: none; outline: none;
width: 443px; height: 24px;
}


/* FAQ Styles */

#faqContainer { 
min-height:315px;
padding: 115px 40px 20px 20px;
width:940px;
}

#faqContainer ul { margin: 0; padding: 0; }

#faqContainer li {
font: bold 14px/16px Verdana, Arial, Helvetica, sans-serif;
}

#faqContainer p {
font: 13px/16px Helvetica, sans-serif; }


/* About Us Styles */

#aboutusContainer { 
min-height:315px;
padding: 115px 40px 20px 20px;
width:940px;
font: 13px/16px Helvetica, sans-serif;
}

#aboutusContainer h3 { font: normal 24px/24px Verdana, Arial, Helvetica, sans-serif; color: #3081ae; margin:0; padding: 0; }

#aboutusContainer li { margin: 8px 0; }

/* Product Support */

#productsupportContainer { 
min-height:315px;
padding: 115px 40px 0 20px;
width:940px;
font: 13px/16px Helvetica, sans-serif;
}

#productsupportContainer h3 { font: normal 24px/24px Verdana, Arial, Helvetica, sans-serif; color: #3081ae; margin:0; padding: 0; }

#productsupportContainer a { color: #bb1a01; }

#productsupportContainer li { font-size: 11px; }

#productsupportContainer li a { font-weight: bold; text-decoration: none; float: left; margin-right: 12px; color: #333; }


/* Terms & Conditions */

#termsContainer, #privacyContainer {   
min-height:315px;
padding: 115px 40px 20px 20px;
width:940px;
font: 11px/16px Helvetica, sans-serif;
}

#termsContainer h3, #privacyContainer h3 { font: normal 24px/24px Verdana, Arial, Helvetica, sans-serif; color: #3081ae; margin:0 0 10px 0; padding: 0; }
#termsContainer h4, #privacyContainer h4 { font: normal 16px/24px Verdana, Arial, Helvetica, sans-serif; color: #333; margin:0; padding: 0; }

/* Managed Solutions Styles */

#managedsolutionsContainer { 
min-height:315px;
padding: 115px 40px 20px 20px;
width:940px;
font: 13px/16px Helvetica, sans-serif;
}

#managedsolutionsContainer h3 { font: normal 24px/24px Verdana, Arial, Helvetica, sans-serif; color: #3081ae; margin:0; padding: 0; }
#managedsolutionsContainer h4 { font: normal 14px/24px Verdana, Arial, Helvetica, sans-serif; color: #333; margin:0; padding: 0; }

#managedsolutionsContainer a { color: #bb1a01; }

#managedsolutionsContainer img { float: left; border: 1px solid #999; padding: 6px; background: #FFF; }

#managedsolutionsContainer li { font-size: 11px; }

#managedsolutionsContainer li a { font-weight: bold; text-decoration: none; float: left; margin-right: 12px; color: #333; }

.managedBox { width: 260px; float: left; margin-left: 20px; }