/* @override http://localhost:8888/global/styles/GlobalScreen.css */

/* Global styles for peteharrison.id.au website */

/*
	 When overriding the following 'global' styles with LocalScreen.css styles, keep in mind the cascading
	 precedence rules:
	 
	 Step 1:
		a. Count the number of ID attributes in the selector
		b. Count the number of CLASS attributes in the selector
		c. Count the number of HTML tag names in the selector
		
	 Step 2:
	 	Write the three numbers in exact order with no spaces or commas to obtain a three digit number.
	 	(Note, you may need to convert the numbers to a larger base to end up with three digits.)
	 	The final list of numbers corresponding to selectors will easily determine specificity with
	 	the higher numbers winning out over lower numbers. Following is a list of selectors sorted by specificity:

			#id1         {xxx} /* a=1 b=0 c=0 --> specificity = 100
			UL UL LI.red {xxx} /* a=0 b=1 c=3 --> specificity = 013
			LI.red       {xxx} /* a=0 b=1 c=1 --> specificity = 011
			LI           {xxx} /* a=0 b=0 c=1 --> specificity = 001
*/

/* @group Base Styles */

/* Underlying style defaults */

body {
	font: 10pt "Lucida Grande", Lucida, Verdana, sans-serif;
	color: #666666;
	text-align: left;
	margin: 0;
	background: white url(/global/images/QPR%20Map%20Background.jpg) top center;
}

.headerBase {
	height: 115px;
	margin-bottom: -115px;
	border-bottom-style: ridge;
}

/* This is part of the hack required to get IE to correctly handle .png files */

img, div {
	behavior: url(/global/iehack/iepngfix.htc);
}

/* These are the wrappers for the individual background elements for the different site areas */

.wrapper {
	margin: auto;
	width: 1060px;
}

/* Set the colours for links */

a { color: #2c5f8c; text-decoration: none;
	border-bottom: 1px dotted #8facbf;
}
a:hover { color: navy; }
a:active { color: #080032; }

/* @end Base Styles */

/* @group Header */

.phHeader {
}

.headerTop {
}

.headerContent{
	width: 1060px;
	height:  126px;
	position: relative;
	margin-top: -5px;
}

.headerTitle {
	margin-left: 40px;
	padding-top: 20px;
}

.headerTitle img {
	height: 90px;
	border-style: none;
	float: left;
	margin-top: -10px;
	margin-right: 25px;
	box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-moz-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
}

#headerTitleText {
	font: 36pt Courier, "Lucida Grande", Lucida, Verdana, sans-serif;
	color: #444;
/*	margin-left: 210px; */
	text-align: center;
}

.navBar {
	position: relative;
	text-align:right;
	padding-top:2px;
	padding-right: 45px;
	bottom: 10px;
}

.navBar ul {
}

/*	left: 410px; */

.navBar a {
	color: #666;
	border-bottom-style: none;
}
.navBar a:hover { color: #aaa; }

.navBarElement {
	display: inline;
	padding-left: 6px;
	padding-right: 8px;
}

#homeNav, #aboutNav, #contactNav, #bookmarkNav, #searchNav {
	border-right: 1px solid #ccc;
}

#searchLabel {
	padding-left: 10px;
	padding-right: 0px;
}

#googleSearchBox {
}

.headerBottom {
}

/* @end Header Styles */

.content {
}

/* @group Footer */

.phTagLine {
	font: 8pt "Lucida Grande", Lucida, Verdana, sans-serif;
	color: #444;
	width: 300px;
	padding: 1px;
	margin: auto;
	background-color: rgba(254,255,255,0.75);
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.phTagLine ul {
	margin-left: -25px;
}

.phTagLine ul li {
	margin: 0 0 0 0;
}

/* My Comment */

/* The links in the copyright are not a special colour */

.phTagLine a {
	color: #666;
	border-style: none;
}
.phTagLine a:hover { color: #aaa; }

.tagLine a {
	color: #666;
	border-style: none;
}
.tagLine a:hover { color: #aaa; }

.tagLineElement {
	display: inline;
	padding-left: 6px;
	padding-right: 8px;
}

/* The copyright tag */

#copyrightNav {
	border-right: 1px solid #ccc;
}

/* The ABN */

#abnNav {
	border-right: 1px solid #ccc;
	color: #999;
}

/* @end Footer Styles */

/* @group Menu Styles */

/* Left Side Menu */

.leftSideBar {
	position: absolute;
	width: 220px;
	background-color: rgba(255,254,255,0.8);
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

/* Right Side Menu */

.rightSideBar {
	position: absolute;
	width: 200px;
	margin-left: 850px;
	background-color: rgba(255,254,255,0.8);
}

/* Set up our default list styles */

.leftSideBar ul li {
	list-style-type: none;
	margin: 0px 0px 0px -30px;
	padding-left: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
}

.leftSideBar ul li ul {
	padding-left: 0px;
}

.leftSideBar ul li ul li {
	margin-left: 0px;
	padding-top: 5px;
	padding-bottom: 2px;
	border-bottom: none;
}

/* Styles for Right Sidebar content */

.rightSideBar img {
	margin: auto;
	display: block;
}

.rightSideBar a { color: #666; }
.rightSideBar a:hover { color: #aaa; }

.sideBarElement {
	margin-top: 25px;
}

.sideBarText {
	color: white;
	text-align: center;
}

/* Turn off sub-menus by default */
/* Then display the approrpiate menu items */

.MenuLink {
	display: none;
}

/* Now set the appropriate colours etc. on the individual options */
/* Maybe this should be done using some sort of breadcrumb display... */

.RootLink a {
	color: #666;
	border-bottom-style: none;
}
.RootLink a:hover { color: #aaa; }
.RootLink a:active { color: black; }

/* There's a bit of stuffing around here to get things right */
/* We have to colour things down the tree to get an 'embedded' active link */
/* displayed the way we want */

/* First, highlight the branch containing the active link */

.SideBarParent a {
	color: black;
	font-weight: normal;
	border-bottom-style: none;
}
.SideBarParent a:hover { color: #aaa; }
.SideBarParent a:active { color: #333; }

/* Next, set the style for the parts of the menu that are not in the currently selected path */

.L1Relation a,
.L2Relation a,
.L3Relation a,
.L4Relation a,
.L5Relation a {
	color: #aaa;
	border-bottom-style: none;
}
.L1Relation a:hover,
.L2Relation a:hover,
.L3Relation a:hover,
.L4Relation a:hover,
.L5Relation a:hover { color: #ccc; }
.L1Relation a:active,
.L2Relation a:active,
.L3Relation a:active,
.L4Relation a:active,
.L5Relation a:active { color: #333; }

/* Bold the currently active link */

.SideBarActiveLink a {
	color: black;
	font-weight: bold;
	border-bottom-style: none;
}
.SideBarActiveLink a:hover { color: #aaa; }
.SideBarActiveLink a:active { color: #333; }

/* But leave its children and siblings in the highlit format */

.SideBarChild a {
	color: #444;
	font-weight: normal;
	border-bottom-style: none;
}
.SideBarChild a:hover { color: #aaa; }
.SideBarChild a:active { color: #333; }

.SideBarSibling a {
	color: #777;
	font-weight: normal;
	border-bottom-style: none;
}
.SideBarSibling a:hover { color: #aaa; }
.SideBarSibling a:active { color: #333; }

/* @end Menu Styles */

/* @group Main Bar Styles */

.mainBar {
	width: 560px;
	margin-left: 220px;
	padding-bottom: 20px;
	position: absolute;
}

.mainBarTop {
	background: transparent url(/global/images/page-c-top.png) top left no-repeat;
	height: 29px;
}

.mainBarMiddle {
	background: transparent url(/global/images/page-c-middle.png) repeat-y;
}

.mainBarBottom {
	background: transparent url(/global/images/page-c-bottom.png) top left no-repeat;
	height: 29px;
}

.mainBarContent {
	width: 484px;
	height: 650px;
	overflow: auto;
	margin-left: 30px;
	padding-right: 20px;
	text-align: justify;
}

.mainBarContentExtended {
	width: 484px;
	min-height: 650px;
	overflow: auto;
	margin-left: 38px;
	padding-right: 20px;
	text-align: justify;
}

.mainBarContent img,
.mainBarContentExtended img {
	width: 484px;
	margin: auto;
	display: block;
}

.dropShadow {
	box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-moz-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
}

.mainBarContent ul,
.mainBarContentExtended ul {
	list-style-type: disc;
}

.mainBarContent ul li,
.mainBarContentExtended ul li {
	margin-top: 0;
	padding-top: 0;
}

#listSpaced5 ul {
	margin-top: -5px;
}

#listSpaced5 ul li {
	margin-top: 5px;
}

#listSpaced5 p {
	margin-top: 2px;
	margin-bottom: 0px;
}

.insetImage img {
	width: auto;
	float: right;
	padding-left: 10px;
	padding-top: 15px;
}

.insetImageS img {
	width: auto;
	float: right;
	padding-left: 10px;
	padding-top: 15px;
	box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-moz-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
}

.insetImageRight img {
	width: auto;
	float: right;
	padding-left: 10px;
	padding-top: 15px;
}

.insetImageRightS img {
	width: auto;
	float: right;
	padding-left: 10px;
	padding-top: 15px;
	box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-moz-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
}

.insetImageLeft img {
	width: auto;
	float: left;
	padding-right: 10px;
	padding-top: 15px;
}

.insetImageLeftS img {
	width: auto;
	float: left;
	padding-right: 10px;
	padding-top: 15px;
	box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
	-moz-box-shadow: rgba(0, 0, 0, 0.796875) 0px 5px 15px;
}

#mainBarFooter {
	font: 7pt "Lucida Grande", Lucida, Verdana, sans-serif;
	color: #888;
	text-align: right;
	margin-top: 15px;
	margin-right: 30px;
	z-index: 10;
}

/* Various special paragraph styles */

p {
	line-height: 150%;
	margin: 10px 0px 0px 0px;
}

sup, sub {
  vertical-align: baseline;
  position: relative;
  top: -0.4em;
}

sub { 
  top: 0.4em; 
}	

.tight {
	margin-top: 4pt;
}

.left {
	text-align: left;
}

.right {
	text-align: right;
}

.center {
	text-align: center;
}

/* Style for the first character of the first paragraph on a page */

.initial:first-letter { font-size: 140%; }

/* Make the heading styles match our paragraph style */

h1 { font-size: 180%; font-weight: normal; color: #222222; text-align: left; }
h1.initial:first-letter { font-size: 200%; }

h2 { font-size: 160%; font-weight: normal; color: #2a2a2a; text-align: left; }
h2.initial:first-letter { font-size: 180%; }

h3 { font-size: 140%; font-weight: normal; color: #333333; text-align: left; margin-bottom: 2pt; }
h3.initial:first-letter { font-size: 160%; }

h4 { font-size: 120%; font-weight: normal; color: #3a3a3a; text-align: left; margin-bottom: 2pt; }
h4.initial:first-letter { font-size: 140%; }
#headerList h4 { margin-top: 6pt; }

h5 { font-size: 110%; font-weight: normal; color: #444444; text-align: left; margin-bottom: 2pt; }
h5.initial:first-letter { font-size: 125%; }

h6 { font-size: 100%; font-weight: normal; color: #4a4a4a; text-align: left; margin-bottom: 2pt; }
h6.initial:first-letter { font-size: 110%; }

h1, h2, h3, h4, h5, h6 {
	color: #2c5f8c;
}

/* And provide a bit of variety */

.eventDate {
	color: maroon;
	margin-bottom: -15px;
	margin-top: 0px;
}

.eventHeading {
	margin-bottom: -5pt;
}

/* Style for centred text */

.centredText {
	text-align: center;
	top: 50px;
	position: relative;
}

/* Style for different sized image presentation formats */

.imageContainer {
	width: 484px;
	font-size: 10pt;
	text-align: center;
}

.imageContainer a {
	line-height: 10pt;
}

.imageBox1 {
	width: 400px;
	line-height: 2;
	padding-bottom: 20px;
}

.imageBox1 img {
	width: 280px;
	margin-bottom: 10px;
}

.imageBox2 {
	width: 240px;
	display: inline-block;
	line-height: 2;
	padding-bottom: 20px;
}

.imageBox2 img {
	width: 225px;
	margin-bottom: 10px;
}

.imageBox3 {
	width: 155px;
	display: inline-block;
	line-height: 2;
	padding-bottom: 20px;	
}

.imageBox3 img {
	width: 150px;
	margin-bottom: 10px;
}

.imageBox4 {
	width: 110px;
	display: inline-block;
	margin-bottom: -10px;
}

.imageBox4 img {
	width: 105px;
	margin-bottom: 10px;
}

/* List Styles */

ul.evenSpace,
ul.evenSpaceNoMarker,
ul.tightSpace,
ul.tightSpaceNoMarker {
	margin-top: 5px;
}

ul.evenSpace li,
ul.evenSpaceNoMarker li,
ul.tightSpace li,
ul.tightSpaceNoMarker li {
	line-height: 150%;
}
	
ul.evenSpace li {
	margin-top: 5px;
}

ul.evenSpaceNoMarker li {
	margin-top: 5px;
	list-style-type: none;
}

ul.tightSpace li {
	margin-top: 0px;
}

ul.tightSpaceNoMarker li {
	margin-top: 0px;
	list-style-type: none;
}

/* @end Main Bar Styles */

/* @group File Download Table Styles */

.dlSpecification {
	margin-top: 5px;
}

.dlCaption {
	font-size: 120%;
	font-weight: normal;
	color: #3a3a3a;
	text-align: left;
	margin-bottom: 4pt;
}

.dlIcon img {
	width: auto;
	padding: 2px;
	margin-right:8px;
	margin-left:8px
}

.dlFileName {
	width: 340px;
	text-align: left;
	vertical-align: middle;
}

.dlSize {
	width: 60px;
	text-align:  right;
	vertical-align: middle;
	font-size: 80%;
}

/* @end File Download Table Styles */

/* @group FancyZoom Styles */

#ZoomCaption {
	font-size: 14px;
	font-family: Comic Sans MS;
	color: rgb(255, 255, 255);
	text-shadow: rgb(0, 0, 0) 0px 2px 4px;
	white-space: nowrap;
}

#ZoomSubcaption {
	font-weight: normal;
	color: #aaa;
}

/* @end FancyZoom Styles */

/* @group Miscellaneous Styles */

.contactTable,
.table1 {
	margin-top: -10px;
}

.contactTable tr,
.table1 tr {
	vertical-align: bottom;
	text-align: left;
}

.refCase li {
	padding-bottom: 5px;
}

.shade {
	background: #eee;
}

/* @end Miscellaneous Styles */