/* IE transparent png hack */
img#beckleylogo { behavior: url(/site_media/iepngfix.htc);  width: 111px; height: 140px; border: 0px; margin: 0px; padding: 0px; float: right; }

/* Body */
body { margin:0px; padding: 0px; text-align:center; font-family:Verdana, sans-serif; font-size:10pt; background-color:#efefec; }

/* Forms */
form { text-align:center; width:80%; margin-left:auto; margin-right:auto; }

/* Header */
img#ucllogo { width: 172px; height: 48px; border: 0px; margin: 7px 5px 0px 0px; padding: 2px; float: left; }
img#beckleylogo { width: 111px; height: 140px; border: 0px; margin: 0px; padding: 0px; float: right; }
img#ucllogo { width: 172px; height: 48px; border: 0px; margin: 7px 5px 0px 0px; padding: 2px; float: left; }
div#texts { display: block; }

div.header { min-width: 1000px; width: 100%; margin: 0px; padding: 0px }
div.topheader    { background: transparent url(/site_media/img/header-bg.png) repeat-x scroll; height: 140px; padding: 0px; margin: 0px; }
div.bottomheader { height: 5px; padding: 0px; background-color:#1e79a6; margin: 0px}
div.headertitle{ position: absolute; max-height: 42px; width: 800px; margin-left: -400px; padding-top: 7px;  top: 72px; left: 50%;  text-align: center; }
h1{ display: block; font-size:42px; font-family: serif; font-weight: normal; color:white; margin: 0px auto; text-align: center; }
h2.logo-text{ font-size:26px; font-family: serif; font-weight: lighter; color:white; margin: 0px auto; text-align: center; }
h2#beckleytext { margin: 10px 10px 0px 0px; float: right; }
h2#ucltext { margin: 10px 0px 0px 10px; float: left; }
a.homelink { color:white; margin-left:7px; margin-right:7px; font-weight: bold; }
a#home { color:white; text-decoration: none; }
a.logo-link { color:white; text-decoration: none; }
a#home:hover { color:white; text-decoration: underline; }

/* Drugtable */
table.drugtable { border-spacing:0; border-width:thin; border-color: #d66b6b; border-style:none; margin-left:auto; margin-right:auto; }
th.drugtablehead { vertical-align:bottom; text-align:center; background-color:#dddddd; width:100px; } 
tr.row { height:20px; } 
td.cage { text-align:left; background-color:#dad5c5; border: 1px solid white; }
td.rowstart { background-color:#dad5c5; text-align:left; border: 1px solid white; padding-left: 8px; padding-right: 8px; font-weight:bold; }
th.column { width:200px; min-width:120px; background-color:#dad5c5; border: 1px solid white; }
td.row{ background-color:#dad5c5; border: 1px solid white; }
td.drugtablecell { border-width:thin; border-color: #d66b6b; border-style:solid; text-align:center; width:90px; }
td.drugnamecell { width:300px; text-align:right; } 
/*End of drug table*/

/* Progress bar */
table.progress{ text-align:center; width:120px; margin-top:20px; margin-left:auto; margin-right:auto; border-spacing:0; border:0; }
td.progress{ text-align:center; width:10px; height:10px; margin-left:10px; margin-right:10px; }
div.progress-done{ text-align:center; width:10px; height:10px; border:solid 1px; background-color:#ff9603; }
div.progress-todo{ text-align:center; width:10px; height:10px; border:solid 1px; background-color:white; }

/* Main content */
div.content { width:80%; min-width: 972px; max-width: 1024px; margin-left:auto; margin-right:auto; text-align:center;background-color:white; padding: 11px; margin-top: 30px; border: solid; border-color: #1e79a6; display:inline-table; }
div.paragraphs { text-align: left; }
h2#page-title{ width:100%; border-bottom: solid #16bde1; padding-bottom: 7px; margin-top:7px; margin-bottom:20px; text-align:center; } 
select { width:140px; } 
div#languages { width: 100%; text-align: left; }
form {margin-left: auto; margin-right: auto; display:inline-table; }
label#label1 { padding: 5px; }
label#label2 { padding: 5px; }

/* Footer */
div#footer { width:80%; min-width: 972px; max-width: 1024px; margin-top:4px; margin-left:auto; margin-right:auto; font-size:8pt; text-align:right; } 

/* Graph */
/* TODO: still not working with IE. Bars are shrinkwrapping round % inside them. */
.graph { border:1px solid #1e79a6; padding:2px; position:relative; width:200px; margin-top:0px; margin-bottom:0px ;}
element.style { width:54%; }
.graph .bar { background:#16bde1 none repeat scroll 0 0; color:#333333; display:block; height:20px; line-height:20px; position:relative; text-align:center; margin-top:0px; margin-bottom:0px; }
/* IE HACK! Non valid css now :( */
strong.bar { color:#90C32C; font-weight:bold; _float:left }
table.results { padding:0px; margin-left:auto; margin-right:auto; }