/* CSS Document */

/* colour reference
Dark Blue - #003366

/* ------------------- General ------------------- */
html { min-height: 100%; margin-bottom: 1px; }
body {
	color:#666;
	margin:0px;
	padding:0;
	font-family:verdana,arial,helvetica,sans-serif;
	font-size:70%;
	text-align: center;
	background-color: #003366;
	background-position: center;
}
img {border:0}
.clear {clear:both}
div.clear {
	height:1px;
	font-size:1px;
	clear: both;
}
ul{margin-top:.75em; margin-bottom:.5em; line-height:100%}
h1, h2 {margin:0 0 .2em;line-height:100%}
h3 {margin-top:.2em; margin-bottom:.1em; line-height:100%}
h4, h5 {margin-top:.25em; margin-bottom:0; line-height:100%}
p {margin: 0 0 1em; line-height:120%}
li {line-height:120%}
a:link, a:visited {color:#02A9C6; text-decoration:none}
a:hover, a:selected {color:#303177; text-decoration:underline;}
ul{list-style:none; margin:0; padding:0}
li{ margin:0; padding: 0 0 5px 0}

/* -------------------  structure ------------------- */

#wrapper{
	width:100%;
	margin-left:auto;
	margin-right:auto;
	background-position: center;
	text-align: center;
	background-color: #FFFFFF;
}

#bannercol {
	background-color: #003366;
	width: 100%;
	height: 100px;
}
#bannerleftcol {
	background-color: #003366;
	width: 50%;
	height: 100px;
}
#banner {
	padding: 0;
	width: 770px;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 5px;
}
#bannerfull {
	width: 100%;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 5px;
	padding-top: 0;
	padding-right: 0px;
	padding-bottom: 0;
	padding-left: 0;
}
#bannerleft {
	padding: 0;
	width: 380px;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 5px;
}
#bannerright {
	padding: 0;
	width: 380px;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 5px;
}
#banner h1{
	font-size: 100%;
	padding: 0;
	margin: 5px;
	width: 360px;
}

#leftcol { /* Begin laying out the leftcol div */
	float: left; /* Floats the div to the left to make a column */
	width: 180px; /* sets a width for the div - Imperative for IE mac */
	margin-bottom: 120px;
	margin-left: 7px; /*creates a margin on the left to move the div away from the wrapper's edge */
	margin-top: 5px; /* sets the path to the bg image */
	background-repeat: no-repeat; /* prevents the bg image from repeating, no need to position it as top left is the default and that is where we want the image to show */
	padding-top: 5px; /* sets a padding to the top of the div to allow the bg image to show above the leftcol divs contents */
	background-color: #FFFFFF;
}

#leftcol #navigation {
	line-height: 100%; /* helps out IE 5.01 PC */
	width: 180px; /* sets the path to the bg image */
	background-repeat: no-repeat; /* prevents the bg image from repeating */
	background-position: bottom left; /*uses keywords to place the image at the bottom left of the div */
	padding-bottom: 10px; /* gives our background image room to display */
}

#leftcol #navigation ul {
	list-style-type: none; /* removes the bullets from our list navigation */
	margin: 0; /* zeroes off the margins */
	padding: 0;
}

#leftcol #navigation ul li { /*The 3 margin property/value pairs are a hack to make the links butt together in IE 5.01 */
	padding: 0; /* zeroes off the padding */
	margin: 0; /* zeroes off the margins */
	margin: /**/ 0 0 -3px 0; /* This takes 3px off the bottom margin in IE 5.01 - IE 5.5 cannot read this hack so stays with the 0 value from the last margin property */
	ma\rgin: 0; /* IE 5.01 and IE5.5 cannot read this selector - resets the margins on other browsers back to zero - the escape character must not come immediately before the letters a,b,c,d,e or f. If it does it will be seen as a hex character and the hack will fail */
	background-image: none; /* repeats the image vertically, no need to position it as top left is the default and that is where we want the image begin tiling from */
	
}

#leftcol #navigation a, 
#leftcol #navigation a:visited { /* use dual selectors if the properties and values are the same for each */
	color: #000000; /* changes the default text colour to white */
	display: block; /* required to make the links act like a button, having the full area "clickable" */
	padding: 4px 0 6px 4px; /* sets padding values to give the link text some "air" */
	text-decoration: none; /* sets a background colour on the links which hides the roll over snowman image in the li selector */
	width: 163px; /* sets the width for IE5.x - content width plus border widths plus padding value = 6 extra pixels */
	w\idth: 163px; /* resets the width for IE6 and compliant browsers */
	text-align: left;
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
}

/* using the \ escape character as in w\idth - see final property declaration in the selector above */
/* IE 5.01 and IE5.5 cannot read this selector. The escape character must not come immediately before the letters a,b,c,d,e or f. If it does it will be seen as a hex character and the hack will fail */

#leftcol #navigation a:hover, 
#leftcol #navigation a:focus { /* use dual selectors if the properties and values are the same for each */
	background-color: transparent; /* changes the bottom border to white to give the hover state an indented look */
	color: #003366; /* changes the hover and focus text to black */
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
}
#rightcol { /* Begin laying out the leftcol div */
	float: left; /* Floats the div to the right to make a column */
	width: 100px; /* sets a width for the div - Imperative for IE mac */
	margin-bottom: 0px;
	margin-right: 0px; /*creates a margin on the right to move the div away from the wrapper's edge */
	margin-top: 0px; /* sets the path to the bg image */
	background-repeat: no-repeat; /* prevents the bg image from repeating, no need to position it as top left is the default and that is where we want the image to show */
	padding-top: 5px; /* sets a padding to the top of the div to allow the bg image to show above the leftcol divs contents */
	background-color: #FFFFFF;
	margin-left: 600px;
}
#container {
	width: 770px;
	background-color: #FFFFFF;
	text-align: left;
	padding: 0px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#container90 {
	width: 90%;
	background-color: #FFFFFF;
	text-align: left;
	padding: 0px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#content{
	margin-left: 200px;
	margin-top: 0px;
	margin-right: 120px;
	margin-bottom: 0px;
}
#pics {
	margin: 0px;
	width: 100px;
	padding-top: 15px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	float: right;
}


#content p{
font-size: 90%;
margin: 20px;
}

#content h1{
font-size: 130%;
color: #003366;
padding: 0;
margin: 20px;
}

#content h2{
font-size: 110%;
color: #003366;
padding: 0;
margin: /*100px 0 0*/ 20px;
}

.leftimage{
float: left;
margin-right: 10px;
border: 1px solid #000000;
}

.rightimage{
margin-bottom: 20px;
float: right;
margin-left: 15px;
border: 1px solid #000000;
}
#footer {
	clear: both;
	border-top-width: 10px;
	border-top-style: solid;
	border-top-color: #FECE5A;
	background-color: #003366;
	vertical-align: top;
	height: 100%;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
}
.clear {clear: both; height: 1px; font-size: 0.1em}

/* ------------------- headings ------------------- */
h1{font-size:120%; font-weight:bold;}
h2{font-size:120%; font-weight:bold; }
h3{font-size:100%; font-weight:bold;}
h4{font-size:90%; font-weight:bold; }

/* -------------------  banner ------------------- */

.bannerimage {
	padding:0;
	float:left;
	width: 100%;
	margin-top: 0;
	margin-right: 5px;
	margin-bottom: 0;
	margin-left: 5px;
	background-image: url(../images/PTP_logo.gif);
	background-repeat: no-repeat;
	background-position: left top;
	height: 100px;
}
.bannerimageNW {
	float:left;
	width: 100%;
	margin-top: 0;
	margin-right: 5px;
	margin-bottom: 0;
	margin-left: 5px;
	background-image: url(../images/PTP_logo.gif);
	background-repeat: no-repeat;
	background-position: left top;
	height: 100px;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 0;
}
/* -------------------  Nationwide content ------------------- */
#nw_content{
	margin-left: 20px;
	margin-top: 0px;
	margin-right: 20px;
	margin-bottom: 0px;
	color: #000;
}
#nw_pics {
	margin: 0px;
	width: 100px;
	padding-top: 15px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	float: right;
}


#nw_content p{
font-size: 90%;
margin: 20px;
}

#nw_content h1{
font-size: 130%;
color: #003366;
padding: 0;
margin: 20px;
}

#nw_content h2{
font-size: 110%;
color: #003366;
padding: 0;
margin: /*100px 0 0*/ 20px;
}

/* -------------------  Nationwide primary navigation ------------------- */

#nw_primary{
	margin:0;
	float:none;
	text-align: center;
	padding-top: 6px;
	padding-right: 5px;
	padding-bottom: 3px;
	padding-left: 5px;
}
#nw_primary .tl {background:url(../images/shared/full_tl.gif) no-repeat 0 0 #fff; position: relative}
#nw_primary ul{list-style:none; margin:0 0 .4em 0; padding: 0;  white-space:nowrap;}
#nw_primary li{display:inline; padding: 0 5px 0 8px; border-right:1px solid #666; color:#666;}
#nw_primary li.primaryli{border-right:none}
#nw_primary a:link, #primary a:visited {color:#666; text-decoration:none;}
#nw_primary a:hover{color:#666; text-decoration:underline;}

/* -------------------  footer ------------------- */

#footer ul{
	list-style:none;
	margin:0 0 .4em 0;
	padding: 0;
	white-space:nowrap;
	font-size:90%;
	color: #FFFFFF;
}
#footer li{display:inline; padding: 0 5px 0 8px; border-left:1px solid #666}
#footer li.termsli{
	padding-left:0px;
	border-left:none;
}
#footer a:link, #footer a:visited {color:#02A9C6; text-decoration:none}
#footer a:hover{color:#303177; text-decoration:underline;}
/* -------------------  Application form  ------------------- */
label
{
	width: 16em;
	float: left;
	text-align: right;
	margin: 0 2em 10px 0;
	clear: both;
	font-size: 60%;
}
.label-cb
{
	width: 25em;
	float: left;
	text-align: right;
	margin: 0 2em 10px 0;
	clear: both;
	font-size: 60%;
}


.address-field
{
	float: left;
	margin-bottom: 10px;
	width: 16em;
	font-size:80%;
}


.input-box
{
	float: left;
	margin-bottom: 10px;
	color: #26a;
	border: #26a solid 1px;
	background-color: #FFFFCC;
	width: 16em;
}
.input-check-box
{
	float: left;
	margin-bottom: 10px;
	width: 7em;
}


.submit-button
{
	clear: both;
	color: #FFFFFF;
	border: 2px #9cf outset;
	background-color: #003366;
	float: right;
	margin-right: 100px;
	display: inline;
}

fieldset
{
	border: #26a solid 1px;
	width: 90%;
}

legend
{
	border: #26a solid 1px;
	padding: 1px 10px;
	background-color: #364971;
	color: #FFFFFF;
}
#nw_dux_wrapper{
	width:770px;
	margin-left:auto;
	margin-right:auto;
	background-position: center;
	text-align: left;
}
#nw_dux_masthead {background:#fff; padding: 0; margin: 5px;}
