/* Normalizes margin, padding */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td 
{ margin : 0; padding : 0; }

/* Normalizes font-size for headers */
h1,h2,h3,h4,h5,h6 { font-size : 100%; }

/* Removes list-style from lists */
ol,ul { list-style : none; }

/* Normalizes font-style and font-weight to normal */
address, caption, cite, code, dfn, em, strong, th, var
{ font-style : normal; font-weight : normal; }

/* Removes list-style from lists */
table { border-collapse : collapse; border-spacing : 0; }

/* Removes border from fieldset and img */
fieldset,img { border : 0; }

/* Left-aligns text in caption and th */
caption,th { text-align : left; }

/* Removes quotation marks from q */
q:before, q:after { content :''; }


/* layout */

html 	{ text-align : center;  }
body {text-align : left;
}
div#wrapper{background-color:#FFFFFF; 


background-position:top right;
background-repeat:no-repeat;
position : relative; 
width:1000px;
margin : 0 auto; 
 }

div#header{}

div#branding {
	width:1000px;
	margin:0 auto;
	height:180px;
	top: 0px;
	background-image:url(../images/PUK-logo.png);
	background-repeat: no-repeat;
	background-position:top right;
	position : relative; z-index : 10;}

/* this is for the site main title, hidden by CSS */
div#branding h1 { 
text-indent : -9999px; }

div#branding h2{
	position:absolute;
	height: 60px;
	text-indent:-9999px;
	top: 100px;
	left: 0px;
	width:802px;
	background-image: url(../images/PUK-strapline.png);
	background-repeat: no-repeat;
}

div#navigation h2 { 
	position:absolute;
	top:-20px;
	text-indent : -9999px; }

div#branding blockquote { 
	position : absolute;
	top : -9999px; }



/* navigation */
div#navigation{
	background-color:#563795;
	background-position: top center;
	height:40px;
	border:#563795;
	
}

div#nav-wrapper{
	height:40px;
	background-color:#563795;
	width:1000px;
	margin:0 auto;
}
/* this overrides the 20px margin on all text */	
ul#nav_features{ 
	margin-top:-19px;
	font : 95%"Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, sans-serif ;	
}
ul#nav_features li{
	width: 100px;
	display: inline;
}
#nav_features li a{
	display: block;
	float: left;
	padding-top:10px;
	padding-left:20px;
	padding-right:20px;
	padding-bottom:10px;
	color:#ffffff;
	text-decoration: none;
}
#nav_features li a:hover{
	
	background-color: #70c066;
}
div#content{
	min-height:100%;
}

ul.navigation ul{display:none}
ul.navigation li:hover>ul{display:block}
ul.navigation ul{position: absolute;left:0px;top:98%;}
ul.navigation ul ul{position: absolute;left:98%;top:0px;}
ul.navigation,ul.navigation ul {
	margin:0px;
	list-style:none;
	padding:0px 0px 0px 0px;
	background-color:#563795;
	background-repeat:repeat;
	
}

/* new main navigation */ 
div#navnew{
	background-color:#563795;
	background-position: top center;
	height:54px;
	border:#563795;
	
}

div#navnew-wrapper{
	height:54px;
	background-color:#563795;
	width:1000px;
	margin:0 auto;
}


ul.navigation table {border-collapse:collapse}ul.navigation {
	display:block;
	float: inherit; 
	zoom:0;
	width:1000px;
	border:0px;
	background-position:center;
	
	
}
ul.navigation ul{
	width:100px;
}
ul.navigation li{
	display:block;
	margin:0px 0px 0px 0px;
	font-size:0px;
	width:200px; 
}


ul.navigation a, ul.navigation li.dis a:hover, ul.navigation li.sep a:hover {
	display:block;
	vertical-align:middle;
	background-color:#563795;
	border-width:0px;
	border-color:#563795;
	border-style:solid;
	text-align:center;
	text-decoration:none;
	padding: 5px 5px 5px 5px;
	font:normal 14px Verdana;
	color: #fff;
	text-decoration:none;
	cursor:pointer;
	

}
ul.navigation span{
	overflow:hidden;
}
ul.navigation li {
	float: left;
}
ul.navigation ul li {
	float:none;
}
ul.navigation ul a {
	text-align:center;
	white-space:nowrap;
}
ul.navigation li.sep{
	text-align:center;
	padding:0px;
	line-height:0;
	height:100%;
}
ul.navigation li:hover{
	display:block;
	position:relative;
	cursor:default;
}
ul.navigation li:hover>a{
	background-color:#70c066;
	border-color:#665500;
	border-style:solid;
	font:Verdana, sans-serif, 13px;
	color: #ffffff;
	text-decoration:none;
}
ul.navigation li a:hover{
	position:relative;
	background-color:#70c066;
	border-style:solid;
	font:Verdana, sans-serif, 13px;
	color: #ffffff;
	text-decoration:none;
}



div#subnav{
	background-color:#70c066;
	background-position: top center;
	height:20px;
	border:#70c066;
	
}
/* table */

div#table_right
{
	background-color:#70c066;
	width:150px;
	float:right;
	text-align:center;
	text-decoration:none;
	padding: 0px 0px 0px 0px;
	font:normal 14px Verdana;
	text-color: #fff;
	text-decoration:none;
	cursor:pointer;
	position:inherit;
	
	
}
#table_right a:hover{
	display:block;
	vertical-align:middle;
	background-color:#563795;
	border-width:0px;
	border-color:#563795;
	border-style:solid;
	text-align:center;
	text-decoration:none;
	padding: 5px 5px 5px 5px;
	font:normal 14px Verdana;
	color: #fff;
	text-decoration:none;
	cursor:pointer;
}

#table_right a{
	display:block;
	vertical-align:middle;
	background-color:#70c066;
	border-width:0px;
	border-color:#70c066;
	text-align:center;
	text-decoration:none;
	padding: 5px 5px 5px 5px;
	font:normal 14px Verdana;
	color: #fff;
	text-decoration:none;
	cursor:pointer;
}

/* these are the two main content areas */

div#content_right {
	min-height:450px;
	background-image: url(../images/green-stripe.jpg) ;
	background-repeat: no-repeat;
	background-position: right 20px;
	width: 60%;
	margin-bottom:50px;
	float: left;}

div#content_left {
		min-height:450px;
		background-image: url(../images/green-stripe.jpg) ;
		background-repeat: no-repeat;
		background-position: left 20px;
		margin-left: 120px;
		width: 200px;
		float : left;}


/*poss new content area */	
		
div#content_farright {
	min-height:450px;
	background-image: url(../images/green-stripe.jpg) ;
	background-repeat: no-repeat;
	background-position: right 20px;
	width: 2px;
	margin-bottom:50px;
	float: left;}
	
.page-image{
	padding:10px;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom:20px;
	float: right;
	background-color: #70c066 ;
	
}	

.page-image-left{
	padding:10px;
	margin-right: 20px;
	margin-bottom:20px;
	float: left;
	background-color: #70c066 ;
	
}
	
/* this is an individual sub column */	
	
div#sub_block{
	float:left;
	width:236.5px;
	min-height:250px;
	border-right: thin dotted #CCCCCC;
}

div#clear{
clear:both;}
	


div#site_info {
	background-color:#563795;
	background-position: top center;
	clear:both;
	position: relative;

}
div#site-info-wrapper{
	height:40px;
	padding-top:2px;
	background-color:#563795;
}

#site_info p{
	
	color:#ffffff;
	
}

#site_info a{
	
	color:#ffffff;
	
}



div#site-info-wrapper {
	position: inherit;
	width:1000px;
	margin:0 auto;
	text-align:left;
}

/* page specific */

.homeheader {text-indent:-9999px;
	 background-image: url(../images/welcome.png);
	background-repeat: no-repeat;
	width: 600px;
	height:170px;}
	
.homeheader2 {text-indent:-9999px;
	background-image: url(../images/homeheader.gif);
	background-repeat: no-repeat;
	width: 1000px;
	height: 200px;
	background-position:top;
	background-position:left;
	}
	
.womenheader
{text-indent:-9999px;
	 background-image: url(../images/women.png);
	background-repeat: no-repeat;
	width: 600px;
	height:100px;}
	
	.womenheader2
{text-indent:-9999px;
	 background-image: url(../images/women.headergif.gif);
	background-repeat: no-repeat;
	width: 600px;
	height:100px;}
	
	.menheader
	{text-indent:-9999px;
		 background-image: url(../images/men.png);
		background-repeat: no-repeat;
		width: 600px;
		height:100px;}
		
		.youthheader
		{text-indent:-9999px;
			 background-image: url(../images/youth.png);
			background-repeat: no-repeat;
			width: 600px;
			height:100px;}
			
			.healthheader
			{text-indent:-9999px;
				 background-image: url(../images/health.png);
				background-repeat: no-repeat;
				width: 600px;
				height:120px;}
				
				.policyheader
				{text-indent:-9999px;
					 background-image: url(../images/policy.png);
					background-repeat: no-repeat;
					width: 600px;
					height:90px;}
					
					.informationheader
					{text-indent:-9999px;
						 background-image: url(../images/information.png);
						background-repeat: no-repeat;
						width: 600px;
						height:100px;}	
						
						.contactheader
						{text-indent:-9999px;
							 background-image: url(../images/contact-us.png);
							background-repeat: no-repeat;
							width: 600px;
							height:80px;}
							
							.getinvolvedheader
							{text-indent:-9999px;
								 background-image: url(../images/get-involved.png);
								background-repeat: no-repeat;
								width: 600px;
								height:100px;}
				
						.magazineheader
							{text-indent:-9999px;
								 background-image: url(../images/magazine.png);
								background-repeat: no-repeat;
								width: 600px;
								height:200px;}
								
								.aboutusheader
							{text-indent:-9999px;
								 background-image: url(../images/aboutus.png);
								background-repeat: no-repeat;
								width: 600px;
								height:100px;}

							.faqsheader
							{text-indent:-9999px;
								 background-image: url(../images/faqs.png);
								background-repeat: no-repeat;
								width: 600px;
								height:200px;}
								
									.personalstoriesheader
							{text-indent:-9999px;
								 background-image: url(../images/personalstories.png);
								background-repeat: no-repeat;
								width: 600px;
								height:100px;}
										
									.supportheader
							{text-indent:-9999px;
								 background-image: url(../images/support.png);
								background-repeat: no-repeat;
								width: 600px;
								height:150px;}
									.pozfemheader
							{text-indent:-9999px;
								 background-image: url(../images/poz_fem.png);
								background-repeat: no-repeat;
								width: 600px;
								height:100px;}
								
								.wecareheader
							{text-indent:-9999px;
								 background-image: url(../images/wecare.png);
								background-repeat: no-repeat;
								width: 600px;
								height:100px;}


		.supportmenheader
							{text-indent:-9999px;
								 background-image: url(../images/support_men.png);
								background-repeat: no-repeat;
								width: 600px;
								height:150px;}
								
								.linksheader
							{text-indent:-9999px;
								 background-image: url(../images/useful_links.png);
								background-repeat: no-repeat;
								width: 600px;
								height:100px;}
								
								.donate_main_header
							{text-indent:-9999px;
								 background-image: url(../images/donate_main.png);
								background-repeat: no-repeat;
								width: 600px;
								height:150px;}
								
								.volunteerheader
							{text-indent:-9999px;
								 background-image: url(../images/volunteer.png);
								background-repeat: no-repeat;
								width: 600px;
								height:150px;}
								
									.schoolsheader
							{text-indent:-9999px;
								 background-image: url(../images/schools.png);
								background-repeat: no-repeat;
								width: 600px;
								height:120px;}
									
									.pregnancyheader
							{text-indent:-9999px;
								 background-image: url(../images/pregnancy.png);
								background-repeat: no-repeat;
								width: 600px;
								height:200px;}
								.consultationheader
							{text-indent:-9999px;
								 background-image: url(../images/consultation_responses.png);
								background-repeat: no-repeat;
								width: 600px;
								height:200px;}
								
									.reportsheader
							{text-indent:-9999px;
								 background-image: url(../images/published_reports.png);
								background-repeat: no-repeat;
								width: 600px;
								height:200px;}
								
									.HIVheader
							{text-indent:-9999px;
								 background-image: url(../images/HIVintheUK.png);
								background-repeat: no-repeat;
								width: 600px;
								height:120px;}
								
									.historyheader
							{text-indent:-9999px;
								 background-image: url(../images/history.png);
								background-repeat: no-repeat;
								width: 600px;
								height:100px;}
									.missionheader
							{text-indent:-9999px;
								 background-image: url(../images/mission.png);
								background-repeat: no-repeat;
								width: 600px;
								height:100px;}
								
								.blogheader
							{text-indent:-9999px;
								 background-image: url(../images/blog.png);
								background-repeat: no-repeat;
								width: 600px;
								height:120px;}
.gpheader
							{text-indent:-9999px;
								 background-image: url(../images/gp.png);
								background-repeat: no-repeat;
								width: 600px;
								height:200px;}
								
								.WADheader
							{text-indent:-9999px;
								 background-image: url(../images/WAD.png);
								background-repeat: no-repeat;
								width: 850px;
								height:150px;}
								
									.ambassadorheader
							{text-indent:-9999px;
								 background-image: url(../images/ambassador.png);
								background-repeat: no-repeat;
								width: 850px;
								height:100px;}
/* typography */

p, ul { 
font : 80% "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, sans-serif ;
color : #000000);
margin:20px; /* this gives all text a 20px margin */	
}

ul{
	line-height: 150%;
	font-weight: bold;
}

ul#twitter_update_list{
	font-weight: normal;
	font-size:80%;	
	line-height: 110%;
}

ul#twitter_update_list li{
	
	margin-bottom: 10px;
	
}



a{color:#563795;}



H1{font : 250%/1.5  "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, sans-serif ;
color : #000000);
margin:20px;}

H2 {font : 200%/1.5  "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, sans-serif ;
color : #000000;
margin:20px;}
H3{font : 120%/1.5  "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, sans-serif ;
color : #000000;
margin-left:20px;
margin-top:40px;}

.bold{font-weight:bold;}

.quote{font-family: Georgia, "Times New Roman", Times, serif;
line-height:1.6em;
color:#660000;

font-style:italic;
}
.font150{font-size:150%;}
.font170{font-size:170%;}
.font200{font-size:200%;}

.pagetop{position: absolute; top: 0px;}



/* rabiohead posuk font */

.rabiohead {
	font-family: 'RabioheadRegular';
	src: url('rabiohead-webfont.eot');
	src: local('?'), url('rabiohead-webfont.woff') format('woff'), url('rabiohead-webfont.ttf') format('truetype'), url('rabiohead-webfont.svg#webfont6j7ChCgu') format('svg');
	font-weight: normal;
	font-style: normal;
}