/* CSS Document */
body {font: 1em "Trebuchet MS",Tahoma,Verdana,Helvetica,Arial,Geneva,sans-serif; text-align: center; color: #467283; behavior: url(css/csshover.htc);}

* {margin: 0; padding: 0; font-family: Helvetica,Arial,Geneva,sans-serif;}

/*/*/a{}
body, body td, body th {font-weight: normal; cursor:default; font-size: small; voice-family: "\"}\""; voice-family: inherit; font-size: medium;}
html>body, html>body td, html>body th {font-size: medium; font-weight: normal; cursor:default;}  
/* */

/* HEADER STYLES */
h1, h2 {margin: 0; padding: 0;}
h1 {font-size: 10px}
h2 {font-size: 13px}
/*/*/a{}
h1 {font-size:small; voice-family: "\"}\""; voice-family: inherit; font-size: medium;}
html>body h1 {font-size: medium;}
h2 {font-size: x-small; voice-family: "\"}\""; voice-family: inherit; font-size: small;}
html>body h2 {font-size: small;}
/* */
h3 {color: #467283; font-size: .9em; font-weight: bolder;}
h4 {color: #679CA2; font-size: .9em; font-weight: bold; border-bottom: 1px dashed; margin-bottom: 5px;}
h5 {color: #B7DDE0; font-size: .8em; font-weight: bold; border-bottom: 1px dashed; margin: 7px 0 5px 0;}
h6 {color: #679CA2; font-size: .8em; font-weight: bold; margin-top: 5px;}

/* Paragraph styles */
p {padding: 5px 0 10px 0; font-weight:200;}
p.highlight {font-family: "Bitstream Vera Sans Mono",Geneva, Arial, Helvetica, sans-serif; padding: 20px; background-color:#ECF2F2; text-align: center; font-size:1.3em; font-weight:600; }
p span.italics {font-style:italic;}

/* General Link Styles */
a {color: #3182D3;}
a:hover {color: #679CA2;}

/* List styles */
ul {list-style-type: disc;}
li {list-style-type: disc;}

/* General Alignment */
html>body .right {float: right;}

/* Footer style */
div#footer {text-align: right; padding-top: 6px;}

/* Image styles */
img {border: 0; padding: 0; margin: 0;}
img.image_left {float: left; margin: 10px 10px 10px 0;}
img.image_right {float: right; margin: 10px 0 10px 10px;}
div#logo img {border: 0;}

/* Top navigation links */
* div#nav_top ul {float: left;}
div#nav_top li {float: left; list-style-type: none;}
div#nav_top a {font-weight: 600; color: #669CA1; text-decoration: none;}
div#nav_top a:hover {color: #3182D3;}

/* Positioning */
div#mainwrap {width: 900px; margin-left: auto; margin-right: auto; text-align: left;}
div#header {height: 140px; margin: 0 53px 0 53px; text-align: left; background:url(../images/theme/essentials/header_dropdown.gif) repeat-x top left;}
div#header_image {height: 60px; position: absolute; top: 140px; left: 53px;}
div#logo {float: left; height: 120px; width: 200px; padding-top: 5px; text-align:center;}
div#nav_top {position: absolute; top: 70px; right: 80px; font-weight: 800; font-size: .8em; color: #B7DDE0;}
div#nav_base {position: relative; right: 70px;}
div#contentarea {width: 900px; position: relative; background:url(../images/theme/essentials/faux_left.gif) repeat-y top left;}
div#contentarea2 {width: 900px; position: relative; background:url(../images/theme/essentials/faux_right2.gif) repeat-y top right;}
div#column1 {width: 200px; position: absolute; top: 244px; left: 0px; margin: 0 0 0 53px; padding: 0;}
div#column2 {width: 530px; margin-left: 200px; padding-top: 60px; left: 200px; }
div#column3 {width: 170px; position: absolute; top: 200px; left: 730px; padding: 0; bottom: 0}
.left_col {width: 256px;}
.right_col {position: absolute; left: 265px;}
div#headerwrap {position: absolute; top: 0; width: 900px; text-align: left;}
div#sidenav_left {top: 0px; left: 0px; width: 131px;}
div#sidenav_right {position: relative; top: 5px; right: -3px; width: 102px; text-align: right;}
div#footer {clear: both; position: relative; height: 38px; background: url(../images/theme/essentials/footer.gif) no-repeat;}

/* Navigation - left side menu */
div#sidenav_left {background-color:#FFFFFF; margin: 7px 0 0 5px; padding: 0;}
div#sidenav_left a {display: block; font-weight: 800; font-size: .8em; color: #3182D3; text-decoration: none; padding: 0 5px 0 5px;}
div#sidenav_left a.header {background-color:#ECF2F2; color: #3182D3; padding:10px 0 10px 10px;}
div#sidenav_left a.header:hover {background-color:#ECF2F2; color: #669CA1; padding:10px 0 10px 10px;}
div#sidenav_left ul {margin: 0; padding: 0 0 10px 0;}
div#sidenav_left ul li {list-style-type: none; width: 131px; padding: 5px 0 5px 0; border-bottom-width: thin; border-bottom-style: dotted; border-bottom-color: #ECF2F2;}
div#sidenav_left ul li:hover {background-color:#ECF2F2;}

/* News Nav Style */
div#news { width: 131px; background-color:#FFFFFF; margin: 7px 0 0 5px; padding: 0;}
div#news p.news {margin: 0 5px 0 5px; font-size: .8em;}
div#news p a.news_link {font-size:1em; margin: 0; padding: 0;}
/*div#news p a.news_more {text-align: right; font-weight:100; margin: 5px 0 0 0; padding: 0;}*/
div#news a.news_more {text-align: right; font-size:.6em; margin: 0px; padding: 0;}
div#news a {display: block; font-weight: 800; font-size: .8em; color: #3182D3; text-decoration: none; padding: 0 5px 0 5px;}
div#news a.header {background-color:#ECF2F2; color: #3182D3; padding:10px 0 10px 10px;}
div#news a.header:hover {background-color:#ECF2F2; color: #669CA1; padding:10px 0 10px 10px;}
div#news ul {margin: 0; padding: 0 0 10px 0;}
div#news ul li {list-style-type: none; width: 131px; padding: 5px 0 5px 0; border-bottom-width: thin; border-bottom-style: dotted; border-bottom-color: #ECF2F2;}
div#news ul li:hover {background-color:#ECF2F2;}

/* Navigation - Base Menu */
div#nav_base { font-weight: 300; font-size: .7em; text-align: right; color: #3182D3;}
div#nav_base ul {text-align: right; float: right;}
* div#nav_base ul {position: relative; float: right;} /* putting position:relative here again breaks the rule of separating positioning from other properties, but this makes it work, I don't know why. */
div#nav_base li {float: left; list-style-type: none;}
div#nav_base a {font-weight: 600; color: #3182D3; text-decoration: none;}
div#nav_base a:hover {color: #669CA1;}

/* Navigation - Dropdown Menu */
div#dropdown {position: relative; top: 104px; width: 750px; left: 90px; font-size: .9em; font-weight: bold; text-align: left;} /*left position determines how far left the entire line of items will sit; try and keep it looking centred */
div#dropdown a {display: block; padding: 0 3px; text-decoration: none; color: #FFFFFF;} /* the padding determines whether the last item drops off the line in IE 6 */
div#dropdown a:hover {color: #467283;}
div#dropdown ul {float: left;}
* html div#dropdown ul {float: left;}
div#dropdown ul li {width: 100px; float: left; position: relative; list-style-type: none; border-right: 0px; background-image:url(../images/theme/essentials/dropdown_top.gif) no-repeat; } /* this line should have background-repeat:no-repeat; but when that's put in, the nav bar breaks! */

div#dropdown ul li:hover ul, div#dropdown ul li ul:hover {display: block;}
div#dropdown li:first-child {border-left: 0px solid #467283;}
div#dropdown ul li ul {margin:0 0 0 1px; position: absolute; top: 36px; width: 12em; left: -1px;}
* html div#dropdown ul li ul {border-top: 1px solid #E8EEF0; border-left: 0px;}
body div#dropdown ul li ul {display: none;}
div#dropdown ul li ul li {width: 100%; border-left: 0px solid #467283; border-bottom: 1px solid #E8EEF0; border-right: 0px solid #467283;}
div#dropdown ul li ul li {width: 13em; float: right; position: relative; list-style-type: none; border-right: 0px solid #467283; background-color: #669CA1; background-image:url(../images/theme/essentials/dropdown_left.gif);}
div#dropdown ul li ul li:first-child {border-top: 1px solid #E8EEF0;}
div#dropdown ul li ul li a {padding: 0 5px 0 5px;}
div#dropdown ul li ul li a:hover {color: #3182D3; background-image:url(../images/theme/essentials/dropdown_left2.gif);}

/* Fix IE. Hide from IE Mac \*/
* html div#dropdown ul li {float: left; height: 1%;}
* html div#dropdown ul li a {height: 1%;}

/* Hidden elements */
.hidden {display: none;}

/* Clearfix Fix */
.clearfix:after { display: block; height: 0; clear: both; visibility: hidden;}
/**/.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}

/* Homepage specific positioning */
div#column1_index {position: absolute; top: 200px; width: 155px; left: 0px; margin: 0 0 0 53px; padding: 0;}
div#column3_index {background-color:#FFFFFF; position:absolute; top: 50px; left: 734px; width: 166px; height: 315px; background:  url(/images/theme/essentials/faux_right2.gif) repeat-y;}

/* Frontpage code */

/* Homepage Buttons */
div#buttons {position: relative; bottom: 0px; left: 0px; margin-bottom: 0px; width: 648px; height: 100px; overflow:hidden; }
/* we used to have a box of 4 x 2 buttons; height used to be 200px */
/*html>body div#buttons {position: relative; bottom: 0; margin-bottom: 0px; width: 648px; overflow:hidden; }*/
* html div#buttons a:hover {visibility: visible; }
div#buttons a:hover img { visibility: hidden; }
div#buttons img {height: 100px; width: 162px; border: 0; }
div#buttons a {display: block; height: 100px; width: 162px; display: block; float: left; }
div#button_01 {position: absolute; top: 0; left: 0; height: 100px; width: 162px; background: url(../images/theme/buttons/buttons_final_over_01.jpg) no-repeat; display: block; margin: 0; padding: 0; }
div#button_02 {position: absolute; top: 0; left: 162px; height: 100px; width: 162px; background: url(../images/theme/buttons/buttons_final_over_02.jpg) no-repeat; display: block; margin: 0; padding: 0; }
div#button_03 {position: absolute; top: 0; left: 324px; height: 100px; width: 162px; background: url(../images/theme/buttons/buttons_final_over_03.jpg) no-repeat; display: block; margin: 0; padding: 0; }
div#button_04 {position: absolute; top: 0; left: 486px; height: 100px; width: 162px; background: url(../images/theme/buttons/buttons_final_over_04.jpg) no-repeat; display: block; margin: 0; padding: 0; }
/*div#button_05 {position: absolute; top: 100px; left: 0; height: 100px; width: 162px; background: url(../images/theme/buttons/buttons_final_over_05.jpg) no-repeat; display: block; margin: 0; padding: 0; }
div#button_06 {position: absolute; top: 100px; left: 162px; height: 100px; width: 162px; background: url(../images/theme/buttons/buttons_final_over_06.jpg) no-repeat; display: block; margin: 0; padding: 0; }
div#button_07 {position: absolute; top: 100px; left: 324px; height: 100px; width: 162px; background: url(../images/theme/buttons/buttons_final_over_07.jpg) no-repeat; display: block; margin: 0; padding: 0; }
div#button_08 {position: absolute; top: 100px; left: 486px; height: 100px; width: 162px; background: url(../images/theme/buttons/buttons_final_over_08.jpg) no-repeat; display: block; margin: 0; padding: 0; }
*/

/* Homepage Feature - the blank space between 'welcome to oa' banner, left news and contact us/disclaimer footer */
div#featured {position: relative; width: 587px; }
div#featured img { border: 0; display: block;}
div#featured p {font-size: smaller; }
div#featured ul {font-size: .8em; color: #669CA1;}
div#featured ul li {color: #467283; line-height: 1.4em; width: 400px; font-size: 1em; padding-left: 0; margin-left: 3em; list-style-type: square;}

div#Table_01 { /* the blank space between "Welcome to Osteoporosis Australia", left nav bar and buttons on the bottom */
	position:relative;
	left:0px;
	top:0px;
	padding: 0px;
	width: 100%; /* same width as div#featured */
	display: block;
}

div#right {
/*	position: relative; */
	position: absolute; 
	left: 324px;
	top: 0px;
	width: 300px;
	padding: 0px 0px 0px 20px;
	margin: 10px 0px 0px 0px;
	border-left: 1px solid #4d99e5; /* middle blue line, bottom length */
	height: 400px; /* this should be defined in the div that has the absolute position */
}
div#fracturecard {
	position: relative;
	width: 272px;
	left: 11px;
	/*top: -10px;*/
}
div#fracturecard img{
	border: 0;
	display: inline;
}

div#left {
	position:relative;
/*	position:absolute; */
	left: 0px;
	top: 0px;
	width: 304px; /* determines where the middle blue line lies */
	/*border-right: 1px solid #4d99e5; /* middle blue line, start from the top */
	margin: 0px 0px 0px 10px;
	/*margin-right: 0px; 
	padding-left: 20px; */
/*	height: 400px; /* this should be defined in the div that has the absolute position */
}

div.hr_index { /* a horizontal, thin blue line */
	display: block;
	border-bottom:1px solid #4d99e5;
	width: 97%;
	margin-bottom: 5%;
}