@charset "UTF-8";

/*CSS Reset.
Reset any default margins set by the browser*/
*{  
   margin:0;  
   padding:0;  
} 
/*****************Reset all defaults set by the browser, using this _very_ generic CSS code*********************/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html{	
			
			
  background:  no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	/*background-attachment:fixed; */
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/*****************End reset*********************/





	
 /*
 Wrapper div for whole page. In theory it makes it easy to center all content on the page. 
 All elements of the page will be inside this one.
 */
 #wrapper {  
   width:960px;  
   margin:0 auto;  
   text-align:left; 

}  

body {alignment-adjust:central;	
		/*width:960px; */ 
		font-family: 'Scala', sans-serif; /* was Verdana, Arial, Helvetica, sans-serif;		*/
		margin-left:auto; /*For IE6 Shenanigans*/
		margin-right:auto; /*For IE6 Shenanigans*/ 
		text-align:center;  /*For IE6 Shenanigans, to allow divs to center*/  
		
		/*gradient*/ 
		background-image: -moz-linear-gradient(top, rgba(255,255,255,0.1) 40%, rgb(122,122,120) 90%);	/* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, rgba(255,255,255,0.1) 40%, rgba(122,122,120) 90%);	/* Opera */ 
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(255,255,255,0.1)), color-stop(1, rgb(122,122,120)));	/* Webkit (Safari/Chrome 10) */ 
	background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.1) 40%, rgb(122,122,120) 90%);	/* Webkit (Chrome 11+) */ 	
	background-image: linear-gradient(to bottom, rgba(255,255,255,0.1) 20%, rgb(122,122,120) 80%);		/* W3C Markup, IE10 Release Preview */ 

   		/*need this to get rid of the extra white space at the bottom of the page caused by the gradient above*/
		background-attachment: fixed; 
}

h1 {	font-family: 'Scala', sans-serif;
		font-size: 34px;
		color:#102283;
		font-weight:bold;
		display:block;
		padding-bottom:.5em;}

h2{		font-family: 'Scala', sans-serif; /* was Verdana, Arial, Helvetica, sans-serif;	*/
		font-size:16px;
		font-weight:normal;
		color:#102283;
}
h3 {margin-bottom:.2em;
	background-color:rgba(11,183,234,1);}

header {padding-top:1em; /* was.25em with regular-sized diamond*/;
		background-color:rgba(255,255,255,0);
		width:960px;  
   margin:0 auto;  
   padding-left: 7%;
   text-align:left; 
		 }
		 
section {   width:960px;  
   margin:0 auto;  
   text-align:left; 
		
	}

#TopThird{  background-color:#FFFFFF; 
		width:100%
	}
	
	
#BottomTwoThirds{	
		width:100%;
		/*need a tall height here  just to push down the extra grey bar at the bottom of the page that I couldn't get rid of*/
		height:600px;
		
	/*This only works for I.E. All other browsers take their background gradient for the whole page from the Body style*/
			filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#7A7A78'); 
			/* background-image: -ms-linear-gradient(top, rgba(255,255,255,0.1) 40%, rgb(122,122,120) 90%);	2nd color was  rgb(143,142,140) 95%) IE10 Consumer Preview */ 
}	
	
div #FooterDiv	{margin: 0 auto;
				width:100%;
		height:2em;
		padding-top:.25em;
		float:left;}
	
footer {width:960px;
	display: block;
	padding-right: 1.5em;
	 /*to center the div on the page*/
	margin: 0 auto;	
	}

div #FooterCopyright {
	/*So that IE can display the content correctly*/
	position:relative;

	float: left;
	width: 40%; /*was 30%*/
	font-size: 10px;
	font-weight: normal;
	padding-top:.5em;					}
						
div #FooterNav {
	/*So that IE can display the content correctly*/
		position:relative;
		
		float:left;
	text-align: right;
	width: 60%; /*was 70%*/
	font-size: 10px;
	padding-top:.5em;	
	/*margin-left:1em */
	}
	

nav {/*This ends up controlling how high the menu bar is*/ 
	margin-top:3.5em
	}	

 


th {font-size:20px; text-align:left}

td {width:240px}

/*To make triangular bullets
ul {list-style:none;}
ul li:before{content: "\25BA \0020";} /*This is sort of like an ASCII character for a right-pointing triangle*/
*/

ul li{list-style:disc;
list-style-position:inside;
list-style-type:square;
padding-left:20px;
	} 

li{padding-bottom:.75em;
	padding-left:.75em
}
	
a:visited{
	/*ensure no difference in color if a link has already been visited*/
	color:	#0000FF;
	font-weight:normal;}
	

.StartHeight { height:30px; vertical-align:top }
.ErrorHeight {height:60px;vertical-align:top }
.ErrorTextHidden {display:none}
.ErrorTextShowing {display:block; color:#FF0000}

label { padding-left:3em}

input {width:180px}

input .NarrowInput {size:5; display:inline}


div #Content {
	/*without this next line,the gradient doesn't appear in IE*/
	position:relative;
	width: 90%;
	height: 380px;
	display: block;
	padding-top: 1em;
	padding-right: 1.5em;
	 /*to center the div on the page*/
	margin: 0 auto;
	margin-bottom: 0em;

	/*Rounded corners on the top only*/
	-moz-border-radius: 20px 20px 0px 0px;
	-webkit-border-radius: 20px 20px 0px 0px;
	border-radius: 20px;
	behavior: url(border-radius.htc); /*Referencing a file that allows IE to support rounded corners prior to IE9*/
	
	/*background grey gradient*/
	/*before transparency at the bottom, this was all originally (91deg, #F4FCF8 0%, #807F7C 72%)*/
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCCCCC', endColorstr='#00EEEEEE'); /*	 for IE */
 	background: linear-gradient(91deg, transparent 30%, #CCC 90%); /* was #807F7C */
	background: -moz-linear-gradient(91deg, transparent 30%, #CCC 90%); 
	background: -webkit-linear-gradient(91deg, transparent 30%, #CCC 90%);  
	background: -o-linear-gradient(91deg, transparent 30%, #CCC 90%);
	
}

div #HomeContent {
	/*without this next line,the gradient doesn't appear in IE*/
	position:relative;
	
	width: 90%;
	height: 375px;
	display: block;
	padding-top: 1em;
	padding-right: 1.5em;
	 /*to center the div on the page*/
	margin: 0 auto;
	margin-bottom: 0em;

	/*Rounded corners on the top only*/
	-moz-border-radius: 20px 20px 0px 0px;
	-webkit-border-radius: 20px 20px 0px 0px;
	border-radius: 20px 20px 0px 0px;
	behavior: url(border-radius.htc); /*Referencing a file that allows IE to support rounded corners prior to IE9*/
	
	/*background grey gradient*/
	/*before transparency at the bottom, this was all originally (91deg, #F4FCF8 0%, #807F7C 72%)*/
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCCCCC', endColorstr='#00CCCCCC'); /* for IE */
	background: linear-gradient(91deg, transparent 30%, #CCC 90%);  /*was #807F7C*/
	background: -moz-linear-gradient(91deg, transparent 30%, #CCC 90%); 
	background: -webkit-linear-gradient(91deg, transparent 15%, #CCC 90%);  
	background: -o-linear-gradient(91deg, transparent 30%, #CCC 90%);
}
	
.specialGradient{
	/*background grey gradient*/
	/*before transparency at the bottom, this was all originally (91deg, #F4FCF8 0%, #807F7C 72%)*/
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCCCCC', endColorstr='#00CCCCCC'); /* for IE */
	background: linear-gradient(91deg, transparent 30%, #CCC 90%);  /*was #807F7C*/
	background: -moz-linear-gradient(91deg, transparent 30%, #CCC 90%); 
	background: -webkit-linear-gradient(91deg, transparent 15%, #CCC 90%);  
	background: -o-linear-gradient(91deg, transparent 30%, #CCC 90%);
}

.specialBorder{	/*Rounded corners on the top only
	-moz-border-radius: 20px 20px 0px 0px;
	-webkit-border-radius: 20px 20px 0px 0px;*/
	border-radius: 20px;
	/*behavior: url(border-radius.htc); Referencing a file that allows IE to support rounded corners prior to IE9*/
	border: 1px solid #999;

}

div.HomeContentSubtitle	{
	float:right; 
	display:block; 
	width:35%; 
	height:50px; 
	padding-top:.5em;
	margin-top:5%;/*  */
	text-align:right;
	/*margin-left:65%; Was 52%*/
	font-weight:normal;
		color:#102283;
}

div.TransparentCaption{
	/*background-color:rgba(255,255,255,0.55); */
	height:42px; 
	width:39%; /*was 74%*/
	 padding-left: 45%; /*was 24%*/
	padding-bottom:1em; 
	text-align:right;
	float:right;
	color:  #102283;
	/*This works on all browsers to move the div down to the right position. margin-top:70% works diffently in CHrome & Firefox
	top:76%;*/ 
	
	margin-left:10px; /*was 20px*/
	/* position:relative;*/  z-index:2; 
	font-family: 'Scala', sans-serif;font-size: 34px;
	font-weight:normal;
	 text-align:right;
}
	

		
.BoldHeading {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;
	color: #0000FF;
}

.Clickable {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;
	color: #0000FF;}

a.ScriptHeading {			
/*This is just to make sure that the jQuery slideToggle effect doesn't make any of the other content on the page disappear (in IE)*/
position:relative;

	font-family: 'Scala', sans-serif;
	font-size: 18px; /*was 20 until Update Statistics script was added*/
	font-weight: normal;
	color:#000000;
	display:block;
	margin-top:.5em;
	text-decoration:none;
	border-bottom:thin;
	border-bottom-style:solid;
	border-bottom-color:#FFFFFF;
	padding-bottom:.25em;
	padding-left:1.4em;
	padding-top:.25em; 

	
	/*rounded corners*/
	behavior: url(border-radius.htc); /*Referencing a file that allows IE to support rounded corners prior to IE9*/
		-moz-border-radius: 10px 10px 0px 0px;
	-webkit-border-radius: 10px 10px 0px 0px;
	border-radius: 10px 10px 0px 0px;
}


div.ScriptDescription{
/*This is just to make sure that the jQuery slideToggle effect doesn't make any of the other content on the page disappear (in IE)*/
position:relative;
	
	font-family: 'Scala', sans-serif;
			font-size: 15px; 
			font-weight:normal;
			margin-bottom:1em;
			background-color:rgba(255,255,255,1); 
			padding:10px;
			/*margin-top:5px;
			Starts the description hidden. Will be toggled by heading in ScriptHeading style*/
			display:none;
 
/*	*/		overflow:hidden;
			
	behavior: url(border-radius.htc); /*Referencing a file that allows IE to support rounded corners prior to IE9*/
	-moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;

			}

button.ScriptButton  {
  font-family: 'Scala', sans-serif;
  color: #ffffff;
  font-size: 12px;
  padding: 7px;
  text-decoration: none;
  margin-right:3em;
  margin-top:1em;
  
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  
  -webkit-box-shadow: 0px 1px 3px #666666;
  -moz-box-shadow: 0px 1px 3px #666666;
  box-shadow: 0px 1px 3px #666666;
  
  text-shadow: 1px 1px 3px #666666;
  border: solid #ffffff 0px;
  
  background: #102283 /* was -webkit-gradient(linear, 0 0, 0 100%, from(#0000ff), to(#0000ff));
  								background: -moz-linear-gradient(top, #0000ff, #0000ff); */
  }




.ContentText {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	
}

#ServicesDescrip{padding-top:0.5em;
					padding-bottom:.75em;
				
			  margin-left:24px		;
				float:left;
				height:75px;
				font-family: Verdana, Arial, Helvetica, sans-serif;
				font-size: 20px;
				font-weight: bold;
				color: #000000;
					width:500px;
					display:block;
}


				
div #NavBar{
	
	Height: 1.5em;
	width: 100%; 	
	/*to center the div on the page*/
	margin:  0 auto;
	vertical-align: bottom;
}
	
div.NavDiv{
	float: left;
	color: #0000FF;
	/*border-right-color: #0033CC; */
	text-align: center;
	/*padding: 0; */

	}

span.Nav{
	/*display:inline;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	color:#000000; /*was #0000FF before Deryck*/

	text-decoration:none;
	vertical-align:top;
	padding-left:1em;
	margin-left:1em;

	}

span.Nav:hover{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*Unless this font is slightlly smaller than the one for Nav, then all 
	the nav bar items to the right of the selected one shift to the right during the hover*/
	font-size: 12px;
	font-weight: bold;
	color:#102283; /*was #0000FF*/ 

	vertical-align:top;
	padding-left: 1em;
	margin-left: 1em; 
	}

NavSpan{
	vertical-align:top;
	display:inline;
	margin-top:2em;
	padding-left:1em;
	float:left;
	margin-right:1em;
}

div.Testimonial{font-family: 'Scala', sans-serif;
			font-size: 16px; 
			font-weight:normal;
			margin-bottom:1em;
				  width:90%; 
			}

span.Author{
	display:block;
	font-family: 'Scala', sans-serif;	font-size: 15px;
	font-weight: normal;
	color:#656565; /*#0000FF; */
	padding-left:1em;
	}

	
.Panel{			/* For IE prior to IE9 */
					position:relative; 
					
				  margin-top:1em;
				  height:200px;
				  width:260px; 
				  float:left;
				  margin-left:24px		;
				  margin-bottom:1em;
				  padding-top:15px;
				  padding-bottom:15px;
				  
					/*Rounded corners*/
					-moz-border-radius:12px;
					 -webkit-border-radius:12px;
					  border-radius:12px;	
					  behavior:url(border-radius.htc); /*Referencing a file that allows IE to support rounded corners prior to IE9*/	
					  
					  /*Shadow*/
		-moz-box-shadow:10px 9px 16px 0px rgba(170, 178, 187, 0.88);
		-webkit-box-shadow:10px 9px 16px 0px rgba(170, 178, 187, 0.88);
		box-shadow:10px 9px 16px 0px rgba(170, 178, 187, 0.88);
		}
/*		*/
.ServicesPanelTitle{
		width: 254px;  
		font-family: 'Scala', sans-serif; /*Front runners are Roboto Condensed, Scada,Strait, Basic. Originally Verdana, Arial, Helvetica, sans-serif; */
		font-size: 24px;
		font-weight:bold;
		color:#102283;
		padding-top:.25em; 
		padding-left:.25em;
		padding-bottom: .25em;
		margin-bottom: .75em;

		/*gradient background*/
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#E6E6E6'); /* for IE */		
		background: linear-gradient(284deg, #FFFFFF 20%, #E6E6E6 68%); 
		background: -moz-linear-gradient(284deg, #FFFFFF 20%, #E6E6E6 68%); 
		background: -webkit-linear-gradient(284deg, #FFFFFF 20%, #E6E6E6 68%); 
		background: -o-linear-gradient(284deg, #FFFFFF 20%, #E6E6E6 68%); 
		}


span.DescripText {
	font-family: 'Scala', sans-serif; /* was Verdana, Arial, Helvetica, sans-serif; */
	font-size: 22px;
	font-weight:normal;
	color: #000;
}			

div #BottomThird{
	/*background-color:#000; */
	float:none;
	width: 92.5%;
	height: 150px;
	display: block;
	 /*to center the div on the page*/
	margin: 0 auto;
}

div.BottomPanels{
	position:relative;
	width:45%; /*was 46%*/
	height: 120px;
	padding-left:1em;
	  padding-top:15px;
	  padding-bottom:15px;
	
	/*Rounded corners on the top only*/
	behavior: url(border-radius.htc); /*Referencing a file that allows IE to support rounded corners prior to IE9*/
	-moz-border-radius: 20px 20px 20px 20px;
	-webkit-border-radius: 20px 20px 20px 20px;
	border-radius: 20px 20px 20px 20px;
	 

	/*background grey gradient*/
	/*before transparency at the bottom, this was all originally (91deg, #F4FCF8 0%, #807F7C 72%) */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCCCCC', endColorstr='#FFFFFF'); /* for IE */
	background: linear-gradient(91deg, transparent 30%, #807F7C 90%); 	
	background: -moz-linear-gradient(91deg, #CCC 30%, #FFFFFF 90%); 
	background: -webkit-linear-gradient(91deg, #CCC 30%, #FFFFFF 90%);  
	background: -o-linear-gradient(91deg, transparent 30%, #807F7C 90%); 

}

div.PanelTitle{
	font-family: 'Scala', sans-serif;
		font-size: 24px;
		font-weight:bold;
		color: #000000;
		height:3em;
		display:block;
		vertical-align:top;
}

div.PanelTitle:hover{
	color:#102283;}
	
div.PanelTitle a{text-decoration:none;
	font-family: 'Scala', sans-serif;
		font-size: 24px;
		font-weight:bold;
		color: #000000;
}

div.PanelTitle a:hover{text-decoration:none;
	font-family: 'Scala', sans-serif;
		font-size: 24px;
		font-weight:bold;
		color: #102283;
}

div.PanelSubtitle{	font-family: 'Scala', sans-serif; /* was Verdana, Arial, Helvetica, sans-serif;	*/
		font-size:16px; 
		font-weight:normal;
}

div.PanelSubtitle:hover{		
		font-family: 'Scala', sans-serif;
}
				
.LinkText {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	color: #333366;
}

.BulletText {font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight:normal;
	color: #000000;
	list-style-type:none;
	line-height:1.25em;
	
}

.StartHidden {
	display:none;
	background-color:#478FB2;
	height:101%;
	padding-left:1em;
	width:500px;	}
	
/* ABOUT page & Contact page*/
.AboutParagraph{
display:block;
padding-bottom:1em;}

