/* -Ian! D. Allen - idallen@idallen.ca - www.idallen.com */

.bold { font-weight: bold }
.boldit { font-weight: bold; font-style: italic }
.middle { vertical-align: middle }

/* causes problems in Chrome with images stretching down */
.full {
    width: 100%;
    height: 100%;
}

body {
  font-family: verdana,arial,helvetica,sans-serif,georgia;
  background-color: #ffffdd;
  max-width: 55em;
  padding-top: 1em;
  padding-left: 1em;
  padding-right: 0.2em;
  margin: 0;
}

/* all images stay inside their containers */
img {
    max-width: 100%;
}

/**************************************************************************/

#topblock {
  /* position: relative; /* captures all enclosed absolute positions */
  float: left;
  background-color: #ffdd66;
  margin-bottom: 0.15em;
  border-top: 0.2em solid #ff9900 ;
  border-bottom: 0.2em solid #ff9900;
  padding-bottom: 0.5em;
  width: 100%;
  height: 100%;
}

#topblock .updated {
  float: right;
  font-style: italic;
  font-size: 70%;
  margin: 0;
  padding: 0;
}

/**************/

#topleftblock {
  width: 25%;
  float: left;
  margin-right: 2%;
  text-align: center;
  background-color: #ff9900;
  padding-top: 0.5em;
}

#topleftblock img {
    width: 80%;
}

/**************/

#toprightblock {
  background-color: #ffdd66;
  float: left;
  width: 71%;
  padding-left: 2%;
}

#toprightblock h1, #toprightblock h2, #toprightblock img {
  clear: right; /* go under the .updated */
  text-align: left;
  margin: 0;
  padding: 0;
}

/**************************************************************************/

#midblock  {
  width: 100%;
  float: left;
  margin: 0;
  padding: 0;
  clear: left;
  background-color: #ffdd66;
}

/**************/

#midleftblock {
  width: 25%;
  min-width: 10em;
  float: left;
  margin-bottom: 1em;
  background-color: #ffdd66;
  padding-top: 0.5em;
}

#midleftblock ul {
 margin-top: 0;
 margin-bottom: 0.5em;
 padding-left: 1.5em;
 padding-right: 0.5em;
}

#midleftblock .major li {
 font-weight: bold;
 color: yellow;
}

#midleftblock li {
    margin-bottom: 0.5em;
}

#midleftblock .jump * {
 font-size: 90%;
}

#midleftblock h4 {
    margin-top: 0;
    margin-bottom: 0.5em;
    padding: 0;
}

#midleftblock .jump * {
    font-style: italic;
}

/**************/

/* margin must be zero on this or it pushes even the float down */
#midrightblock > *:first-child { margin-top: 0; }

#midrightblock {
  float: left;
  width: 73%;
  padding-left: 2%;
  background-color: #ffffaa;
  padding-top: 0.5em;
}

#midrightblock #midrightblockcol1of3 {
    float: left;
    width: 22%;
    /* height: 20%; */
}

#midrightblock #midrightblockcol2of3 {
    float: left;
    width: 46%;
    min-width: 10em;
    margin-top: 0;
    margin-left: 1%;
    margin-right: 1%;
}

#midrightblock #midrightblockcol2of3 > *:first-child {
    margin-top: 0;
}

#midrightblock #midrightblockcol3of3 {
    float: left;
    width: 30%;
    /* height: 30%; */
}

/**/

#midrightblock #midrightblockcol1of2 {
    float: left;
    width: 68%;
    min-width: 10em;
    margin-top: 0;
    margin-right: 2%;
}

#midrightblock #midrightblockcol1of2 > *:first-child {
    margin-top: 0;
}

#midrightblock #midrightblockcol2of2 {
    float: left;
    width: 30%;
    height: 30%;
}

/**/

#midrightblock ul {
 margin-top: 0;
 margin-bottom: 0.5em;
 padding-left: 1.5em;
 padding-right: 0.5em;
}


#midrightblock dt {
 font-weight: bold; font-style: italic;
}

#midrightblock dd {
    margin-left: 1em;
}

/* if you clear both, it goes under *all* the floats on the page,
 * even the sidebar, unless you make the container a float too */
#midrightblock #midrightblocklowblock {
  clear: both;
}


/**************************************************************************/

#lowblock {
  clear: both;
  float: left;
  width: 100%;
  max-width: 40em;
}

#lowblock > p {
  padding-left: 1em;
}

#lowblock > h3 + h4 {
  margin-top: -1em;
  padding-left: 1em;
}

#lowblock oxl {
 margin-top: 0;
 margin-bottom: 0.5em;
 padding-left: 1.5em;
 padding-right: 0.5em;
}

/**************************************************************************/

#footer  {
  clear: both;
  float: left;
  width: 100%;
  border-top: 2px solid red;
  border-left: 2px solid red;
  padding-left: 1em;
  max-width: 40em;
  font-style: italic;
  font-size: 80%;
}

#footer > p {
    margin-top: 0.5em;
}

#footer  img.wide {
  width: 90%;
  max-width: 440px;
}