/* Local DAMTP styles - many nicked from Geography */
/* $Id: local.css,v 1.7 2010/06/28 16:32:31 werdna Exp df224 $
 Now held under RCS...
/*

/* 'Lines' table style */
table.lines {border-collapse: collapse; /* width: 95%; */}
.lines td, .lines th {border-bottom: 1px solid #e9e9e9; padding: 6px 4px 2px; vertical-align: top; text-align: left;}
.lines th {font-weight: bold;}
/* .lines td:first-child, .lines th:first-child {width: 150px;} */
.lines tr:first-child {border-top: 1px solid #e9e9e9;}
.lines td h3 {text-align: left; padding-top: 20px;}
.lines p {text-align: left;}
.lines td.noline {border-bottom: 0;}
table.lines td.value p:first-child {margin-top: 0;}
table.lines td.value p:last-child {margin-bottom: 0;}

.error {color: red; }

/* 'Admin list' table style */
table.lines2 {border-collapse: collapse; /* width: 95%; */}
.lines2 td, .lines2 th {border-bottom: 1px solid #e9e9e9; padding: 0.5ex 0.5em; vertical-align: top; text-align: left;}
.lines2 th {font-weight: bold;}
/* .lines td:first-child, .lines th:first-child {width: 150px;} */
.lines2 tr:first-child {border-top: 1px solid #e9e9e9;}
.lines2 td h3 {text-align: left; padding-top: 20px;}
.lines2 p {text-align: left;}
.lines2 td.noline {border-bottom: 0;}
table.lines2 td.value p:first-child {margin-top: 0;}
table.lines2 td.value p:last-child {margin-bottom: 0;}

.error {color: red; }

/* Images */
img, img.photo {border-color: #aaa;}

/* Images */
img, img.photo {border-color: #aaa;}
span.photograph, .stafflist span.photograph {border: 1px dashed #eee; display: block; margin-bottom: 20px;}
img.intphoto {
 clear: none;
 float: left;
 height:150px;
 margin:0; padding:0 0 0 0;
 border: 0;
}
img.default {
 /* {border-color: #aaa;} */
 clear: none;
 float: none;
 margin:0; padding:0 0 0 0;
 border: 0;
}


/* Sidebar */
#sidebar {float: right; width: 20%; margin: 1.2em 0 10px 22px; padding: 0 0 25px 15px; border-left: 1px solid #f0f0f0; background-color: white;}
#sidebar * {line-height: 1.5em; text-align: left;}
#sidebar p {margin-top: 0;}
#sidebar h3 {font-size: 1.55em; padding: 0; margin-bottom: 8px; line-height: 1.2em;}
#sidebar > h3:first-child {margin-top: 0;}
#sidebar ul {margin-top: 0; margin-left: 10px; padding-left: 7px;}
#sidebar li {margin-top: 5px;}
#sidebar dl {margin-top: 0;}
#sidebar dt {margin-top: 10px; font-weight: normal;}
#sidebar dd {margin-top: 0px; text-align: right; font-style: italic;}

/* Biography pages */
#sidebar {font-size: 0.87em;}
#sidebar ul#contacts {margin-left: 0; padding-left: 0;}
#sidebar ul#contacts li { list-style: none;}
#sidebar p {margin-top: 1.5em;}
#sidebar acronym {border-bottom: 1px dashed #ccc;}
/* #sidebar img, body.people #sidebar span.photograph, .stafflist span.photograph {width: 100px; height: 120px;} */
/* #sidebar img.larger, body.people #sidebar span.photograph {width: 150px; height: 180px;} */
#sidebar img {border: 1px solid gray; margin-bottom: 15px;}
#sidebar span.photograph, .stafflist span.photograph {border: 1px dashed #eee; display: block; margin-bottom: 20px;}
#sidebar {width: 25%;}
#sidebar address {font-style: normal; margin-top: 0.2em; margin-bottom: 0.2em;}
#sidebar span.address, body.people #sidebar address {display: none;}
#sidebar address.addressvisible {display: block;}
#sidebar p.jumpto {padding-top: 1em;}

/* for having different types of bullets  */
/* ul li { list-style:circle; } */

/* = Adds GTM research section */
div.resgroup {
	margin: 3px;
	padding: 10px;
	width: 100%;
	border-top: solid 1px #cccccc;
	clear: both;
}

div.resgroup img {
	clear: none;
	float: left;
	float:left;
	width:150px;
	margin:0; padding:10px 0  0 0;
}

div.resgroup h2 {
	clear: none;
	margin-top: 5px;
	padding-top: 0px;
}

div.resgroup div.resgroupdesc {
	margin: 0 180px;
}

div.resgroup div.resgrouplist  {
	float: right;
	padding: 0;
	width: 200px;
	margin: 20px;
	}

div.resgrouplist ul li { list-style: none; }

div#banner h2 {
	min-height: 2.5em;
	padding: 15px;
	margin-bottom: 0;
}

div #banner img {
	margin-left: auto;
	margin-right: auto;
}

div#content-primary p img {
        float: right;
        border: 5px solid #dbd7cc;
        margin-left: 20px;
        margin-bottom: 1.125em;
/* Override an earlier styleseet??? */
        display: inline;
        clear: both;
}

div#content-primary p img.photo {
        border: 0px;
        margin-left: 0px;
        margin-bottom: 1.125em;
        display: inline;
        clear: both;
}

div#content-primary p img.right {
        float: right;
        border: 5px solid #dbd7cc;
        margin-left: 20px;
        margin-bottom: 0em;
/* Override an earlier styleseet??? */
        display: inline;
        clear: both;
}

/* Caption for right side image */
div#content-primary p.captionright {
        float: right;
        display: inline;
        clear: both;
	font-size: 0.6em;
	padding: 0px;
}

div#content-primary p img.left {
        float: left;
        border: 5px solid #dbd7cc;
        margin-right: 20px;
	margin-left: 0px;
        margin-bottom: 1.125em;
        display: inline;
}

div#content-primary ul li li {
	list-style:disc;	
}

/* code to provide quick two-column layout */

div.twocols {
	width: 100%;
	}

div.col {
	width: 50%;
	float: left;
	}

/* JSP computingnews class added to implement what SJC/PHH asked for */
body[class="two-col dept"] ul.computingnews {
	/* use this much of the column when in 2-col format */
	width: 40%;
	/* Avoid boxes getting too small to display common titles */
	min-width: 33em;
}
body[class="three-col dept"] ul.computingnews {
	/* use this much of the column when in 3-col format */
	width: 60%;
	/* Avoid boxes getting too small to display common entries */
	min-width: 32em;
}

/* For urgent news items - red(ish) to show they are 'important' */
ul.computingnews li.urgentnews {
	border: 1px solid #F7CCCC;
	font-weight: bold;
	margin-bottom: 1px;
	background: #F7CCCC;
}

ul.computingnews li.urgentnews a {
	display: block
}

/* fiddle the colours on hover to make the text a bit more visible */
ul.computingnews li.urgentnews a:hover{
	background: #FFEEEE;
	color:#036;
}

/* For new news items - yellow to show they are 'recent' */
ul.computingnews li.newnews {
	border: 1px solid  #F7F7CC;
	font-weight: bold;
	margin-bottom: 1px;
	background: #F7F7CC;
}

ul.computingnews li.newnews a {
	display: block
}

/* fiddle the colours on hover to make the text a bit more visible */
ul.computingnews li.newnews a:hover{
	background: #FFFFEE;
	color:#c60;
}

/* For older news items - blue to show they are 'cold'  */
ul.computingnews li.oldnews {
	border: 1px solid #f1f5ff;
	font-weight: bold;
	margin-bottom: 1px;
	background: #f1f5ff;
}

ul.computingnews li.oldnews a {
	display: block
}

/* fiddle the colours on hover to make the text a bit more visible */
ul.computingnews li.oldnews a:hover{
	background: #fff;
	color:#c60;
}


/* another test - add a div type for centering paragraphs, tables and
   images for use in computing pages etc, it also changes the tables
   colours and borders!  Also add one for dcnews for news items so
   that tables actually show up - by default in the style we are using
   they don't! */
div.dccent p, div.dccent table, div.dccent th, div.dccent td, div.dccent img,
div.dcnews table, div.dcnews th, div.dcnews td,
div.dccomp table, div.dccomp th, div.dccomp td {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	margin-bottom: 1em;
}

/* Alter min height for pre block to stop 1 line pre blocks from being
   stupid */
div.dccent pre, div.dcnews pre, div.dccomp pre {
	min-height: 2em;
}

/* set a min-width for the dcnews tables */
div.dcnews table, div.dccomp table {
	min-width: 55%;
}
div.dccent table, div.dcnews table, div.dccomp table {
	border: 1px solid black;
}

div.dccent th, div.dccent td, div.dcnews th, div.dcnews td  {
	padding: 0.1em 1.2em 0.1em 1.2em;
	border: 1px solid black;
}
div.dccomp th, div.dccomp td  {
	padding: 0.1em 0.15em 0.1em 0.15em;
	border: 1px solid black;
}
div.dccent th, div.dcnews th, div.dccomp th {
	font-weight: bold;
	background: #f1f5ff;
}
div.dccent td, div.dcnews td, div.dccomp td {
        background: #f9f9f9;
}
div.dccomp tr.dcoff td {
        background: #f9f0f0;
}

/* left hand side nav menu hightlight for hover - mr349, 03/11/2008 */
ul#nav-primary li a:hover, ul#nav-primary li.active a:hover {
        background: #fff;
        color:#c60;
}

div #nav-search {
	border-top: 2px;
	border-bottom: 1px;
	margin: 0.15em 0 50px 0;
	clear: both;
	width: 100%;
}

body.one-col div#nav-search {
	display: none;
}

body.two-col div#nav-search {
	float: left;
	width: 22%;
	padding-left: 0;
}

/* profile editing */
.edit { 
	cursor: pointer; 
	color: black;
	border: 1px dashed black;
}

.noedit { 
	cursor: default;
	/* color: default; */
}

.textInput
{
	border: 1px dashed black;
	background: white;
	color: black;
	font-size: 1.1em;
}

.comboInput
{
	background: white;
	color: black;
	font-size: 1.1em;
	width: 230px;
}

.comboInputSmall
{
	background: white;
	color: black;
	font-size: 1.1em;
	width: 150px;
}

.photofile {	
	border: 1px dashed black;
	background: white;
	color: black;
	font-size: 1.1em;
}

.colorbar {
/*        background: #cFF; */
        color:#c60;
}

/* photo and table style for photos on /internal/ page  */
img.photo {
        border: 0;
        clear: both;
        height: 200px;
        margin: 0 0 0 0;
        display: inline;
        float: none;
        clear: none;
}

table.photo {
	border-collapse: separate;
        border-spacing: 0;
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0; 
        vertical-align: baseline;
}

/* jp107 added these to make the stuff in /internal/ work when viewed in
   seamonkey too - 2009-02-05 */
div.damtpphoto {
	width: 100%;
	float: left;
	border: 0;
        border-spacing: 0;
        margin: 0;
        padding: 0;
}
div.damtpphoto img {
        height: 200px;
}

/* =Computing SEARCH-FORM
----------------------------------------------- */

form.dcsearch {
        font-size: 0.75em;
        width: 100%;
        border: 0;
        border-spacing: 0;
        margin: 0;
        padding: 0;
}

form.dcsearch label {
        color: #999999;
}

form.dcsearch #search-term {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 1em;
        border: 1px solid #CCC;
        padding: 2px;
        /* amended by DMR (Studio24) 24.01.08*/
        width: 20em;
}

form.dcsearch #search-button {
        position: relative;
        top: 6px;
}

/*text decoration changed 2.2 hvs*/
form.dcsearch a {
        font-weight: bold;
        font-size: 0.9em;
        display: block;
        margin-left: 2.5em;
        padding-left: 15px;
        background: url(../images/icon-arrow-nav-primary.gif) no-repeat 0 6px;
        text-decoration: none;
}

form.dcsearch a:hover {
        text-decoration: none;
}

/* for the search form */



/* =nav-primary sub-sub-nav (third level)
addition by mr349, 30/10/2008 (copied from chemestry)
-------------------------------------------------------------- */

ul#nav-primary li.active ul li ul,
ul#nav-primary li ul li ul{
        font-size: 0.8em;
        list-style-type: none;
        margin: 5px;
        padding: 0 0 0 0;
}

ul#nav-primary li.active ul li ul li,
ul#nav-primary li ul li ul li {
        border: none;
        border-top: solid #E8F0FF 1px;
        padding: 2px 0 2px 0;
}

/* Style for unselected third-level nav link */
ul#nav-primary li.active ul li ul li a,
ul#nav-primary li.active ul li ul li a:hover,
ul#nav-primary li ul li ul li a,
ul#nav-primary li ul li ul li a:hover {
        padding: 0 20px 0 45px;
        border: none;
        color: #036;
		font-size: 1.3em;
}

ul#nav-primary li.active ul li ul li a:hover,
ul#nav-primary li ul li ul li a:hover {
        color: #c60;
        text-decoration: underline;
}


/*-------------------------------------------------------------*/
ul#nav-tabbed li a:hover {
	background: #036 url(../images/bg-tab-right-over.gif) no-repeat 100% 0;
}

ul#nav-tabbed li a {
	background: #06c url(../images/bg-tab-right.gif) no-repeat 100% 0;
}

ul#nav-tabbed li.active a {
	background: #b2ccff url(../images/bg-tab-right-active.gif) no-repeat 100% 0; border-top: 0px white solid; margin: 0 2px;
}

/*------------------------------*/
/* =NAV-TABBED2
-------------------------------------------------------------- */

ul#nav-tabbed2 {
	list-style-type: none;
	margin: 1em 0 2em 0;
	padding: 0;
	background: white;
	font-family: Arial, Helvetica, sans-serif;
	clear: both;
	width: 100%;
	overflow: hidden;
}

ul#nav-tabbed2 li {
	float: left;
	margin-right: 1px;
	margin-bottom: 1px;
}

ul#nav-tabbed2 li a {
	color: white;
	background: #81adb5 url(../images/bg-tab-right.gif) no-repeat 100% 0;
	display: block;
	padding: 0.6em 20px 0.45em 20px;
	position: relative;
	text-decoration: none;
}

ul#nav-tabbed2.az li a {
	padding: 0.6em 9px 0.45em 9px;
	font-size: 0.9em;
}

ul#nav-tabbed2 li a span {
	background: url(../images/bg-tab-left.gif) no-repeat 0 0;
	width: 5px;
	height: 5px;
	position: absolute;
	top: 0;
	left: 0;
}

ul#nav-tabbed2 li a:hover {
	text-decoration: none;
	background: #4f8d97 url(../images/bg-tab-right-over.gif) no-repeat 100% 0;
}

ul#nav-tabbed2 li a:hover span {
	background: url(../images/bg-tab-left-over.gif) no-repeat 100% 0;
}

ul#nav-tabbed2 li.active a {
	background: white url(../images/bg-tab-right-active.gif) no-repeat 100% 0; border-top: 1px #ccc solid; margin: 0 2px; /*temp fix - hvs*/
	color: #333;
	font-weight: bold;
}

ul#nav-tabbed2 li.active a span {
	background: url(../images/bg-tab-left-active.gif) no-repeat 100% 0;
}

ul#nav-tabbed2 li a:hover {
	background: #036 url(../images/bg-tab-right-over.gif) no-repeat 100% 0;
}

ul#nav-tabbed2 li a {
	background: #06c url(../images/bg-tab-right.gif) no-repeat 100% 0;
}

ul#nav-tabbed2 li.active a {
	background: #b2ccff url(../images/bg-tab-right-active.gif) no-repeat 100% 0; border-top: 0px white solid; margin: 0 2px;
}

/*-------------------------------------------------------------*/

/* these are essentially the same as definitions from purecontent.css but
   affecting a "span.person" rather than a "div.person" - the content below is
   only used for media="screen" so was not used when printing, so there is also
   a copy of this in print.css - by contrast purecontent.css is used for all
   media types. */

div.stafflist div.person img.larger { margin-left: auto; margin-right: auto; }
div.stafflist span.person img.larger { margin-left: auto; margin-right: auto; }
div.stafflist span.person { text-align: center; }
.stafflist span.person { height: 232px; float: left; width: 160px; border/*-bottom*/: 1px solid #ddd; padding: 10px 10px 0; margin: 0 10px 10px 0; cursor: pointer}
.stafflist span.person:hover {background-color: #fcfcfc; border-color: #aaa;}
.stafflist #hod span.person {margin-top: 0; height: 160px;}
.stafflist span.person h3 {text-align: center; margin: 0;}
.stafflist span.person p {text-align: center; margin-top: 11px; line-height: 1.5em;}
.stafflist span.person img, .stafflist span.photograph { 
	text-align:center;
	height: 160px; 
	margin-top:5px;
	margin-bottom:0px;
	padding:0px;
	border: 1px solid #999; }

div#content-primary dl.menu dd a.twitter {
    background: none;
    display: inline;
    padding: none;
    text-decoration:none;
}



/*---------------------------------------------------------------*/
/* menu SEARCH-FORM
----------------------------------------------- */

form.mnsearch {
        font-size: 1em;
        width: 100%;
        border: 0;
        border-spacing: 0;
        margin: 10px;
        padding: 0;
}

form.mnsearch label {
        color: #999;
}

/* jp107 hacked these two to avoid the name clash with the same id's
   used elsewhere, see also changes to htdocs-damtp/sitetech/menu.html
*/
form.mnsearch #sec-search-term {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 1em;
        border: 1px solid #CCC;
        padding: 2px;
        /* amended by DMR (Studio24) 24.01.08*/
        width: 78%;
}

form.mnsearch #sec-search-button {
        position: relative;
        top: 6px;
	left: -10px;
}

/*text decoration changed 2.2 hvs*/
form.mnsearch a {
        font-weight: bold;
        font-size: 0.9em;
        display: block;
        margin-left: 2.5em;
        padding-left: 15px;
        background: url(../images/icon-arrow-nav-primary.gif) no-repeat 0 6px;
        text-decoration: none;
}

form.mnsearch a:hover {
        text-decoration: none;
}

/* for the search form */

/* 30/04/09 Rui */
pre { min-height: 2em; }