﻿@import "reset.css";
@import "typography.css";


body 
{
	background-color:#000;
	color:#fff;
	text-align:center;
	position:relative;
	font-family: Arial, sans-serif;
	font-size: 75%;
	/*font:75%/110% Arial, Helvetica, Tahoma, Verdana, sans-serif;*/

}
#outerWrap
{
	width:100%;
	height:580px;
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-50%;
	margin-top:-293px;
	overflow:hidden;
	
}
#innerWrap
{
	width:100%;
	height:580px;
	position:relative;
	float:left;
	margin:0px;
	padding:0px;
	
	}
	#innerWrap #header
	{
		width:985px;
		height:40px;
		line-height:0px;
		margin:0px auto;
		position:relative;}
	#innerWrap h1
	{
		width:302px;
		height:40px;
		line-height:0px;
		margin:0px auto;
		position:relative;
		}
	#innerWrap h1 a
	{
		width:302px;
		height:40px;
		position:relative;
		float:left;
		text-indent:-9999px;
		padding:0px;
		background:#000 url('../imgs/headTitle.gif') no-repeat top left;
		}
		#innerWrap span a#hide
		{
			width:90px;
			height:41px;
			position:absolute;
			top:0px;
			right:0;
			text-indent:-9999px;
			padding:0px;
			background:#000 url('../imgs/hideBtn.gif') no-repeat top left;}
			
	#insideWrap
	{
	background:url('../imgs/bg.gif') repeat-y center top;
	width:100%;
	height:490px;
	position:relative;
	float:left;
	margin:0px;
	padding:0px;
	clear:both;
	}
	
	#container
	{
		background:url('../imgs/silhouetteBg_1.gif') no-repeat center top;
		width:985px;
		height:460px;
		margin:0 auto;
		text-align:left;
		padding:30px 0 0 15px;
		
		}
	#mainContent
	{
		background:url('../imgs/contentBg1.png') no-repeat center bottom;
		width:938px;
		width:944px;
		height:370px;
		position:relative;
		float:left;
		margin:0px;
		padding:30px 15px 0 15px;
		}	
		
		#container h4
		{
			background:url('../imgs/h4Bg.gif') no-repeat center top;
			width:968px;
			height:33px;
			color:#fff;
			line-height:0;
			
		}	
		/*#container h4 img
		{
			margin: 5px;
		}*/
		h4 span.home
		{
			background:url('../imgs/findClinicTitle.gif') no-repeat left top;
			width:186px;
			height:24px;
			text-indent:-9999em;
			position:relative;
			float:left;
			margin-left:15px;
			margin-top:5px;
		}
			
/*=============================
DUAL PANELS
==============================*/	
#rightPanelContent,
#leftPanelContent
{
	width:438px;
	height:438px;
	position:relative;
	float:right;
	padding:0px;
	margin:0px;
	text-align:left;
	
	}
#leftPanelContent
{
	float:left;
	}
#rightPanelHome,
#leftPanelHome,	
#rightPanel,
#leftPanel
{
	/*width:438px;
	height:341px;*/
	width:443px;
	height:436px;
	position:relative;
	float:left;
	padding:0px;
	margin:0px;
	background:url('../imgs/panelBg3.png') no-repeat bottom left;
	text-align:left;
	}
	

	
#rightPanelHome,	
#rightPanel
{
	float:right;}
	
#rightPanelHome h4,
#leftPanelHome h4,
#rightPanel h4,
#leftPanel h4
{
	background:url('../imgs/h4LeftBg.gif') no-repeat center top;
	width:438px;
	height:33px;
	margin-bottom:10px;
	padding:0px;
	position:relative;
	float:left;
	color:#fff;
	}
	
#rightPanelHome h4,	
#rightPanel h4
{
	background:url('../imgs/h4RightBg.gif') no-repeat center top;
	
	}
	
#rightPanelHome,
#leftPanelHome
{
	background:url('../imgs/panelBg2.png') no-repeat bottom left;
	height:348px;
	}	
	
	
	
	h4 span.viralVideo,
	h4 span.whyTest,
	h4 span.sendTest,
	h4 span.findNearClinic,
	h4 span.latestNews,
	h4 span.theFacts,
	h4 span.theSympts,
	h4 span.whatToDo,
	h4 span.howToDo,
	h4 span.treat,
	h4 span.terms,
	h4 span.homeTitle
			{
			background:url('../imgs/whyTestTitle.gif') no-repeat left top;
			width:292px;
			height:27px;
			text-indent:-9999em;
			position:relative;
			float:left;
			margin-left:8px;
			margin-top:3px;
			}
	h4 span.homeTitle{
		background:url('../imgs/homeTitle.gif') no-repeat left top;
		width:427px;
		
			}		
	h4 span.viralVideo	
	{
		background:url('../imgs/haveYouTitle.gif') no-repeat left top;
		width:347px;
		height:28px;
		
			}	
	h4 span.sendTest{background:url('../imgs/sendMeTitle.gif') no-repeat left top;}
	h4 span.findNearClinic{background:url('../imgs/findNearClinicTitle.gif') no-repeat left top;}
	h4 span.latestNews{background:url('../imgs/lateNewsTitle.gif') no-repeat left top;}	
	h4 span.theFacts {background:url('../imgs/theFactsTitle.gif') no-repeat left top;}
	h4 span.theSympts{background:url('../imgs/symptmsTitle.gif') no-repeat left top;}
	h4 span.whatToDo{background:url('../imgs/whatToDoTitle.gif') no-repeat left top;}
	h4 span.howToDo{background:url('../imgs/howToDoTitle.gif') no-repeat left top;}
	h4 span.treat{background:url('../imgs/treatTitle.gif') no-repeat left top;}
	h4 span.terms{background:url('../imgs/termsTitle.gif') no-repeat left top;}
	
	
#leftPanelHome h5,
#rightPanelHome h5,	
#rightPanel h5,	
#leftPanel h5

{

	float:left;
	position:relative;
	padding-bottom:3px;
	margin:0px 0px 2px 10px;
	text-align:left;
	
	
	}
		
dl
{
	margin:10px 0 10px 10px;
	clear:both;
	}


#leftPanelHome p,
#rightPanelHome p,
#leftPanel p,
#rightPanel p
{
	width:90%;
	padding-bottom:3px;
	margin:0px 15px 7px 10px;
	text-align:left;
	float:left;
	position:relative;
	}
#leftPanelHome ul,
#rightPanelHome ul,	
#leftPanel ul,
#rightPanel ul,
#leftPanel ol,
#rightPanel ol
{
	
	margin:0 20px 6px 10px;
	padding:0px;
	float:left;
	list-style:none;
	/*margin:0 1.5em 0.6em 2.5em;
	list-style-type: disc;
	list-style-position:inside;*/
	}	
#leftPanel ul li,
#rightPanel ul li,
#rightPanelHome ul li,
#leftPanelHome ul li{
	background: url(../imgs/bullet.gif) no-repeat 2px 5px ;
	padding:0 0 0 18px;
}	
	
/*	
#leftPanel ul li,
#rightPanel ul li,
#leftPanel ol li,
#rightPanel ol li
{
	position:relative;
	float:left;
	display:inline;
	padding:1px 0px;
	margin:0px;
	list-style-type:decimal;
	}

*/
#rightPanelContent a.linkBtn,
#leftPanelContent a.linkBtn
{	width:289px;
	height:73px;
	position:relative;
	float:left;
	margin:30px 0 0 77px;
	padding:0px;
	text-align:center;
	cursor:hand;
	
	}
	#rightPanelContent a#findaClinicBtn
	{
		background:url('../imgs/findaClinicBtn.png') no-repeat left top;
		text-indent:-9999em;}
	#leftPanelContent a#sendMeBtn
	{
		background:url('../imgs/sendMeBtn.png') no-repeat left top;
		text-indent:-9999em;}	
/*===============================
FOOTER
=================================*/
		
#footerWrap
{
	background:url('../imgs/footerBg.gif') no-repeat center top;
	width:100%;
	height:40px;
	position:relative;
	float:left;
	text-align:center;
	margin:0px;
	padding:0px;
	
	}
	
	#menu
	{
		width:1000px;
		height:40px;
		margin:0 auto;
		position:relative;
		padding:0px;
			
		
		}
/*===============================
SUB NAVIGATION
=================================*/		
		ul#subNav
		{
			width:248px;
			height:14px;
			
			/*position:absolute;
            bottom:-5px;
            right:0px;
            margin:0px;
            padding:0px;*/
            
			position:relative;
			float:right;
			margin-right:0px;
			padding:0px;
			display:inline;
			z-index:100;
			}
			ul#subNav li
			{
				width:85px;
				list-style:none;
				display:inline;
				border-right:1px solid #fff;
				padding:0 5px;
				font-size:80%;
				}
				ul#subNav li.last
				{
					padding-left:0px;
					border:none;
					}
				ul#subNav li a
				{
					color:#fff;
					text-decoration:none;
					}
/*===============================
MAIN NAVIGATION
=================================*/					
	ul#nav{
		background:#000 url('../imgs/nav.gif') no-repeat;
		width:1000px;
		height:28px;
		position:relative;
		float:left;
		display:inline;
		margin:4px 0 0 0;
		padding:0px;
		
		}	
		
	ul#nav li{
		margin:0; 
		padding:0; 
		list-style:none; 
		position:absolute; 
		top:0px;
		text-indent:-9999px;
	 }
	
	ul#nav a {
		height:28px; 
		display:block;
		}
		
		
		li#home {top:0px; left: 0px; width:62px; height:28px;}
		li#send {top:0px; left: 62px; width:112px; height:28px;}
		li#clin {top:0px; left: 174px; width:149px; height:28px;}
		li#news {top:0px; left: 323px; width:99px; height:28px;}
		li#fact{top:0px; left: 422px; width:77px; height:28px;}
        li#symp{top:0px; left: 499px; width:103px; height:28px;}
        li#what{top:0px; left: 602px; width:161px; height:28px;}
        li#test{top:0px; left: 763px; width:145px; height:28px;}
        li#treat{top:0px; left: 908px; width:92px; height:28px;}
      
        li#home a:hover {background: transparent url('../imgs/nav.gif') 0 -28px no-repeat;}
		li#send a:hover {background: transparent url('../imgs/nav.gif') -62px -28px no-repeat;}
		li#clin a:hover {background: transparent url('../imgs/nav.gif') -174px -28px no-repeat;}
		li#news a:hover {background: transparent url('../imgs/nav.gif') -323px -28px no-repeat;}
		li#fact a:hover{background: transparent url('../imgs/nav.gif') -422px -28px no-repeat;}
        li#symp a:hover{background: transparent url('../imgs/nav.gif') -499px -28px no-repeat;}
        li#what a:hover{background: transparent url('../imgs/nav.gif') -602px -28px no-repeat;}
        li#test a:hover{background: transparent url('../imgs/nav.gif') -763px -28px no-repeat;}
        li#treat a:hover {background: transparent url('../imgs/nav.gif') -908px -28px no-repeat;}
        
        li#home .active {background: transparent url('../imgs/nav.gif') 0 -28px no-repeat;}
		li#send .active {background: transparent url('../imgs/nav.gif') -62px -28px no-repeat;}
		li#clin .active {background: transparent url('../imgs/nav.gif') -174px -28px no-repeat;}
		li#news .active {background: transparent url('../imgs/nav.gif') -323px -28px no-repeat;}
		li#fact .active{background: transparent url('../imgs/nav.gif') -422px -28px no-repeat;}
        li#symp .active{background: transparent url('../imgs/nav.gif') -499px -28px no-repeat;}
        li#what .active{background: transparent url('../imgs/nav.gif') -602px -28px no-repeat;}
        li#test .active{background: transparent url('../imgs/nav.gif') -763px -28px no-repeat;}
        li#treat .active {background: transparent url('../imgs/nav.gif') -908px -28px no-repeat;}
        
/*===============================
SEND KIT FORM
=================================*/		
#termsCond,
#RegistrationForm
{
	width:944px;
	float:left;
	height:350px;
	margin-top:-15px;
	padding:0;
	position:relative;
	}
      #RegistrationForm fieldset
      {
      	width: 450px;
      	position:relative;
      	display:inline;
      	float:left;
      	margin:0px;
      	padding:0 0 0 20px;
      	}
      	#RegistrationForm p
      	{
      		width:410px;
      		position:relative;
      		float:left;
      		margin:0 0 3px 0px;
      		line-height:1.2;}  
      		#RegistrationForm p label
      		{
      			float:left;
      			position:relative;
      			width:250px;
      			text-align:left;
      			}
      		#RegistrationForm p input
      		{
      			float:right;
      			position:relative;
      			width:150px;
      			height:16px;
      			font-size:90%;
      			padding-top:0px;
      			padding-bottom:0px;
      			
      			
      			}	
      			
      			#RegistrationForm p select 
      			{
      				margin-left:8px;
      				padding:0px;}
      				
      			#RegistrationForm p label em{
					display:none;
					font-weight:bolder;
					color:Red;
					}	
					  				
      				#RegistrationForm p input#sendBtn
      				{
      					width:50px;
      					height:25px;
      					/*position:absolute;
						right:-20px;
						top:15px;*/
						margin:0;
						padding:0;
						font-size:100%;
						}
					div.introNote,
					div.intro {
						font-size:110%;
						width:410px;
						height:50px;
						position:relative;
						float:left;
						padding:0px;
						color:red;
						}
						div.intro #SaveFailed
						{
							
						font-style: italic; }
						#RegistrationForm div.introNote
						{
							margin-top:50px;
							padding:0 0 0 20px;
							font-size:100%;
							}
							#RegistrationForm a,
							#RegistrationForm a:active,
							#RegistrationForm a:visited
							{
								color:#ff1ec2;
								font-size:100%;
								text-decoration:none;}
								
							#RegistrationForm a:hover
							{
								color:#fff;}
div.rightPanel,
div.leftPanel
{
	background-image:none;
	width:470px;
	text-align:left;
	position:relative;
	float:left;
	display:block;
	}								
div.rightPanel p,
div.leftPanel p
{
	
	font-size:89%;
	margin:5px 15px 5px 0px;
	padding:0;
	}
	div.rightPanel
	{width:450px;
		padding-left:20px;}
.blackText, 
.blackText h3 { color: Black; }
/*===============================
CHLAMYDIA EVENTS LIST FROM JAN to MARCH
=================================*/	
table#eventTable 
{
	
	width:65%;
	position:relative;
	float:left;
	margin-top:-10px;
	margin-bottom:0;
	padding:0;
	font-size:85%;
	color:#000;
	border:none;
	border-collapse:collapse;
	clear:both;background-color:#fff;}

table#eventTable th, td {
	padding:2px 10px 1px 5px;
	border-bottom:1px solid #000;
	}
table#eventTable th {
	background:#C3D9FF;
	font-weight:bold;
	}
table#eventTable tr{}
table#eventTable tr.yellowBar
{
	background-color:#f9fe9b;}
	
table#eventTable tr.blueBar
{
	background-color:#cefefd;}

ul.listLegend
{
	width:100%;
	margin:5px 0 0 0px;
	padding:0;
	list-style:none;
	font-size:80%;
	font-weight:bold;
	clear:both;
	}	
	ul.listLegend li
	{
		display:inline;
		margin-right:10px;
		}
		
	ul.pressList
	{
		
		width:310px;
		float:right;
		position:relative;
		margin:0;
		padding:0;
		margin-top:-10px;
		list-style:none;
		clear:right;
		}
		ul.pressList li ul li
		{
			margin:5px 0; }	
		ul.pressList li ul
		{
			margin-bottom:15px;}
			ul.pressList li ul li a:link,
			ul.pressList li ul li a:visited,
			ul.pressList li ul li a:active
			{
				color:#ff1ec2;
				text-decoration:none;
				}
			
			ul.pressList li ul li a:hover
			{
				color:#fff;
				text-decoration:none;}