@charset "utf-8";
/* CSS Document */

@import url(/global/css/nav.css);

/* RESET */
html, body, div, pre, form, blockquote, fieldset, input { margin: 0; padding: 0; } /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* hide outlines/dotted boxes visible in Firefox (etc?) */
* { outline: none; }

a:active
{
outline: none;
}

a:focus
{
-moz-outline-style: none;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.SlidingPanels {
	float: left;
	position: relative;
	width: 575px;
	padding: 0px;
	border: none;
	/* BL added - removed orig inline styles. Note: .js file adds these styles as well */
	overflow: hidden; 
}

.SlidingPanelsContentGroup {
	position: relative;
	float: left;
	width: 10000px;
	margin: 0px;
	padding: 0px;
	border: none;
}

.SlidingPanelsContent {
	float: left;
	width: 575px;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	padding-right:10px;
	border: none;
}

A {
	color:#cc3300;
	text-decoration:none;
}

A img {
	text-decoration:none;
	border:none;
}

A:hover {
	text-decoration:underline;
}

A.more  { display:block; height:16px; width: 100px; padding-right: 20px;  background: url(/global/images/arrow.gif) no-repeat right center;  /*  13x13px  arrow used in list items for districts   control li line height using: height:1.7em; (vs 13px;)*/ }


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */


.SlidingPanelsAnimating * {
	overflow: hidden !important;
}
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #444444;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}

UI, LI, P {
	font: normal 11px/16px Verdana, Arial, Helvetica, sans-serif;
	color: #333;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

/* logo bullet image */
#mainContent Ul {
	/* list-style-image: url(/global/images/bullet.gif); */
  list-style-type: disc;
	padding-left: 15px;
}
#mainContent Ul.slidingTabPanel {
  list-style-image: none;
}

#mainContent Ul LI {
	padding-left: 5px;
}
/* - - -  */


h1 {
	position: relative;
	margin:0;
	padding:0;
	font-size:18px;
	color: #535b71; /* #948C89;	*/
}

.sub {
	font-size: 16px;
	font-style:italic; 
	color: #999999; 
	display: block; 
	text-indent: 100px; 
	font-weight: lighter;
	

}

.centered {
	position: relative;
	height: 1em;
	margin-bottom: 2em;
}

.centered span {
	position: absolute;
	/* center the text */
	text-align: center;
	display: block;
	margin: 0 auto;
	padding: 0;
	width: 420px;  /* <<<<<<<<<<<< ------------- forced centering  */
	hight: 1em;
	/* display: inline;
	_zoom:1;
	word-wrap: break-word; /* overflow: hidden; (optional)   (break-word for text & hidden for images)  Internet Explorer and the Expanding Box Problem  */

}

h2 {
	font-size:12px;
	color:#444;
	color: #595959;
	margin-bottom: -5px;
}

h3 {
	font-size:11px;
	color:#444;
	color: #595959;
	font-weight: bold;
	margin-bottom: -10px;
	}

h4 {
	font-size:12px;
	color: #595959;
	font-weight: normal;
	line-height: 20px;
}

p.caption {
	font: normal 10px/14px Verdana, Arial, Helvetica, sans-serif;
	margin:0 0 20px 16px;
}

/* /\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\ */

.twoColFixLtHdr #container { 
	background:url(/global/images/content_bg.png) repeat-y;
	width: 756px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 5px auto 10px; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	
	position: relative; /* added to absolutely position the quotes */
} 
.twoColFixLtHdr #header {
	 background: url(/global/images/header_bg.png) repeat-x;
	 height:120px;
	 position: relative; /* for download, etc. absolute positioning */
} 
.headerLeftCorner {
	float:left;height:120px; width:10px; background:url(/global/images/header_crnr_lft.png) no-repeat;
}
.headerRightCorner {
	float:right;height:120px; width:10px; background:url(/global/images/header_crnr_rt.png) no-repeat;
}
.twoColFixLtHdr #header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
.twoColFixLtHdr #sidebar1 {
	float: left; /* since this element is floated, a width must be given */
	width: 130px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	*width: 160px; /* IE hack */
	padding: 10px 10px 0px 20px;
		clear: both; /* BL - Optional - to display correctly in DW design view - otherwise the sidebar is incorrectly displayed over the header, even though it displays correctly in a browser */
		
		position: relative; /* added to position the globalnav */
}
.twoColFixLtHdr #sidebar1 UL{
	margin:0;
	padding:0;
}
.twoColFixLtHdr #sidebar1 LI{
	list-style-type:none;
}
.twoColFixLtHdr #sidebar1 A {
	font: 12px/24px Verdana, Arial, Helvetica, sans-serif;
	color:#444;
	text-decoration:none;
}.twoColFixLtHdr #sidebar1 A:hover {
	color:#f60;
}
.twoColFixLtHdr #sidebar1 A:active {
	color:#f60;
}
.twoColFixLtHdr #mainContent { 
	margin: 10px 0 0 160px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */	
	padding: 0 10px;
	/* border-left:1px solid #ababab; */ /* Replaced by implied line created by new globalnav and quote positioned on the left */
	/* *width: 555px; IE hack 575 - 10 - 10 */
}
.twoColFixLtHdr #mainContent .centered-column {
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 0;
}

.contentDivider {
	border-bottom:1px solid #969696;
	height: 1px;
}


/* ********************** footer & billboard   **********************  */

/* Heights for all set below */

.twoColFixLtHdr #footer { 
	background:url(/global/images/footer_bg.png) bottom left repeat-x;
    font-size: 1px;
	
	position: relative;
	
} 

/* Billboard Images (Bottom Background Images) */
#container 				#billboard {
	position: absolute;
	left: 1px;
	top: 1px;
	width: 754px;
	background-image: url(/global/images/watermark.png);
	background-repeat: no-repeat;
	background-position: 420px -2px;
}  /* left bottom; */
/* #container.main 		#billboard { background: url(/global/images/billboard_main.jpg); } 
#container.clutter		#billboard { background: url(/global/images/billboard_clutter.jpg); } 
#container.about 		#billboard { background: url(/global/images/billboard_2.jpg); } 
#container.thief 		#billboard { background: url(/global/images/billboard_thief.jpg); } 
#container.packages 	#billboard { background: url(/global/images/billboard_3_shells.jpg); } 
#container.insider-tips	#billboard { background: url(/global/images/billboard_tips.jpg); } 
#container.contact 		#billboard { background: url(/global/images/billboard_main.jpg); }  */


.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
}
#footer .fltlft {
	height:10px;
	width:10px;
		background:url(/global/images/footer_crnr_lft.png) top left no-repeat;
	
	background-position: bottom left;
}
#footer .fltrt {
	float:right;
	height:10px; 
	width:10px; 
	background:url(/global/images/footer_crnr_rt.png) top right no-repeat;
	
	background-position: bottom right;
	
}
	
.twoColFixLtHdr #footer,
#container #billboard,
#footer .fltlft,
#footer .fltrt {
height: 240px;
}
	
/*  **********************   END of footer & billboard    **********************  */

	
#header .floatLogo {
	float: left;
	padding:0; /* 0 0 22px;    &  orig 24px 0 0 22px; */
}
#header .floatName {
	float: right;
	padding:0;
}
/* IEwin6 z-index bug fixed by removing#header from these classes
and moving the div outside of the header div  */
.floatTagLine {
	position: absolute;
	top: 30px;
	left: 580px;
	z-index: 9998;
	width: 270px;
	/* for downlod image  <<<<<<<<<<  BL  */
	/* background:url(/global/images/from_insidenout.png) top right no-repeat;       
	/*  float:right; 
	padding:63px 12px 0 0;
	margin-top:15px; */
}

.floatTagLine p {
	margin: 0;
	padding: 0;
	color: #787878; /* #595959; */
	font:italic 12px/20px Georgia, 'Times New Roman', Times, serif;
}

.floatTagLine span {
	font-size: .9em;
}

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
  height:0;
  font-size: 1px;
  line-height: 0px;
}

#copyright-terms {
	text-align:center;
	margin: 0px auto;
	width: 646px !important;
	width: 650px; 
}
#copyright-terms P{
	color:#666;
}
#copyright-terms a {
	color:#999;
	text-decoration:none;
}
#copyright-terms span {
	color:#999;
}

.slidingTabPanelWrapper {
	background:url(/global/images/tab_shadow.png) bottom center no-repeat;
	border-bottom:1px solid #969696;
	height:46px;
	margin:20px 0 10px 0;
	display: none;

}
.slidingTabPanel {
	list-style:none;
	margin:0 auto;
	padding:0;
	width:288px;
	height:46px;
}

.SlidingPanelsContent h2 {
	color: #9966CC;
}

.slidingTabPanel LI {
	list-style:none;
	float:left;
	width:50px;
	margin:0 2px;
}
.tabActive {
	position:relative;
	top:1px;
	display:block;
	width:50px;
	height:46px;
	cursor:default;
	outline:none;
}
.tab {
	position:relative;
	top:1px;
	display:block;
	width:50px;
	height:46px;
	background-position:-100px;
	cursor:pointer;
	outline:none;
}
.tab:hover {
	background-position:-50px;
}
/* rename these divs later - must check if js requires updating too! */
#nutshell {
	background-image:url(/global/images/tab_1_home.jpg);
}
#widgets {
	background-image:url(/global/images/tab_2_workspace.jpg);
}
#data {
	background-image:url(/global/images/tab_3_money.jpg);
}
#effects { background-image:url(/global/images/tab_4_move.jpg); }


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.topRight {
	float:right;
	width:155px;
	position: relative !important; /* overrides the spry_quotes js that would set the .quotebox to position absolute */
	height: 190px;
}

.bottomLeft {
	position: absolute;
	left: 0;
	top: 305px;
	width:140px; 
	z-index: 1000;

}
/* IMAGE BOX - Relatively Positioned on the Left Side  
(For fading: Must change position style in quote js  */
.imageBox {
	font:italic 14px/18px Georgia, 'Times New Roman', Times, serif;
	color:#444; 
	background-color: #F8F8F8; 
	background: url(/global/images/quote_bg.jpg) repeat-x top left; /* BL */
	margin: 0 0 10px 15px;
	text-indent:-5px;
	*text-indent: 0px; /* IEwin7 */
	/* BL added - removed orig inline styles. Note: .js file adds these styles as well */
	position: relative;
	height: 190px;
}
.image {
	background-color: #F8F8F8; /* Essential BL - http://icant.co.uk/sandbox/msieopacityissue/   If you use an animation library to fade elements in and out, make sure to add a background colour to the element you animate, otherwise MSIE will play silly buggers with the font face. */ 
	/* OR */
	background: url(/global/images/quote_bg.jpg) repeat-x top left; /* BL */ 
	margin:10px 15px 5px; /* orig  20 */
	_margin-left: 10px; /* IEwin6 */
	width:140px;
	/* BL added - removed orig inline styles. Note: .js file adds these styles as well */
	position: absolute;
	top: 0px;
	right: 0px;
	opacity: 0;
	
	z-index: 9998;
	display: none;  /* prevents momentary simultaneous display of all quotes */
}
	

/* ----------------------- */


#quote {
	font:italic 14px/18px Georgia, 'Times New Roman', Times, serif;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* NEW QUOTE BOX - Absolutely Positioned on the Left Side  
Must change position style in quote js */
.quoteBox {
	width:140px; 
	font:italic 13px/18px Georgia, 'Times New Roman', Times, serif;
	color: #555555; /* color:#444; */
	background-color: #F8F8F8; 
	background: url(/global/images/quote_bg.jpg) repeat-x top left; /* BL */
	margin: 0 0 10px 10px;
	text-indent:-5px;
	*text-indent: 0px; /* IEwin7 */
	/* BL added - removed orig inline styles. Note: .js file adds these styles as well */
	height: 190px;
	
}
.quote {
	background-color: #F8F8F8; /* Essential BL - http://icant.co.uk/sandbox/msieopacityissue/   If you use an animation library to fade elements in and out, make sure to add a background colour to the element you animate, otherwise MSIE will play silly buggers with the font face. */ 
	/* OR */
	background: url(/global/images/quote_bg.jpg) repeat-x top left; /* BL */ 

	margin:10px; /* orig  20 */
	/* padding: 2px;  orig 0  BL */
	width:120px;
	/* BL added - removed orig inline styles. Note: .js file adds these styles as well */
	position: absolute;
	top: 0px;
	left: 0px;
	opacity: 0;
	
	z-index: 2000;
	display: none; /* prevents momentary simultaneous display of all quotes */
}
	
.quoteBox SPAN {
	float:right;
	text-align:right;
	color:#818181;
	font-size:10px;
	line-height:12px;
	margin-top:6px;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* ORIGINAL QUOTE BOX - Relatively Positioned on the Right Side  
Must change position style in quote js  */
.quoteBox-Disabled {
	float:right;
	width:175px;
	font:italic 14px/18px Georgia, 'Times New Roman', Times, serif;
	color:#444; 
	background-color: #F8F8F8; 
	background: url(/global/images/quote_bg.jpg) repeat-x top left; /* BL */
	margin: 0 0 10px 10px;
	text-indent:-5px;
	*text-indent: 0px; /* IEwin7 */
	
	/* BL added - removed orig inline styles. Note: .js file adds these styles as well */
	position: relative;
	height: 190px;
}
.quote-Disabled {
	background-color: #F8F8F8; /* Essential BL - http://icant.co.uk/sandbox/msieopacityissue/   If you use an animation library to fade elements in and out, make sure to add a background colour to the element you animate, otherwise MSIE will play silly buggers with the font face. */ 
	/* OR */
	background: url(/global/images/quote_bg.jpg) repeat-x top left; /* BL */ 

	margin:18px; /* orig  20 */
	/* padding: 2px;  orig 0  BL */
	width:135px;
	/* BL added - removed orig inline styles. Note: .js file adds these styles as well */
	position: absolute;
	top: 0px;
	left: 0px;
	opacity: 0;
	
	z-index: 9998;
	display: none;  /* prevents momentary simultaneous display of all quotes */
}
	
.quoteBox-Disabled SPAN {
	float:right;
	text-align:right;
	color:#818181;
	font-size:10px;
	line-height:12px;
	margin-top:6px;
}

/* ----------------------- */

.animationContainer{
	position: relative;
}

/* sliding panels */

.demoDiv{ 
	height: auto; 
	overflow: hidden;
}
.hideInitially{
	display: none;
	visibility: hidden;
}




#the-thief 					{ position: relative; left: 0px; width: 570px; height: 450px; /* padding:5px 0 5px 30px;  border: 1px solid #ede1f1; */  }
#the-thief .quadrant { float:left; width: 230px; padding: 10px 20px 0px; height: 220px; _height: 230px; /* IEwin6 */  margin-bottom: 0px; border: 1px solid #d6d6fb; /* #ccccff; */ background: url(/global/images/quadrant_bg.jpg) repeat-x top left;
display: inline; /* IEwin Bug FIx - The IE Doubled Float-Margin Bug in case of float and margin on same side */  
word-wrap: break-word; overflow: hidden; /* (break-word for text & hidden for images)   Internet Explorer and the Expanding Box Problem  */
*width: 270px;  /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
_zoom:1;}
#the-thief .quadrant.one	 { border-top: none; 	  border-left:none;  }
#the-thief .quadrant.two 	 { border-top: none; 	  border-right:none; }
#the-thief .quadrant.three { border-bottom: none; border-left:none;   padding-bottom: 0; }
#the-thief .quadrant.four	 { border-bottom: none; border-right:none;  padding-bottom: 0; }
#the-thief .quadrant h2 	 { text-align:left;  }



/* CONTACT US email encoded by Enkoder (Hivelogic) */
/* center content */
.center,
/* #container.contact p,
#container.contact h1,
#container.contact h2 */  {
	text-align: center;
}

#contact {position:relative; width: 220px; height: 110px; display: block; /* text-align:center;  left: 95px; */ }

a#email.text-white { margin-bottom: -20px;}
a#email.text-white, #email.text-readable { width: 220px; height: 15px; background: url(/global/images/email_centered.gif) no-repeat; overflow:visible; line-height: 18px; padding-top: 18px; font-size: .9em; color:#FFF; display: block; }

/* 2nd email is disabled until  required */
/* #email-2.text-white, #email-2.text-readable { width: 220px; height: 15px;  background: url(/global/images/email-2.gif) no-repeat; overflow:visible; line-height: 18px; padding-top: 18px; font-size: .9em; color:#FFF; display: block; }   */

#email.text-readable, #email-2.text-readable { color: #999999;  margin-bottom: 0; /* optional --> */ text-align:center; }
 

/* -------- */