/* 
CSS --------------------------------------------------------
	Author:			Simone Hutchinson  - simone@sunsol.co.uk
	Company:		Sunsol - http://www.sunsol.co.uk/
	Client:			Promoting Workplace Learning
	Initial Date:	Friday 22nd July 2005
	--------------------------------------------------------
*/
/*body {background-color:#ccccff;}*/
/* ==========================================================================
------------------------------------------------------------- Layout DIVs --
all layout divs specify margins and padding in ems to try and maintain good whitespace if
user chooses to increase/decrease text size */
#contentContainer {
width:79em; /* all layout divs reseize relative to the user's choice of text size */
min-width:730px; /* prevents column-wrapping and preserves readability at reduced viewport sizes */
position:absolute;
left:10px;
top:10px;
padding:10px 0;
background-color:#fff;
}

#leftSidebar {float:left;width:18%;margin:0;padding:0;position:relative;}
#middleColumn {float:left;width:55%;margin:0;padding:0;}
#rightSidebar {float:left;width:22%;margin:0;padding:0;}
/* start of contents of middle column */
#content {
border:1px solid #000066;
padding:0 3%;
}
/* ------- Footer - is inside middleColumn div to autoposition with middle content ------*/
#footer {
text-align:center;
clear:both;
margin:10px auto;
border:1px solid #999;
width:auto;
}

#footer ul {margin:0;padding:0;background-color:#9cf;}
#footer li {
list-style-type:none;
display:inline;
color:#999;
}
#footer li a {color:#333;font:0.8em Verdana, Arial, Helvetica, sans-serif;}
/* end of footer --- */

/* WinIE only. */
* html body #leftSidebar {width:18%;margin:0;}
* html body #middleColumn{width:55%;margin:0;}
* html body #rightSidebar {width:22%;margin:0;}
/* end of WinIE only */



/* header contents */
#header {margin:0;width:100%;}
#header h1#logo {margin:0;padding:0 1em;float:left;}
#header h1 {
float:right;
font:italic 1.2em "Lucida Grande", Tahoma, "Lucida Sans Unicode", arial, sans-serif;
color:#909;
padding-right:5em;
}
/* end of header contents */
/* ==========================================================================
------------------------------------------------------------- Menu --------
Thanks to K.Chayka for http://accessat.c-net.us/test/menu-4.html#
*/
#nav {
padding:52px 0 0 0;
margin:0 0 0 18%;
/*padding-top: .2em;  for Safari */
}

#nav ul {
margin:0;
padding:0;
}

#nav li {
float:left;
list-style-type:none;
margin:0 5px;
padding:0;
background:  url("/web/TEMPLATES/pwl_3col_files/menu/expander_off.jpg") right center no-repeat;
font-size:1em;
white-space:nowrap;
}
/* hide from IE */
html>body #nav li:hover {
background-image:url("/web/TEMPLATES/pwl_3col_files/menu/expander_on.jpg");
background-position:right center;
background-repeat:no-repeat;}
/* end of hide from IE */

#nav li.active {background-image:  url("/web/TEMPLATES/pwl_3col_files/menu/expander_on.jpg");}
* html #nav li.active {margin-bottom:-2px;}

#nav li.active span {color:#000066;} /* for current menu heading */

#nav a, #nav span { /* span has different image though, so needs extra rule */
background-image:  url("/web/TEMPLATES/pwl_3col_files/menu/anchor_off.jpg");
background-position:left center;
background-repeat:no-repeat;
padding:5px 15px;
display:block;
text-decoration:none;
color:#909;
font-weight:bold;
text-align:center;
}

#nav span {
background-image:  url("/web/TEMPLATES/pwl_3col_files/menu/anchor_on.jpg");
}

#nav a:hover, #nav a:focus, #nav a:active {
color:#9c3;}

/* hide from IE */
html>body #nav a:hover, html>body #nav a:focus,html>body #nav a:active {
background-image:url("/web/TEMPLATES/pwl_3col_files/menu/anchor_on.jpg");
background-position:left center;
background-repeat:no-repeat;
color:#000066;}
/* end of hide from IE */

/* for MacIE only */
* html>body #nav,
* html>body #nav a,
* html>body #nav span {
	display:inline-block;
}
/* end MacIE hack */
/* ================================================================================
------------------------------------------------------------- Options Menu --------
Is inside the header ------------------------------------------------------------*/
#optionsMenu {
margin:-30px 0 0 18%; /* same width as the left sidebar, to align with main content area */
padding: 0;
clear:left;
font:0.9em Verdana, Tahoma, sans-serif;
}

/* clear float for WinIE */
* html #optionsMenu {height:1%;margin-left:19%;}
/* end WinIE hacks */

/* clear float for other browsers */
#optionsMenu:after {
content:" ";
display:block;
clear:both;
height:0;
overflow:hidden;
visibility:hidden;
}
#optionsMenu ul {margin:0;padding:0;}
#optionsMenu li {
float:left;
list-style-type:none;
text-align:left;
}

#date li {
padding:0 10px 0 20px;
background:url("/web/TEMPLATES/pwl_3col_files/icons/calendar_icon.gif") left no-repeat;
color:#9c3;
}

#access li {
background:url("/web/TEMPLATES/pwl_3col_files/icons/accessibility_icon.gif") left no-repeat;
padding:0 0 0 20px;
}
#access li a{color:#9c3;}

#lang {visibility:visible;}
#optionsMenu>#lang {margin:-10px 0 0 0;}
/* ==========================================================================
-------------------------------------------------------------------- Sidebars 
These consist of: submenu, enews and quickl ------*/
#leftSidebar img {/* for partner logos */
margin:10px 15px 10px 28px;
text-align:center;
}

#sunsol{
   float:right;
}

#sunsol a{
color:#F77B31;
}

#submenu, #quickl {
background: #9cf url("/web/TEMPLATES/pwl_3col_files/boxtops/stretchy%20boxtops/expander.gif") top right no-repeat;
padding:0;
margin:0 0 10px 0;
height:1%;
border:0;
}

#submenu {
margin:0 1em;
}

#quickl {
background-color:#9cf;
margin:0 1em;
}


#submenu h2, #enews h2, #quickl h2 {
background: url("/web/TEMPLATES/pwl_3col_files/boxtops/stretchy%20boxtops/anchor.gif") top left no-repeat;
color:#9c3;
font:bold 1em "Lucida Grande", Tahoma, Arial, sans-serif;
padding:2px 0;
text-align:center;
margin:0;}

#right_logo{
position:relative;
top:31.6em;
margin:0 5em;
vertical-align:bottom;
}

#enews h2 {text-align:left;background:none;}
#enews>h2 {margin:0 10px;}
#enews {width:150px;margin:0 1em;}
#enews a{font-size:0.9em;margin:0 1em;}
#enews a {margin:5px 0 0 1em;}
#enews p {margin:5px 0 0 1em;}
* html body #enews p {margin:2px 0 0 1em;}

/* WinIE only */
* html body #submenu h2, 
* html body #enews h2,
* html body #quickl h2
{padding:2px 10px;margin:0;}
/* end of WinIE only */

#submenu ul { /* Win/IE*/
padding:0;
margin:0;
border-right:1px solid #000066;
border-left:1px solid #000066;
}

#quickl div {
padding:0 5px 10px 5px; /* space within each quick links box */
height:1%; /* for WinIE only: keeps floated images inside the pale grey containers */
border:1px solid #000066;
}

#quickl div img {clear:left;float:left;margin:0 5px 5px 5px;vertical-align:top;}
#quickl a {line-height:1.2em;margin:0;height:1%;font-size:1em;color:#000066;}
#quickl p {line-height:1.2em;margin:0 5px;}
#quickl hr {clear:both;background-color:#fff;}

#submenu li {
list-style-type:none;
margin:0;
border-bottom:1px solid #000066;
}

#submenu li a {
background-image:  url("/web/TEMPLATES/pwl_3col_files/submenu/sub_off.jpg");
background-repeat:no-repeat;
background-position: left;
color:#000066;
padding:10px 0 10px 25px;
margin:0 10px;
display:block;
text-decoration:none;
vertical-align:text-top;
line-height:1.2em;
}

* html #submenu li a {padding:5px 0 5px 25px;}

#submenu li.active a {background-image:  url("/web/TEMPLATES/pwl_3col_files/submenu/sub_on.jpg");}
#submenu li a:hover {background-image:  url("/web/TEMPLATES/pwl_3col_files/submenu/sub_on.jpg");}

/* WinIE MacIE only. contains floated child elements within div */
* html>body #enews,
* html body #enews,
* html>body #quickl div,
* html body #quickl div
{height:100%;} 
/* end of WinIE MacIE only rule */

/* CSS2 saves the day! use of generated content 
will contain floated child elements and save on hack mark-up */
#enews form:after {content:""; display:block; height:0; clear:both;}
#quickl div:after {content:""; display:block; height:0; clear:both;}
/* =========================================================================
------------------------------------------------------------- Typography --
Thanks to Owen Briggs for his useful research on using relative units: percentages 
and ems, for font sizing in CSS, written up at:
http://www.thenoodleincident.com/tutorials/typography/
I have read and modified for use here. Whatever remains of his comments is either in tact
(if I couldn't say it better myself) or modified (if they were not relevant).
*/

body {
	font-family:Helvetica, Arial, Geneva, sans-serif;
	font-size: 76%;/* font sizing in ems, baby. if you want to change anything, just change this.*/
	/*funny thing happens at 75% and lower. opera goes to a nice small size, but moz and ie pc change almost not at all. seems 76% is as small as you can go and stay the same across browsers. poop.*/
	color: #000;
	}


h1 {
	font-size: 1.7em;
	font-weight: normal;
	color:#000066;
	font-family:"Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;
}

h2 {
	font-size: 1.5em;
	margin: 1em 0em;
	font-weight: normal;
	color:#f96;
	}
h3 {
	font-size: 1.4em;
	font-family:"Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
	}
h4 {
	font-size: 1.2em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
h5 {
	font-size: 1.0em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
h6 {
	font-size: 0.8em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}

img {border:0;}
#content img {border: 1px solid #ccc;padding:5px;}

ol, ul, li {
font-size: 1.0em;
line-height: 1.8em;
margin-top: 0.2em;
margin-bottom: 0.1em; 
}
	
p {
font-size: 1.0em;
line-height: 1.5em;
margin: 1.2em 0em 1.2em 0em;
}

.FAQ_Question{
  margin-bottom:-20px;
}	

.FAQ_Heading{
font-size: 1.2em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
}

li > p {margin-top: 0.2em;}

strong {font-weight: bold;}

em {font-style:italic;}

#leftSidebar hr {border:1px solid #ccc;margin:1em 1.5em;width:130px;}
hr {border:1px solid #ddd;color:#fff;margin:10px 0px;}


td p{
  margin-top:0;
}

/* ==========================================================================
------------------------------------------------------------- Links--------*/
a {
color:#39f;
}

#optionsMenu a {color:#000066;}
#optionsMenu li a:hover, #optionsMenu li a:active {color:#36f;}

#submenu a, #quickl a {color:#666;}
#submenu li#current {color:#000;}

a:link {
}
a:visited {
color:#69f;
}

a:active {
}

a:hover {
text-decoration: none;
}
/* ==========================================================================
------------------------------------------------------------- forms ------*/
#enews {padding:5px 5px;margin:0;}
#enewsF input.formButton {
margin:5px 0 5px 10px;
border:0;
float:right;
}

#enewsF input {
margin:5px 0 0 10px;
font:0.9em Verdana, Tahoma, sans-serif;}

* html body #enewsF input {
margin:0 0 0 10px;
}


input {border:1px solid #999;color:#666;}

#optionsMenu form input {margin:0 0 0 10px;}
.formButton {border:0;margin:0; padding:0; vertical-align:bottom;}

#enewsF img {vertical-align:middle;}
/* ============================================================================
------------------------------------------------------------- Tables --------*/
#content table {width: 96%;} /* 100 minus the padding of left and right sides for content */
caption {font-style:bold; text-align:left;}

.accessT th {text-align:left;}
.accessT td {border-bottom:1px solid #ddd;text-align:left;}
/* ==========================================================================
---------------------------------------------------------- Misc. Classes & rules --*/
.right {text-align:right;}
.center {text-align:center;}
.left {text-align:left;}

img.floatright {margin:0 0 10px 10px;}

div.floatright {margin:0 0 10px 10px;}
div.floatleft {margin:0 10px 10px 0;}
/* ===========================================================================================
---------------------------------------------------------- Activedition-accessible classes --*/
/*Begin AESTYLE*/.floatright {float:right;}/*End AESTYLE*/
/*Begin AESTYLE*/.floatleft {float:left;}/*End AESTYLE*/
/*Begin AESTYLE*/.clear {clear:both;}/*End AESTYLE*/
/*Begin AESTYLE*/.urdu {font-size:1.5em;}/*End AESTYLE*/
/*Begin AESTYLE*/.floatnone {float:none;}/*End AESTYLE*/
/*Begin AESTYLE*/.border {border:1px solid #909;}/*End AESTYLE*/
/*following style is for the right sidebar*/
/*Begin AESTYLE*/.q_2 {background-color:#eeeeff;}/*End AESTYLE*/
/*Begin AESTYLE*/.accessT {width:60%;}/*End AESTYLE*/
/*Begin AESTYLE*/.photoT {width:60%;}/*End AESTYLE*/
/*Begin AESTYLE*/.back {
background:url("/web/TEMPLATES/pwl_3col_files/icons/back.jpg") left no-repeat;
padding-left:20px;}/*End AESTYLE*/
/*Begin AESTYLE*/
.urduHead{
  text-align:right;
}/*End AESTYLE*/