/* Document handling
-----------------------------------------------------------------------------*/

body {
	background: url(../_img/bg.gif) repeat-y center;
}
img { border: 0; }


/* Container
-----------------------------------------------------------------------------*/

.container { display: block; background: #ccc url(../_img/background.jpg) repeat-x top center fixed; }
.main { display: block; width: 980px; margin: 0 auto; }
.contentHome { width: 980px; background: #fff; }


/* Header
-----------------------------------------------------------------------------*/

.header { margin: 0; }
	
.headertop { background: #000; height: 40px; }
	
.shortcut { padding: 10px 20px 0px; }

.searchBar {
	background: url(../_img/search-bar.gif) no-repeat;
	width: 220px;
	height: 20px;
	display: block;
	float: right;
	margin: 10px 10px 0px 0px;
}

#flashcontent, .flashcontent { background: #e5e5e5; width: 980px; height: 300px; }
		

/* Navigation and drop down menu
-----------------------------------------------------------------------------*/

.headerPink {
	display: block;
	height: 12px;
	background: url(../_img/header-pink.gif) top center no-repeat #f064a5;
}

.navigation { height: 65px; margin: 0; }

#nav {
	padding: 0;
	margin: 0;
	list-style: none;
	height: 44px;
	background: #000;
	position: relative;
	z-index: 400;
	font-family: arial, verdana, sans-serif;
}

#nav {padding:0; margin:0; list-style:none; height:44px; background:#000; position:relative; z-index:500; font-family:arial, verdana, sans-serif;}
#nav li.top {padding:0; margin:0; display:block; float:left; height:44px;}
#nav li a.top_link {display:block; float:left; height:44px; line-height:44px; color:#fff; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 0px; cursor:pointer; background:#000;}
#nav li a.top_link span {float:left; display:block; padding:0 35px 0 36px; height:44px; background: #000 url(../_img/nav_seperator.gif) top right no-repeat;}
#nav li a.top_link span.down {float:left; display:block; padding:0 35px 0 35px; height:44px; background: #000 url(../_img/nav_seperator.gif) top right no-repeat;}

#nav li:hover a.top_link {color:#f064a5; background:#292929;}
#nav li:hover a.top_link span {background:#292929 url(../_img/nav_seperator.gif) top right no-repeat;}
#nav li:hover a.top_link span.down {background:#292929 url(../_img/nav_seperator.gif) top right no-repeat;}

#nav li.last a.top_link span, 
#nav li.last a.top_link span.down, 
#nav li.last:hover a.top_link span, 
#nav li.last:hover a.top_link span.down,  
#nav li a.top_link.current,
#nav li a.top_link.current span, 
#nav li a.top_link.current span.down, 
#nav li.last a.top_link.current,
#nav li.last a.top_link.current span, 
#nav li.last a.top_link.current span.down {background-image: none;}

#nav li a.top_link.current,
#nav li a.top_link.current span, 
#nav li a.top_link.current span.down {color:#f064a5; background:#292929 url(../_img/nav_seperator.gif) top right no-repeat;}


	/* drop down menu list styling
	-----------------------------------------------------------------------------*/
	
	#nav li:hover {position:relative; z-index:200;}
	
	#nav li:hover ul.sub
	{left:0px; top:44px; background: #292929; padding: 3px; border:1px solid #292929; white-space:nowrap; width:243px; height:auto; z-index:300;}
	#nav li:hover ul.sub li
	{display:block; height:20px; position:relative; float:left; width:243px; font-weight:normal;}
	#nav li:hover ul.sub li a
	{display:block; font-size:11px; height:18px; width:241px; line-height:18px; text-indent:5px; color:#fff; text-decoration:none;border:1px solid #292929;}
	#nav li:hover ul.sub li a:hover 
	{background:#f064a5; color:#000; border-color:#f064a5;}
	
	#nav li:hover li:hover ul,
	#nav li:hover li:hover li:hover ul,
	#nav li:hover li:hover li:hover li:hover ul,
	#nav li:hover li:hover li:hover li:hover li:hover ul
	{left:243px; top:-8px; background: #292929; padding: 3px; border:1px solid #292929; white-space:nowrap; width:243px; z-index:400; height:auto;}
	
	#nav ul, 
	#nav li:hover ul ul,
	#nav li:hover li:hover ul ul,
	#nav li:hover li:hover li:hover ul ul,
	#nav li:hover li:hover li:hover li:hover ul ul
	{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
	
	/* Set sub width individually */
	#nav li:hover.menu01 ul.sub { width: 96px; } #nav li:hover.menu01 ul.sub li a { width: 94px; }
	#nav li:hover.menu02 ul.sub { width: 260px; } #nav li:hover.menu02 ul.sub li a { width: 258px; }
	#nav li:hover.menu03 ul.sub { width: 154px; } #nav li:hover.menu03 ul.sub li a { width: 152px; }
	#nav li:hover.menu04 ul.sub { width: 150px; } #nav li:hover.menu04 ul.sub li a { width: 148px; }
	#nav li:hover.menu05 ul.sub { width: 136px; } #nav li:hover.menu05 ul.sub li a { width: 134px; }
	#nav li:hover.menu06 ul.sub { width: 150px; } #nav li:hover.menu06 ul.sub li a { width: 148px; }
	#nav li:hover.menu07 ul.sub { width: 122px; } #nav li:hover.menu07 ul.sub li a { width: 120px; }


/* Hyperlink styling
-----------------------------------------------------------------------------*/

a.hyperlinkSpanStyling { text-decoration: none; font-weight: bold; }
a.hyperlinkSpanStyling:hover { text-decoration: none; }
a.hyperlinkSpanStyling:hover span { text-decoration: underline; }


/* Left column content
-----------------------------------------------------------------------------*/

#LeftColumn { float: left; width: 600px; padding: 0px 0px 30px 30px; }
#LeftColumn .LeftColumnInner {}

#LeftColumn h1 { font-size: 1.667em; color: #f064a5; margin: 0 0 0.75em; padding: 8px 8px 9px; background: url(../_img/titleFrame.gif) bottom no-repeat; }
#LeftColumn h2 { font-size: 1.417em; color: #666; margin: 1em 0 0.75em; padding: 0px 0px 5px; border-bottom: 1px solid #666; }
#LeftColumn h3 { font-size: 1.25em; color: #f064a5; margin: 1em 0 0.75em; }
#LeftColumn h4 { font-size: 1.25em; color: #333; margin: 1em 0 0.75em; }
#LeftColumn h5 { font-size: 1.167em; color: #333; margin: 1em 0 0.75em; }
#LeftColumn h6 { font-size: 1.083em; color: #333; margin: 1em 0 0.75em; }

#LeftColumn p { text-align: justify; }


/* Right column content
-----------------------------------------------------------------------------*/

#RightColumn { float: right; width: 280px; padding: 0 30px 30px 0; }
#RightColumn .RightColumnInner {}

#RightColumn h1, #RightColumn h2 { font-size: 1.667em; font-weight: normal; margin: 0.5em 0 0.75em; padding: 6px 0px 6px; border-bottom: 4px solid #ff99cc; }
#RightColumn h3 { font-size: 1.25em; font-weight: bold; margin: 0.25em 0 0.25em; padding: 6px 0px 6px; border: 0; }
	
	#RightColumn h1.first, #RightColumn h2.first { margin-top: 0; }
	
	
	/* Services provided
	-----------------------------------------------------------------------------*/
	
	.navi_services_tele, .navi_services_hiv, .navi_services_makss {
		margin: 0 0 5px;
		height: 60px;
		width: 280px;
		display: block;
		overflow: hidden;
		cursor: pointer;
		* cursor: hand;
	}
	
	.navi_services_tele { background: url(../_img/btn_services_tele.jpg) 0 0 no-repeat; }
	.navi_services_hiv { background: url(../_img/btn_services_hiv.jpg) 0 0 no-repeat; }
	.navi_services_makss { background: url(../_img/btn_services_makss.jpg) 0 0 no-repeat; }
	
	.navi_services_tele:hover, .navi_services_tele.current { background-position: 0 -60px; }
	.navi_services_hiv:hover, .navi_services_hiv.current { background-position: 0 -60px; }
	.navi_services_makss:hover, .navi_services_makss.current { background-position: 0 -60px; }
	
	.div_services_tele, .div_services_hiv, .div_services_makss {
		display: block;
		height: 180px;
		margin-bottom: -25px;
	}
	
	.div_services_tele { background: url(../_img/services_provided_telephone_counselling.gif) 0 0 no-repeat; }
	.div_services_hiv { background: url(../_img/services_provided_anonymous_hiv_screening.gif) 0 0 no-repeat; }
	.div_services_makss { background: url(../_img/services_provided_makss.gif) 0 0 no-repeat; }
	
	.div_services_inner {
		display: block;
		padding: 20px 260px 0 10px;
	}
	
	
.subPage {
	margin: 0 0 0.75em;
	background: #eee;
}

	.subPage h1 { font-size: 1.25em !important; font-weight: bold !important; margin: 0.25em 0 0.25em !important; padding: 10px 0 0 20px !important; border: 0 !important; }
	
	.subPage ul { margin: 0; padding: 5px 0 10px; }
	
	.subPage ul li {
		display: block; 
		margin: 0;    
		line-height: 1.25em;  
		list-style: none;
	}
	
	.subPage ul li a {
		display: block; 
		padding: 0.25em 0 0.25em 30px;
		background: url(../_img/point-gfx.gif) 22px 5px no-repeat; 
		font-weight: bold; 
		text-decoration: none;
	}
		
	.subPage ul li a:hover {
		background: url(../_img/point-gfx.gif) 22px 5px no-repeat #faa0ca; 
		color: #fff; 
		text-decoration: none;
	}
	
	.subPage ul li a.current {
		background: url(../_img/point-gfx.gif) 22px 5px no-repeat #f064a5; 
		color: #fff; 
		text-decoration: none;
	}


/* Table style
-----------------------------------------------------------------------------*/

.tableColumn { margin: 0 0 1em; }
.tableColumn h1 { margin-top: 0 !important; margin-bottom: 0 !important; }
.tableColumn thead th { padding: 0; text-align: left; }
.tableColumn tbody td { padding: 1em 0 0; }
.tableColumn tbody td table td { padding-top: 0; }

.tableForm { margin: 0 0 1em; }
.tableForm p { margin: 0 0 0.25em; }
.tableForm thead th { }
.tableForm tbody td { padding: 0.25em 0 0.25em; }
.tableForm tbody td.label { padding: 0.5em 0 0.25em; }
.tableForm tbody td table td { padding-top: 0; }

table.tableMedia { margin: 0 0 20px; }
table.tableMedia td.photoG { background: url(../_img/Photo_48.png) no-repeat; width: 290px; height: 50px; }
table.tableMedia td.videoG { background: url(../_img/video_48.png) no-repeat; width: 290px; height: 50px; }
table.tableMedia td.photoG, 
table.tableMedia td.videoG { font-size: 1.5em; font-weight: normal; margin: 0.25em 0 0.25em; padding: 0 0 0 50px; border: 0; }

table.tableHighlightsListing { margin: 0; }
table.tableHighlightsListing h3 { margin: 5px 0 5px !important; padding: 0 !important; }

table.tableContactInfo { margin: 0 0 5px; }
table.tableContactInfo thead th, 
table.tableContactInfo th { background: #ccc; text-align: left; font-weight: bold; }
table.tableContactInfo thead th, 
table.tableContactInfo th, 
table.tableContactInfo td { padding: 9px; border: 1px solid #ccc; }
table.tableContactInfo td p { margin: 0 0 0.25em; }
table.tableContactInfo td table td { border: 0; padding: 0 0 5px; }

table.tableHomeHighlights, table.tableHomeHighlights td { text-align: left; }
table.tableHomeHighlights p { text-align: left !important; }


/* Database Table
-----------------------------------------------------------------------------*/

.datatable 
{	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-align: center; }
	
.datatable td 
{	padding: 1px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #FFFFFF;
	border-right-color: #FFFFFF;
	background-color: #ffccff; }
.datatable .colorgrey 
{	background-color: #CCCCCC; }
.datatable .colorgrey2 
{	background-color: #999999;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 12px; }
.datatable .colorgrey3 
{	background-color: #DCDCDC; }
.datatable .colorpink 
{	color: #FFFFFF;
	background-color: #f064a5;
	font-weight: bold; }
.datatable .colorpink2 
{	background-color: #ff99ff; }
.datatable .colorwhite 
{	background-color: #FFFFFF; }
.datatable strong 
{	font-size: 12px;
	font-weight: bold; }


/* Buttons and buttons links
-----------------------------------------------------------------------------*/

.btn_submit, .btn_send, 
.btn_syphilis {
	height: 25px;
	display: block;
	border: 0;
	overflow: hidden;
	cursor: pointer;
	* cursor: hand;
}

.btn_submit { width: 117px; background: url(../_img/btn_submit.jpg) 0 0 no-repeat; }
.btn_send { width: 70px; background: url(../_img/btn_send.jpg) 0 0 no-repeat; }
.btn_syphilis { width: 70px; background: url(../_img/btn_send.jpg) 0 0 no-repeat; }

.btn_submit:hover, .btn_submit.current { background-position: 0 -25px; }
.btn_send:hover, .btn_send.current { background-position: 0 -25px; }

.navi_submit, .navi_send {
	height: 25px;
	width: 100%;
	display: block;
	overflow: hidden;
	cursor: pointer;
	* cursor: hand;
}
.navi_submit { background: url(../_img/btn_submit.jpg) 0 0 no-repeat; }
.navi_send { background: url(../_img/btn_send.jpg) 0 0 no-repeat; }
.navi_submit:hover, .navi_submit.current { background-position: 0 -25px; }
.navi_send:hover, .navi_send.current { background-position: 0 -25px; }


.navi_donate, 
.navi_signup, 
.btn_syphilis, 
.btn_download_PT_Foundation_Research_Application {
	margin: 10px 0;
	height: 32px;
	display: block;
	overflow: hidden;
	cursor: pointer;
	* cursor: hand;
}
.navi_donate { width: 150px; background: url(../_img/btn_donate.jpg) 0 0 no-repeat; }
.navi_signup { width: 150px; background: url(../_img/btn_signup.jpg) 0 0 no-repeat; }
.btn_syphilis { width: 90px; background: url(../_img/btn_syphilis.jpg) 0 0 no-repeat; }
.btn_download_PT_Foundation_Research_Application { width: 380px; background: url(../_img/btn_download_PT_Foundation_Research_Application.jpg) 0 0 no-repeat; }

.navi_signup:hover, .navi_signup.current, 
.navi_donate:hover, .navi_donate.current, 
.btn_syphilis:hover, .btn_syphilis.current, 
.btn_download_PT_Foundation_Research_Application:hover, .btn_download_PT_Foundation_Research_Application.current { background-position: 0 -32px; }


/* Photo Gallery and Video Gallery
-----------------------------------------------------------------------------*/

.photoList, .videoList { margin-bottom: 10px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; }
.photoList ul, .videoList ul { margin-top: 5px; margin-bottom: 5px; background: none; }
.photoList ul li, .videoList ul li { margin-top: 2px; margin-bottom: 2px; }

#videoDisplay, .videoDisplay {
	display: block;
	margin: 0 0 10px;
	padding: 10px;
	height: 320px;
	background: #000;
	text-align: center;
}

	.photoContent, .videoContent {
		display: block;
		margin: 0 0 20px;
		padding: 9px 14px;
		background: #eee;
		border: 1px solid #ccc;
	}


/* Maps
-----------------------------------------------------------------------------*/
.more {	display: none;
		border-top: 0px solid #f064a5;
		border-bottom: 0px solid #f064a5; }
		
a.hideLink, a.showLink { text-decoration: none; }
a.hideLink:hover, a.showLink:hover { color: #cc0066; text-decoration:underline; }


/* Footer
-----------------------------------------------------------------------------*/

.footerBg {
	background: #000;
	border-top: 4px solid #ff99cc;
	width: 980px;
}

.footerBgInner { margin: 0px 20px 0px; }

.footer { padding-top: 20px; padding-bottom: 50px; }

.footerLink {
	color: #999;
	margin: 0px 0px 10px;
	padding: 0px 0px 10px;
	border-bottom: 1px solid #333;
}
.footerLink.last { border-bottom: none; }

.footerLink a, .shortcut a { color:#999999; text-decoration: none; }
.footerLink a:hover, .shortcut a:hover { color: #FFFFFF; text-decoration: underline; }
.footerLink a.current, .shortcut a.current { color: #FFFFFF; text-decoration: none; }

.copyright { margin-top: 2px; }


/* List
-----------------------------------------------------------------------------*/

.contactInfoLink {
	display: block;
	position: absolute;
	margin: 0 350px 10px;
	width: 250px;
}

ul { margin: 0.5em 0 1em; padding: 10px 30px; background-color: #eee; }
ol { margin-left: 20px; margin-bottom: 1em; }
ul li { list-style-image: url(../_img/point-gfx.gif); * list-style-image: url(../_img/point-gfx-ie.gif); }
li { margin: 0 0 0.25em; }

ul li a.current { color: #cc0066; text-decoration: none; }

.photoThumbListStyle { display: block; margin-bottom: 20px; background-color: #eee; }
.photoThumbListStyle ul { margin: 0px; padding: 10px; list-style: none; background-color: none; }
.photoThumbListStyle ul li { float: left; display: block; list-style: none; margin: 5px; width: 120px; height: 90px; }


/* Buttons
-----------------------------------------------------------------------------*/

.btn_default, 
.btn_alert {
	background: center left repeat-x;
	padding: 1px 5px;
	font-weight: bold;
	color: #fff;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	cursor: pointer;
	* cursor: hand;
}
.btn_default:hover { background-position: right; color: #fff; }
.btn_alert:hover { background-position: right; color: #fff; }

.btn_default { background-image: url(../_img/btn_default.gif); border: 1px solid #f392bf; }
.btn_alert { background-image: url(../_img/btn_default.gif); border: 1px solid #f392bf; }


.btn_arrowPhotos_previous, .btn_arrowPhotos_next {
	margin: 0px 0px 0px;
	width: 30px;
	height: 50px;
	background: 0px 0px no-repeat;
	cursor: pointer;
	vertical-align: middle;
}

	.btn_arrowPhotos_previous { background-image: url(../_img/btn_arrowPhotos_previous.gif); }
	.btn_arrowPhotos_next { background-image: url(../_img/btn_arrowPhotos_next.gif); }

	.btn_arrowPhotos_previous:hover, .btn_arrowPhotos_next:hover { background-position: 0px -50px; }


/* Misc
-----------------------------------------------------------------------------*/

.requireFill { font-style: italic; color: #ff0000; }

.backtotop  {
	display: block;
	float: right;
	background: url(../_img/point-gfx1.gif) 0px 12px no-repeat;
	padding: 10px 0px 0px 15px;
}
	
.backtotop a { text-decoration: none; font-weight: bold; }
.backtotop a:hover { text-decoration: underline; }

.hide { display: none; }
.show { display: block; }

p.datetimeInfo { font-style: italic; font-size: 0.917em; }
span.datetimeInfo { font-style: italic; font-size: 0.917em; }

.HighlightsListing {
	margin: 0 0 10px;
	padding: 0 0 10px;
	border-bottom: 1px solid #eee;
}
	
	span.readmore { display: inline-block; font-style: italic; }


.greyBox { display: block; margin: 0 0 10px; padding: 10px; background: #eee; }
.greyBox img { float: left; margin: 0 10px 0 0; padding: 3px; width: 50px; height: 30px; background: #ccc; }
.greyBox a:hover { text-decoration: none; }

.greyBox2 { display: block; margin: 0 0 10px; padding: 20px; background: #e2e2e2; }
.greyBox2 ul { background-color: #e2e2e2; }


/* Color
-----------------------------------------------------------------------------*/

.colorPink { color: #f064a5; }
.colorDarkPink { color: #cc0066; }


