/* 
 * styles.css
 *
 * The styles.css file contains CSS styles that are used for all browsers.
 */

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 3.0.0
build: 1549
*/
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 3.0.0
build: 1549
*/
body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}

html {
overflow: -moz-scrollbars-vertical;
overflow: scroll;
}

a { outline: none; }

#Wrapper { width: 980px; } /* Width of "page" */
#MainChannel { width: 730px; } /* Width of left channel and center channel combined */
	body.noSidebar #MainChannel { width: 980px; }
#Content { width: 695px; } /* Width of center channel */
	body.noSidebar #Content { width: 980px; } /* Center channel with no sidebar */
#Sidebar { width: 222px; } /* Single sidebar on right */
/*#SidebarPrimary { width: 13.3em; }*/ /* Width of left channel */ 
/*#SidebarSecondary { width: 13.3em; }*/ /* Width of right channel */
/* = End Widths = */

#Wrapper {
	margin: 0 auto; /* Make content centered */
	padding: 0 4px;
}

/* Link at top of document to jump over navigation and go straight to content - For usability */
#ContentJump { left: -32000em; position: absolute; }

#Header { margin-top: 10px; position: relative; z-index: 10; }
		
#SiteId {
	z-index: 5;
}

#DuetPartners { 
	position: absolute;
	top: 20px;
	right: 10px;
}
	#DuetPartners li { border-right: 1px solid #a1a1a1; float: left; padding: 0 15px; }
		#DuetPartners li.last { border: 0; }

#SectionId {
	z-index: 30;
}
#SectionId ul {
	left: 170px;
	position: absolute;
	top: -3px;
	z-index: 30;
}
#SectionId li { float: left; margin-right: 5px; }
#SectionId li a {
		background: url(../images/common/section-tab.png) no-repeat 0 0;
		color: #666;
		display: block;
		height: 77px;
		text-decoration: none;
		width: 252px;
	}
	#SectionId li a.active {
			background: url(../images/common/section-tab-active.png) no-repeat 0 0;
			color: #fff;
		}
	#SectionId li a em { 
			display: block; 
			font-size: 116%;
			font-weight: bold; 
		}
	#SectionId li a span {
			background: url(../images/common/section-tab.png) no-repeat 100% 0;
			display: block;
			margin-left: 20px;
			padding-top: 10px;
		}
		#SectionId li a.active span {
				background: url(../images/common/section-tab-active.png) no-repeat 100% 0;
			}
	#SectionId li sup 
	{
		font-size: 93%;
	}

/* Top Navigation */
#NavigationPrimary {
	background: url(../images/common/navigation-primary-bg.png) no-repeat 0 0;
	height: 63px;
	margin-bottom: 1px;
	position: relative;
	z-index: 2;
}
	#NavigationPrimary ul {
		float: left;
		margin-top: 31px;
		z-index: 2;
	}
	  #NavigationPrimary li { /* Topnav item */
			background: url(../images/common/navigation-primary-link-bg.png) repeat-x 0 0;
			border-right: 1px solid #9b9b9b;
			float: left; /* Keep nav in a line */
			height: 32px;
			padding-left: 0;
			position: relative; /* To position dropdowns based on topnav items */
			z-index: 3; /* Need a known z-index so we can lap dropdowns over topnav items and flyouts over the dropdowns */
	  }
	    #NavigationPrimary li.active, #NavigationPrimary li.over { 
			background: url(../images/common/navigation-primary-link-bg-active.png) repeat-x 0 0;
			z-index: 5; /* Make dropdowns appear over topnav items and flyouts over lower li's that are siblings to dropdown items */
	    }
	    #NavigationPrimary a { /* Topnav link */
			color: #ddd;
			display: block;
			height: 32px;
			padding: 0 20px;
			text-decoration: none;
	    }
			#NavigationPrimary a.active, #NavigationPrimary li.over a { color: #fff; }

			#NavigationPrimary a span { display: block; padding-top: 3px; }
			
	    #NavigationPrimary ul ul { /* Dropdown menu */
	      display: none;
	      left: -1px;
	      position: absolute;
	      top: 0;
	      width: 100px;
	      z-index: 8;
	    }
			#NavigationPrimary ul #NavigationPrimaryNewsEvents ul { width: 150px; }
	      #NavigationPrimary li.over ul {
	        display: block; /* Show the dropdown on hover */
	      }
	      #NavigationPrimary li li { /* Dropdown item */
			background: 0 !important;
			border: 0;
	        float: none; /* Make dropdown items appear on top of each other, not next to */
	        height: auto;
	      }
	        #NavigationPrimary li li a { background: #787878; color: #ddd !important; display: block; height: auto; padding: 5px; width: 100%; } /* Dropdown link */
	          #NavigationPrimary li li a.over { 
	            background-color: #999; /* Same specificity as above, but later in sheet means it wins */
	            color: #fff !important;
	          }
	          #NavigationPrimary li li ul,
							#NavigationPrimary li.over li ul { /* Flyout menu */
	            display: none; /* Hide flyout */
	            left: 90%;
	            position: absolute;
	            top: 5px;
	          }
	            #NavigationPrimary li.over li.over ul {
	              display: block; /* Show flyout on hover */
	            }

#NavigationPrimary ul#Toolbar {
				background: 0; 
				float: right;
		}
	#NavigationPrimary ul#Toolbar li { 
						background: url(../images/common/toolbar-divider.gif) no-repeat 100% 3px;
						border: 0;
						float: left;
						font-size: 85%;
						height: auto;
				}
		#NavigationPrimary ul#Toolbar li.last { background: 0; }
	#NavigationPrimary ul#Toolbar a { 
						color: #fff; 
						height: auto;
						padding: 0 10px 0 7px;
				}
						
#MainBody { 
  position: relative; /* to facilitate */
  z-index: 2;         /* topnav dropdowns */
}

/* Wrap left and center channel so that we can put center channel first */
/* in markup for optimal content ordering */
#MainChannel { float: left; }

/* Left channel */
#SidebarPrimary { float: left; }

/* Center channel */
#Content { float: left; }

ul#Breadcrumbs { float: right; margin-top: 30px; }
  body.home ul#Breadcrumbs { display: none; }
  ul#Breadcrumbs li { 
			background: url(../images/common/breadcrumb-divider.gif) no-repeat 100% 6px; 
			float: left; 
			padding: 0 15px 0 7px;

		}
		ul#Breadcrumbs li.last { background: 0; }
	  ul#Breadcrumbs li a { color: #fff; float: left; text-decoration: none; }
ul#PageTools { float: right; }
  ul#PageTools li { float: left; }
  
/* Right Channel */
#SidebarSecondary { float: right; }

/* If there's only a right channel */
#Sidebar { float: right; }

#Footer {
	border-top: 1px solid #999;
	color: #a0a0a0;
	padding: 9px;
	font-size: 85%;
}
	#Footer a { color: #a0a0a0; text-decoration: none; }
		#Footer a:hover { text-decoration: underline; }
  #Footer p.copy { float: left; }
  #Footer ul.siteLinks { float: right; }
    #Footer ul.siteLinks li { background: url(../images/common/footer-divider.gif) no-repeat 100% 4px; float: left; padding: 0 10px 0 7px; }
	#Footer ul.siteLinks li.last { background: 0; padding-right: 5px; }
	#Footer .vcard { float: left; }
		#Footer .vcard p.note { display: none; }

/* Utility Classes */
.selfClear:after { /* Make elements self-clearing - see http://positioniseverything.net/easyclearing.html */
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* Setup some defaults, site-wide */
h1 { color: #00598d; font-size: 182%; font-weight: bold; padding-bottom: 4px; }
h2 { color: #666; font-size: 153.9%; margin-top: 8px; padding-bottom: 4px; }
h3 { color: #000; font-size: 116%; font-weight: bold; padding-bottom: 15px;}
h4 { color: #000; font-size: 108%; font-weight: bold; }
p { line-height: 1.4em; margin-bottom: 20px; font-size: 93%; }
	body.home #Content p { color: #8a8a8a; }
#Content { color: #000; margin-left: 20px; }
	body.home #Content { margin: 0; }
	
#Mast { 
		background: url(../images/masts/mast.jpg) no-repeat 0 0;
		height: 90px;
		margin-bottom: 15px;
		position: relative; 
		width: 980px;
	}
	body.home #Mast { background: #00517b; height: 317px; margin-bottom: 10px; }
	
	#Mast h1 { color: #fff; position: relative; top: 35%; left: 20px; }
		body.home #Mast h1 { position: absolute; text-indent: -32000em; }
		body.home #Mast h2 { color: #fff; font-size: 116%; font-weight: bold; left: 750px; position: absolute; top: 5%; }
		body.home #Mast p { color: #fff; left: 750px; line-height: 1.6em; margin-right: 20px; position: absolute; top: 25%; }

#Content a { color: #1d86bb; text-decoration: underline; }

#Content ul { margin-bottom: 20px; }
#Content ul ul { margin-bottom: 0; }

/* The standard li treatment for lists in the content */
/* We don't style the li site-wide because we also use it in a utility capacity */
#Content li {
	line-height: 1.4em;
	list-style-type: square;
	margin-left: 30px;
	padding-bottom: 5px;
}

#Content ul.tableOfContent li { float: left; list-style-type: none; margin-left: 0; width: 24%; }

body.eventinabox #Content p { margin-bottom: 10px; }
body.eventinabox #Content a.download {
	display: inline-block !important;
	line-height: 16px !important;
	margin-left: 5px;
	padding-left: 22px;
}
body.eventinabox #Content a.pdf { background: url(../images/Eventinabox/pdf-icon.png) no-repeat 0 0; text-transform: uppercase; }
body.eventinabox #Content a.ppt { background: url(../images/Eventinabox/presentation-icon.gif) no-repeat 0 0; text-transform: uppercase; }
body.eventinabox #Content a.video { background: url(../images/Eventinabox/video-icon.png) no-repeat 0 0; }

body.home #Content ul.promoTiles { margin-bottom: 5px; }
body.home #Content ul.promoTiles li {
	float: left;
	list-style-type: none;
	margin: 0 10px 0 0;
}
	body.home #Content ul.promoTiles li.last { margin-right: 0; }

body.home .newsticker {
	background: url(../images/home/headlines-bg.gif) repeat-x 0 0;
	height: 35px;
	margin-bottom: 10px;
}
	body.home .newsticker span {
		color: #fff;
		display: block;
		float: left; 
		padding: 10px 12px 0 12px;
	}

body.home .newsticker .socialMediaButtons { float: right; }
body.home .newsticker a.socialMedia
{
	display: block;
	height: 32px;
	float: left;
	margin-top: 2px;
	padding: 0 2px 0 0;
	text-indent: -32000em;
	width: 32px;
}

body.home .newsticker a.rssButton { background: url(../images/home/rss-button.png) no-repeat 0 0; }
body.home .newsticker a.blogButton { background: url(../images/home/blog-button.png) no-repeat 0 0; }
body.home .newsticker a.facebookButton { background: url(../images/home/facebook-button.png) no-repeat 0 0; }
body.home .newsticker a.msPartnerButton { background: url(../images/home/partner-network-button.png) no-repeat 0 0; }
body.home .newsticker a.twitterButton { background: url(../images/home/twitter-button.png) no-repeat 0 0; }
body.home .newsticker a.youTubeButton { background: url(../images/home/youtube-button.png) no-repeat 0 0; }

#Content ul#Headlines {
  background: #434343;
  float: left; 
  height: 27px;
  margin: 4px 0 0 0;
  padding: 0;
  width: 640px;
}
  #Content ul#Headlines li {
	list-style-type: none;
	margin-left: 10px;
	padding: 4px 0 0 0;
}
  ul#Headlines a {
    color: #fff;
    display: block;
    font-weight: bold;
    text-decoration: none;
  }
    ul#Headlines a:hover { color: #ddd; }


/* Styles for the FAQ page */
#Content dl.faq { margin-bottom: 30px; }
#Content dl.faq dt { color: #003366; font-size: 13px; font-weight: bold; padding: 0; margin: 12px 0 8px 0; }
#Content dl.faq dd { line-height: 18px; margin: 8px 0 12px 0; padding: 0; }

#Content .whitepapers th, #Content .mediaArchive th, #Content .archive th { color: #003366; font-size: 12px; font-weight: bold; padding-bottom: 7px; }
#Content .whitepapers td, #Content .mediaArchive td, #Content .archive td { font-size: 12px; margin-bottom: 10px; padding: 0 5px 10px 0; vertical-align: top; }

#Content .sapphireEvent { margin-bottom: 20px; width: 100%; }
#Content .sapphireEvent th {
	background: url(../images/common/agenda-header-bg.png) repeat-x;
	border: 1px solid #fff;
	color:#003366;
	font-weight: bold;
	padding: 7px;
	text-align: center;
	vertical-align: middle; 
	white-space: nowrap;
}
#Content .sapphireEvent .odd td  { background: #d0d8e8; vertical-align: middle; }
#Content .sapphireEvent td  { background: #e9edf4; border: 1px solid #fff; padding: 5px 10px;  }
#Content .sapphireEvent td.code { padding: 0; text-align: center; width: 10%; }
#Content .sapphireEvent td.location { width: 35%; }
#Content .sapphireEvent td .title { font-weight: bold; }

#Content .tutorial { float: left; margin-bottom: 20px; width: 225px; }
#Content .tutorial img { margin-bottom: 5px; }
#Content .tutorial a.playDemo { background: url(../images/common/play.gif) 0px 3px no-repeat; padding: 5px 0 0 20px; text-decoration: none;}
#Content .tutorial a.playDemo:hover { text-decoration: underline; }

#Content a.pdf { 
		background: url(../images/icons/pdf.png) no-repeat 0 0;
		display: block;
		line-height: 16px;
		padding-left: 25px; 
	}
#Content .quoteBox {
		float: left;
		margin: 0 15px 5px 0;
		padding: 3px;
		width: 257px;
}
#Content .quoteBox .content {
		background: url(../images/common/quote-box-bg.png) no-repeat 50% 50%;
		border: 3px solid #5495ac;
	}
	#Content .quoteBox q { 
				color: #fff; 
				display: block;
				font-size: 116%; 
				font-weight: bold; 
				line-height: 24px;
				padding: 15px 15px 0 15px;
		}
	#Content .quoteBox cite { 
				color: #fff; 
				display: block;
				font-size: 86%; 
				line-height: 16px;
				padding: 15px;
		}

.more { background: url(../images/common/more.gif) no-repeat 100% 5px; padding-right: 8px; }

#Content .twoCol .leftCol, #Content .twoCol .rightCol { float: left; width: 49%; }

/* Hide the spam detect field from regular users. */
form div.sdField { display:none; }

#newsletterSignUp { 
	background: #EEEEEE;
	border: 1px solid #000; 
	padding: 15px; 	
	width: 410px; 
}
    #newsletterSignUp label {
		display: block; 
		float: left;
		margin: 0 10px 10px 0; 
		text-align: right; 
		width: 100px; 
	}
#unsubscribe {
	background: #EEEEEE;
	border: 1px solid #000; 
	padding: 15px; 	
	width: 300px; 
}
    #unsubscribe label { margin-right: 5px; }
#requestContact { 
        background: #EEEEEE;
	border: 1px solid #000; 
	padding: 15px; 
	width: 80%; 
}
  #requestContact .field { margin-bottom: 5px; }
  #requestContact label { 
     display: block;
     float: left;
     margin: 0 10px 10px 0; 
     text-align: right;
      width: 150px; 
   }
     #requestContact #contactVia label, #requestContact #contactBy label, #requestContact #share label, #requestContact #PartnerProgram label { display: inline; margin-left: 5px; width: auto; float: none; }    
     
#submit { background: #F6BF03; float: right; }	
	
#NextSteps { margin-bottom: 20px; width: 222px; }
	#NextSteps .header { 
				background: url(../images/common/next-steps-bg.png) no-repeat 0 0;
		}
		#NextSteps .header .content { padding: 18px 20px 0 20px; }
			#NextSteps .header h3 {
						color: #fff;
						padding-bottom: 5px;
				}
	#NextSteps .channel {
				background: url(../images/common/next-steps-bg.png) no-repeat 0 -15px;
		}
		#NextSteps .channel .content { padding: 0 20px; }
		#NextSteps .channel li { border-bottom: 1px solid #fae086; font-size: 93%; }
			#NextSteps .channel li.last { border: 0; }

		#NextSteps .channel li a { 
							color: #fff; 
							display: block;
							font-weight: bold;
							padding: 6px 0 6px 23px; 
							text-decoration: none;
					}
			#NextSteps .channel li a.pdf { background: url(../images/common/pdf.gif) no-repeat 0 4px; }
			#NextSteps .channel li a.demoIcon { background: url(../images/common/demo.gif) no-repeat 0 4px; }
			#NextSteps .channel li a.faq { background: url(../images/common/faq.gif) no-repeat 0 4px; }
			#NextSteps .channel li a.contact { background: url(../images/common/contact.gif) no-repeat 0 4px; }
	#NextSteps .footer {
				background: url(../images/common/next-steps-bg.png) no-repeat 0 100%;
				min-height: 15px;
		}

#Sidebar .contentBlock { margin-bottom: 20px; width: 222px; }
	#Sidebar .contentBlock h3 { 
					border-bottom: 1px solid #000;
					margin-bottom: 13px;
					padding: 0 0 5px 7px;
			}
	#Sidebar .contentBlock li { margin: 0 10px; padding-bottom: 15px; }
	#Sidebar .contentBlock a { color: #00558a; text-decoration: none; }

/*
	TODO Standard Box Styles
*/
.highlightBox { }
.featureBox { }

/* 
	Image Block
	
	Image on left, content on right

	<div class="imageBlock selfClear">
		<h3>Content Title</h3>
		<p class="image"><a href="/images/larger-version.png" rel="prettyPhoto"><img src="/images/smaller-version.jpg" width="186" height="130" alt="alt text" /></a></p>
		<p>Info about the image</p>
	</div>
*/
.imageBlock { }
	.imageBlock p { float: right; }
		.imageBlock p.image { float: left; margin: 0 10px 15px 0 !important; width: auto; }

/* Image Block layout Properties - custom for each site/implementation */
.imageBlock p { margin-bottom: 3px !important; width: 400px; }
.imageBlock h3 { padding-bottom: 3px; }
.imageBlock a { text-decoration: none !important; }
.imageBlock a.demoButton { 
		background: url(../images/demo/view-demo.png) no-repeat 0 0; display: block; height: 30px; width: 125px; text-indent: -32000em; }


/*
	Standard Document Lists

	<ul class="documents">
		<li><a href="#" class="pdf">PDF Document</a></li>
	</ul>
*/
#Content ul.documents { }
	#Content ul.documents li { background: 0 !important; padding-left: 0; }
		#Content ul.documents li a {
					display: block;
					font-weight: bold;
					font-size: 93%;
					padding-left: 24px;
					line-height: 16px;			
		}
			#Content ul.documents li a.pdf {
					background: url(../images/icons/pdf.png) no-repeat 0 0;
			}
			#Content ul.documents li a.video {
					background: url(../images/icons/video.png) no-repeat 0 0;
			}

/*
	Layout horizontal buttons

	<ul class="buttons">
		<li><a href="#" class="button sampleButton"><span><em>Button 1</em></span></a></li>
		<li><a href="#" class="button sampleButton"><span><em>Button 2</em></span></a></li>
		<li><a href="#" class="button sampleButton"><span><em>Button 3</em></span></a></li>
	</ul>
*/
ul.buttons { margin-bottom: 8px; }
	ul.buttons li {
		background: 0 !important;
		float: left;
		margin: 0 10px 0 0 !important;
		padding: 0 !important;
	}

/* 
	Standard Button Display
	
	<p class="selfClear"><a href="#" class="button sampleButton"><span><em>Sample Button</em></span></a></p>
*/
a.button {
	display: block;
	float: left; /* Collapse around text */
	text-decoration: none;
}
	a.button:hover { text-decoration: none; }
	a.button span {	display: block;	float: left; }
		a.button em {	display: block; float: left; }

/* Custom display properties for a button on the site - updated for each site */
a.sampleButton {
	background: url(../images/common/sample-button-bg.png) no-repeat 100% 100%; 
	height: 41px; /* height of button image */
	padding-right: 10px; /* right padding for image edge */
}
	a.sampleButton span {
		background: url(../images/common/sample-button-bg.png) no-repeat 0 0;
		color: #fff;
		font-size: 116%;
		padding-left: 10px; /* balance out right padding */
	}
		a.sampleButton:hover span { color: #fc0; }
		a.sampleButton em {
			line-height: 41px; /* Provides vertical centering */
			/* Add styles here if image has an icon on it, left or right of text */
		}

/*
	TODO More links
*/
a.more { }

/*
	TODO Button Style
*/
a.button { }
	a.buttonLarge { }
	a.button span { }
		a.button span em { }

/*
	Same height columns

<div class="columnWrapper">
	<ul class="columns twoUp">
		<li class="column"></li>
		<li class="column"></li>
	</ul>
</div>
*/
div.columnWrapper {
	position: relative; /* relative position on display table element causes problems */
}
	ul.columns {
		display: table;
		margin: 0 !important;  /* Override any values set for */
		padding: 0 !important; /* lists in the content area */
	}
		ul.columns li.column {
			display: table-cell;
			vertical-align: top;
			background: none !important; /* Override any values */
			margin: 0 !important;        /* set for lists in */
			padding: 0 !important;       /* the content area */
		}
			ul.twoUp li.column { width: 50%; }
			ul.threeUp li.column { width: 33%; }

ul.sampleColumns { }
	ul.sampleColumns li { border-right: 1px solid #333; width: 275px; }
		ul.sampleColumns li.last { border-right: 0; }
		ul.sampleColumns div.content { padding: 8px 16px 12px; }
		ul.sampleColumns p.more {
			bottom: 2px;
			margin-bottom: 0;
			position: absolute;
			text-align: right;
			width: 243px;
		}

/* Standard Grid display */
/* From: http://www.hedgerwow.com/360/dhtml/css-inline-block-layout.php */
ul.grid { }
	ul.grid li {
		display:-moz-inline-stack !important;/* Firefox 2 and under to simulate display:inline-block */
		display: inline-block !important;
		padding: 0 !important;
		vertical-align: text-top;
	}

/* Set layout properties for specific grid implementations. The standard ul.grid
	selector should remain unchanged from project to project.
	
	<ul class="grid sampleGrid">
	
	Though you should use something more descriptive than just "sampleGrid"
 */
ul.sampleGrid li {
		background: 0 !important;
		margin: 0 10px 0 5px; /* Set as appropriate */
		padding-bottom: 10px !important;
		width: 250px; /* Set as appropriate */	
}

/* Need vertical centering solution that works for both one and two lines of text.
   See: http://www.ilikespam.com/blog/centering-multiple-line-content-with-css */
div.vertBox .channel { display: table; }
	div.vertBox .channel .content {	display: table-cell; vertical-align: middle; }

/* Set layout properties for specific vertical positioning implementations.
	The standard selector should remain unchanged from project to project.
	
	<div class="vertBox sampleVertBox">
		<a href="#" class="channel">
			<span class="content">lorem</span>
		</a>
	</div>
*/
div.sampleVertBox .channel {
	border: 1px solid #333;
	height: 39px; /* Set as appropriate */
}
	div.sampleVertBox .content {
		font-size: 93%; /* Set as appropriate  */
		line-height: 1.2em; /* Set as appropriate */
		padding: 0 6px;
		text-align: center;
		width: 88px; /* Set as appropriate */		
	}

/* ThickBox plugin CSS */
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
*{padding: 0; margin: 0;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
  font: 12px Arial, Helvetica, sans-serif;
  color: #333333;
}
#TB_secondLine {
  font: 10px Arial, Helvetica, sans-serif;
  color:#666666;
}
#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
  position: fixed;
  z-index:100;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
}
.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
  background-color:#000;
  filter:alpha(opacity=75);
  -moz-opacity: 0.75;
  opacity: 0.75;
}
* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_window {
  position: fixed;
  background: #ffffff;
  z-index: 102;
  color:#000000;
  display:none;
  border: 4px solid #525252;
  text-align:left;
  top:50%;
  left:50%;
}
* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_window img#TB_Image {
  display:block;
  margin: 15px 0 0 15px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
}
#TB_caption{
  height:25px;
  padding:7px 30px 10px 25px;
  float:left;
}
#TB_closeWindow{
  height:25px;
  padding:11px 25px 10px 0;
  float:right;
}
#TB_closeAjaxWindow{
  padding:7px 10px 5px 0;
  margin-bottom:1px;
  text-align:right;
  float:right;
}
#TB_ajaxWindowTitle{
  float:left;
  padding:7px 0 5px 10px;
  margin-bottom:1px;
}
#TB_title{
  background-color:#e8e8e8;
  height:27px;
}
#TB_ajaxContent{
  clear:both;
  padding:2px 15px 15px 15px;
  overflow:auto;
  text-align:left;
  line-height:1.4em;
}
#TB_ajaxContent.TB_modal{
  padding:15px;
}
#TB_ajaxContent p{
  padding:5px 0px 5px 0px;
}
#TB_load{
  position: fixed;
  display:none;
  height:13px;
  width:208px;
  z-index:103;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}
* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_HideSelect{
  z-index:99;
  position:fixed;
  top: 0;
  left: 0;
  background-color:#fff;
  border:none;
  filter:alpha(opacity=0);
  -moz-opacity: 0;
  opacity: 0;
  height:100%;
  width:100%;
}
* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_iframeContent{
  clear:both;
  border:none;
  margin-bottom:-1px;
  margin-top:1px;
  _margin-bottom:1px;
}
/* End styles for the ThickBox jQuery plugin (which is used for the popup images */