
/*####################
##### HTML, BODY #####
#####################*/ 

body {
	font-family				: Arial, Helvetica, sans-serif;
	font-size				: 12px;
	color					: #333333;
	text-align				: center;
	margin					: 0px 0px 0px 0px;
	padding 				: 0px 0px 0px 0px;
	background				: #FFF url('../images/bkgrnd.gif') top center no-repeat;
	behavior				: url('htc/csshover.htc')
}
	
#menuh{float:none;}
#menuh ul li{float:left; width: 100%;}
#menuh a{height:1%;font:bold 0.7em/1.4em arial, sans-serif;}



/*##############
#### HEADER ####
#############*/ 
	
#header{
	display 				: block;
	width					: 820px;	
	height					: 270px;
	margin					: 0px auto 0px auto;
	padding					: 0px 0px 0px 0px;
	
}

.headerFlash{
	margin					: 25px 0px 0px 220px;
	padding					: 0px 0px 0px 0px;
	position				: absolute;
}

*html .headerFlash{
	margin					: 25px 0px 0px -19px;
}


.headerImg{
	margin					: 0px 0px 0px 10px;
	padding					: 0px 0px 0px 0px;
	border					: none;
	float					: right;
}


.headerInfo{
	margin					: 10px 10px 0px 0px;
	padding					: 0px 0px 0px 0px;
	border					: none;
	float					: left;
	font-size				: 24px;
	color					: #99D1E3;
	font-weight				: bold;
	text-align				: center;
	line-height				: 1.2em;
}



.logo{
	margin					: 80px 0px 0px 10px;
	padding					: 0px 0px 0px 0px;
	border					: none;
	float					: left;
	clear					: both;
}


/*###################
##### CONTAINER #####
###################*/ 

#container{
	width					: 820px;
	margin					: 0px auto 0px auto;
	padding					: 0px 15px 10px 15px;
	text-align				: left;
	display					: block;
}

#containerInner{
	width					: 790px;
	margin					: 0px auto 0px auto;
	padding					: 15px 15px 10px 15px;
	text-align				: left;
	display					: block;
	background 				: #FFF url('../images/bkgrndContent.gif') top left repeat-x;
}




/*###############
##### FONTS #####
###############*/ 

p{
	margin					: 0px 0px 0px 0px;
	padding		 			: 5px 0px 5px 0px;
	font-size 				: 105%;
	line-height				: 1.4em;
}


h1{  /*  Page Titles */
	margin					: 0px 0px 0px 0px;
	padding		 			: 10px 0px 10px 0px;
	font-size 				: 200%;
	font-weight				: normal;
	color					: #0093B7;
}


h2{  /*  Sub titles */
	margin					: 0px 0px 0px 0px;
	padding		 			: 10px 0px 0px 0px;
	line-height				: 1.5em;
	font-size 				: 120%;
	font-weight				: bold;
	color					: #333;
}

h2 span{  /*  blog date */
	line-height				: 1.0em;
	font-size 				: 90%;
	font-weight				: normal;
	color					: #999;
}

#content ul{
	margin					: 10px 0px 10px 10px;
	padding 				: 0px 0px 0px 0px;
	list-style				: none;
}

#content ul li{
	margin					: 0px 0px 0px 5px;
	padding 				: 0px 0px 5px 15px;
	line-height				: 1.4em;
	background				: url('../images/bullet.gif') top left no-repeat;
}

#content a{
	color					: #0093B7;
	text-decoration			: none;
	font-weight				: bold;
}

#content a:hover {
	color					: #0093B7;
	text-decoration			: underline;
}




/*##################
#### NAVIGATION ####
##################*/ 

/* ---- TOP NAV ---- */
#navTop{
	margin 					: 10px 5px 15px 0px;
	padding					: 0px 0px 0px 0px;
	display 				: block;
	list-style 				: none;
	height					: 9px;
	float					: right;
}

*html #navTop{
	display					: none;
}

*html #navTop{
	margin 					: 10px 0px 15px 0px;
}

ul#navTop li{
	display 				: inline;
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
}

ul#navTop li a{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 15px 0px 15px;
	display 				: block;
	float 					: left;
	text-decoration 		: none;
	width					: 9px;
	height 					: 9px;
	border-right			: 1px dotted #FFFFFF;
}


*html ul#navTop li a{
	height 					: 9px;
	overflow				: hidden;
}


ul#navTop li a.navTopHome{
	background				: url('../images/home.gif') top center no-repeat;
}

ul#navTop li a.navTopHome:hover{
	background				: url('../images/home.gif') bottom center no-repeat;
}

ul#navTop li a.navTopContact{
	background				: url('../images/contact.gif') top center no-repeat;
}

ul#navTop li a.navTopContact:hover{
	background				: url('../images/contact.gif') bottom center no-repeat;
}

ul#navTop li a.navTopMap{
	background				: url('../images/sitemap.gif') top center no-repeat;
}

ul#navTop li a.navTopMap:hover{
	background				: url('../images/sitemap.gif') bottom center no-repeat;
}




/* ---- MAIN NAV ---- */

#navMain{
	margin 					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	display 				: block;
	list-style 				: none;
	width					: 818px;
	height					: 35px;
	background				: url('../images/bkgrndNav.gif') top left;
	border					: 1px solid #ACACAC;	
}
	
#navMain ul{
	margin 					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	list-style				: none;
	float					: left;
}


#navMain li{
	position				: relative;
	display 				: inline;
}

		
#navMain a{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	display 				: block;
	float 					: left;
	color					: #4D6987;
	text-decoration 		: none;
	font-size 				: 11px;
	font-weight				: normal;
	text-align				: center;
	height 					: 35px;
	width					: 134px;
	line-height				: 3.4em;
	border-left				: 1px solid #E0E0E0;
	border-right			: 1px solid #FDFDFD;
	text-transform			: uppercase;
}
	
#navMain a:hover, #navMain a.selected{
	text-decoration 		: none;
	color					: #324458;
	background				: url('../images/bkgrndNavHover.gif') top left;
}

#navMain ul ul{
	position				: absolute;
	margin 					: 34px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	display					: none;
	width					: 134px;
	z-index					: 500;
	border					: 1px solid #999999;
	background-color		: #333333;
}

#navMain ul ul li{
	position				: relative;
	display 				: inline;
}

#navMain ul ul a{
	margin					: 0px 0px 0px 0px;
	padding					: 7px 5px 7px 5px;
	display 				: block;
	float 					: left;
	color					: #999999;
	text-decoration 		: none;
	font-size 				: 12px;
	font-weight				: normal;
	text-align				: left;
	height 					: auto;
	width					: 124px;
	line-height				: 1.4em;
	border					: none;
	border-top				: 1px solid #999999;
	text-transform			: none;
}



#navMain ul ul a:hover{	
	text-decoration 		: none;
	color					: #FFFFFF;
	background-color		: #666666;
	background-image		: none;
}



#navMain ul a span{
	background				: url('../images/arrow1.gif') right no-repeat;

	margin					: 0px 0px 0px 0px;
	padding					: 0px 20px 0px 0px;
}



div#navMain li:hover ul ul,
div#navMain li li:hover ul ul,
div#navMain li li li:hover ul ul,
div#navMain li li li li:hover ul ul
{display:none;}

div#navMain li:hover ul,
div#navMain li li:hover ul,
div#navMain li li li:hover ul,
div#navMain li li li li:hover ul
{display:block;}





/* ---- LEFT NAV ---- */
#navLeft{
	margin 					: 2px 15px 0px 0px;
	padding					: 0px 0px 0px 0px;
	display 				: block;
	float					: left;
	list-style 				: none;
	width					: 170px;
	height					: auto;
}

#navLeft ul{
	margin 					: 10px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	list-style 				: none;
	width					: 170px;
}

#navLeft ul li a{
	margin					: 0px 0px 4px 0px;
	padding					: 0px 0px 0px 0px;
	display 				: block;
	float 					: left;
	color					: #999999;
	text-decoration 		: none;
	font-size 				: 12px;
	width					: 170px;
	line-height				: 3.0em;
	height					: 35px;
}

*html #navLeft ul li a{
	margin					: 0px 0px -10px 0px;
	padding					: 0px 0px 0px 0px;
}


#navLeft ul li a:hover{	
	text-decoration 		: none;
	color					: #3B5474;
	background				: url('../images/navLeftHover.gif') top left;
}

#navLeft ul li a.selected{	
	text-decoration 		: none;
	color					: #3B5474;
	background				: url('../images/navLeftOver.gif') top left;
}


/*###############
#### CONTENT ####
###############*/ 

#content{
	display 				: block;
	width					: 790px;	
	height					: auto;
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
}




/*#################
##### TEASERS #####
#################*/ 


/* MAIN TEASERS */
.teaser1, .teaser2, .teaser3  {
	display					: block;
	float					: left;
	width					: 255px;
	height					: 140px;
	margin					: 0px 12px 10px 0px;
	padding					: 0px 0px 0px 0px;
	background 				: #FFF url('../images/teaser1.jpg') top left no-repeat;
	cursor					: pointer;
	text-decoration			: none !important;
}

.teaser2{
	background 				: #FFF url('../images/teaser2.jpg') top left no-repeat;
}

.teaser3{	
	margin					: 0px 0px 10px 0px;
	background 				: #FFF url('../images/teaser3.jpg') top left no-repeat;
}

.teaser1:hover, .teaser2:hover, .teaser3:hover{
	background 				: #FFF url('../images/teaser1.jpg') bottom left no-repeat;
	color					: #333333;
	text-decoration			: none !important;
}

.teaser2:hover{
	background 				: #FFF url('../images/teaser2.jpg') bottom left no-repeat;
}

.teaser3:hover{
	background 				: #FFF url('../images/teaser3.jpg') bottom left no-repeat;
}

.teaser1 p, .teaser2 p, .teaser3 p{
	width					: 130px;
	height					: 90px;
	margin					: 5px 0px 5px 5px;
	padding					: 5px 110px 5px 5px;
	color					: #666666;
	overflow				: auto;
}


.teaser1 span, .teaser2 span, .teaser3 span{
	display					: block;
	height					: 21px;
	margin					: 0px 0px 0px 10px;
	padding					: 8px 0px 0px 25px;
	color					: #4D6987;
	font-size				: 11px;
	text-transform			: uppercase;
	background 				: url('../images/arrow.gif') left no-repeat;
}



/* SIDE TEASERS */
#shortcuts{
	float					: right;
	margin					: 0px 0px 0px 35px;
	padding					: 0px 0px 0px 0px;
}

.shortcut1, .shortcut2{
	display					: block;
	width					: 194px;
	height					: 68px;
	margin					: 0px 0px 20px 0px;
	padding					: 0px 0px 0px 0px;
	background 				: #FFF url('../images/shortcut1.jpg') top left no-repeat;
	cursor					: pointer;
}

.shortcut2{
	background 				: #FFF url('../images/shortcut2.jpg') top left no-repeat;
	cursor					: pointer;
}

.shortcut1:hover{
	background 				: #FFF url('../images/shortcut1.jpg') bottom left no-repeat;
}

.shortcut2:hover{
	background 				: #FFF url('../images/shortcut2.jpg') bottom left no-repeat;
}


/*################
##### FOOTER #####
################*/ 

#footer{
	clear					: both;
	width					: 790px;
	min-height				: 70px;
	margin					: 0px auto 0px auto;
	padding					: 10px 15px 0px 15px;
	line-height				: 1.4em;
	font-size				: 11px;
	color					: #999999;
	border-top				: 1px solid #CCC;
	background 				: #FFF url('../images/bkgrndFooter.gif') top left repeat-x;
	text-align				: left;	
}

#copyright, #terms{
	margin					: 0px 0px 20px 0px;
	padding		 			: 0px 0px 0px 0px;
	float					: left;
}

#footerLinks {
	margin					: 0px 0px 0px 0px;
	padding		 			: 0px 0px 0px 20px;
	float					: right;
}

#copyright a, #footerLinks a {
	text-decoration			: none;
	color					: #666666;
}

#copyright a:hover , #footerLinks a:hover{
	color					: #333333;
	text-decoration			: underline !important;
}

#footerLinks a {
	margin					: 0px 0px 0px 10px;
	padding		 			: 0px 0px 0px 12px;
	border-left				: 1px solid #999999;
}

	


#textSEO{
	margin					: 0px 0px 0px 0px;
	padding		 			: 0px 5px 0px 5px;
	clear					: both;
	width					: 780px;
	height					: 50px;
	border					: 1px solid #CCC;
	overflow				: auto;
}

#textSEO p{
	margin					: 0px 0px 0px 0px;
	padding		 			: 3px 5px 0px 5px;
	font-size				: 90%;
}


#anchorLinks{
	clear 					:both;
}

#anchorLinks ul {
	margin					: 10px 0px 20px 0px;
	padding		 			: 10px 0px 0px 0px;
}

#anchorLinks ul li{
	display					: inline
}

#anchorLinks ul li a {
	text-decoration			: none;
	color					: #666666;
	margin					: 0px 0px 0px 10px;
	padding		 			: 0px 0px 0px 12px;
	border-left				: 1px solid #999999;
}

#anchorLinks ul li a:hover{
	color					: #333333;
	text-decoration			: underline !important;
}


/*###############
##### MISC. #####
###############*/ 

.imgLeft{
	margin					: 0px 20px 10px 0px;
	padding					: 0px 0px 0px 0px;	
	float					: left;
}

.imgRight{
	margin					: 0px 0px 10px 20px;
	padding					: 0px 0px 0px 0px;	
	float					: right;
}

.imgContainer{
	float					: right;
	display					: block;
	text-align				: center;
	margin					: 0px 0px 10px 20px;
	padding					: 0px 0px 0px 0px;	
}


/* ---- GALLERY PAGING ---- */
.galleryList{
	float					: right;
	display					: block;
	margin					: 5px 10px 0px 0px;
	padding					: 0px 0px 0px 0px;	
}

.galleryList a{
	display					: block;
	float					: left;
	margin					: 0px 0px 0px 5px;
	padding					: 2px 5px 2px 5px;
	border					: 1px solid #999999;
	background-color		: #FFFFFF;
}


.galleryList a:hover{
	border					: 1px solid #CCC;
	border					: 1px solid #333333;
	text-decoration			: none !important;
}

.galleryList a.selected{
	border					: 1px solid #CCC;
	background-color		: #64BAD5;
	border					: 1px solid #666666;
	color					: #FFFFFF !important;
	text-decoration			: none !important;
}



/* ---- GOOGLE MAPS ---- */
#mapHolder{
	width					: 381px;
	height					: 405px;
	display					: block;
	margin					: 20px 0px 0px 20px;
	padding					: 0px 0px 0px 0px;	
	float					: right;
}

#map{
	width					: 380px;
	height					: 380px;
	border					: 1px solid #999999;
	color					: #000000;
}



/* ---- VARIOUS TABLES ---- */
.tblContact, .tblGallery, .tblReferral, .tblBlogs, .tblTech{
	margin					: 10px 0px 10px 0px;
	padding					: 0px 0px 0px 0px;
	width					: 350px;
	font-size				: 100%;
}

.tblGallery{
	width					: 785px;
}

.tblReferral, .tblBlogs, .tblCases, .tblTech{
	width					: 560px;
}
.tblCases{
	width					: 100%;
}

.tblTech, .tblBlogs, .tblCases{
	margin					: 10px 0px 10px 0px;
}

.tblBlogs, .tblCases{
	padding					: 5px 5px 5px 5px;
	border					: 1px solid #CCC;
}

.tblContact td, .tblGallery td, .tblReferral td{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 5px 10px 0px;	
	vertical-align			: top;
}

.tblBlogs td, .tblTech td, .tblCases td{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 5px 5px 5px;	
	vertical-align			: top;
}


.tblTech p, .tblTech h2{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 5px 0px;
}

.tblBlogs p, .tblBlogs h2, .tblCases p, .tblCases h2{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 5px 0px;
}

.tblBlogs span, .tblCases span{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	color					: #999999;
}



.tblGallery img{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;	
}


/* ---- FORM FIELDS/BUTTONS ---- */
.textField, .textFieldShort{
	width					: 200px;
	height					: 16px;
	font-size				: 12px;
	float					: left;
	font-family				: Arial, Helvetica, sans-serif;
}

.textFieldShort{
	width					: 150px;
}

.textArea, .textAreaShort, .textAreaWide{
	width					: 200px;
	height					: 80px;
	float					: left;
	font-family				: Arial, Helvetica, sans-serif;
	font-size				: 12px;
}

.textAreaShort{
	width					: 150px;
	height					: 60px;
}

.textAreaWide{
	width					: 98%;
}


.submitBtn{
	margin					: 0px 5px 0px 0px;
	padding					: 0px 5px 0px 5px;
	display 				: block;
	float					: right;
	font-weight				: normal;
	text-align				: center;
	color					: #4D6987;
	text-decoration 		: none;
	font-size 				: 10px !important;
	height					: 24px;
	width					: 90px;
	border					: 1px solid #999999;
	background-image		: url(../images/bkgrndNav.gif);
	background-position		: bottom;
	cursor					: pointer
}

.submitBtn:hover{
	background-image		: url(../images/bkgrndNavHover.gif);
	background-position		: bottom;
	color					: #324458;
	text-decoration 		: none;
}





/*#################################
### SAFARI/IE6 HACK FOR NAV BAR ###
### KEEP AT BOTTOM OF THIS PAGE ###
#################################*/ 


#navMain ul ul{
margin:35px 0px 0px 0px;/*IE 5 for PC only*/
voice-family:"\"}\"";
voice-family:inherit;
margin:35px 0px 0px 0px;/*all non-IE 5 browsers*/
}
/*end*/

/*\*/
html*#navMain ul ul{
[margin:35px 0px 0px 0px;/*Affects older Firefox and Netscape browsers only. Seen also by IE5-6 and Safari for Macintosh, which is
addressed below.*/
margin:35px 0px 0px -136px;/*Affects Safari for Macintosh only (v1-3). See also by IE5-6, but thats addressed below. Also
hidden from older Firefox and Netscape browsers.*/
]margin:35px 0px 0px -136px;/*Affects IE 7 only. Seen by IE5-6 but thats addressed below. Hidden from Safari and all
Firefox and Netscape browsers.*/
}/**/
.dummyend[id]{clear:both/*end hack using dummy attribute selector for IE5 mac, else error in CSS occurs!*/}

/*The above rule is hidden from IE for MAC, and read only by older Firefox and Netscape 6-7 and IE5-7 for PC,
and Safari on MAC, in general.*/
/*Newer Firefox and Netscape agents reads rule, but does not read any properties set within [], so is
unaffected by it, probably because it sees these as part of an attribute selector. Those will be hidden.*/
/*IE 7 on PC will correctly read all rules as it will ignore many characters before a property*/
/*Safari for MAC sees each [] as a character and not part of a selector, if one falls before a property.
These cause the property name following the character to not be read, but next line without "[]" property
is  parsed.*/
/*use of [] will break all css selectors following the rule, if all are not closed, as Mozilla-Netscape
read the [] as part of a selector rule, so make sure they are all closed, using dummy selector.*/

/*\*/
* html #navMain ul ul{
margin:35px 0px 0px -136px;/*Finally, be sure to reapply a fix that affects IE 5-6 only here. IE for Mac and IE 7 for PC
are not affected here, which means purple above should work only in IE 7 above!*/
}
/**/


