/******** general styling *********/

body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:0.7em; }
iframe {background-color:transparent;}

h1{font-size:160%} h2{font-size:150%} h3{font-size:125%} h4{font-size:110%} h5{font-size:100%}
img {border:none;}

body {
	margin-top: 0;padding: 0;
	text-align: center; /* centers child for IE */
	height:100%; width:100%;
	background:#e8f0fa;
}

#border {
	background-color:#fff;
	width:930px;
	margin:0 auto;
}

#header {
	margin: 0 auto; /* center for good browsers */
	width: 900px; /* don't change */
	text-align: left; overflow:hidden;
	padding:6px 0;
}
#intraSite {float:right; text-align:right; padding: 0 10px;}
#intraSite img {margin: 0 0 0 4px; }

#header form {float:left; padding: 0;margin:0;}
.goog-te-combo{margin:0px 8px !important; border:1px inset orange;
font-size:10px !important;} 
#q {
	margin:0; border:1px inset orange; padding:1px 3px; font-size:10px; width:200px;
	background-image: url('../pics/base/search.gif'); background-repeat:no-repeat;
	background-position: 4px center;background-color:#fff;
}
#q:focus { background-image: none; background-color:white; }
#searchgo {margin:0; padding:0;}

#slogan {
	margin:0 auto; padding:0; width:900px; height:139px;
	text-align:left; /*background-color:#fff;*/
	background: #CFEBF6 url('../pics/base/slogan.jpg') no-repeat;
}

#slogan img { margin:10px 0 0 15px; }

#slogan h1 { margin:0 0 0 15px; padding:0;font-size:120%;color:#0C1E64; }

#container {
	margin: 0 auto 10px; /* center for good browsers */
	text-align: left; /* keep the centering for IE from being inherited */
	width: 900px; /* don't change */
}

#mainDiv {
	background:white url('../pics/base/sprite.png') repeat-y;
	background-position: -2030px top;
}


#content {
	margin-left:170px;
	padding:1em 2em; background-color:#fff;
	border-right:1px solid #dcc

}

.headline { text-align:center; color:#333; }
.article { color: #092066;}
.red { color:#FF0000; }

#footer {
	background-color: #fff; padding:10px 0; margin:0;
	background-image: url('../pics/base/sprite.png');
	background-position:-1000px bottom;
}
#footer div {
	margin: 0 ; padding:3px; text-align:center;color:#0C1E64;
	font-size:12px; font-weight:bold;
}

#externalLinks { width:900px; margin: 0 auto 3px; text-align:right; }

#externalLinks span { color:#000; float:left;}
#externalLinks a { color:navy; text-decoration:none; }
#externalLinks a:hover { text-decoration:underline; }

/* switch out content for IE6 and below */
.IE6 {display:none} .NotIE6 {display:block}


/***********START CSS FOR MENU: ddsmoothmenu JAVASCRIPT OBJECT ***************/
/*

!!!!!!!!! ATTENTION !!!!!!!!!

WARNING:
	1. the javascript menu object pulls information out of this section.
	2. cross-browser compatability for this is EXTREMELY sensitive

THEREFORE,
	1. don't add or remove classes or attributes, just change their values
	2. only change things that are marked "styling" unless:

UNLESS
	1. you are sure you know how the javascript interacts with the css (hint: if you are reading this, you don't).
	2. you take the time to test your changes in all browsers.

*/

/** the horizontal menu **/

#menu {
	clear:both;
	margin:0 auto;
	text-align: left; /* keep the centering for IE from being inherited */
	width: 880px; /* can be smaller but not bigger */
	background-image: url('../pics/base/sprite.png');
	padding:0 10px;
	height:32px;
}

/* h4 can be safely styled */
#menuv h4 {
	font-size:120%;
	color:#17588E; text-align:center;padding:1em 0;margin:0;
}

.ddsmoothmenu{
	font: bold 11px Verdana;
	width: 100%;
}

.ddsmoothmenu ul{
	z-index:100;
	margin: 0;
	padding: 0;
	list-style-type: none;
}

/*Top level list items*/
.ddsmoothmenu ul li{
	position: relative;
	display: inline;
	float: left;
}

/*Top level menu link items */
.ddsmoothmenu ul li a{
	display: block;
	color: white; /* styling */
	padding: 8px 10px;
	border-right: 1px solid #ffe8cc; /* styling */
	color: #2d2b2b; /* styling */
	text-decoration: none;
}

* html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
	display: inline-block;
}

.ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{
	color: white; /* styling */
}

.ddsmoothmenu ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
	background: #d76900; /* styling */
	color: white; /* styling */
}

.ddsmoothmenu ul li a:hover{
	background: #d76900; /* styling */
	color: white; /* styling */
}
	
/*1st sub level menu*/
.ddsmoothmenu ul li ul{
	position: absolute;
	left: 0;
	display: none; /*collapse all sub menus to begin with*/
	visibility: hidden;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.ddsmoothmenu ul li ul li{
	display: list-item;
	float: none;
}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.ddsmoothmenu ul li ul li ul{
	top: 0;
}

/* Sub level menu links style */
.ddsmoothmenu ul li ul li a{
	font: normal 11px Verdana; /* styling */
	width: 160px; /*width of sub menus*/
	background: #ffb016; /* styling */
	padding: 5px;
	margin: 0;
	border-top-width: 0;
	border-bottom: 1px solid orange;/*gray;*/
}

/* Holly Hack for IE \*/
* html .ddsmoothmenu{height: 1%;} /*Holly Hack for IE7 and below*/


/* CSS classes applied to down and right arrow images */

.downarrowclass{
	position: absolute;
	top: 12px;
	right: 7px;
}

.rightarrowclass{
	position: absolute;
	top: 6px;
	right: 5px;
}

/* CSS for shadow added to sub menus */

.ddshadow{
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	background: silver;
}

/*.toplevelshadow{ /*shadow opacity. Doesn't work in IE */ /*
	opacity: 0.8;
}*/

/** the side bar menu **/
/*#menuv {
	float:left; width:170px;
}*/

.ddsmoothmenu-v ul{
	margin: 0;
	padding: 0;
	width: 170px; /* Main Menu Item widths */
	list-style-type: none;
	/* styling, but the format must remain the same */ 
	font: bold 11px Verdana;
	border-top: 1px solid orange /*#8EB2CF*/;
}
 
.ddsmoothmenu-v ul li{
	position: relative;
}

/* Top level menu links style */
.ddsmoothmenu-v ul li a{
	display: block;
	overflow: auto; /*force hasLayout in IE7 */
	color: #ffe8cc;
	text-decoration: none;
	padding: 6px;
	border-bottom: 1px solid orange /*#8EB2CF*/;
}

.ddsmoothmenu-v ul li li a{
	background-color:#ffe8cc;
}

.ddsmoothmenu-v ul li a:link, .ddsmoothmenu-v ul li a:visited, .ddsmoothmenu-v ul li a:active{
	/* styling */ /*background of menu items (default state)*/
	/* styling */ color: #17588E;
}


.ddsmoothmenu-v ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
	background: #B3E5EF; /* styling */
	color: #fff; /* styling */
}

.ddsmoothmenu-v ul li a:hover{
	background:#B3E5EF; /* styling */
	color: #17588E; /* styling */
}

/*Sub level menu items */
.ddsmoothmenu-v ul li ul{
border-bottom: 1px solid #8EB2CF;
	position: absolute;
	width: 170px; /*Sub Menu Items width */
	top: 0;
	font-weight: normal;
	visibility: hidden;
}
 
/* Holly Hack for IE \*/
* html .ddsmoothmenu-v ul li { float: left; height: 1%; }
* html .ddsmoothmenu-v ul li a { height: 1%; }
/* End */


/***********START CSS FOR THE SIDE BAR (BELOW #menuv) ***************/
#menusidebar{ width:170px;float:left;clear:left;}


/***********START CSS FOR BEST SELLERS ***************/

div.bestSellers {padding-left:1em;padding-right:1em;}
div.bestSellers h5 {text-align:center; color:#17588E; font-size:120%; padding:1em 0 .5em;margin:0;}
div.bestSellers a {text-decoration:none;}
div.bestSellers a:hover { text-decoration:underline}

/***********END CSS FOR BEST SELLERS ***************/



/***********START CSS FOR SIMILAR PROGRAMS ***************/

div.similarPrograms {padding:1em;}
div.similarPrograms h5 {text-align:center; color:#17588E; font-size:110%; padding:.5em 0 0;margin:0;}
div.similarPrograms a {text-decoration:none;}
div.similarPrograms a:hover { text-decoration:underline}

/***********END CSS FOR SIMILAR PROGRAMS ***************/



/***********START CSS FOR BUTTONS ***************/

div.webbuttons {padding:1em;}
a.webbutton {display:block; background-repeat:no-repeat; padding:3px 1em;}
a.webbutton span {display:block;padding:6px 6px;}
a.webbutton span span {display:inline;padding:0;}

.facebook:hover, .twitter:hover{background-position:-200px top;}

/***********END CSS FOR BUTTONS ***************/


/***********START CSS FOR ROUNDED BOXES ***************/

.box div { background-image: url('../pics/base/boxes/grey.png'); background-repeat:no-repeat;}
.box div.boxmid div, .box div div div { background-image: none; }
.boxtop, .boxbottom { height:10px; overflow:hidden;}
.boxtop div, .boxbottom div { float:right; height:10px;width:11px; }
.boxtop { background-position:-100px -47px;}
.boxtop div { background-position:0 -47px; }
.boxmid { background-position: -101px -57px; border-right:1px solid #ccc;border-left:1px solid #ccc; padding:0 1em 2px; overflow:hidden; }
.boxbottom { background-position:-100px 0px; margin-bottom:1em; }
.boxbottom div { background-position:0 0; }

/***********END CSS FOR ROUNDED BOXES ***************/


/***********START CSS FOR THE GENERAL INFO BOXES ***************/

#indexfoot { margin:0 ; }
#indexfoot div { overflow:visible; }
#indexfoot div.right {margin-left:341px;}
#indexfoot div.left {float:left; width: 330px; }
#indexfoot a { text-decoration:none; }
#indexfoot a:hover { text-decoration:underline; }
#indexfoot ul { margin:0; padding:0; }
#indexfoot ul li { list-style-type: none; margin:0; }

#lowprice .boxmid div {
	padding-left:85px; min-height:65px;
	background-image: url('../pics/base/basicinfo/guarantee.png');
	background-position:center left; background-repeat:no-repeat;
}


#brochures span {
	display:block; padding:10px 110px 10px 10px;
	background-image: url('../pics/base/basicinfo/brochure.png');
	background-position:center right; background-repeat:no-repeat;
}

#brochures span span {
	background-image:none; font-weight: bold; border-bottom:1px solid gray; margin: 0 0 10px 0; padding: 0 0 10px 0;
}

#links .boxmid ul { }

#links a {
	display:block; background-repeat:no-repeat; background-position: 15px center;
	height:2em; min-height:2em; line-height:2em;padding-left:5em;
}
#links a:hover { background-color:#d2f1fb; }
#links1 a { background-image: url('../pics/base/basicinfo/questions.png');}
#links2 a { background-image: url('../pics/base/basicinfo/contact.png');}
#links3 a { background-image: url('../pics/base/basicinfo/calc.png');}
#links4 a { background-image: url('../pics/base/basicinfo/next.png');}
#links5 a { background-image: url('../pics/base/basicinfo/ok.png');}


/***********END CSS FOR GENERAL INFO BOXES ***************/


/***********START CSS FOR SUMMARY BOXES ***************/
div.pagebox {width:270px; float:right; padding-left:1.5em;}
div.boxmid {padding:0 10px;}

div.pagebox .box div { background-image: url('../pics/base/boxes/orange2.png'); }
div.pagebox .box div.boxmid div, .box div div div { background-image: none; }
div.pagebox .boxmid {border-right:1px solid;border-left:1px solid;border-color: #f8ca85; padding:0 10px; }


/** summary **/
.summary { color: #333; }
.summary h4.headline {text-align:center; color: #664909; margin:0; padding: .5em 0 .5em}
.summary ul { margin:0; padding:0 0 1em;}
.summary li { margin:0 1em 0 2em; padding:0 0 .4em;}

/** gallery **/
.galleryparent {overflow:hidden; background-color: #ddd; width:250px;}
div.scrollable { 
	position:relative; overflow:hidden;background-color:#ddd;
	width:230px; height:60px; float:left; margin:3px 0;
} 
div.scrollable div.items { width:20000em; position:absolute; } 

div.scrollable div.items div { float:left; padding:0 7px; }
div.scrollable div.items div a img { border:1px solid gray; } 
div.scrollable div.items div a img:hover { border:1px solid blue; } 
 
div.items div.active { }

/* buttons */
a.prev, a.next, a.prevPage, a.nextPage {
	display:block; background-color:#ddd;
	background-image:url('../pics/gallery/arrows.gif'); background-repeat:no-repeat;
	float:left; height:66px;width:8px;
	padding:0 1px; margin:0;
	cursor:pointer; font-size:1px;
}
a.prev, a.prevPage { background-position: 1px center; }
a.next, a.nextPage { background-position: -39px center; clear:right; }

/* mouseover state */
a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover { background-color:#555;background-position:-19px center; }
a.next:hover, a.nextPage:hover { background-position:-59px center; }

/* disabled navigational button */
a.disabled { visibility:hidden !important; }

/* navigator: not currently in use, but there if we need it. */
div.navi { width:100%; height:20px;margin-left:10px; }

div.navi a {
	width:8px; height:8px; float:left; margin:3px;
	background:url('../pics/indexes/navigator.png') 0 0 no-repeat;
	display:block; font-size:1px;
}

div.navi a:hover { background-position:0 -8px; }

div.navi a.active { background-position:0 -16px; } 

/***********END CSS FOR SUMMARY BOXES ***************/

/***********START CSS FOR MODAL BOX: mb JAVASCRIPT OBJECT ***************/
#mb_content{
	background-color:#d9eaf8;
	border: 1px solid black;
	display: none; position: absolute;
	top: 0; left: 0;
	z-index: 1000; text-align:left;
	}

#mb_overlay{
	background-image: url('../pics/overlay.png');
	position: absolute; display:none;
	top: 0; left: 0;
	z-index: 900; width: 100%;
}
#mb_loading{
	background-image: url('../pics/loading.gif'); background-repeat:no-repeat;
	background-attachment:fixed; background-position:center; 
	display: none; position: absolute;
	top: 0; left: 0;
	z-index: 1000; width: 100%;
}

/***********END CSS FOR MODAL BOX ***************/

/***********START CSS FOR BROCHURES DIALOG: brochures JAVASCRIPT OBJECT ***************/

#brochures_container h3 {
	padding:0 2px; margin:2px 0; font-size:100%; background-color:#333;
}
#brochures_container h3 a {
	display:block; height:19px; padding:1px 8px; margin:2px 0; color:#eee; text-decoration:none;
	background-image:url('../pics/lightbox_close.gif'); background-position: center right; background-repeat:no-repeat;
}
#brochures_container table { width:100%;margin:1em 0; }

#brochures_container td select { width:100% }


/***********END CSS FOR BROCHURES DIALOG ***************/

/***********START CSS FOR IMAGE LIGHT BOX: lb JAVASCRIPT OBJECT ***************/
#lb_container {padding:10px 10px 5px;}
#lb_close, #lb_prev, #lb_next {position:absolute;top:5px;cursor:pointer}
#lb_next {right:10px;} #lb_close {right:27px;} #lb_prev {right:45px;}
#lb_container div{ padding:5px 0; font-size:.9em; } 
#lb_container img{ border: none;}

/***********END CSS FOR IMAGE VIEWER ***************/


/***********START CSS FOR DIALOG: db JAVASCRIPT OBJECT ***************/
#db_container {padding:5px 0;}
#db_container h3 {padding:1px 10px 3px; margin:0; background-color:#8f471a;color:#d9eaf8}
#db_container h3 a { color:#d9eaf8; text-decoration:none; }
#db_msg {margin:0 0 5px;padding:10px; overflow:auto;}

#db_buttons {padding:5px 10px; text-align:right} 
#db_buttons input {width:75px;min-width:75px; border:2px outset orange; padding: 2px 4px; margin: 0 0 0 4px;} 

/***********END CSS FOR IMAGE VIEWER ***************/



/***********START CSS FOR PRINTERS AND HANDHELD DEVICES***************/

@media print,handheld{
	#container {margin:0;padding:0;width:100%;border:none}
}
@media print{
	#menu {display:none}
}

/***********END CSS FOR PRINTERS AND HANDHELD DEVICES***************/ #content i {color:maroon;}
#content hr {clear:both;}

#formParent {
	float:right; width:250px; height:40em;
	padding-left:20px;
}

.googlemaps {
	float:right; width:320px; height:320px;
	padding:20px 0 20px 30px;
} 
/* memory required at peak to generate file: 316kb */