/*
 * Religion & Society
 * 2009/10/15
 */

/***********************************
************************************
	General Rules
------------------------------------
*/
.left { float: left !important; }
.right { float: right !important; }

.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }

.undo-margin { margin-top: -1em !important; }
.no-margin { padding-bottom: 0 !important; }
.half-margin { padding-bottom: 1ex !important; }
.margin { padding-bottom: 1em !important; }

.separated { margin-top: 1ex; padding-top: 1em; clear: both;  border-top: 1px solid #eee; }


/*----------------------------------
	Headers, Paragraphs, Text style
------------------------------------
*/
h1 { margin-bottom: 1em; padding: .5ex 0 .5ex 1px; background: transparent url("../img/heading_background.png") no-repeat 0 100%; color: #115991; font-size: 2.667em; font-weight: 400; }
h2 { color: #115991; font-size: 1.917em; font-weight: 400; line-height: 1.1; }
h3 { padding: 1ex 0; color: #115991; font-size: 1.5em; font-weight: 400; line-height: 1.1; }
h4 { padding: 1ex 0; color: #115991; font-size: 1.417em; font-weight: 400; line-height: 1.1; }
h5 { color: #115991; font-size: 1.083em; line-height: 1.5; }

p.author,
p.date { color: #888; }

p.back { margin-top: -2em; padding: 0 0 3ex; font-size: 11px; text-align: right; }
p.back a { padding-left: 24px; background: transparent url("../img/bullet_b.png") no-repeat 0 50%; text-decoration: none; }
p.back a:hover { text-decoration: underline; }

p.top { overflow: hidden; clear: both; padding: 5em 0 0; font-size: .917em; }
p.top a { float: right; padding: 0 0 0 28px; background: #eaeaea url("../img/button_a.png") no-repeat 0 -21px; color: #888 !important; line-height: 21px; text-decoration: none; text-transform: lowercase; white-space: nowrap; }
p.top a span { float: left; padding: 0 10px 0 0; background: transparent url("../img/button_a.png") no-repeat 100% -21px; }
p.top a:hover span { text-decoration: underline; }

p.photo { float: right; width: 160px; margin: 0 0 1ex 2em; padding: 10px; border: 1px solid #e5e5e5; color: #888; font-size: .917em; font-style: italic; }
p.photo em { display: block; padding: 1em 0 .5ex; color: #115991; font-size: 1.091em; }
p.photo img { width: 160px !important; }

p.member { float: right; width: 182px; margin: 0 0 1ex 2em; }
p.member strong { display: block; padding: 1ex 0 0; color: #222; }
p.member img { width: 160px !important; padding: 10px; border: 1px solid #e5e5e5;}

p.intro { color: #222; font-size: 1.417em; font-weight: 400; line-height: 1.2; }

p.empty-content { height: 350px; margin-top:30px;}
/*----------------------------------
	LINKS
------------------------------------
*/
a { color: #48a5ce; text-decoration: underline; cursor: pointer; }
a:focus,
a:hover { color: #115991; text-decoration: underline; }

a.button { display: inline-block; padding: 0 0 0 28px; background: #eff6f9 url("../img/button_a.png") no-repeat 0 0; font-size: 11px; color: #115991 !important; line-height: 20px; text-decoration: none; text-transform: lowercase; white-space: nowrap; }
a.button span { float: left; padding: 0 10px 1px 0; background: transparent url("../img/button_a.png") no-repeat 100% 0; }
a.button:hover span { text-decoration: underline; }

a.pdf { display: inline-block; padding-left: 25px; background: transparent url("../img/icon_pdf.png") no-repeat 0 50%; line-height: 24px; }
a.doc { display: inline-block; padding-left: 25px; background: transparent url("../img/icon_doc.png") no-repeat 0 50%; line-height: 24px; }


/*----------------------------------
	Text
------------------------------------
*/
.underline {
	text-decoration: underline;
}

/*----------------------------------
	Clear & Hide
------------------------------------
*/
.clearme {
	clear: both;
	height: 0;
	margin: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
	background: none;
}

.hideme {
	display: none;
	height: 0;
	margin: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
	background: none;
}


/***********************************
************************************
	Forms
------------------------------------
*/
button, input.radio, input.checkbox, input.button, label, select { cursor: pointer; }

button { padding: 0; border: none; background: transparent; }
button span { display: inline-block; padding: 0 0 0 28px; background: #1d6596 url("../img/button_a.png") no-repeat 0 -42px; font-size: 11px; color: #aee7ff !important; line-height: 20px; text-decoration: none; text-transform: lowercase; white-space: nowrap; }
button span span { float: left; padding: 0 10px 1px 0; background: transparent url("../img/button_a.png") no-repeat 100% -42px; }
button:hover span { text-decoration: underline; }


/*----------------------------------
	Page header
------------------------------------
*/
#header { position: relative; width: 960px; height: 187px; margin: 0 auto; }
#header p {  padding: 0; }

#header h1 { position: absolute; left: 24px; top: 22px;  width: 179px; height: 136px; background: transparent url("../img/logo.jpg") no-repeat 0 0; text-indent: -99em; }
#header h1 a { float: left; width: 100%; height: 100%; }

#header p.links { position: absolute; bottom: 140px; right: 26px; color: #72adcc; font-family: "Tahoma", "Geneva", sans-serif; font-size: .917em; word-spacing: 1ex; }
#header p.links a { color: #fff; text-decoration: none; word-spacing: normal; }
#header p.links a:hover { color: #0e4c7f; }

#header form { position: absolute; right: 21px; top: 59px; width: 240px; }
#header input.button { float: right; width: 27px; height: 27px; margin: 2px 0 0 4px; padding: 0; border: none; background: #aee7ff url("../img/button_search.png") no-repeat 0 0; text-indent: -99em; }
#header input.text { float: left; width: 195px; height: 19px; padding: 7px 2px 3px 12px; border: none; background: #fff url("../img/search_background.png") no-repeat 100% 0; color: #666; font-family: "Tahoma", "Geneva", sans-serif; line-height: 12px; }

#header ul { position: absolute; bottom: 26px; right: 8px; list-style: none; width: 659px; height: 41px; padding: 0 0 0 11px; background: transparent url("../img/menu_background.png") no-repeat 0 3px; letter-spacing: -1px; }
#header li { float: left; margin-right: -1px; padding-right: 19px; background: transparent url("../img/menu_item_2.png") no-repeat 50% 1000%; }
#header li.active,
#header li.hover,
#header li:hover { background-position: 50% 100%; }
#header li a { float: left; background: transparent url("../img/menu_item.png") no-repeat 0 0; color: #fff; font-size: 1.167em; font-weight: 700; text-decoration: none; }
#header li a.first { background-position: -1px 0; }
#header li a span { position: relative; left: 14px; float: left; padding: 0 14px 5px 0; background: transparent url("../img/menu_item.png") no-repeat 100% 0; line-height: 35px; }
#header li.active a,
#header li a:hover { background-position: 0 100%; }
#header li.active a span,
#header li a:hover span { background-position: 100% 100%; text-shadow: #5a97bb 0 1px 1px; }

#header ul div { clear:both; z-index: 999998; position: absolute; left: -4px; top: 40px; display:none; width: 248px; padding: 15px 0 0; background: transparent url("/img/dropdown_background_top.png") no-repeat 0 0; }
#header li.hover div,
#header li:hover div { display:block; }
#header ul div div { z-index: 999999;  position: static; width: auto; padding: 0 15px 12px; background: transparent url("/img/dropdown_background_bottom.png") no-repeat 0 100%; }
#header ul div ul { position: static; width: auto; height: auto; padding: 0; background: transparent; font-family: "Arial", "Helvetica", sans-serif; font-size: .857em; letter-spacing: normal; }
#header ul div li { position: relative; z-index: 1; clear: left; margin: -1px 10px 0; padding: 0; border-top: 1px solid #d0eef9; background: transparent; }
#header ul div a { position: relative; width: 200px; height: 28px; margin: 0 -10px; padding: 0 4px 0 14px; background: transparent url("/img/dropdown_hover.png") no-repeat 999px 999px !important; color: #105389; font-weight: 400; line-height: 28px; }
#header ul div li.hover,
#header ul div li:hover { z-index: 2; margin-top: 0; border-top: none; }
#header ul div li.active,
#header ul div a:hover { background-position: 0 0 !important; }

.js #header ul { letter-spacing: normal; }
.js #header li a:hover span { text-shadow: none; }


/*----------------------------------
	Page content container/columns
------------------------------------
*/
#content { overflow: hidden; width: 950px; margin: 0 auto; padding: 0 10px 20px 0; }

#column-primary { float: right; width: 640px; padding: 0 0 20px; background: transparent url("../img/primary_column_background.png") no-repeat 0 100%; }
#column-primary-child { overflow: hidden; padding: 15px 30px 0; background: #fff url("../img/primary_column_background.png") no-repeat -640px 0; color: #666; }

#column-secondary { float: right; width: 305px; margin: 23px 0 0; padding: 16px 0 0; background: #3281ae url("../img/secondary_column_background_top.png") no-repeat 0 0; }
#column-secondary div { height: 95px; padding: 56px 30px 0 37px; background: transparent url("../img/secondary_column_background_bottom.png") no-repeat 4px 0; }
#column-secondary div p { padding: 0 0 0 43px; background: transparent url("../img/subscribe_background.png") no-repeat 0 0; font-size: 1.167em; font-weight: 700; line-height: 1.2; }
#column-secondary div p a { display: inline-block; margin-top: 1ex; color: #aee7ff; font-size: .786em; font-weight: 400; text-decoration: none; }
#column-secondary div p a:hover { color: #fff; text-decoration: underline; }

div.no-menu { height: 146px !important; padding-top: 0 !important; background: transparent url("../img/secondary_column_background_no_menu.png") no-repeat 0 0 !important; }
div.no-menu div { height: auto !important; padding-top: 39px !important; background: transparent !important; }

#column-secondary.address { height: 212px; padding-top: 0; background: transparent url("../img/secondary_column_background_address.png") no-repeat 0 0; }
#column-secondary.address div { height: auto; padding-top: 20px; padding-left: 30px; background: transparent; }
#column-secondary.address h3 { border-bottom: 1px solid #3174a3; color: #aee7ff; font-size: 1.167em; font-weight: 700; }
#column-secondary.address h4 { padding-top: 1em; color: #fff; font-size: 1.083em; font-weight: 700; }
#column-secondary.address div p { padding: 0; background: transparent; color: #c1d8e6; font-size: 1em; font-weight: 400; }


#column-secondary ul { overflow: hidden; list-style: none; padding: 0 26px 18px 30px; }
#column-secondary ul ul { padding: 0; }
#column-secondary li { margin-top: -1px; }
#column-secondary li a { display: block; padding: .6em 0 .6em 22px; border-top: 1px solid #478eb6; background: transparent url("../img/bullet_c.png") no-repeat 5px 50%; color: #aee7ff; font-size: 1.167em; font-weight: 700; line-height: 1.1; text-decoration: none; }
#column-secondary li a.active,
#column-secondary li a:hover { color: #fff; }
#column-secondary li li { margin-top: 0; }
#column-secondary li li a { padding: .8em 0 .8em 38px; background-position: 23px 50%; font-size: 1em; }


/*----------------------------------
	Location bar - breadcrumbs
------------------------------------
*/
p.location { color: #ccc; font-size: .917em; line-height: 1.1; }
p.location a { color: #888; text-decoration: none; }
p.location a:hover { color: #888; text-decoration: underline; }
p.location strong { color: #48a5ce; font-weight: 400; }


/*----------------------------------
	Specifications
------------------------------------
*/
ul.specifications { overflow: hidden; list-style: none; padding: 0; }
ul.specifications li { margin-top: -1px; padding: 1ex 0 1.25ex; border-top: 1px solid #eee; }


/*----------------------------------
	Commisioning panel
------------------------------------
*/
ul.commisioning { float: left; list-style: none; width: 240px; padding: 1em 15px 0 0; color: #222; font-size: 1.167em; }
ul.commisioning li { padding: 0 0 1em; }
ul.commisioning em { display: block; color: #666; font-size: .857em; }


/*----------------------------------
	External links listing
------------------------------------
*/
ul.links { color: #449ec8; }
ul.links li { padding-bottom: 1ex; }


/*----------------------------------
	List of thumbnails (used in team members and projects)
------------------------------------
*/
ul.thumbnails { overflow: hidden; list-style: none; margin-right: -20px; padding: 1em 0 0; }
ul.thumbnails li { float: left; width: 180px; padding: 0 20px 1em 0; }
ul.thumbnails img { display: block; width: 160px !important; height: 148px !important; padding: 9px; border: 1px solid #e5e5e5; }
ul.thumbnails strong { display: block; padding-top: 1ex; color: #222; }


/*----------------------------------
	Project phases
------------------------------------
*/
ul.phase { overflow: hidden; list-style: none; padding: 0 0 1em; }
ul.phase li { margin-top: -1px; padding: 1ex 0 1ex 27px; border-top: 1px solid #eee; background: transparent url("../img/bullet_c.png") no-repeat 12px .8em; }
ul.phase strong { display: block; color: #222; }

/*----------------------------------
	Related projects
------------------------------------
*/
ul.rel-projects { overflow: hidden; list-style: none; padding: 0 0 1em; }
ul.rel-projects li { margin-top: -1px; padding: 0.6ex 0 0.6ex 27px; background: transparent url("../img/bullet_c.png") no-repeat 12px .8em; }
ul.rel-projects strong { display: block; color: #555; }


/*----------------------------------
	Generic listing
------------------------------------
*/
ul.listing { overflow: hidden; list-style: none; margin-top: -1em; padding: 0; }
ul.listing li { overflow: hidden; margin-top: -1px; padding: 4ex 0 2ex 150px; border-top: 1px solid #eee; }
ul.listing p.photo { float: left; width: 128px; margin: 0 0 0 -150px; padding: 0; }
ul.listing p.photo img { width: 128px !important; }
ul.listing p.author,
ul.listing p.date { padding-bottom: 1ex; font-size: .917em; }

ul.listing-small li { padding-left: 75px; }
ul.listing-small p.photo { width: 54px; margin-left: -75px; }
ul.listing-small p.photo img { width: 54px !important; }

ul.listing-nophoto { margin-top: 15px;}
ul.listing-nophoto li { margin-top: -1px; padding: 0.6ex 0 0.6ex 27px; background: url(../img/bullet_c.png) no-repeat scroll 12px 0.8em}





/*----------------------------------
	Download listing
------------------------------------
*/
ul.downloads {}
ul.downloads li { float: right; margin-right: 20px; padding: 0; border: none; }

/*----------------------------------
	Pagination
------------------------------------
*/
.pages { overflow: hidden; font-size: .917em; line-height: 1.1; text-align: right; }
.pages p { float: right; margin-right: 1em; padding: .6ex 0; color: #888; font-style: normal; }
.pages ul { overflow: hidden; float: right; list-style: none; padding: .6ex 0; }
.pages li { float: left; margin-left: -1px; border-left: 1px solid #dedede; }
.pages li.first { border-left: none; font-weight: 700; text-align: left; }
.pages li.last { border-right: none; font-weight: 700; text-align: left; }
.pages li.first .disabled,
.pages li.last .disabled { width: auto; margin: 0 0 0 1em; padding: 0 10px 0 0; color: #999; }
.pages li a { position: relative; float: left; width: 3.5ex; margin: -.6ex 0; padding: .6ex 0; text-decoration: none; text-align: center; }
.pages li.first a,
.pages li.last a { width: auto; margin: 0 0 0 1em; padding: 0 10px 0 0; }

.pages li a:hover { text-decoration: underline !important; }
.pages li.current { position: relative; float: left; width: 3.5ex; margin: -.6ex 0; padding: .6ex 0; text-align: center; background: #115991; color: #fff; font-weight: 700; }



/*----------------------------------
	Contacts listing
------------------------------------
*/
ul.contact { overflow: hidden; list-style: none; margin-left: -20px; padding: 0 0 1em; }
ul.contact li { float: left; width: 180px; padding: 0 0 0 20px; }
ul.contact p { padding: 0; }
ul.contact p strong { color: #222; }


/*----------------------------------
	Contact form
------------------------------------
*/
form.contact dl { overflow: hidden; padding: 1em 0 0; }
form.contact dt { float: left; clear: left; width: 145px; padding: 0 10px 1ex 0; }
form.contact dd { float: left; width: 380px; padding: 0 0 1ex; }
form.contact dd.indent { clear: left; padding-left: 155px; }
form.contact label { color: #222; font-weight: 700; }
form.contact label span { float: right; color: #449ec8; font-weight: 400; }
form.contact input.text { width: 250px; }
form.contact textarea { width: 380px; }


/*----------------------------------
	Some tabs
------------------------------------
*/
ul.tabs { overflow: hidden; list-style: none; padding: 0 0 3em; line-height: 1.1; }
ul.tabs li { float: left; margin-left: -1px; }
ul.tabs a { position: relative; float: left; width: 111px; padding: 8px 15px 8px 20px; border-bottom: 1px solid #88acc8; background: transparent url("../img/tabs_background.png") no-repeat 0 0; font-weight: 700; text-decoration: none; }
ul.tabs a:hover { text-decoration: underline; }
ul.tabs a.active { z-index: 1; border-bottom: none; background-position: 100% 0; color: #115991; }


/*----------------------------------
	Research projects
------------------------------------
*/
ul.projects { overflow: hidden; list-style: none; margin-top: 1em; padding: 0; border-top: 1px solid #eee; }
ul.projects li { overflow: hidden; margin-top: -3px; padding: 1em 0 .5ex; border-top: 3px solid #eee; }
ul.projects table { width: 100%; margin-left: -1em; border-collapse: collapse; line-height: 1.1; }
ul.projects table td,
ul.projects table th { padding: 0 1em; border-left: 1px solid #eee; text-align: left; }
ul.projects table .status {width:30px; padding-right: 0; text-align: right; }
ul.projects table .open { color: #66b332; }
ul.projects table .closed { color: #DD0000; }
ul.projects h5 { margin-top: 1.5ex; padding-top: 1ex; border-top: 1px solid #eee; color: #222; }
ul.projects table .download {width: 80px; text-align: center; padding: 8px 0}
ul.projects table .amount {width: 90px; text-align: center; padding: 8px 0}
ul.projects table th.download {padding: 0}
ul.projects table .download .f-pdf {float: left}
ul.projects table .download .f-doc {float: right}
ul.projects table th.amount {padding: 0}
ul.projects table .download a{padding: 0 10px;}

/*----------------------------------
	Homepage banner/image
------------------------------------
*/
.banner { overflow: hidden; width: 939px; margin: -8px auto 0; }

.banner div.left { position: relative; overflow: hidden; width: 358px; height: 243px; background: #000; }
.banner div.left p.image { overflow: hidden; width: 100%; height: 100%; text-align: center; }
.banner div.left p.image img { height: 242px !important; }
.banner div.left .desc { position: absolute; left: 0; bottom: 0; width: 327px; padding: 0 15px 1ex; background: transparent url("../img/banner_desc_background.png") repeat 0 0; }
.banner div.left .desc h2 { padding: 1ex 0 0; color: #fff; font-size: 1.5em; font-weight: 400; }
.banner div.left .desc p { padding: 1ex 0 0; }
.banner div.left .desc a { color: #aee7ff; text-decoration: none; }
.banner div.left .desc a:hover { color: #fff; text-decoration: underline; }

.js .banner div.left .desc p { display: none; }

.banner div.right { width: 484px; height: 190px; padding: 53px 45px 0 40px; background: transparent url("../img/banner_background.jpg") no-repeat 0 0; font-size: 1.333em; line-height: 1.2; text-shadow: #145a8e 0 1px 1px; letter-spacing: -.2ex; }
.banner div.right p.intro { margin-right: -20px; padding-bottom: 1ex; color: #fff; font-size: 1.563em; }
.banner div.right p.intro strong { color: #d7ffad; }
.js .banner div.right { text-shadow: none; }
.js .banner div.right p.intro { padding-bottom: 0; }
.js .banner div.right { letter-spacing: normal; }


/*----------------------------------
	Three boxes/columns on homepage
------------------------------------
*/
.three-boxes { width: 949px; margin: 0 auto 20px; padding: 22px 0 20px; background: transparent url("../img/three_boxes_bottom.png") no-repeat 0 100%; }
.three-boxes-child { position: relative; overflow: hidden; min-height: 150px; padding: 15px 4px 31px; background: transparent url("../img/three_boxes_top.png") no-repeat 0 0; }
.three-boxes div.left,
.three-boxes div.middle,
.three-boxes div.right { float: left; width: 251px; padding: 0 15px 0 35px; }

.three-boxes div.middle { width: 251px; padding-left: 54px; }
.three-boxes div.right { float: right; }

.three-boxes a.button { background-position: 0 -63px; color: #aee7ff !important; }
.three-boxes a.button span { background-position: 100% -63px; }
.three-boxes h2 { padding: 0 0 1.25ex; color: #fff; font-size: 1.75em; text-shadow: #145a8e 0 1px 1px; }
.three-boxes p.last { position: absolute; bottom: 0; padding: 0; }
.three-boxes ul { overflow: hidden; list-style: none; margin-left: -20px; padding: 0 0 0 20px; font-size: .917em; }
.three-boxes li { margin-top: -1px; padding: 1.25ex 0 1.5ex; border-top: 1px solid #478eb6; }
.three-boxes li a { display: block; margin-left: -20px; padding-left: 20px; background: transparent url("../img/bullet_c.png") no-repeat 0 .8ex; color: #aee7ff; font-size: 1.273em; font-weight: 700; line-height: 1.2; text-decoration: none; }
.three-boxes li a:hover { color: #fff; text-decoration: none; }
.three-boxes div.left ul { font-size: 1em; }
.three-boxes div.left li { padding: 1.5ex 0; }
.three-boxes div.left li a { padding-bottom: .5ex; font-size: 1.167em; }
.three-boxes div.right h2 { color: #d7ffad; }
.three-boxes div.right a.button { background-position: 0 -84px; }
.three-boxes div.right a.button span { background-position: 100% -84px; }


/*----------------------------------
	Podcasts
------------------------------------
*/
div.podcast { float: left; margin: 0 2em 1ex 0; }


/*----------------------------------
	Page footer
------------------------------------
*/
#footer { width: 900px; height: 282px; margin: 0 auto; padding: 0 20px; border-top: 1px solid #28618f; font-size: .917em; }
#footer p { float: left; padding: 30px 0 0; }
#footer ul { overflow: hidden; float: right; list-style: none; padding: 20px 0 0; }
#footer li { float: left; margin-left: -1px; border-left: 1px solid #2d6b99; }
#footer a.ahrc { float: left; width: 158px; height: 37px; margin-right: 18px; background: transparent url("../img/footer_logo_ahrc.png") no-repeat 0 0; text-indent: -99em; }
#footer a.esrc { float: left; width: 47px; height: 39px; margin-left: 27px; background: transparent url("../img/footer_logo_esrc.png") no-repeat 0 0; text-indent: -99em; }
#footer a { color: #a1dcf9; text-decoration: none; }
#footer a:hover { color: #fff; text-decoration: underline; }