/* 
 ==========================================
 = Stylesheet for WUN
 = Ben Hayes, ILRT: ben.hayes@bris.ac.uk
 = Copyright 2009 University of Brisol
 ==========================================
*/

/* Eric Meyer's reset styles: */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, em, img, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } input, textarea { font-family: inherit; } body { color: black; background: white; } ol, ul { list-style: none; } table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; }

/* Disable above and enable the following for debugging in Firebug: */
/*
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, em, img, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; }
*/

/* =typography
 * =========================================== */
body, input, textarea, select {
	font-size: 13px;
	line-height: 20px;
	font-family: Verdana, sans-serif; 
	color: #000;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Franklin Gothic Medium', 'FranklinGothic-Medium', Arial, Verdana, sans-serif;
	color: #BD0025;
	margin: 20px 0 10px;
}

#content p, #content ul, #content ol, #content dl {
	margin: 10px 0;
}

h1 {
	font-size: 24px;
	line-height: 30px;
	font-weight: bold;
}

h2 {
	font-size: 19px;
	line-height: 25px;
	font-weight: bold;
}

h3, h4, h5, h6 {
	font-size: 17px;
	line-height: 20px;
	font-weight: bold;
}

.top, #content .top { margin-top: 0; }

#content #sidebar h2.top { margin-top: 5px; }

.tiny { font-size: 11px; }
.small { font-size: 12px; }
.large { font-size: 16px; }
.vlarge { font-size: 18px; }
.huge { font-size: 20px; }

strong { font-weight: bold; color: #555; }
.weak { color: #666; }
em { font-style: italic; }

.note { color: #666; font-style: italic; font-weight: normal; }

span.date, span.amount, span.phone { white-space: nowrap; }

cite { font-style: italic; }

#content ul {
	padding-left: 24px;
	list-style-type: disc;
}

#content ul.nav {
	padding-left: 0;
	list-style-type: none;
}

#content ul.events li {
		border-bottom: 1px solid #ddd;
		margin-top: 10px;
		padding-bottom: 10px;
}

#content ul.news li {
		border-bottom: 1px solid #ddd;
		margin-top: 10px;
		padding-bottom: 10px;
}

#content ul.events span.date {
		display: block;
		color: #666;
		font-size: 12px;
}

#content ul#results li {
		clear: left;
		border-bottom: 1px solid #ddd;
		margin-top: 10px;
		padding-bottom: 10px;
}

#content ul#results p {
		margin: 0;
}

#content ul#results p.title {

}

#content ul#results p.date {
		color: #555;
}

#content ul#results p.excerpt {
}

#content ul#results img {
		float: left;
		margin: 0 10px 0 0;
}

blockquote {
	font-style: italic;
	padding-left: 15px;
}

#sidebar blockquote { padding-left: 0; }


li ul, li ol {
	margin: 0;
}

ol {
	padding-left: 24px;
}

ol li {
	list-style-type: decimal;
}

ol li li {
	list-style-type: lower-alpha;
}

ol li li li {
	list-style-type: lower-roman;
}

dl dt {
		font-weight: bold;
		color: #666;
		margin-top: 10px;
}

/* =link styles
 * ====================================== */
a:link, a:visited {
	color: #005697;
	text-decoration: underline;
}

a:hover, a:active, a:focus {
	color: #BD0025;
}

a:focus, input:focus {
	outline: 1px dotted #1A49C0;
}



#content img {
	display: block;
	margin: 10px 0;
}

hr {
	height: 1px;
	border-width: 0;
	color: #ccc;
	background-color: #ccc;
	margin: 20px 0 20px;
	clear: left;
}



/* =layout (main layout styles)
 * =========================================== */

body {
	background: #287AB8 url(../images/background.png) left top repeat-x;
}

#wrapper {
	margin: 0 auto 20px;
	width: 976px;
}

#header {
		margin-top: 20px;
		width: 100%;
}

#logo {
		float: left;
		display: block;
		width: 300px;
		height: 59px;
		margin-bottom: 15px;
}

#page {
		clear: both;
		background-color: #fff;
		border-top: 9px solid #D10029;
		overflow: auto;
		width: 100%;
}

.home #page {
		border-top: none;
}

#sidenav {
		float: right;
		width: 248px;
}

#main {
/*		width: 724px;*/
		width: 709px;
		min-height: 400px;
}

#content #main .inner { padding: 20px 0 20px 20px; }

#sidebar {
		float: right;
		width: 225px;
}

#content #sidebar .inner { padding: 20px 20px 20px 0px; }

.nosidenav #content #sidebar .inner { padding-left: 20px; }

/* 3 col, with sidenav (e.g. Research group page)
 * =========================================== */

.threecol, .twocol {
		background: transparent url(../images/sidenav-bkgd.png) right top no-repeat;
		/*
		 background: transparent url(../images/grid.png) left top repeat-y;
		 */
}

.threecol #content, .twocol #content {
		width: 724px;
}

.twocol #content .inner {
		padding: 20px 10px 20px 20px;
}

.threecol #main {
		width: 480px;
}

/* without sidebar (e.g. List of research groups)
 * =========================================== */
.nosidenav {
		background-image: none;
		/*
		background: transparent url(../images/grid.png) left top repeat-y;
		*/
}

.nosidenav #content {
		width: 100%;
}

.nosidenav #sidebar {
		width: 260px;
}


/* =homepage
 * =========================================== */
.home {
		/*
		 background: transparent url(../images/grid.png) left top repeat-y;
		 */
}
#masthead {
		width: 936px;
		height: 242px;
		background: transparent url(../images/broadhorizon.jpg) center top no-repeat;
		margin: 20px auto 0;
}

.home #masthead h1 {
		text-indent: -999em;
		background: transparent url(../images/text-home-tagline.png) left top no-repeat;
		width: 503px;
		height: 51px;
		position: relative;
		top: 30px; left: 30px;
		margin: 0; padding: 0;
}

.home #content {
		padding: 0 15px 0 0;
}

.home #sidebar1 {
		background: #fff url(../images/bkgd-home-sidepanel.png) center top no-repeat;
		width: 230px;
		float: right;
		margin-top: 15px;
		margin-right: 10px;
}

.home #sidebar2 {
		background: #fff url(../images/bkgd-home-sidepanel.png) center top no-repeat;
		width: 230px;
		float: right;
		margin-top: 15px;
}

.home #sidebar1 .inner, .home #sidebar2 .inner {
		padding: 15px;
}

.home #main {
		width: 480px;
}

.home #main .more {
		margin-bottom: 20px;
		padding-bottom: 20px;
		border-bottom: 1px solid #e0e0e0;
}

.home #main .last {
		border-bottom-width: 0;
		padding-bottom: 0;
}




#footer {
	font-size: 12px;
	color: #E5EEF9;
	padding: 10px 20px 20px;
	overflow: auto;
}

#footer a:link, #footer a:visited { color: #E5EEF9; }
#footer a:hover { color: #fff; }

#footer p {
		float: right;
		width: 500px;
		text-align: right;
}

#footer li {
		float: left;
		background: transparent url(../images/topnav-pipe.png) right bottom no-repeat;
		padding: 0 0.5em;
}

#footer li.first { padding-left: 0; }
#footer li.last { background-image: none; }


#content .section {
	margin: 20px 0;
	clear: left;
	overflow: auto;
}

#main h1, #main h2, #main h3, #main h4 { clear: left; }

#content .subject {
		border-bottom: 1px solid #e0e0e0;
		margin: 0;
		padding-bottom: 10px;
}

#content .last {
		border-bottom-width: 0;
}


/* =nav
 * ========================================= */

#topnav {
		float: right;
		font-size: 14px;
		padding-top: 3px;
}

#topnav ul {
		float: right;
		clear: right;
}

#topnav li {
		float: left;
		background: transparent url(../images/topnav-pipe.png) right bottom no-repeat;
		padding: 0 0.5em;
}

#topnav li.last {
		background-image: none;
}

#topnav a:link, #topnav a:visited {
		text-decoration: underline;
}

#topnav li.current a:link, #topnav li.current a:visited {
	color: #BD0025;
		text-decoration: none;
}

#topnav li a:hover { text-decoration: underline; }

#topnav li.current a:hover { text-decoration: underline; }

ul#mainnav {
		clear: both;
		padding: 0; margin: 0;
		width: 100%;
		background: transparent url(../images/mainnav-bkgd.png) left bottom repeat-x;
		height: 39px;
}

#mainnav li {
		float: left;
		display: block;
		background-repeat: no-repeat;
		background-position: left top;
		background-color: transparent;
		height: 39px;
		margin: 0 2px 0 0;
}

#mainnav li a:link, #mainnav li a:visited {
		display: block;
		height: 39px;
		text-indent: -999em;
		overflow: hidden;
}

#mainnav li a:hover, #mainnav li.current, #mainnav li.current a:link, 
#mainnav li.current a:visited, #mainnav li a:focus {
		background-position: left bottom;
}

#mainnav li#about { margin-left: 20px; }

#about, #about a {
		width: 116px;
		background-image: url(../images/mainnav-tab-about.png);
}

#research, #research a {
		width: 100px;
		background-image: url(../images/mainnav-tab-research.png);
}

#challenges, #challenges a {
		width: 167px;
		background-image: url(../images/mainnav-tab-challenges.png);
}

#activities, #activities a {
		width: 98px;
		background-image: url(../images/mainnav-tab-activities.png);
}

#mobility, #mobility a {
		width: 181px;
		background-image: url(../images/mainnav-tab-mobility.png);
}

#resources, #resources a {
		width: 109px;
		background-image: url(../images/mainnav-tab-resources.png);
}

/* =sidenav
 * ========================================= */

#sidenav .inner { padding: 24px 1px 20px 0; }

#sidenav #back, #sidenav h2, #sidenav h3 {
		padding-left: 15px;
		padding-right: 15px;
}

#sidenav #back {
		margin-bottom: 10px;
}

#sidenav h2 {
		margin-top: 0;
}

#sidenav li {
}

#sidenav li a:link, #sidenav li a:visited {
		display: block;
		text-decoration: none;
		padding: 5px 15px 5px 15px;
		border-top: 1px solid #fff;
		font-weight: bold;
}

/* cmtsa: replaced current selector with active as generated by Drupal code */
#sidenav li.active a:link, #sidenav li.active a:visited {
}

#sidenav li a:hover, #sidenav li a:active, #sidenav li.active a:link, #sidenav li a.active:visited, #sidenav li a.active:link, #sidenav li a.active:visited {
	color: #BD0025;
	background-color: #ddd;
}

#sidenav li.active {
}

#sidenav li a span.date {
		color: #777;
		font-weight: normal;
}

/* Add styles for nested nav lists: */
#page #sidenav li li a {
		padding-left: 30px;
		font-weight: normal;
}

#page #sidenav li li li a {
		padding-left: 45px;
}

#sidenav li.active li a:link, #sidenav li.active li a:visited {
	color: #005A70;
	background-color: transparent;
}

#sidenav li.active li a:hover, #sidenav li.active li a:active, #sidenav li.active li a:focus {
	color: #BD0025;
	background-color: #ddd;
}

#sidenav ul#aux {
		margin-top: 10px;
}

#sidenav ul#aux li a {
		font-weight: normal;
}

#sidenav li.rss {
		display: block;
		padding-left: 15px;
}

#sidenav li.rss a:link, #sidenav li.rss a:visited {
		background: transparent url(../images/icon-rss.png) 0 10px no-repeat;
		padding-left: 20px;
		text-decoration: underline;
}

#sidenav li.rss a:hover, #sidenav li.rss a:focus {
	color: #BD0025;
}

/* =forms
 * ================================================== */

form {
	vertical-align: middle;
	background-color: #e2e2e2;
	padding: 10px;
	margin: 20px 0;
}

label {
	vertical-align: baseline;
	display: block;
}

input { 
	vertical-align: middle;
}

input.textbox, textarea {
	border: 1px solid #bbb;
	background-color: #fff;
	padding: 2px;
	color: #000;
}

#content ul.checkboxes {
	list-style-type: none;
	padding: 0;
}

ul.checkboxes label {
	color: #222;
}

#topnav form {
		background-color: transparent;
		float: right;
		clear: right;
		padding: 7px 0 0;
		margin: 0;
}

#topnav form label {
		position: absolute;
		left: -999em;
}

#topnav input.textbox {
		display: inline;
}

#topnav .button {
		display: inline;
}


/* =errors, warnings, etc
 * ============================================================================ */

.error {
}

p.error {
	background-color: #EC173D;
	color: #fff;
	padding: 10px;
}

tr.error {
	background-color: #EC173D;
	color: #fff;
}

/* =buttons
 * ============================================================================= */
a.button:link, a.button:visited {
	display: block;
	cursor: pointer;
	margin: 10px 0;
}

a.button:hover, a.button:active {
}


/* =buttons that are form controls
 * ============================================== */

input.button {
	background-color: #fafafa;
	border-top: 1px solid #bbb;
	border-right: 1px solid #777;
	border-bottom: 1px solid #777;
	border-left: 1px solid #bbb;
	cursor: pointer;
	color: #333;
}

#topnav input.button {
	color: #005697;
	background-color: #fff;
	border-top: 1px solid #bbb;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	border-left: 1px solid #ccc;
}

input.button:hover {
	color: #fff;
	background-color: #BD0025;
	border-top: 1px solid #BD0025;
	border-right: 1px solid #890021;
	border-bottom: 1px solid #890021;
	border-left: 1px solid #BD0025;
}

#topnav input.button:hover {
	color: #fff;
	background-color: #BD0025;
	border-top: 1px solid #BD0025;
	border-right: 1px solid #890021;
	border-bottom: 1px solid #890021;
	border-left: 1px solid #BD0025;
}



/* =tables
 * ================================================== */

table {
	margin: 20px 0;
}

table th {
	padding: 4px 20px 4px 10px;
	border-bottom: 1px solid #aaa;
	font-weight: bold;
	color: #666;
}

table td {
	padding: 4px 20px 4px 10px;
	border-bottom: 1px solid #ddd;
}

table tr.even {
	background-color: #eee;
}

/* =calendar
 * ================================================== */
.date-nav {
		background: #f5f5f5;
        position: relative;
        width: 688px;
		
}

.date-next {

        position: absolute; right: 0; top: 0;
}

.date-prev {
		position: absolute; left: 0; top: 0;
}

.date-nav strong {
		display: block;
		text-align: center;
		width: 200px;
		margin: 0 auto;
		text-align: center;
		font-size: 14px;
}

div.calendar-calendar table {
	border-collapse: collapse;
	border-style: hidden;
	padding: 0; margin: 8px 0 20px;
	border-width: 0;
	width: 688px;
}

div.calendar-calendar table th, div.calendar-calendar table td {
		width: 88px;
}

div.calendar-calendar table th {
		background-color: #999;
		border: 8px solid #fff;
		color: #fff;
		padding: 4px 8px;
		font-size: 12px;
}

div.calendar-calendar table td {
		background-color: #ebebeb;
		border: 8px solid #fff;
		color: #fff;
		padding: 4px 8px 60px;
		vertical-align: top;
}

div.calendar-calendar table td.filler {
		background-color: #f5f5f5;
}

div.calendar-calendar table td.today {
		background-color: #F7E3E7;
}

div.calendar-calendar table td.hasevent {
		padding-bottom: 4px;
}

div.calendar-calendar table strong {
	color: #BD0025;
	font-weight: bold;
	display: block;
	text-align: right;
}

div.calendar-calendar table ul {
		font-size: 11px;
		line-height: 16px;
		list-style-type: none;
		padding: 0;
}

div.calendar-calendar table ul li {
		margin-bottom: 8px;
}

div.calendar-calendar table td a {
	font-size: 11px;
}

#content #main div.calendar-calendar table .inner {
		padding: 0;
}

/* =page-specific styles:
 * ================================================== */
#content ul#universities {
		padding: 20px 10px;
		margin: 0;
		list-style-type: none;
		overflow: auto;
}

#content ul#universities li {
		width: 320px;
		float: left;
		margin-bottom: 20px;
}

#content ul#universities li a:link,
#content ul#universities li a:visited {
		display: block;
		text-decoration: none;
}

#universities li a img {
		float: left;
		margin: 0 10px 0 0;
}

#content #universities li span.university a {
		text-decoration: underline;
		margin-left: 50px;
		padding-right: 10px;
}

#content #universities li span.country {
		color: #555;
		text-decoration: none;
		display: block;
		margin-left: 50px;
		padding-right: 10px;
}

#content ul.researchgroups {
	overflow: auto;
	/*padding-left: 16px;*/
	}

#content ul.researchgroups li {
	color: #555;
	width: 190px;
	margin-right: 20px;
	float: left;
	margin-bottom: 10px;
	/*list-style-image: url(../images/icon-bullet-black.png);*/
}


li.calendar a {
		display: block;
		background: transparent url(../images/icon-calendar.png) left center no-repeat;
		padding-left: 20px;
}

#content li.rss a {
		display: block;
		padding-left: 20px;
		background: transparent url(../images/icon-rss.png) 0px 4px no-repeat;
}

span.count {
		font-size: 12px;
		color: #555;
}

ul#eventlist {
}

ul#eventlist li {
		margin: 10px 0;
		border-bottom: 1px solid #e0e0e0;
		padding-bottom: 10px;
}

ul#eventlist li span.date {
	color: #BD0025;
	font-weight: bold;
}

ul#eventlist li span.location {
		color: #555;
		margin-left: 3px;
}

.eventseries ul#eventlist li span.location {
		margin-left: 0;
}

ul#eventlist li span.virtual {
		padding-left: 20px;
		background: transparent url(../images/icon-monitor.png) left center no-repeat;
}

/* cmpjs - changed from a.title to span.title */
ul#eventlist li span.title {
		display: block;
		font-weight: bold;
}

ul#eventlist li span.series {
		color: #555;
}

#content p.pagination {
		margin-top: 20px;
		color: #555;
}

/* 
    cmtsa - added a span to hang class from as deeply nested override of 
    modules theme would be required to add link to actual anchor, plus CSS 
    will be missing otherwise whne on first page of pagination 
*/
p.pagination span.prev {
		margin-left: 10px;
}

ul#eventdetails {
		background-color: #f4f4f4;
		border: 1px solid #d4d4d4;
		list-style-type: none;
		padding: 5px;
		margin: 20px 0;
}

ul#eventdetails li {
		margin-bottom: 4px;
}


ul#eventdetails li.date {
	color: #BD0025;
	font-weight: bold;
}

ul#eventdetails li.time {
	color: #666;
	font-weight: bold;
}

ul#eventdetails li.localtime {
		background: transparent url(../images/icon-time.png) left center no-repeat;
		padding-left: 20px;
}

ul#eventdetails li.virtual {
		background: transparent url(../images/icon-monitor.png) left center no-repeat;
		padding-left: 20px;
		color: #555;
}

.globalchallenges #content ul#results li p {
		margin-left: 70px;
}


#content ul.logoflag {
		list-style-type: none;
		padding: 0;
}

#content ul.logoflag li {
		margin-right: 10px;
		margin-bottom: 10px;
		padding: 0;
}

#content ul.logoflag li img {
		margin: 0;
}

img.left
{
    float:left;
    padding-right:0.5em;
}

img.right
{
    float:right;
    padding-left:0.5m;
}

