/* Copyright (c) 2005-2008 Smart Media Limited. All Rights Reserved */
/* 070722 JoLe changing to the new visuals */
/* ======== Set defaults for the body ======== */

body
{
	margin: 0 20px;
	padding: 0;
	background: #fff url(../images/ukela/bggrad.gif) repeat-x top left;  
}


#page 
{
 padding: 2px 2px 0 15px;
 margin: 0 auto;
 width: 97%; 
 text-align: left;
 background-color: #fff;
 border: 1px solid #ccc; 
}
* html #page  /* 071104 needs to be checked with IE7 !*/
{
/*width:995px;*/
}


form
{
	margin: 0;
}

p
{
	margin: 0 0 0 0;
}



/* ======== Setup layout containers ======== */





/* Hide divs used on printable version of page only */
#sentenceprinth, #sentenceprintf
{
	display: none;

}

/* Set margins on all of the main containers */
#header, #middlecontainer, #bottomcontainer, #footer
{	margin:0;
	padding:0;
	border:0;
}

/* Set minimum and dynamic widths on the main containers */
/* JF: #header did have min-width  of 748 but I think this is not used, so set as 758 also */
#header,  #bottomcontainer, #footer
{
	xmin-width: 975px;
	xwidth: 978px;
	xwidth: expression(document.body.clientWidth < 780? "978px": "100%" );
	background-color: #fff;
}

/* JF: #toplinkblack not actually referenced in any templates, so removed from this item */
#bottom, #copyright
{
	margin: 0;
	background-color: #fff; /* use F5F2E3 for home page */
}

/* Perform clears after certain containers */
#bottomcontainer, #footer, #middlecontainer
{
 clear: both;
}
#middlecontainer
{
}

#bottomcontainer
{
}

#footer
{
	padding-top: 10px;
	margin-top:2px;
	border-top: 1px solid rgb(188,222,163);
	margin-right:0;
	
}


/* ======== Styles for items in #header ======== */

/* Main divs in #header */
#header
{
	margin:0;
	padding:0;
	border-bottom:3px solid rgb(188,222,163);
	float: left;
	background: url(../images/ukela/bgtop.jpg) no-repeat top right;
	margin-bottom:4px; /*080331 */
	width:100%;
}

#headerL
{
	margin:0;
	padding:0;
	float: left;
	width: 148px;
	margin-bottom:0;
	padding-bottom:0;
	border:0;
}

#headerL2
{
	padding-top: 45px;
	padding-left: 30px;
	float: left;
}

#headerM
{
	float: right;
	margin:0;
	padding:0;
	xwidth:756px;
	xmargin-left:219px;					 
	border:0;
}


/* Components of #headerL div */
#headerM img, #headerL img, #headerM a, #headerL a
{
	margin: 0px;
	padding:0px;
	border:0;
}

/* Used under the top navigation list, so that next element appears in corect positioning (the next elements are different
   depending on if on homepage or not, so added to class rather than a specific id) */
.aftertopnav p
{
	clear: both;
	margin:0;
	padding:0;
	height:1px;
}

#youarehere
{
	clear:both; /*080408 fixed safari */
	font-size:0.9em;
	padding: 0px 0 6px 0;
	
}

#youarehere ul
{
	margin: 0;
	padding: 0;
	display: inline;
	font-size:0.9em;
}
#youarehere ul li
{
	display: inline;
	padding-left: 12px;
	padding-right: 4px;
	
}
#youarehere span
{
	display: block;
	xfloat: right;
	margin: 0;
	margin-left: 10px;
	margin-right: 5px;
}
#youarehere span strong
{
	font-weight: normal;
}
#youarehere span strong a
{
	padding-left: 6px;
	padding-right: 6px;
}


#youarehere #icons img
{
	margin:0 15px;
}


#youarehere { border: 0px }
#youarehere ul li { background: url(../images/gw/defaulthome.gif) no-repeat 0.1em 0.3em;}
#youarehere ul li.firstli {  }
#youarehere ul li a:link, #youarehere ul li a:visited { color: #7a7a7a; text-decoration : none; }
#youarehere ul li a:hover, #youarehere ul li a:active { color: #7a7a7a; text-decoration : underline; }
#youarehere ul li a:active{ color: #7a7a7a; text-decoration : none; }
#youarehere span { color: #000; }
#youarehere span a:link, #youarehere span a:visited, #youarehere span a:hover, #youarehere span a:active
{
	color: #000;
	text-decoration: none;
}

#date
{
	font-family: verdana, arial, helvetica, sans-serif;
	font-size:0.6em;
	color: rgb(34,46,107);
	padding: 10px 0 2px 4px;
}

#leftcolumn
{
	width: 148px; /*(was 148)*/
	float: left;
	margin:0;
	padding:0;
	border:0;
}



/*** Font sizes ***/
#youarehere
{	font-size: 70%;
	font-family: Verdana, Arial, helvetica, sans-serif;
}

#navcontainer
{	font-size: 80%;
}	

	
#bottom
{	font-size: 70%;
	font-family: Verdana, Arial, helvetica, sans-serif;
	
}

#footer	
{	font-size: 70%;
	font-family: Verdana, Arial, helvetica, sans-serif;
	
}




/* Content */


#middle
{
xfloat:left; /*080408 disabling this stops IE7 from having spurios right margin */
border:0;
margin:0;
padding:0;
}

#middle #content
{
	margin: 0;
	padding-left:20px;
	border:0;
	margin-left:148px; 
	xfloat:right; /*080408 */
	font-family: Verdana, Arial, helvetica, sans-serif;
	color: #000;
	font-size: 80%;
	line-height:1.4em;
	xborder:2px #f00 solid;
	xposition:relative;
	xmin-height:400px;
	}


 
/* Class added to turn off margin and background image for #elements */
#middle #content #elements.nogapunderheading
{
	margin-top: 0;
	padding-top: 0;
	background-image: none;
}


#content a, #footer a {color: #00672f; }
#content a:link, #footer a:link { text-decoration: underline; }
#content a:visited, #footer a:visited {color: #003366; }
#content a:hover, #footer a:hover{ color: #00a200; }
#content a:active,#footer a:active { color: #00a200; }


/****** FILE UPLOADS AND LINKS ************/

#content p.linkpara 
{
margin:0;
font-weight:bold;
xcolor: rgb(105,126,142); 
}

#content #elements p.linkpara 
{
padding-left:1.4em;
display: block;
background: url(../images/ukela/arrow_button.gif) no-repeat 0 0.2em;
margin-top:0.5em;
margin-left:0.4em; /*080328 */
margin-bottom:1em; /*080403 */
}



#listregann 
{
margin:0;
padding:0;
}

#listregann li, #listregann li a
{
list-style:none;
font-weight:bold;
margin:0;
padding:0;
}
#listregann a:link, #listregann a:visited
{
padding-left:12px;
background: url(../images/ukela/greyarrow.gif) no-repeat 0px 4px);
}


/***************  RIGHT HAND SIDE ********************/

#content #rhs
{
margin:0;
padding:0;
width:210px;   /*100609 was 200 px */
float:right;
margin-left:1em; /*080408 */
}
#content #rhs p.linkpara
{
margin-left:0em; /*080328 */
}
#content #rhs img
{
margin-bottom:30px;
}

#content #rhs dl
{
 padding: 0;
 margin: 0;
}

#content #rhs p
{
margin:0;

}

/***************** END RHS *********************/

#content h1
{
	font-size: 1.2em; 
	font-weight:bold; 
	margin: 0 0 15px 0; 
	padding: 6px 10px 6px 10px;
	color: rgb(29,43,105);
	background-color: rgb(156,207,120);
	background-image: url(../images/ukela/bgh1.gif);
	background-repeat: repeat-x;
	background-position: top left;
	
}

#content h2
{
	font-size: 1.1em;  
	font-weight: bold; 
	margin: 0;
	padding:0;
	padding-bottom:4px;
}
	
#content h3
{
	font-size: 1.0em;  
	font-weight: bold; 
	margin: 0;
	padding-bottom:4px;
}

	
#content h4
{
	font-size: 0.9em;  
	font-weight: bold; 
	margin: 0;
	padding-bottom:4px;
}

/************* CONTENT IMAGES *************/

/* images should be also in std definition */
.imagerightcaptioned, .imageleftcaptioned, .imagerightcaptioned a, .imageleftcaptioned a
{
  color:rgb(159,64,0);
}

.imagerightcaptioned, .imageleftcaptioned
{
  font-size: 0.85em;
 }

.imagerightcaptioned, .imageright
{
  margin-left:6px;
  xborder:1px solid #CDC78D;
  padding:2px;
}
.imageleftcaptioned, .imageleft
{
  margin-right:8px;
  border:1px solid #adadad;
  padding:2px;
  margin-bottom:0.6em;
}

/***************  recent news ***************/

.recentnews
{
	font-family: verdana;
	color: #000;
	margin:0 0em 0.4em 0.4em;
	border: 1px solid #dadada;
	width: 95%;
}


#content .recentnews h3
{
	font-size: 0.9em;
	background: url(../images/ukela/nfheaderbggrey.jpg) repeat-x top left;
	color:#060;
	margin:0;
	padding:1px 6px 1px 6px;
	border-bottom:1px solid #dadada;
	
}
.recentnews ul
{	
margin:0;
padding:0;
margin-top:0.6em;
}
.recentnews li
{
list-style:none;
padding: 0 4px 4px 1.4em;
display:block;
background: no-repeat url(../images/ukela/green_arrow.gif) 0.4em 0.6em;
font-size:0.9em;
line-height:1.4em;
}

.recentnews .reldate
{
font-size:0.8em;
nowrap;
}




/* ======== Styles for items in bottomcontainer ======== */

#bottomcontainer
{
clear:all;

}
#bottom
{
	padding-right:16px;
	text-align: right;
	margin-bottom: 8px;
	padding-bottom: 2em;	
}
#bottom ul
{
  margin: 0;
  padding: 0;
  list-style: none;
}
#bottom li
{
  margin: 0;
  padding: 8px 0 0px 0;
}
#bottom li.left
{
  float: left;
  padding-left:168px;
}
#bottom li.right
{
  float: right;
}
#bottom a
{
  xcolor: rgb(159,64,0);
}

/* ======== Styles for items in footer ======== */

#footer
{
	padding-top: 4px;
	padding-bottom: 6px;
	text-align: center;
	clear:all;
	}

#footer a:link, #footer a:visited
{
text-decoration:none;
}	

/* JF: Where is the edit class used? */
.edit
{
	font-size: 1.2em;
}


#content
{
  position:relative; 
}
#elements
{
  position:relative; /* required otherwise IE6 content disappears! */
  xfloat:left; /*080408 */

}

#elements p
{
margin-bottom:1em;
}

#middle #content #elements
{
 	padding-top: 0px; /* 060703 JoLe */
  	padding-right:1em; /*080317 */
}




/* ======== General utility style for content objects ======== */

.smwsdatatable
{
  margin: 0;
  padding: 0;
  font-size: 1.1em;
}
.smwsdatatable th
{
  text-align: left;
}
.smwsdatatable th, .smwsdatatable td
{
  padding-left: 0;
  padding-right: 8px;
  padding-top: 0;
  padding-bottom: 5px;
  vertical-align: top;
}

/* JF: Is normalsubheading used from anywhere? */
.normalsubheading
{
	font-weight: bold;
}

/* ======== Form Styles ======== */
.smfcform fieldset
{
  margin: 0px;
  padding: 6px 6px 13px 6px;
  background-color:#daf2cb;
  border: 0;
}
.smfcform legend
{
  padding: 30px 0 0 2px;
  margin: 0;
  border: 0;
  xcolor: #fff;
  font-weight: bold;
  text-transform: uppercase;
}
/* IE, don't give padding at top of legend, and take off extraneous padding */
* html .smfcform legend
{
  padding: 0;
  margin-left: -4px;
}

.smfcform, .smftform
{
  margin: 0px;
}
.smfcform table
{
  font-size: 100%;
  xcolor: rgb(105,126,142);
  line-height: 1.8em;
}
.smfcform table table
{
  border: 0px;
  padding: 0;
}
.smfcform table td table td
{
  padding: 1px 3px 1px 3px;
}
.smfcform label, .smftform label
{
  font-weight: bold;
}
.smftform dl, .smftform dd
{
  margin: 0;
}
.smftform input, .smftform textarea
{
  width: 350px;
}
.smfcformmandatory, .smftformmandatory
{
  /*color: #d00;*/
}
.smfcformmandatory input, .smfcformmandatory textarea, .smfcformmandatory select,
.smftformmandatory input, .smftformmandatory textarea, .smftformmandatory select
{
  background-color: #eee; */#cbf2da;*/
}
.btn
{
  background-image: url(../images/ukela/btn_tl.gif);
  width: 7em;
  float: left;
}

/* optional class to not float buttons (when not used with smfc form) */
.btn.nofloat
{
  float: none;
}
/* When using btn on a smfc form, add margin to top.  */
.smfcform .btn
{
  margin-top: 10px;
}

.btn div
{
  background-image: url(../images/ukela/btn_tr.gif);
  background-position: top right;
  background-repeat: no-repeat;
}
.btn div div
{
  background-image: url(../images/ukela/btn_bl.gif);
  background-position: bottom left;
}
.btn div div div
{
  background-image: url(../images/ukela/btn_br.gif);
  background-position: bottom right;
  padding: 3px 0;
  text-align: center;
}
.btn input
{
  border: none;
  background: none;
  margin: 0;
  padding: 0;
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
}


/* ======== Specific styles for vacancies ======== */
.wsjobvacanciesdetaillist dt
{
	font-weight: bold;
}
.wsjobvacanciesdetaillist dd
{
	margin-left: 3em;
}

/* ====================== FAQ ========================= */
/* do not add a colour defs - inherits from content */
#content #elements .faq_dl
{
margin:0;
padding:0;
}

#content #elements .faq_dl dt
{
	padding-left:16px;
	background: url(../images/ukela/green_arrow.gif) no-repeat  0.5em .4em; /* of you set this on DT the first dt does not show it! */
	text-decoration: none;
	font-weight: bold;
	border:none;
	display:block;
	margin-bottom:0.6em;
}
#content #elements .faq_dl dd
{
margin-top: 0.4em;
padding-bottom: 1px;
padding-left: 1em;
background: no-repeat url(../images/bullits/a.gif) 0.5em 0.5em; 
xbackground-color:#F5F2E3;
}



/* ======== Common styles used on a number of the specific pages ======== */


/* Set the heading style on press release and event detail pages */
/* Note that #left_events h2 uses class so that style isn't set on other h2 used on events listing page. */
#left_press h2, #left_events h2.h2topofpage
{
	font-size: 1.3em;  font-weight: bold; margin: 0; text-transform: uppercase; letter-spacing: .1em; padding: 4px 4px 0px 0px; /* last value was 28px - why this different from normal page title definition? */
	
}


/* ======== Specific styles for Press Release Listing page ======== */

/* Settings for left and right columns on the press release page(s) */
#right_press
{
	background-color:#daf2cb; /* 080228 was bcdea3*/
	padding:0.8em;
	margin:0;
}

#pressreleaselist, .pressreleasesearchresults
{
	margin: 0;
	padding: 0;
}

#pressreleaselist dd, #pressreleaselist dt, .pressreleasesearchresults dd, .pressreleasesearchresults dt
{
	margin: 0;
	padding: 0 0 0 14px;
}

#pressreleaselist dd, .pressreleasesearchresults dd
{
	color: #5a5a5a;
	font-size: .9em;
	padding-bottom: 10px;
}
#pressreleaselist dt, .pressreleasesearchresults dt
{
	padding: 0;
}

#content #pressreleaselist dt a:link,
#content #pressreleaselist dt a:visited,
.pressreleasesearchresults dt a
{
	padding-left:16px;
	background: url(../images/ukela/green_arrow.gif) no-repeat  0.5em .4em; /* of you set this on DT the first dt does not show it! */
	text-decoration: none;
	font-weight: bold;
	border:none;
	display:block;
}

#content #pressreleaselist dt a:hover, .pressreleasesearchresults dt a:hover
{
	text-decoration: underline;
}

/* Links to archived/back to index */
a#archived, a#back_releases, a#back_archieved_index, a#back_index
{
	display: block;
	padding: 0px 4px;
	text-align: lef;
	font-weight: bold;
	text-decoration: none;
	xborder: 1px solid #f4f4f4;
	xbackground-color: #f4f4f4;
	font-size: .9em;
	color: #5a5a5a;
	xwidth: 15em;
}
a#back_releases
{
	width: 38em;
}
a#back_index
{
	xwidth: 337em;
}
a#archived:hover, a#back_releases:hover, a#back_archieved_index:hover, a#back_index:hover
{
	text-decoration: underline;
}


/* ======== Specific styles for Press Release details page ======== */

#left_press #left_right
{
	float: right;
	margin-left: 10px;
}
#left_press #left_left .normalpre, #left_press #left_left p
{
	xmargin-top: 20px;
	margin:0;
}
p#date_release, .reldate
{
	color: #5a5a5a;
	font-size: .9em;
	text-align: left;
	padding: 0;
	margin: 0;
	margin-bottom:1em;
	
}
#left_press #left_right #fileattachedcontainer
{
	text-align: right;
}
#left_press #left_right #fileattached
{
	background-color: #f4f4f4;
	border: 1px solid #7a7a7a;
	width: 14em;
	margin: 0 auto;
	text-align: left;
}
#left_press #left_right #fileattached h4
{
	margin: 0;
	padding: 0;
	font-size: 1em;
	text-align: center;
	border-bottom: 1px solid #7a7a7a;
	color: #3a3a3a;
}
#left_press #left_right #fileattached p.linkpara
{
	text-align: center;
}
#left_press #left_right #fileattached a
{
	text-decoration: none;
}
#left_press #left_right #fileattached a:hover
{
	text-decoration: underline;
}
#left_press #left_right #fileattached ul
{
	margin: 0;
	padding: 0;
	list-style: none;
}
#left_press #left_right #fileattached li
{
	margin: 0;
	padding: 2px 4px;
}


#pressreleaseinfolist
{
	margin: 0;
	margin-bottom: 20px;
	background-color:#daf2cb;
	padding:0.8em;
}
#pressreleaseinfolist dd
{
	margin: 0;
	padding: 0;
	padding-left: 4em;
}
#pressreleaseinfolist dt
{
	font-weight: bold;
	text-decoration: underline;
	margin-bottom: 4px;
}
#pressreleaseinfolist dd ul
{
	margin: 0;
	padding: 0;
	list-style: none;
}

#pressinfo, #pressdownloads, #presslinks
{
	background-color:#daf2cb;
	padding:0.8em;
}

/* ======== Specific Styles for use with Events ======== */
/* JF: These values are set for the press releases, are these different on the events page? They are set to different values but what are the effects? Answer: almost nothing, so removed to leave same as press release setting. */
/* JF: The values on the events stylesheet use em, so scale when enlarging font. Those for the press releases are fixed, and don't grow. Which is best? */
x#right_events
{
	float: right;
	width: 14em;
}
x#left_events
{
	margin-right: 15em;
	font-size: .9em;
}


#eventslist
{
	margin: 0;
	padding: 0;
	list-style: none;
}
#eventslist li
{
	color: #5a5a5a;
	margin: 0;
	padding: 0 0 10px 14px;
	background: #fff url(../images/bullits/red2arrows.gif) no-repeat 0 .55em;
}
#eventslist li a
{
	text-decoration: none;
	font-weight: bold;
}
#eventslist li a:hover
{
	text-decoration: underline;
}

#popupcalendar
{
  position: absolute;
  left: 0px;
  top: 0px;
  visibility: hidden;
  font-family: arial;
  background-color: #fff;
  border: 1px solid #c62a35;
  font-size: 1em;
  padding: 2px;
}
#popupcalendar table
{
  font-size: 1em;
  border-collapse: collapse;
}
#popupcalendar td
{
  text-align: center;
  width: 1.7em;
  height: 1.6em;
  padding: 0;
}
#popupcalendar th
{
  padding: 1px;
  font-weight: normal;
}
#popupcalendar tbody td a
{
  text-decoration: none;
  font-weight: bold;
  padding: 2px;
  width: 1.7em;
  color: #000;
}
#popupcalendar tbody td a:hover
{
  background-color: #c62a35;
  color: #fff;
}
#popupcalendar tfoot td a
{
  text-decoration: none;
}
#popupcalendar .seldate
{
  background-color: #c62a35;
}
#popupcalendar .seldate a
{
  color: #fff;
}
#popupcalendar .pastdate 
{
  color: #999;
}
#popupcalendar .pastdate a
{
  color: #999;
  font-weight: normal;
}
#popupcalendar thead a:hover
{
	font-weight: bold;
}
#popupcalendar tfoot a:hover
{
	text-decoration: underline;
}


/* ======== Specific styles to use on Event Details screen ======== */

.eventdets
{

}


#left_events #left_right
{
	float: right;
	width: 14em;
}
#left_events #left_left
{
	margin-top: 20px;
	margin-right: 15em;
}
#left_events #left_right p.eventdate
{
	color: #5a5a5a;
	font-size: .9em;
	padding-top: 10px;
	text-align: right;
	padding: 0;
	margin: 0;
}


#left_events #left_left h4
{
	margin: 0;
	padding: 0;
	font-size: 1em;
	text-align: center;
	background-color: #f4f4f4;
	color: #3a3a3a;
}
#left_events #left_left ul
{
	margin: 12px 0;
	padding: 0;
	list-style: none;
}


/************ SEARCH ON HOME PAGE **************/
#sitesearchform
{
  margin: 0;
  padding: 1em 0 0 1.6em; */080408 */
  font-size: 0.8em;
  color: rgb(0,107,30);
}
#sitesearchform dl
{
  margin: 0;
  padding: 0;
}
#sitesearchform dt
{
  margin: 0;
  padding: 0;
}
#sitesearchform dd
{
  margin: 0;
  padding: 0;
}
#searchbutton 
{
  xpadding-top:4px;
  margin:0px 0 0 3px;
  font-size: 0.75em;
}

.loginerror
{font-size:1.6em; color:#600;
padding-top:1em;
padding-bottom:1em;
line-height:1.1em;
}



/***************** Convenor details on the working party pages ***********/
#convenor
{
font-size:0.85em;
xtext-align:center;
}

#content #elements #rhs #right_press #convenor img
{
margin-top:1em;
margin-bottom:0;
}


#content #elements #rhs #right_press #convenor p
{
margin-top:1em;
}

#convenor h3
{
font-size:1.3em;
}

#loginform
{margin-top:1em;
}

#lhs
{float:left;
}