/* 

SITE SPECIFIC STYLE SHEET FOR NTS 
Created by Matt Roberts and Deborah Miller
Network Technology Solutions
229-226-2110
www.networkts.com

TABLE OF CONTENTS
	
	1. Default -> Line 
	2. Structure -> Line 
	3. Links -> Line 
	4. Standard Classes/ Styles -> Line 
	5. Dojo Specific Sytles -> Line 
	6. Hacks -> Line 

--------------------NOTES-----------------------------------------
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;;			LAST EDIT DATE: 01/23/07 DM							;;	
;;			version: 0.5.3										;;
;;			Note: 												;;
;;			-> Fluid vs. Fixed Layout Option					;;
;;			   (by simply changing container width)				;;
;;			-> Renamed div #black_bar to a more					;;
;;			   descriptive name of #topNavBarIndexSpacer		;;
;;			-> Added #topNavBarContainer						;;
;;			-> Added #rightContainerBottom						;;
;;			-> Added ul li and a styles for #topNavBar and		;;
;;			   #topSubNavBar divs.								;;
;;			-> Deleted redundant font-family and				;;
;;			   font-size delarations							;;
;;			-> Commented out image background tags				;;
;;			   (changed image names to generic names,			;;
;;			   for example instead of 							;;
;;			   online_banking_button_down.jpg, button_down.jpg)	;;
;;			-> Deleted the .hideMapData class, created a		;;
;;			   .hide class which can be used repeatedly.		;;
;;			-> Created a .clear class							;;
;;			-> Created a .border class							;;
;;			-> Added a Dojo Tooltip Style						;;
;;			-> Removed static structure styles					;;
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;*/													

/*************************************************/
/* --------- 1. DEFAULTS  -----------------------*/
/*************************************************/

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	background-image: url(../images/bg.jpg);
	background-repeat: repeat-x;
	background-position: top left;
}

form {
	padding: 0;
	margin:0;
	font-size: 12px;
}

input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 2px;
	border: 1px solid #0066FF;
	margin-bottom: 5px;
}

select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 2px;
	border: 1px solid #0066FF;
	margin-bottom: 5px;
}

textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 2px;
	border: 1px solid #0066FF;
	margin-bottom: 5px;
}

input.required {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 2px;
	border: 1px solid #0066FF;
	background-color: #F5F9FF;
}

textarea.required {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 2px;
	border: 1px solid #0066FF;
	background-color: #F5F9FF;
}


select.required {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 2px;
	border: 1px solid #0066FF;
	margin-bottom: 5px;
	background-color: #F5F9FF;
}


input.enews {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding: 2px;
	color: #0066FF;
	border: 1px solid #0066FF;
	margin-bottom: 5px;
	background-color: #F5F9FF;
}

a img {
	border: 0;
}

hr {
	color: #000000;
	width: 98%;
	height: 2px;
	text-align: center;
}

p {}  

ul {} /*list-style-type: none;*/

h1 {
	font-size: 18px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 5px;
	margin: 0px 0px 15px 0px;
	width: 98%;
	color: #df2822;
	border-bottom: 1px solid #000000;
}

#rightContainer h1 {
	font-size: 18px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 5px;
	margin: 0px 0px 15px 0px;
	width: 98%;
	color: #FFFFFF;
	border-bottom: 1px solid #FFFFFF;
}

h2 {
	font-size: 16px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	color: #2e2c2d;
	padding-bottom: 2px;
	margin: 0px 0px 10px 0px;
}

#rightContainer h2 {
	font-size: 16px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	padding-bottom: 2px;
	border-bottom: 2px solid #FFFFFF;
}

h3 {
	font-size: 14px;
	font-weight:bold;
	font-family: Arial, Helvetica, sans-serif;
	color:#2e2c2d;
	padding:0px;
	margin: 0px 0px 10px 0px;
}

#rightContainer h3 {
	font-size: 14px;
	font-weight:bold;
	font-family: Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	padding:0px;
	margin: 0px 0px 10px 0px;
}

#threeColumnContent h3 {
	font-size: 14px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	background-color: #df2822;
	padding: 2px;
	width: 98%;
	margin: 0px 0px 10px 0px;
}

h4 {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color:#2e2c2d;
	font-weight:bold;
	padding:0px;
	margin: 0px 0px 10px 0px;
}
		
#rightContainer h4 {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-weight:bold;
	padding:0px;
	margin: 0px 0px 10px 0px;
}

h5 {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color:#2e2c2d;
	font-weight:bold;
	padding:0px;
	margin: 0px 0px 10px 0px;
}

#rightContainer h5 {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-weight:bold;
	padding:0px;
	margin: 0px 0px 10px 0px;
}

h6 {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color:#2e2c2d;
	font-weight:bold;
	padding:0px;
	margin: 0px 0px 10px 0px;
}

#rightContainer h6 {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-weight:bold;
	padding:0px;
	margin: 0px 0px 10px 0px;
}

strong {
	text-transform: uppercase;
}

/*************************************************/		
/*  --------- 2. STRUCTURE  -------------------- */
/*************************************************/

#container {
	width: 90%; /* FLUID OR FIXED PAGE LAYOUT DEPENDS SOLELY ON THIS WIDTH*/
}

/* --------------- HEADER ------------------- */

#header {
	height: 115px;
	padding: 0;
	margin: 0;
	background-image: url(../images/header_bg.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	font-weight: bold;
	font-size: 12px;
}

/*======BEGIN header INNER STYLES========*/

/* ------------- HEADER LOGO---------------- */

#header .logo	{
	width: 200px; /*Change Width for Background Image*/
	background: #e3e3e3;
}

/* ----------- HEADER MASTHEAD-------------- */

#header .mastHead	{
	height: 37px;
	margin: 0;
	margin-left: 242px;
	margin-top: 78px; 
	padding: 0;
	text-align: left;
	color: #FFFFFF;
	font-weight: bold;
	float: left;
}

#header ul {
	margin: 0;
	padding: 0;
	width: 570px;
	float: left;
}

#header ul li {
	display: inline;
}

#header ul li a, #header ul li a:visited {
	color: #FFFFFF;
	text-decoration: none;
	padding: 5px 10px;
	text-decoration: none;
	float: left;
}

#header ul li a:hover, #header ul li a:active {
	color: #FFFFFF;
	text-decoration: none;
	border: 1px solid #C7DFFF;
	border-bottom: 4px solid #C7DFFF;
}

/* ------------- HEADER LINKS--------------- */

#header .headerLinks	{
	font-weight: bold;
	color: #FFFFFF;
	padding: 0;
	width: 150px;
	padding-top: 4px;
}

/*======END header INNER STYLES========*/

/* ------------ TOP NAV CONTAINER------------ */

#topNavBarContainer {
	font-weight: bold;
}

/*====== BEGIN topNavBarContainer INNER STYLES========*/

/* --------------- TOP NAV ----------------- */

#topNavBar {
	color: #FFFFFF;
	text-align: left;
	height: 28px;
	margin: 0px;
	margin-top: 4px;
	padding: 0px;
	font-size: 12px;
}

/*====== BEGIN topNavBar INNER STYLES========*/

/* ---------- TOP NAV LEVEL 1------------- */

#topNavBar ul {
	width: 570px;
}

#topNavBar ul li {}

#topNavBar ul li a, #topNavBar ul li a:visited {
	background-image: url(../images/topnav_up_bg.jpg);
	background-repeat: repeat-x;
	background-position: top left;
	color: #0066FF;
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}

#topNavBar ul li a:hover, #topNavBar ul li a:active {
	color: #000000;
	text-decoration: none;
}

/*====== END topNavBar INNER STYLES========*/

/* --------------- TOP SUB NAV ------------- */

#topSubNavBar {
	background-color: #999999;
	color: #FFFFFF;
	text-align: left;
}

/*====== BEGIN topSubNavBar INNER STYLES========*/

/* -------- TOP NAV LEVEL 2--------------- */

#topSubNavBar ul li {}

#topSubNavBar ul {}

#topSubNavBar ul li a, #topSubNavBar ul li a:visited {
	background-color: #999999;
	color: #FFFFFF;
	text-decoration: none;
}

#topSubNavBar ul li a:hover, #topSubNavBar ul li a:active {
	color: #666666;
	text-decoration: none;
	background-color: #999999;
}

/*====== END topSubNavBar INNER STYLES========*/

/* --------- TOP NAV INDEX SPACER ---------- */

#topNavBarIndexSpacer {
	font-weight: bold;
	background-color: #000000;
	color: #FFFFFF;
	text-align: left;
}

/*====== END topNavBarContainer INNER STYLES========*/

/* --------------- LEFT CONTAINER------------ */

#leftContainer {/*left navigation container -- was -- #leftNav*/
	background-image: url(../images/leftcontainer_bg.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	margin: 0;
	padding: 0;
	padding-top: 25px;
	width: 235px;
	font-size: 12px;
	color: #0066FF;
}

#leftContainer p {
	margin-left: 25px;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 0px;
}

#leftContainer h1, #leftContainer h2, #leftContainer h3, #leftContainer h4, #leftContainer h5, #leftContainer h6 {
	margin-left: 25px;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 0px;
}


/*====== BEGIN leftContainer INNER STYLES========*/

/* ------------- LEFT NAV LEVEL 1 ---------- */

#navContainer ul {
	font-weight: bold;
	text-align:left;
	padding-left: 25px;
	padding-right: 10px;
}

#navContainer form {
	text-align:left;
	padding-left: 25px;
	padding-right: 10px;
}

#navContainer .titleBar	{/*this is the left nav title bar that says "menu"*/
	border:1px #000000 solid;
}

#navContainer li {
	width: 200px;/*controls width of the nav containers*/
	margin-bottom: 2px;
}

#navContainer a, #navContainer a:link, #navContainer a:visited {
	border-top: 1px solid #0066FF;
	color: #0066FF;
	text-decoration:none;
}

#navContainer a:hover {
	text-decoration:none;
	color: #DF2822;
	border-top: 1px solid #DF2822;
	/*background-image: url(/images/nav_bg.jpg);
	background-repeat: repeat-x;
	background-position: bottom;*/
}

/* ------------- LEFT NAV LEVEL 2 ---------- */

#navContainer ul ul	{ /*determines left indent*/
	margin-left:0;
}

#navContainer ul ul	li{
	width:200px;/*controls width of sub nav buttons*/
}

#navContainer ul ul li a, #navContainer ul ul li a:active, #navContainer ul ul li a:visited, #navContainer ul ul li a:link {
	color: #0066FF;
	text-decoration: none;
	/*background-image: url(/images/nav_bg.jpg);
	background-repeat: repeat-x;
	background-position: bottom;*/
	margin-top: 2px;
	border: 0px;
	border-top: 1px solid #0066FF;	
}

#navContainer ul ul li a:hover{
	text-decoration:none;
	color: #DF2822;
	border-top: 1px solid #DF2822;
}
	
/* ------------- LEFT NAV LEVEL 3 ---------- */

#navContainer ul ul	ul {/*determines left indent*/
	margin-left:0;
}

#navContainer ul ul ul li {
	width:200px;/*controls width of 3rd level nav buttons*/
}

#navContainer ul ul ul li a, #navContainer ul ul ul li a:active, #navContainer ul ul ul li a:visited, #navContainer ul ul ul li a:link {
	color:#0066FF ;
	text-decoration: underline;
	background-image: none;
	border: 0px;
	border-top: 1px solid #0066FF;	
}

#navContainer ul ul ul li a:hover {
	text-decoration:none;
	color: #DF2822;
	border-top: 1px solid #DF2822;
}

/*====== END leftContainer INNER STYLES========*/

/* ------------ LEFT CONTAINER BOTTOM ------- */

#leftContainerBottom {/*bottom portion of left nav*/
	background-image: url(../images/leftcontainerbottom_bg.jpg);
	background-position: top right;
	background-repeat: no-repeat;
	width: 242px;
	height: 20px;
	padding: 0;
	padding-top: 4px;
	margin: 0;
	margin-top: 10px;
	font-size: 12px;
	text-align: center;
	color: #FFFFFF;
	font-weight: bold;
}

/* --------------- RIGHT CONTAINER ---------- */

#rightContainer	{
	background-image: url(../images/rightcontainer_bg.jpg);
	background-position: top left;
	background-repeat: repeat-y;
	margin-top: 10px;
	color: #FFFFFF;
	width: 200px;
	padding: 0;
	font-size: 12px;
}

#rightContainer ul {
	margin: 5px 0px 0px 22px;
	padding: 0px; /*fixes left indent for nav in firefox*/
	list-style-image: url(../images/arrow.gif);
	font-weight: bold;
	text-align:left;
}

#rightContainer ul ul {
	margin: 2px 0px 2px 18px;
	padding: 0px; /*fixes left indent for nav in firefox*/
	list-style-image: url(../images/arrow.gif);
	font-weight: bold;
	text-align:left;
}

#rightContainer ul li a, #rightContainer ul li a:visited {
	display: block;
	list-style-image: url(../images/arrow.gif);
	text-decoration: underline;
}

#rightContainer ul li a:active, #rightContainer ul li a:hover {
	display: block;
	list-style-image: url(../images/arrow.gif);
	text-decoration: none;
}

#rightContainer p {
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 0px;
}

#rightContainer h1, #rightContainer h2, #rightContainer h3, #rightContainer h4, #rightContainer h5, #rightContainer h6 {
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 0px;
}

/*====== BEGIN rightContainer INNER STYLES========*/

/* ---------- RIGHT CONTAINER LOGIN -------- */

#rightContainer .login	{
	padding-top:5px;
}

/* -------- RIGHT CONTAINER PROMOTION ------ */

#rightContainer .promotion	{
	padding:5px;
	color:#0033ff;
	font-weight:bold;
}

/* ---------- RIGHT CONTAINER LINKS -------- */

#rightContainer .links	{
	text-align:left;
}

#rightContainer .links li	{
	list-style-image: url(/images/arrow.gif);
}

/* ---------- RIGHT CONTAINER CONTACT ------ */

#rightContainer .contact	{
	text-align:left;
	padding:5px 0px 5px 5px;
}

/*====== END rightContainer INNER STYLES========*/

/* --------- RIGHT CONTAINER BOTTOM --------- */

#rightContainerBottom {/*bottom portion of right nav*/
	background-image: url(../images/bottomrightcontainer_bg.jpg);
	background-position: bottom left;
	background-repeat: no-repeat;
	margin: 0;
	padding: 0;
	width: 200px;
	color: #FFFFFF;
	height: 15px;
}

/* --------- THREE COLUMN TOP BOX ----------- */

#threeColumnTopBox { /*Fluid - Include Background Image or Color*/
	text-align: left;
}

/* --------- THREE COLUMN CONTENT ----------- */

#threeColumnContent { /*Three Column Fluid Layout*/
	margin-top: 5px;
}
	
/* --------- TWO COLUMN CONTENT ------------ */

#twoColumnContent { /*Two Column Fluid Layout*/
	background:#fff;
	border:1px solid #000;
}
	
/* --------------- FOOTER ------------------ */

#footer {
	height: auto;
	padding: 0;
	margin: 0;	
	margin-top: 10px;
	font-size: 10px;
	color: #333333;
	background-image: url(../images/footer_bg.jpg);
	background-position: bottom;
	background-repeat: no-repeat;
}

/* -------------- COPYRIGHT ---------------- */

#copyright {
	background-image: url(../images/copyright_bg.jpg);
	background-repeat: repeat-x;
	background-position: bottom left;
	height: 22px;
	padding: 0;
	padding-top: 30px;
	margin: 0;	
	font-size: 10px;
	color: #333333;
}

/**************************************************/
/* ----------------- 3. LINKS ------------------- */
/**************************************************/

a, a:visited {
	color: #DF2822;
	text-decoration: none;
}
		
a:hover, a:active {
	color: #DF2822;
	text-decoration: underline;
}

/* --------------- HEADER ---------- */

#header a, #header a:visited {
	color: #FFFFFF;
	text-decoration: none;
}
#header a:hover, #header a:active {
	color: #FFFFFF;
	text-decoration: underline;
}

/* --------------- LEFT CONTAINER BOTTOM ---------- */

#leftContainerBottom a, #leftContainerBottom a:visited {
	color: #FFFFFF;
	text-decoration: none;
}

#leftContainerBottom a:hover, #leftContainerBottom a:active {
	color: #FFFFFF;
	text-decoration: none;
}

/* --------------- RIGHT CONTAINER ---------- */

#rightContainer a, #rightContainer a:visited {
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
}

#rightContainer a:hover, #rightContainer a:active {
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
}

/* --------------- RIGHT CONTAINER BOTTOM ---------- */

#rightContainerBottom a, #rightContainerBottom a:visited {
	color: #FFFFFF;
	text-decoration: underline;
	font-weight: bold;
}

#rightContainerBottom a:hover, #rightContainerBottom a:active {
	color: #FFFFFF;
	text-decoration: none;
}

/* --------------- TWO COLUMN CONTENT ---------- */

#twoColumnContent a, #twoColumnContent a:visited {
	font-weight:bold;
	color: #0033ff;
	text-decoration: underline;
}

#twoColumnContent a:hover, #twoColumnContent a:active {
	color: #963614;
	text-decoration: none;
}

/* --------------- THREE COLUMN CONTENT ---------- */

#threeColumnContent a, #threeColumnContent a:visited {
	
	font-weight:bold;
	color: #DF2822;
	text-decoration: none;
}

#threeColumnContent a:hover, #threeColumnContent a:active {
	color: #DF2822;
	text-decoration: underline;
}

/* --------------- FOOTER ---------- */

#footer a, #footer a:visited {
	color: #0033ff;
	text-decoration: none;
	font-weight:bold;
}

#footer a:hover, #footer a:active {
	color: #0033ff;
	text-decoration: underline;
}

/* --------------- COPYRIGHT ---------- */

#copyright a, #copyright a:visited {
	color: #0033ff;
	text-decoration: none;
	font-weight:bold;
}

#copyright a:hover, #copyright a:active {
	color: #0033ff;
	text-decoration: underline;
}

/**************************************************/
/* -------- 4. STANDARD CLASSES/ STYLES -------- */
/**************************************************/

/********login button
This may be used for button formatting
*******/
.button	{
	height:18px;
	*height:19px;
	padding: 0;
	background-color: #F5F9FF;
	color: #0066FF;
}

.titleBar	{
	color:#2e2c2d;
	font-weight: bold;
	text-align: center;
	height: 16px;
	width: 100%;
	padding-top: 2px;
	padding-bottom: 2px;
	background-image: url(/images/title_bg_1x20.jpg);
	background-repeat: repeat-x;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #000000;
}

.login	{
	font-weight: bold;
	color: #666666;	
}

.promos	{
	padding:5px;
	font-weight: bold;
	color: #000000;
	font-weight: 300;
	font-style: italic;
}
.center	{
	text-align:center;
	margin-left: 50px;
}

/*session error messages formatting*/
.ErrorMessage	{
	font-family: "Courier New", Courier, monospace;
	color: #CC0000;
	font-weight:bold;
	text-transform:uppercase;
}
.InfoMessage	{
	color: #0469b3;
	font-weight:bold;
	}
	
/*dashed line - use instead of <hr/>*/
.line	{
	width:200px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #000000;
	margin-right: 10px;
	margin-left: 25px;
	margin-bottom: 15px;
}

.hide {
	display: none; /*hide data*/
}

.clear {
	clear: both;
}

.border {
	border: 2px solid #000000;
	width: 567px;
}

/*****table formatting*******/
.tabdata {
	border: 1px solid #D6DDE6;
	border-collapse: collapse;
	width: 80%;
	margin-left:auto;
	margin-right:auto;
}

.tabdata tr {
	background-color: #FFFFFF;
}
.tabdata td {
	border: 1px solid #D6DDE6;
	padding: 4px;
	color: #000000;
	width:50%;
}
.tabdata th {
	border: 1px solid #828282;
	background-color: #000000;
	font-weight: bold;
	text-align: left;
	padding-left: 4px;
	color: #ffffff;
}
.tabdata tr.altrow {
	background-color: #e3e3e3;/*#DFE7F2*/
}

.tabdata tr:hover, .tabdata tr.hilite {
	background-color: #CFD7E2;
}

/**************************************************/
/* -------- 5. DOJO SPECIFIC STYLES ------------ */
/**************************************************/
		 
/*  dojo Tabs  */
.dojoTabPaneWrapper {
	padding : 10px 10px 10px 10px;
	height:150px;
}

#mainTabContainer p	{
	text-align:center;
}

/*googlemaps - dojo*/
#mapLayout{
	width: 98%;
	height:400px;
	border:2px solid black;
	text-align:left;
	font-size: 12px;
	margin: 0;
	padding: 0;
}

/*tooltips - dojo*/
body .dojoTooltip {
	background-color: #FEFEFE;
	border: 1px solid #999999;
	padding: 5px;
	position: absolute;
	z-index: 10;
	display: block;
	text-align: left;
}

body .dojoTooltip a {
	font-weight: bold;
}


/**************************************************/
/* ------------------ 6. HACKS ----------------- */
/**************************************************/

body { /* IE 5 centering bug fix */
	text-align: center;
}
		
#wrapper {
	text-align: left;
}