/* Copyright (c) Gloucestershire Local Medical Committee 2007. All rights reserved. */
/*                         Last updated 2007/10/17.                                 */

/* -----------  Reminder of order of CSS margin, border and padding --------- */

/*   ......................................   */
/*   .            margin                  .   */
/*   . .................................. .   */
/*   . .          border                . .   */
/*   . . .............................. . .   */
/*   . . .        padding             . . .   */
/*   . . .  ........................  . . .   */
/*   . . .  .                      .  . . .   */
/*   . . .  .    TEXT IN HERE      .  . . .   */
/*   . . .  .                      .  . . .   */
/*   . . .  ........................  . . .   */
/*   . . .                            . . .   */
/*   . . .............................. . .   */
/*   . .                                . .   */
/*   . .................................. .   */
/*   .                                    .   */
/*   ......................................   */


/* ---------------------  General Styles --------------------- */

/* Might be better to move some of this into particular sections such as Main Text below. */

body {	font: normal 10pt/16pt Arial, Helvetica, Verdana, sans-serif;
		text-decoration: none;
		text-align: center;
		margin: 0;
		padding: 0;
		background-color: #f4fafc;  /* Light blue */
		}

.page {	background-color: #d4e2ec;  /* Darkish blue */
		padding: 0.2em;
		margin: 0.5em;
		margin-left: auto;
		margin-right: auto;
		width: 88%;
		text-align: left;
		}

h1, h2 {	font-weight: bold;
		text-align: center;
		}

h3, h4, h5 {
		font-weight: bold;
		text-align: left;
		}

h1 {		font-size: 15pt;		}
h2 {		font-size: 14pt;		}
h3 {		font-size: 13pt;		}
h4 {		font-size: 12.5pt;	}
h5 {		font-size: 12pt;		}

a {		color: #141a8c;  /* Dark blue */
		}

a:hover,
a:focus {	color: #c00;  /* Red */
		background-color: white;
		text-decoration: underline;
		}

p {		font-size: 10.5pt;
		line-height: 17pt;
		color: black;
		margin: 0.15em;
		padding: 0.2em;
		}


/* ---------------------  Main Header --------------------- */

.mainheader1 {
		background:url("glmcwindows.jpg");
		background-repeat: repeat;
		float: left;
		width: 100%;
		border-color: #141a8c;  /* Dark blue */
		border-style: solid;
		border-width: 1px 1px 2px 1px;
		}

.mainheader1 h1 {
		font-family: garamond, times new roman, serif;
		font-size: 16.5pt;
		color: #141a8c;			/* Dark blue */
		background-color: #f8fdff;	/* Very light blue */
		padding: 0.45em 0.6em 0.15em 0.6em;
		margin: 40px 10px 10px 60px;
		float: left;
		border-color: #b0c0d5;  /* Darkerish blue. */
		border-style: solid;
		border-width: 0px 0px 1px 0px;
		}

.mainheader1 img {
		padding: 0.1em;
		float: left;
		}

.mainheader2 {
		padding: 0.1em;
		clear: both;
		}


/* ---------------------  Search  --------------------- */

.search {	float: right;
		}

.search input {
		background-color: #f8fdff;  /* Very light blue */
		font-size: 9.5pt;
		padding: 1px 2px 0px 2px;
		}

/* These don't work in IE6. Would have to use JavaScript. */

.search input:hover,
.search input:focus {
		background-color: white;
		border-color: #c00;  /* Red */
		}


/* ---------------------  Main Menu  --------------------- */

/* This Main Menu section is tricky. Works for up to two sub-levels of menu. */
/* Colour changes would be safe. Be careful of margin, padding, border changes. */
/* Study carefully and test any changes in several browsers before releasing. */ 
/* The submenus don't work in IE6. We would have to use JavaScript to make them work. */

.mainmenu ul,
.mainmenu ul ul,
.mainmenu ul ul ul {
		font-size: 10.5pt;
		background-color: #d4e2ec;  /* Darkish blue */
		padding: 1px;
		margin: 0;
		list-style: none;
		}
					/* Reduce the width and line-height for sub-menus. */
.mainmenu ul {
		line-height: 13pt;
		width: 10.6em;	/* The total width of a List-Item is defined here. This is from the */
					/* left edge of the left-hand List-Item margin to the right edge of */
					/* right-hand List-Item margin. */
		}

.mainmenu ul ul {
		line-height: 12pt;
		width: 9.6em;
		}

.mainmenu ul ul ul {
		line-height: 10pt;
		width: 8.6em;
		}


.mainmenu ul li,
.mainmenu ul ul li,
.mainmenu ul ul ul li {
		position: relative;
		border: solid #b0c0d5;  /* Darkerish blue. */
		border-width: 1px 0.1em 1px 0.1em;	/* List-Item border widths defined here. */
								/* Top, Right, Bottom, Left. */
		background-color: #f4fafc;  /* Light blue */
		margin: 1px 0.1em 1px 0.1em ;  /* List-Item margin widths. Top, Right, Bottom, Left. */
		padding: 0px;
		}

.mainmenu ul selected.li,
.mainmenu ul ul selected.li,
.mainmenu ul ul ul selected.li {
		margin: 1px 0.1em 1px 1.1em ;
		}

.mainmenu ul li a,
.mainmenu ul ul li a,
.mainmenu ul ul ul li a {
		display: block;
		text-decoration: none;
		padding: 3px 0.7em 3px 0.7em;  /* Top, Right, Bottom, Left. */
		border: 1px solid #b0c0d5;  /* Darkerish blue. A border here supposedly solves an IE6 bug. */
		}

.mainmenu ul li a:hover,
.mainmenu ul li a:focus,
.mainmenu ul ul li a:hover,
.mainmenu ul ul li a:focus,
.mainmenu ul ul ul li a:hover,
.mainmenu ul ul ul li a:focus {
		/* Stop the general purpose a:hover spoiling our colour scheme etc. */
		color: #c00;  /* Red */
		background-color: white;
		border-color: #c00;  /* Red */
		text-decoration: none;
		}

.mainmenu ul li:hover,
.mainmenu ul li:focus,
.mainmenu ul ul li:hover,
.mainmenu ul ul li:focus,
.mainmenu ul ul ul li:hover,
.mainmenu ul ul ul li:focus {
		/* Hover occurs when the mouse is on or inside the border, not on the margin. */
		color: #c00;  /* Red */
		background-color: #f8fdff;  /* Very light blue */
		border-color: #141a8c;  /* Dark blue */
		}

.mainmenu ul li ul,
.mainmenu ul li ul li ul {
		display: none;  /* Drop-down menu hidden until hover occurs below. */
		margin: 0px;  /* A non-zero margin will need to be subtracted from left and top below. */
		}

/* Absolute position the drop-down menus. */
.mainmenu ul li ul {
		position: absolute;  /* Absolute to the top left point just inside the border of the List-Item. */
		left: 10.3em;	/* To make the drop-down menu appear precisely next to the border of the */
					/* hovered List-Item set this value to to (List-Item total width) - */
					/* (List-Item left-hand border width) - (List-Item right-hand margin width) - */
					/* (List-Item left-hand margin width). */
					/* If there is a gap between the hovered List-Item and the drop-down menu a */
					/* mouse event may touch the gap and the drop-down menu disappear before */
					/* the mouse reaches it. Expressed in em to stretch with font size. */
					/* Note that using a different font or font-size for the sub-menu will throw the */
					/* calculations because this em is for this sub-menu font and the other em is */
					/* for the main menu font. */
		top: -4px;		/* To make the top of the drop-down align with the top of the border */
					/* of the hovered List-Item set this to -(List-Item top border height). */
					/* Subtracting an 'li a' top margin too makes the borders align? */
		}
.mainmenu ul li ul li ul {
		position: absolute;
		left: 9.3em;
		top: -4px;
		}

.mainmenu ul li:hover ul {	/* Unfortunately doesn't seem to work with focus so no keyboard access to sub-menu. */
		display: block;	/* We have to provide a sub-page for every item which shows a copy of the sub-menu. */
		}			/* Drop-down menu now displayed. Except IE5 and IE6 which aren't capable of proper CSS. */

.mainmenu ul li:hover ul li ul {
		display: none;
		}

.mainmenu ul li ul li:hover ul {
		display: block;
		}

/* Fix for IE. Hidden from IE Mac. \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%;}
/* End */

/* Fix for IE. Hidden from IE Mac. \*/
* html ul li { float: left; }
/* End */

.mainmenu {	float: left;
		position: absolute;	/* Gap fix. */
		margin: 0.2em 0.4em 0.4em 0.1em;
		}

/* Relative position the selected menus. They stay open permanently. */
.mainmenu ul li.selected,
.mainmenu ul li ul li.selected {
		display: block;
		position: relative;
		left: 0px;
		top: 0px;
		font-weight: normal;
		}

.mainmenu ul li ul.selected,
.mainmenu ul li ul li ul.selected {
		display: block;
		position: relative;
		left: 0.52em;
		top: 0px;
		font-weight: normal;
		}

.mainmenu ul li a.selected,
.mainmenu ul li ul li a.selected {
		display: block;
		position: relative;
		left: 0px;
		top: 0px;
		font-weight: normal;
		}

.mainmenu ul li.selected,
.mainmenu ul li a.selected,
.mainmenu ul li ul li.selected,
.mainmenu ul li ul li a.selected {
		background-color: white;
		font-weight: bold;
		}

.mainmenu ul li:hover ul li ul.selected {
		display: block;
		}



/* ---------------------  Main Text --------------------- */

/* We will need more styles here as the content becomes more elaborate. */

.maintext {	clear: right;
		background-color: white;
		margin: 0.4em;
		margin-left: 20%;
		margin-right: 20%;
		margin-bottom: 2em;
		padding: 2em;
		border-color: #b0c0d5;  /* Darkerish blue. */
		border-style: solid;
		border-width: 1px 0px 0px 0px;
		}

.maintext img {
		float: left;
		margin: 1em;
		border-color: #141a8c;  /* Dark blue */
		border-style: solid;
		border-width: 1px 1px 1px 1px;
		}

/* Cancel the float in the mainmenu section above. */
.maintext ul li {
		float: none;
		}


/* -----------------  Flash Bulletin button  -------------- */

/* Switch the class from 'newbulletin' to 'nonewbulletin' to make it disappear. */

.newbulletin {
		float: right;
		font-size: 14pt;
		margin: 3px;
		margin-right: 3em;
		padding: 2px 1px 3px 3px;
		color: yellow;
		background-color: #f00;  /* Red */
		font-weight: bold;
		}

.newbulletin a {
		margin: 2px;
		border-color: #d4e2ec;  /* Darkish blue */
		border-style: solid;
		border-width: 1px;
		background-color: white;
		font-size: 10pt;
		text-decoration: none;
		padding: 2px 6px 2px 6px;
		}

.newbulletin a:hover,
.newbulletin a:focus {
		border-color: #141a8c;  /* Dark blue */
		}

.nonewbulletin {
		float: right;
		font-size: 8pt;
		margin: 3px;
		margin-right: 3em;
		padding: 0;
		color: #d4e2ec;  /* Darkish blue */
		background-color: #d4e2ec;  /* Darkish blue */
		font-weight: normal;
		}

.nonewbulletin a {
		color: #d4e2ec;  /* Darkish blue */
		background-color: #d4e2ec;  /* Darkish blue */
		}

.nonewbulletin a:hover,
.nonewbulletin a:focus {
		color: #141a8c;  /* Dark blue */
		background-color: #f4fafc;  /* Light blue */
		}


/* ---------------------  Footer --------------------- */

.footer {	clear: both;
		text-align: center;
		}

.footer div {
		background-color: #f8fdff;  /* Very light blue */
		clear: both;
		width: 96%;
		margin-top: 0.4em;
		margin-bottom: 0.4em;
		margin-left: auto;
		margin-right: auto;
		padding: 0.2em;
		text-align: center;
		}

.footer div p {
		font-size: 8pt;
		line-height: 100%;
		letter-spacing: 1px;
		margin: 0.25em;
		padding: 0.1em;
		}

a.selected {
		background-color: white;
		font-weight: bold;
		}

