@charset "utf-8";
/* CSS Document */

/* ==========================================================
Master Stylesheet

website:   www.biochar.org.uk
version:   "PURE"
updated:   March 29 2011
author:    Duncan Marshall
email:     dm@chromadesign.co.uk
url:       http://www.chromadesign.co.uk

============================================================ */

#ienotice{display: none;}

/* Reset and General Architecture */
blockquote,body,caption,div,dl,dt,dd,form,fieldset,h1,h2,h3,h4,h5,h6,html,li,ul,ol,p,pre,textarea,table,td,th,.wrp {margin:0; padding:0;}
a{outline: none; text-decoration: none;}
IMG{border: 1px solid #666;}
IMG.noborder{border: none;}
a IMG{border: none;}
html, body{height: 101%;}
ul{list-style-type: circle; margin: 0px 0px 24px 20px;}
ul.biblio{color: #072d44;}
ol{margin: 0px 0px 24px 20px;}
ul span{position: relative; left: -5000px;}
.clearfix:after{content: "."; display: block; height: 0px; clear: both; visibility: hidden;}

@font-face {
	font-family: 'FontinRegular';
	src: url('fontin-regular-webfont.eot');
	src: local('☺'), url('fontin-regular-webfont.woff') format('woff'), url('fontin-regular-webfont.ttf') format('truetype'), url('fontin-regular-webfont.svg#webfontUxEdZMCS') format('svg');
	font-weight: normal;
	font-style: normal;
}

body{color: #072d44; background: #f6f6f6 url(../i/str/bdbg01.jpg) top center repeat-x; font-family: FontinRegular, "Palatino Linotype", "Times New Roman", serif; line-height: 24px; text-align: center;}

.wrapper {min-height: 100%;	height: auto !important; height: 100%; margin: 0 auto -120px; background: url(../i/str/containerbg01.jpg) top center no-repeat;}
.header{position: relative; width: 960px; height: 190px; text-align: center; margin: auto; margin-bottom: 5px;}
#content{clear: both; width: 960px; height: auto; margin: auto; text-align: left; padding-bottom: 100px; z-index: -1;}


/* constants */
p, ul, ol, dl{margin-bottom: 12px; font-size: 13px; }
p#breadcrumbs, p#breadcrumbs a{color: gray; font-size: 12px; margin-bottom: 26px;}
p#breadcrumbs{float:left; width: 650px}
p#breadcrumbs span.separator{font-family: Verdana, Arial, Helvetica, sans-serif; position: relative; top: 0px; padding: 0px 3px 0px 2px;}
p#breadcrumbs strong{color: #660000;}
p a, ul a, dl a, a:link a:visited a:active{color: #990000; border-bottom: 1px dotted gray;}
p#breadcrumbs a:link, p#breadcrumbs a:visited, p#breadcrumbs a:active {text-decoration: none; border-bottom: none;}
body.projects ul a, a:link a:visited a:active{color: #072d44;}
body.projects ul a:hover{color: red;}
p a:hover, ul a:hover, dl a:hover{color: red; border-bottom: 1px solid red;}
/* page specific */
p.intro{margin-bottom: 24px; clear: both;}
p.date{margin-top: -12px; margin-bottom: 24px; color: gray;}
p.abstract{clear: both;}
p.abstract strong{font-size: 13px; font-family: Arial, Helvetica, sans-serif;}
p.abstract.final{margin-bottom: 0px;}
.vid p{float: left;}
ul#abstracts{margin: 0px; list-style-type: none;}
ul#abstracts li{margin-bottom: 24px;}
ul#abstracts ul{list-stype-type: none; width: 960px; height: 54px; margin: 5px 0px 0px 0px;} /* Document Download Icons */
ul.downloads{height: 54px; margin: 0px 0px 12px 0px;}
ul#abstracts ul li, ul.downloads li{float: left; display: block; width: 34px; height: 40px; margin-right: 3px; background: 0px 0px no-repeat;}
ul#abstracts ul li.dld, ul.downloads li.dld{width: 150px; border: none; font-weight: 600;}
ul#abstracts ul li.pdf, ul.downloads li.pdf{background-image: url(../i/icons/pdf.jpg);} /* icons adapted from originals by Blake Knight - http://blog.blake-knight.com */
ul#abstracts ul li.doc, ul.downloads li.doc{background-image: url(../i/icons/doc.jpg);}
ul#abstracts ul li.xls ul.downloads li.xls{background-image: url(../i/icons/excel.jpg);}
ul#abstracts ul li.zip ul.downloads li.zip{background-image: url(../i/icons/zip.jpg);}
ul#abstracts ul li.ppt ul.downloads li.ppt{background-image: url(../i/icons/powerpoint.jpg);} 
ul#abstracts ul li a, ul.downloads li a{display: block; width: 34px; height: 40px; border-bottom: none;}
ul#abstracts ul li a span, ul.downloads li a span{position: relative; left: -5000px;}
/* Research Areas List */
ul.researchareas{height: auto; list-style-type: none; margin: 0px;}
ul#abstracts ul.researchareas li{float: left; width: 800px; height: 24px; margin: 0px 0px 0px 0px; background: none; line-height: 24px;}
ul#abstracts ul.researchareas li a{width: 800px; height: 24px; line-height: 24px; font-weight: 600; color: #660000;}
ul.researchareas{font-family: Arial, Helvetica, sans-serif; font-size: 13px; margin-bottom: 24px;}
ul.researchareas.publications li{margin-bottom: 0px;}
ul.researchareas.outputs li{color: #660000; font-weight: 600;}
ul.researchareas li a, a:link a:visited a:active{font-weight: 600; border-bottom: 1px dotted #dddde2;}
ul.researchareas li a:hover{border-bottom: 1px solid red;}
ul.researchareas span{top: -5px; left: 0px; display: block; color: #072d44; font-weight: 500;}

.print{width: 200px; height: 35px; line-height: 35px; }
.print a{display: block; border: none; padding-left: 45px; width: 200px; height: 35px; }
.print a, a:link a:visited a:active{background: url(../i/str/print.jpg) 0px 0px no-repeat;}
.print a:hover{border: none; background: url(../i/str/print2.jpg) 0px 0px no-repeat;}

h1 span, h2 span, h3 span{font-weight: 500; font-family: Baskerville, Constantia, "Palatino Linotype", "Book Antiqua", serif; font-style: italic;}
h1, h2, h3, h4, p#breadcrumbs, .caption, body.people div.columnized p strong{font-family: Arial, Helvetica, sans-serif;}
h1{font-size: 17px;}
h2, body.people div.columnized p strong{font-size: 16px; text-transform: uppercase; float: left;}
body.list h2, body.article h2{width: 960px; font-size: 17px; text-transform: none;}
h3{font-size: 13px;}
h3.journal{font-weight: 500;}
h3.dld{margin-bottom: 0px; clear: both;}
body.homepage h3{font-size: 14px;}
body.article h3{font-size: 14px; margin-bottom: 12px;}
h4{font-size: 12px;} /* reserved for same-size headings, but font-weight 600 */
#pageimages h4, #pageimages h5{font-size: 14px; margin: 0px; line-height: 20px;}
#pageimages h5{font-size: 13px;}

/* Floated Images for Introduction Pages */
.introimages{width: inherit;}
.introimages IMG{float: left; margin: 0px 10px 10px 0px;}


/* page specific */
h2.intro{width: 330px; margin-bottom: 24px;}
.vid h2, .vid p{float: right; width: 650px; margin-left: 10px;}

.wrp{float: left; clear: both; width: 960px; height: auto; margin-bottom: 24px;}
.updates .wrp, .updates p.date{margin-bottom: 12px;}
.updates p.date{margin-bottom: 0px;}


/* home page */
#introduction{float: left; width: 340px; padding-top: 21px; }
.caption{color: gray; margin-top: 6px; margin-bottom: 0px;}
.left{float: left; clear: right; margin-right: 12px;} /* could work for all floated images */
.right{float: right; clear: left; margin-left: 12px;} /* could work for all floated images */
IMG.left, IMG.right{margin-top: 6px; margin-bottom: 0px; border: 1px solid #666;}

#latest{float: right; width: 594px; height: auto; padding-bottom: 30px;}
#latest_topper{width: 594px; height: 11px; background: url(../i/str/latest_topper.jpg) top center no-repeat;}
#latest_text{width: 594px; height: auto; background: url(../i/str/latest_text.jpg) top center repeat-y; padding-top: 10px;}
#latest_botter{width: 594px; height: 11px; background: url(../i/str/latest_botter.jpg) top center no-repeat;}
#latest h2, #latest h3, #latest p{width: 544px; margin-left: 25px;}

.otherstuff{width: 960px; height: auto; border-top: 1px dotted #cccccc; clear: both; margin-top: 10px; padding-top: 10px;}
#rss{width: inherit; clear: both; background: url(../i/rss-trans.png) 0px 0px no-repeat; padding-left: 40px;}

.vid{margin-bottom: 24px;}
.video{float: left; clear: left;}

/*** Randy Simons - MultiColumn CSS ***/
/* Initial definitions for base column. Define the (minimum) width here, and optionally a padding */
.noncolumnized div{display: none;}
.columnized div {
float: left;
width: 305px;		/* When using a fixed number of columns, you can omit the width. Otherwise it must be set! This will be the *minimum* width of a column*/
padding: 0px 22px 0px 0px;		/* You may use a padding... but thanks to IE you can only use pixels! */
margin: 0;/* Don't use a margin! */}
.columnized div p{margin-bottom: 24px;}
body.people .columnized div p{margin-bottom: 12px;}
.columnized div p.caption{margin-top: 0px; margin-bottom: 0px;}

body.people div.columnized p strong{font-size: 14px;}


/* Contact Page - Form and 'Names' */
#names{float: left; width: 340px; height: auto; margin-top: 24px;}
#form{float: right; width: 400px; height: 600px; margin-top: 24px;}
dl{width: 425px;} body.abstract dl{width: 950px;}
dt, dd{/*float: left;*/}
dt{width: 140px;}
dd{width: 285px;}
/* Abstract DL */
body.abstract dl{width: 980px; height: auto/*70px*/; font-weight: 600; font-size: 13px; font-family: Arial, Helvetica, sans-serif;}
body.abstract dt, dd{float: left;}
body.abstract dt{width: 80px;} body.abstract dl.dlwide dt{width: 120px;}
body.abstract dd{width: 870px; color: #660000;} body.abstract dl.dlwide dd{width: 830px;}
#form p{width: 400px; clear: both; margin-bottom: 10px; text-align: left; color: #000;}
label{float: left; text-align: right; width: 60px; font-weight: 500; color: #000;}
input{float: right; text-align: left; width: 330px; height: 20px; line-height: 20px; margin-top: 0px; margin-bottom: 0px;}
select.budge{margin-left: 10px;}
input#send{width: 110px; color: #000; height: 22px; padding-bottom: 2px; text-align: center;}
input#search{padding-left: 0px;}
input#maillist{width: 20px; position: relative; top: -20px; left: -170px; background: none; border: none;}
textarea{float: right; text-align: left; width: 330px;}
input, textarea{background: #fff; border: 1px solid #ddd; color: #000;}
.clear{width: inherit; clear: both; height: 10px;}
#form p.fields{text-align: left;}
#form p.warning, span.warning{display: block; color: red;}
span.warning{float: left; width: 400px; overflow: visible; scroll: none; text-align: left;}


.footer, .push {height: 120px; /* .push must be the same height as .footer */}
.footer{clear: both; background: #ececec; border-top: 1px dotted #ccc; }
.instep{width: 960px; height: 110px; background: url(../i/str/UoElogo.jpg) right 7px no-repeat; padding-top: 10px; margin: auto; text-align: left; line-height: 18px;}
.instep strong{font-weight: 500; color: #660000;}
.instep p a{border: none;}

/* sundries */
code{font-family: "Courier New", Courier, monospace; color: red;}

#groupimages{width: 960px; height: auto;}
#groupimages a{float: left;}

#pageimages{width: 960px; height: auto; margin-bottom: 24px; clear:both;}
#pageimages img, #pageimages div{float: left; margin-right: 50px;}
#pageimages img#theme{margin-top: 20px; margin-bottom: 20px;}
#pageimages div{width: 150px; height: auto; padding-bottom: 6px; text-align: center; font-size: 14px; font-variant: small-caps;}
#pageimages a.theme, a:link a:visited a:active{color: #000;}
#pageimages h5 a.staff, a:link a:visited a:active{color: #990000; border-bottom: 1px dotted gray; font-size: 13px;}
#pageimages.threeimages{height: 225px;}
#pageimages img#one, #pageimages div#one{margin-left: 210px;}
#pageimages img#people{height: 400px; margin-left: 90px; margin-bottom:20px;} 
#pageimages img#theme{height: 400px; margin-left: 180px;} 
#pageimages img#contact{height: 200px; margin: 0px 0px 24px 0px;} 
#pageimages.landscape{height: 370px;}
#pageimages.portrait{height: 500px;}
#pageimages.landscape img{margin-left: 230px;}
#pageimages.portrait img{margin-left: 305px;}

.vleft { margin-left: 40px; float: left; }
.vright { margin-right: 40px; float: right; }
.videoThumb p { width:100%; text-align: center; }
.left { float: left; }
.right { float: right; }

/* Standard Biochars */

.standardBio{width: 960px; height: auto;}
.standardBio article{width: 520px; height: 200px; margin: 0px 0px 24px 260px;}
.col{float: left; height: 200px; position: relative; margin-right: 20px;}
.colOne{width: 200px;} .colOne IMG{width: 200px;}
.colTwo{width: 100px;} .colTwo IMG{width: 100px;}
.col IMG{border: none;}
.col p{width: inherit; text-align: center; position: absolute; bottom: 0px;}