/*
*************************************************
    
    MoAD Annual Report
    General Screen Styles
    
    Made with love by Icelab
    http://www.icelab.com.au/
    
*************************************************
*/

@import url("reset.css");

@font-face {
  font-family: 'DIN Medium';
  src: local('DIN-Medium'), url(../type/din_medium.ttf) format('truetype');
}

/*----- Generic ---------------------------*/

.wrapper:after {
  content: "."; display: block; height: 0; clear: both; visibility: hidden; }


/*----- General ---------------------------*/

body {
  color: #444;
  font: normal 75%/1.5 "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
  min-width: 960px; }

.wrapper {
  width: 960px;
  margin: 0 auto; }


/*----- Typography ------------------------*/

h1, h2, h3, h4, h5, h6 { font-weight: bold; color: #504844; margin-bottom: 10px; }
h1 { font-size: 285%; color: #cf5717; }
h2 { font-size: 140%; color: #cf5717; }
h3 { font-size: 133%; color: #cf5717; }
h4 { font-size: 120%; }
h5 { font-size: 110%; }
h6 { font-size: 100%; }

.intro { font-size: 116%; }

p, ul, ol, blockquote { margin: 0 0 10px; }
  
  ul {
    list-style-image: url(../img/bullet-grey.gif);
    margin-left: 18px; }
  ol {
    list-style: decimal;
    margin-left: 22px; }
  li {
    margin-bottom: 3px; }

a {  color: #cf5717; text-decoration: underline; }
  a:hover { color: #111; }

input, textarea { font: normal 75%/1.4 "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif; }

hr { background: #efefef; background: rgba(0,0,0,.08); border: 0; float: none; height: 0.1em; margin: 1.45em 0 1.45em; width: 100%; }

cite { font-style: italic; }

blockquote {
  border-left: 1px solid #ccc;
  padding-left: 10px;
  font-weight: normal;
  margin-left: 10px; }

  blockquote.medium { font-size: 133%; }
  blockquote.large { font-size: 150%; }
  blockquote.xlarge { font-size: 200%; }

sup,
sub {
  font-size: 60%;
  height: 0;
  line-height: 1;
  vertical-align: baseline;
  position: relative; }

  sup { bottom: .8em; }
  sub { top: .5em; }
  
.footnotes {
  border-top: 3px solid #ebebeb;
  font-size: 91.6%;
  margin-top: 2em;
  padding-top: 1.5em; }


/*------------------------------------------- 
  Grids are sometimes good.
  
  * A structure for generic content based
    on the 960.gs framework.
-------------------------------------------*/

.grid_1 { width: 40px; }
.grid_2 { width: 100px; }
.grid_3 { width: 160px; }
.grid_4 { width: 220px; }
.grid_5 { width: 280px; }
.grid_6 { width: 340px; }
.grid_7 { width: 400px; }
.grid_8 { width: 460px; }
.grid_9 { width: 520px; }
.grid_10 { width: 580px; }
.grid_11 { width: 640px; }
.grid_12 { width: 700px; }
.grid_13 { width: 760px; }
.grid_14 { width: 820px; }
.grid_15 { width: 880px; }
.grid_16 { width: 940px; }
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15 {
  display: inline;
  float: left;
  position: relative;
  margin-left: 10px;
  margin-right: 10px }
.alpha { margin-left: 0 }
.omega { margin-right: 0 }
.grid_right { float: right; }


/*----- Accessibility ----------------------------*/

#accessibility a {
  background: #777;
  color: #fff;
  display: block;
  left: 0;
  position: absolute;
  top: -999em;
  width: 100%; }

  #accessibility span {
    display: block;
    margin: .5em auto;
    width: 960px; }

  #accessibility a:focus {
    top: 0; }


/*----- Header ----------------------------*/

#header {
  background: #cf5717 url(../img/header-bg.jpg) top center repeat-x;
  height: 196px; }
  
  #header h1 {
    background: transparent url(../img/header.gif) no-repeat;
    height: 65px;
    float: right;
    line-height: 65px;
    margin: 77px 0 0;
    overflow: hidden;
    padding: 0;
    text-indent: -999px;
    width: 415px; }
    
    #header h1 a {
      display: block;
      height: 65px;
      width: 415px; }  
      
  #header h2 {
    background: transparent url(../img/moad-logo.gif) no-repeat;
    height: 153px;
    float: left;
    line-height: 153px;
    margin: 17px 0 0;
    overflow: hidden;
    padding: 0;
    text-indent: -999px;
    width: 177px; }
    
    #header h2 a {
      display: block; 
      height: 153px;
      width: 177px; }



/*----- Content ----------------------------*/

#content .wrapper {
  position: relative; }

#article {
  display: inline;
  float: left;
  position: relative;
  margin-right: 10px;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 700px; }
  
  #article h1 {
    font-family: "DIN Medium", "Lucida Grande","Lucida Sans Unicode", helvetica, verdana, arial, sans-serif;
    letter-spacing: -.02em;
    line-height: 1.2;
    text-transform: uppercase; }
  
  .chapter-heading {
    color: #cf5717;
    font-family: "DIN Medium", "Lucida Grande","Lucida Sans Unicode", helvetica, verdana, arial, sans-serif;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 0; }
  
  #article h2,
  #article h3 {
    font-family: "DIN Medium", "Lucida Grande","Lucida Sans Unicode", helvetica, verdana, arial, sans-serif; }

#backtotop {
  background: #fbe6d8 url(../img/backtotop.gif) 12px 14px no-repeat;
  display: block;
  color: #333;
  font-size: 90%;
  text-decoration: none;
  padding: 10px 20px 10px 27px;
  position: absolute;
  bottom: 0;
  right: 50px;
  width: 65px; }
  #backtotop:hover {
    background-color: #eb7f46;
    color: #fff; }

/*----- Sidebar ----------------------------*/

#sidebar {
  background: transparent url(../img/sidebar-bg.gif) left bottom no-repeat;
  display: inline;
  float: left;
  position: relative;
  min-height: 400px;
  width: 240px; }
  
  
#nav {
  margin: 20px 20px; }

#nav ul {
  margin: 5px 0 10px; }

#nav a {
  display: block;
  text-decoration: none; }
  
  #nav a:hover {
    text-decoration: underline;}

#nav li {
  font-family: "DIN Medium", "Lucida Grande","Lucida Sans Unicode", helvetica, verdana, arial, sans-serif;
  font-size: 120%;
  text-transform: uppercase;
  letter-spacing: .1em;
  line-height: 1.3;
  list-style: none;
  margin-bottom: 15px; }
  
  #nav li.active a { color: #111; }
  #nav li a, #nav li a:hover {
    color: #cf5717; }
  
  #nav li span {
    font-size: 75%;
    display: block; }
  
#nav li li {
  font-family: "Lucida Grande","Lucida Sans Unicode", helvetica, verdana, arial, sans-serif;
  font-size: 85%;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.5;
  margin-bottom: 5px; }
  
  #nav li li a {
    color: #666; }
  
  #nav li.selected a { font-weight: bold; }


/*----- Footer ----------------------------*/

#footer {
  background: #cf5717;
  color: #fff;
  padding: 20px 0 40px; }

  #footer a {
    color: #fff; }



/*----- Generic Boxes ----------------------------*/
.box, .figure {
  background: #fbe6d8; 
  border: 1px #f1ccb9 solid;
  border-left: 0;
  border-right: 0;
  padding: 10px 12px;
  margin-bottom: 15px; }
  
  .box { margin-top: 16px; }
  
  .box h2,
  .box h3,
  .box h4,
  .box h5,
  .box h6,
  .box p {
    color: #222; }
  
  .figure {
    float: right;
    margin: 0 0 10px 20px;
    padding: 5px 7px 0; }
    
    .legend { padding-bottom: 8px; margin: 0 5px; }
    .figure img { border: 1px solid #ccc; margin: 1px 0 3px; }
    .fig_left {
      float: left;
      margin: 0 20px 10px 0; }
    .figure a:hover img { border-color: #d4494e; }


/*----- Content tables ----------------------------*/

caption {
  color: #cf5717;
  padding: 0 0 10px 0;
  font-weight: bold;
  text-align: left;
}

table {
  margin: 12px 0 20px;
  border-left: 1px solid #f1ccb9;
  border-top: 1px solid #f1ccb9;
  width: 700px; }

th {
  background: #fadecc;
  border-right: 1px solid #f1ccb9;
  border-bottom: 1px solid #f1ccb9;
  color: #423e3e;
  font-weight: normal;
  padding: 6px 6px 6px 12px;
  text-align: left; }

th.nobg, td.nobg {
  border-top: 0;
  border-left: 0;
  border-right: 1px solid #f1ccb9;
  background: none; }


td {
  border-right: 1px solid #f1ccb9;
  border-bottom: 1px solid #f1ccb9;
  background: #fff;
  padding: 6px 6px 6px 12px; }

th.alt { background: #fbe6d8; }
td.alt { background: #fbede4; }