body {
	margin: 0px; /* Must leave in - fixes body overflow in IE */
	padding: 0px; /* Must leave in - fixes body overflow in IE */
	background-color: #FCFCFC;
	background-image: url(images/ground_blue.gif);
	background-attachment: fixed;
	font-family: "Century Gothic", Helvetica, Tahoma, Arial, sans-serif;
	font-size: small;
	color: #00015E;
	voice-family: inherit;
}
#header {
	position: absolute;
	top: 0px;
	background-image: url(images/header-bk-mag-narrow.gif);
	background-repeat: repeat-x;
	width: 100%; /* Must keep for Safari and Opera */
	height: 75px;
}
#headerleft {
	float: left;
	margin-top: 8px;
	margin-left: 10px;
}
#headerright {
	float: right;
}
/****Menu - Navigation Styles****/
div#menu {
	position: absolute; /*This div is just a moveable container for positioning. */
	top: 76px; /* Using 'div' at the beginning of each '#nav' tag is only necessary to keep IE from choking on this menu type. If you don't do it, IE slows way down or won't use correctly. */
	left: 0px;
	right: 30%;
	clear: both;
	/*border: thin dotted #F4A460;*/
}
div#nav {
	float: left;
	margin: 0px 0 0 0px;
	background: #F6FFFF url(images/ground_blue.gif) fixed; /* Changes just the top row background except current */
	color: inherit; /* Satisfies passing CSS 2.0 standards */
}
div#nav ul {
 	margin: 0px 1px; 
	padding: 0px; 
	background: #F6FFFF;
	color: inherit;
}
div#nav li {
	position: relative;
	top: 0px;
	left: 0px; 
	list-style: none; 
	margin: 0;
  	float: left; 
	width: 6.0em; /* was 7.0em - IE looked crowded @ 800x600; aligned poorly */
	line-height: 1.75em;
	z-index: 100;
}
div#nav li#current {
	background: #26A2E2;
}
div#nav li:hover {
	background: #26A2E2;
}
/*div#nav li.submenu {
	background: #F0FFFF none no-repeat 99% 50%;
}*/
div#nav li a {
	display: block; 
	padding: 0em 0em 0.25em 0em;
  	text-decoration: none;
	width: 6.0em; /* was 7.0em - IE looked crowded @ 800x600; aligned poorly */
	color: #F6FFFF; /* changes top row anchor color - except current */
	text-align: center;
	font-size: x-small;
}

div#nav>ul a {
	width: auto;
}
div#nav ul ul {
	position: absolute;
	width: 9em;
	display: none;
}
div#nav ul ul li {
	width: 9em;
}
div#nav li.submenu ul.level2 li a,
div#nav li.submenu ul.level3 li a {
	font-size: x-small;
	font-weight: 600;
	text-align: left;
	padding-left: 1em;
	width: 11em;
	color: #404E84; /* only changes a text on level2 only lists? */
}
div#nav li.submenu li.submenu {
	background: #F6FFFF none no-repeat 99% 50%;
}
div#nav li.submenu li:hover, 
div#nav li.submenu li.submenu:hover {
	background-color: #26A2E2;
}
div#nav ul.level1 li.submenu:hover ul.level2, 
div#nav ul.level2 li.submenu:hover ul.level3 {
	display:block; 
	background-color: #F6FFFF;
}
div#nav ul.level2 {
	top: 1.9375em; /* positions the top of the first submenu just into the top menu row so it won't break */
	left: -1px;
}
div#nav ul.level3 {
	top: 0em; 
	left: 8.9375em;
}
/********/
.headTitle {
	position: relative;
	top: 126px;
	color: #FCFCFC;
	font-size: x-large;
	font-style: italic;
	font-weight: 600;
	text-align: center;
}
#mainContainer {
	position: relative;
	margin: 0px 100px 0px 100px;
/*	padding-left: 100px;   /* LC fullwidth - grail command */
/*	padding-right: 100px;  /* RC fullwidth + CC padding - grail command */
	min-width: 600px;  /* LC fullwidth + CC padding -or- 2x LC width + RC width - grail command */
	top: 126px;
	left: 0px;
	height: 100%;
	clear: both;
	background: #FCFCFC;
	border: thin solid #00015E;
}
#mainContainerWide {
	position: relative;
	margin: 0px 30px 0px 30px;
	min-width: 600px;  /* LC fullwidth + CC padding -or- 2x LC width + RC width - grail command */
	top: 126px;
	left: 0px;
	height: 100%;
	clear: both;
	background: #FCFCFC;
	border: thin solid #00015E;
}
#mainContainerXWide {
	position: relative;
	margin: 0px 100px 0px 100px;
	min-width: 760px;  /* LC fullwidth + CC padding -or- 2x LC width + RC width - grail command */
	top: 126px;
	left: 0px;
	height: 100%;
	clear: both;
	background: #FCFCFC;
	border: thin solid #00015E;
}
/*.column {
	position: relative;  /* grail command */
	/*float: left;  /* grail command */
/*}*/
#centerColumn {
	width: 100%;  /* grail command */
	padding: 0px;
	font-size: small; /* Use for Font-Size adjustments in the main body */
}
.boxIPLite {
	position: relative;
	top: 141px;
	left: 50%;
	margin-left: -335px;
	padding: 0px;
	width: 670px;
	height: 433px;
	background: #F0F8FF;
}
#imageTitle {
	width: 100%;
}
#imageTitle td.textLeft {
	text-align: left;
	padding: 0px 0px 0px 20px;
	font-size: x-large;
	font-style: italic;
	font-weight: 600;
}
td.textLeft p {
	text-align: left;
	padding: 20px 0px 10px 20px;
	font-size: large;
	font-style: italic;
	font-weight: 600;
	border-bottom: 1px solid #404E84;
}
#imageTitle td.imageCenter {
	text-align: left;
}
#imageTitle td.textRight {
	text-align: right;
	padding: 0px 20px 0px 0px;
	font-size: x-large;
	font-style: italic;
	font-weight: 600;	
}
.textTitle {
	position: relative;
	top: 0px;
	margin: 0em 0em 0em 0em;
	padding: .25em 0em .125em 0em;
	background: #B9DEFF;
	/*color: #404E84;*/
}
.textTitle p {
	color: #404E84;
	font-size: x-large;
	font-style: italic;
	font-weight: 600;
	text-align: center;
}
.textCenter {
	text-align: center;
}
#splash1 {
	position: relative; /*position must be relative for centering to work */
	top: 20px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -275px; /* - 1/2 of the width */
	margin-bottom: 20px;
	width: 550px; /* normally the width of the background graphic you want to center */
	height: 393px; /* normally the height of the background graphic */
	padding: 0px;	
	background: #404E84 url(images/sg-gr550.gif) no-repeat scroll center;
}
#splashLite1 {
	position: relative; /*position must be relative for centeringto work */
	top: 20px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -275px; /* - 1/2 of the width */
	width: 550px; /* normally the width of the background graphic you want to center */
	height: 393px; /* normally the height of the background graphic */
	padding: 0px;	
	background: #404E84 url(images/sgl-gr550.gif) no-repeat scroll center;
}
#splash2 {
	position: relative;
	top: 20px;
	left: 50%;
	margin-left: -224px;
	padding: 20px 0px 20px 0px;
	width: 448px;
	height: 318px;
	background: #FCFCFC url(images/mega.gif) no-repeat scroll;
}
#splashWebx1 {
	position: relative; /*position must be relative for centering to work */
	top: 20px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -274px; /* - 1/2 of the width */
	margin-bottom: 60px;
	width: 548px; /* normally the width of the background graphic you want to center */
	height: 559px; /* normally the height of the background graphic */
	padding: 0px;	
	background: #404E84 url(images/webmega2.gif) no-repeat scroll center;
}
#splashWebx2 {
	position: relative; /*position must be relative for centering to work */
	top: 20px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -288px; /* - 1/2 of the width */
	margin-bottom: 60px;
	width: 576px; /* normally the width of the background graphic you want to center */
	height: 327px; /* normally the height of the background graphic */
	padding: 0px;	
	background: #404E84 url(images/webx2.gif) no-repeat scroll center;
}
#splashHomeRunner {
	position: relative; /*position must be relative for centering to work */
	top: 20px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -252px; /* - 1/2 of the width */
	margin-bottom: 60px;
	width: 504px; /* normally the width of the background graphic you want to center */
	height: 360px; /* normally the height of the background graphic */
	padding: 0px;	
	background: #404E84 url(images/hr-splash.gif) no-repeat scroll center;
}
#logoCenter {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-top: 30px;
	margin-left: -200px; /* - 1/2 of the width */
	margin-bottom: 30px;
	width: 400px; /* normally the width of the background graphic you want to center */
	height: 62px; /* normally the height of the background graphic */
	padding: 0px;	
}
#hrFloorplan {
	background: #F6FFFF url(images/i215-front-floorplan+hand.gif) no-repeat;
}
.imageCenter { /*for HomeRunner */
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -197px; /* - 1/2 of the width */
	margin-bottom: 30px;
	width: 395px; /* normally the width of the background graphic you want to center */
	height: 366px; /* normally the height of the background graphic */
	padding: 0px;
}

.imageCenterWide {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -250px; /* - 1/2 of the width */
	margin-bottom: 30px;
	width: 500px; /* normally the width of the background graphic you want to center */
	height: 206px; /* normally the height of the background graphic */
	padding: 0px;
}
.imageCenterHub {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -250px; /* - 1/2 of the width */
	margin-bottom: 30px;
	width: 500px; /* normally the width of the background graphic you want to center */
	height: 593px; /* normally the height of the background graphic */
	padding: 0px;	
}
.imageCenterALC {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -252px; /* - 1/2 of the width */
	margin-bottom: 30px;
	width: 504px; /* normally the width of the background graphic you want to center */
	height: 408px; /* normally the height of the background graphic */
	padding: 0px;	
}
.imageCenterHub800 {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -400px; /* - 1/2 of the width */
	margin-bottom: 30px;
	width: 800px; /* normally the width of the background graphic you want to center */
	height: 949px; /* normally the height of the background graphic */
	padding: 0px;	
}
#imageCenterPSS-JBX-J-Diagram {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -300px; /* - 1/2 of the width */
	margin-bottom: 30px;
	width: 600px; /* normally the width of the background graphic you want to center */
	height: 409px; /* normally the height of the background graphic */
	padding: 0px;	
}
.imageAnimated {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -180px; /* - 1/2 of the width */
	margin-bottom: 30px;
	width: 360px; /* normally the width of the background graphic you want to center */
	height: 90px; /* normally the height of the background graphic */
	padding: 0px;
}
#hrBedroomOffOn {
	background: #FCFCFC url(images/i215-bdrmOFF-ON_hand500.gif) no-repeat;
}
#hrBedroomOnOff {
	background: #FCFCFC url(images/i215-bdrmON-OFF_hand500.gif) no-repeat;
}
#hrSecurity {
	background: #FCFCFC url(images/i215-security500.gif) no-repeat;
}
#hrAudioVideo {
	background: #FCFCFC url(images/i215-remotes2-500.gif) no-repeat;
}
#hrAudioVideoHand {
	background: #FCFCFC url(images/i215-av_hand.gif) no-repeat;
}
#hrAnimated {
	background: #FCFCFC url no-repeat;
}
#hrMunsters {
	background: #FCFCFC url(images/i215-munsters500.gif) no-repeat;
}
.floatLeft {
	clear: both;
	top: 0px;
	left: 0px;
	margin: 30px 75px 30px 75px;
	/*border: thin solid #E6F0FA;*/
}
.floatLeft span.image {
	float: left;
	position: relative;
	top: 0px;
	margin: 0px 40px 20px 0px;
	}
.floatRight {
	clear: both;
	top: 0px;
	left: 0px;
	margin: 30px 75px 30px 75px;
	/*border: thin solid #E6F0FA;*/
}
.floatRight span.image {
	float: right;
	position: relative;
	top: 0px; 
	margin: 0px 0px 20px 40px;
	}
.floatBoth {
	clear: both;
	position: relative;	
	top: 0px;
	right: 0px;
	margin: 30px 75px 30px 75px;
	/*border: thin solid #E6F0FA;*/
}
.floatBoth div.imageLeft {
	float: left;
	position: relative;
	top: 1em;
	left: 0px;
	margin: 10px 40px 20px 0px;
}
.floatBoth div.imageRight {
	position: relative;
	float: right;
	top: 1em;
	right: 0px;
	margin: 10px 0px 20px 40px;
}
.floatBoth div.centerText {
	position: relative;
	top: 0px;
	left: 0px;	
	display: inline;
	text-align: center;
}
.textAlone {
  	clear: both; 
	margin: 30px 75px 30px 75px;
}
.textAlone li {
	font-weight: 500;
}
.textAlone dd {
	font-weight: normal;
}
.productBold {
	color: #00015E;
	text-shadow: Navy;
	font-weight: 600;
	font-style: italic;
}
.productBoldLarger {
	color: #00015E;
	text-shadow: Navy;
	font-weight: 600;
	font-style: italic;
	font-size: 135%;
}
.headDownloadRed {
	color: #A53B3B;
	font-size: large;
	font-style: italic;
	font-weight: bold;
}
.headDownloadYellow {
	color: #DAA520;
	font-size: large;
	font-style: italic;
	font-weight: bold;	
}
.headDownloadGreen {
	color: #006400;
	font-size: large;
	font-style: italic;
	font-weight: bold;	
}
.imageIcon {
	float: left; /* aligns icon and caption "download" under each other */
	padding: 10px 45px 10px 45px;
	border: none;
}
.imageIcon img{
	border: 0px;
}
.imageIcon a{
	text-decoration: none;
}
.smImageCenter {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	margin-left: -93px; /* - 1/2 of the width */
	margin-bottom: 0px;
	width: 186px; /* normally the width of the background graphic you want to center */
	height: 12px; /* normally the height of the background graphic */
	padding: 0px;
}
#specWrap {
	position: relative; /*position must be relative for centering to work */
	top: 20px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	bottom: 0px;
	right: 0px;
	margin-left: -40%; /* - 1/2 of the width */
	margin-bottom: 75px; /* White space of specWrap at the page bottom */
	width: 80%; /* normally the width of the background graphic you want to center */
	height: 100%; /* normally the height of the background graphic */
	padding: 0% 0% 0% 0%;
	border: 2px solid #404E84;
	background: #B9DEFF;
}
#wideWrap {
	position: relative; /*position must be relative for centering to work */
	top: 0px;
	left: 50%; /* works with "margin-left" & "width" - the 3 together will center the container */
	bottom: 0px;
	right: 0px;
	margin-left: -50%; /* - 1/2 of the width */
	margin-bottom: 0px;
	width: 100%; /* normally the width of the background graphic you want to center */
	height: 100%; /* normally the height of the background graphic */
	padding: 0% 0% 0% 0%;
/*	border: 2px solid #404E84; */
	background: #B9DEFF;
}
#specTable,
#priceTable {
	width: 100%;
}
#priceTable {
	background: #B9DEFF;
	padding: 0px 0px 0px 0px;
	margin: 10px 10px 0px 10px;
}
.specTitle {
	padding-top: 1em;
	padding-bottom: .75em;
	text-align: center;	
	font-style: italic;
	font-weight: bolder;
}
#specTable tr.even {
	width: 100%;
	background: #FFFFFF;
}
#specTable tr.odd {
	width: 100%;
	background: #B9DEFF;
}
#specTable td {
	padding: .5em 1.25em .5em 1.25em;
/*	border-bottom: 1px solid #404E84; */
}
#specTable td.leftClear {
	padding: 5px 10px 3px 10px;
	text-align: right;
	vertical-align: top;
	border-right: 1px solid #404E84;
}
#specTable td.leftClearLast {
	padding: 5px 10px 10px 10px;
	text-align: right;
	vertical-align: top;
	border-right: 1px solid #404E84;
	border-bottom: 1px solid #404E84;
}
#specTable td.rightClearSmaller {
	padding: 5px 10px 3px 10px;
	font-size: 75%;
	vertical-align: top;	
}
#specTable td.rightClearSmallerLast {
	padding: 5px 10px 10px 10px;
	font-size: 75%;
	vertical-align: top;
	border-bottom: 1px solid #404E84;
}
#specTable td.headingNavyLeft {
	background: #404E84;
	font-weight: bold;
	text-align: center;
	color: #F6FFFF;
	border-right: 1px solid #404E84;
	border-bottom: 1px solid #404E84;
}
#specTable td.headingNavyCenter {
	background: #404E84;
	font-weight: bold;
	text-align: left;
	color: #F6FFFF;
	border-right: 1px solid #404E84;
	border-bottom: 1px solid #404E84;
}
#specTable td.headingNavyRight {
	background: #404E84;
	font-weight: bold;
	text-align: center;
	color: #F6FFFF;
	border-bottom: 1px solid #404E84;
}
#specTable td.priceLeft {
	text-align: center;
	border-right: 1px solid #404E84;
	border-bottom: 1px solid #404E84;
}
#specTable td.priceCenter {
	text-align: left;
	border-right: 1px solid #404E84;
	border-bottom: 1px solid #404E84;
}
#specTable td.priceRight {
	text-align: right;
	border-right: 1px solid #404E84;
	border-bottom: 1px solid #404E84;
}
#specTable td.priceRightLast {
	text-align: right;
	border-bottom: 1px solid #404E84;
}
#specTable td.downloadLine {
	text-align: left;
	border-bottom: 1px solid #404E84;
}
#specTable td.downloadLineLeft {  /*with an image icon */
	border-bottom: 1px solid #404E84;
	text-align: center;
}
#specTable td.textCell {
	padding: 10px 75px 10px 75px;
	border-bottom: 1px solid #404E84;
}
#input { 
	margin-top: 10px;
	text-align: center;
}
#leftColumn {
	background: #E6E6FA none repeat-y scroll center;
	width: 100px;  /* LC width - grail command */
	right: 100px;  /* LC full width + CC padding - grail command */	
	margin-left: -100%;  /* grail command */
}
#rightColumn {
	background: #E6E6FA none repeat-y scroll center;
	width: 100px; /* RC width - grail command */
	margin-right: -100%; /* -RC fullwidth + CC padding - grail command */
}
td.alignTop {
	vertical-align: text-top;
}
#listTable td li {
	list-style: none;
}
h1  {
	font-size : x-large;
	font-weight : bold;
	color : #Navy;
	font-style : italic;
	text-align: center;
}
h2  {
	font-size : large;
	font-weight : bold;
	color : #CD5C5C;
	font-style : italic;
	text-align: center;
}
h3  {
	font-size: large;
	color: #404E84;
	font-style: italic;
	text-align: center;
}
h4 {
	padding: .75em 0px 0px 0px;
	font-size: medium;
	color: #404E84;
	font-style: italic;
	text-align: center;
}
h5 {
	padding: .25em 0px 0px 0px;
	font-size: 100%;
	color: #404E84;
	font-style: italic;
	text-align: center;
	font-weight: 700;
}
h6 {
	padding: 0em 0px 0px 0px;
	font-size: 90%;
	color: #404E84;
	font-style: italic;
	text-align: center;
	font-weight: 900;
}
h6LeftAlign {
	padding: 0em 0px 0px 0px;
	font-size: 90%;
	color: #404E84;
	font-style: italic;
	text-align: left;
	font-weight: 900;
}
u {
	text-decoration: underline;
}
.state {
	font-size: 90%;
	font-weight: 600;
	font-style: italic;
	text-align: left;
	text-decoration: underline;
	color: #26A2E2;
}
.dlr {
	font-weight: 600;
}
.lg {
	color: #CD5C5C;
	font-style: normal;
}
.leftAlign {
	text-align: left;
}
hr.fiftyPercent {
	width: 50%;
}
dt,
dt a{
	font-weight: 600;
}
dd {
	margin-bottom: 20px;
}
.noBorder {
	border: none;
}
a:link {
	color: #00015E;
}
a:visited {
	color: Maroon;
}
a:active {
	color: #7B68EE;
}
a:hover {
	color: #CD5C5C;
}
#footer {
	clear: both;  /* grail command */
	margin: 146px 0px 10px 0px;
	text-align: center;
}
#address {
	margin: 0px 0px 20px 0px;
	font-size: 85%;
	color: #FCFCFC;
}
#bottom img {
	border: none;
}
/*** IE grail Fix ***/
* html #leftColumn {
	left: 100px; /* RC fullwidth - grail command */
}



























































