@media screen
{
  div#features
  {
    background:       transparent url(/images/huppelstop.png) no-repeat scroll top left;
    width:            236px;
    height:           420px;
  }

  div#features > div
  {
    background:       transparent url(/images/huppeloverlay.png) no-repeat scroll top left;
    width:            100%;
    height:           420px;
    visibility:       hidden;
  }

  div#features2
  {
    background:       transparent url(/images/organen.png) no-repeat scroll top left;
    width:            175px;
    height:           354px;
    margin-bottom:    1em;
  }

  div#features2 > div
  {
    background:       transparent url(/images/organenoverlay.png) no-repeat scroll top left;
    width:            100%;
    height:           354px;
    visibility:       hidden;
  }

  div#features:hover,
  div#features2:hover
  {
    width:            100%;
  }

  div#features:hover > div,
  div#features2:hover > div
  {
    visibility:       visible;
  }

  div#features:hover > div > div /* extra div needed for IE7 */
  {
    margin:           0;
    padding:          60px 0 0 240px;
  }

  div#features2:hover > div > div /* extra div needed for IE7 */
  {
    margin:           0;
    padding:          0 0 0 180px;
  }

  div#features > div > div > ul,
  div#features2 > div > div > ul
  {
    list-style:       none inside none;
    margin:           0;
    padding:          0;
  }

  div#features > div > div > ul > li,
  div#features2 > div > div > ul > li
  {
    list-style:       none inside none;
    margin:           0;
    padding:          0 0 0 5px;
    line-height:      40px;
    height:           40px;
    vertical-align:   top;  /* Fixing stupid IE */
  }

  div#features > div > div > ul > li:hover,
  div#features2 > div > div > ul > li:hover
  {
    background-color: #EEEEEE;
  }

  div#features > div > div > ul > li > h1,
  div#features2 > div > div > ul > li > h1
  {
    display:          inline;
    font-size:        medium;
    font-weight:      normal;
    margin:           0;
    padding:          0;
    float:            left;
  }

  div#features > div > div > ul > li > div,
  div#features2 > div > div > ul > li > div
  {
    position:         relative;
    float:            right;
    display:          inline-block;
  }

  div#features > div > div > ul > li > div
  {
    width:            250px;
  }

  div#features2 > div > div > ul > li > div
  {
    width:            350px;
  }

  div#features > div > div > ul > li > div > div,
  div#features2 > div > div > ul > li > div > div
  {
    position:         absolute;
    overflow:         visible;
    visibility:       hidden;
  }

  div#features > div > div > ul > li > div > div > div,
  div#features2 > div > div > ul > li > div > div > div
  {
    height:           300px;
    line-height:      1.5em;
    position:         relative;
    display:          block;
    background-color: #EEEEEE;
    padding:          10px;
    text-align:       center;
  }

  div#features > div > div > ul > li > div > div > div
  {
    width:            230px;
  }

  div#features2 > div > div > ul > li > div > div > div
  {
    width:            330px;
    overflow-y:       scroll;
    text-align:       left;
  }

  div#features > div > div > ul > li > div > div > div > img
  {
    display:          inline-block;
    width:            126px;
    height:           166px;
    background-color: white;
    margin:           10px;
  }

  div#features2 > div > div > ul > li > div > div > div > h2
  {
    font-size:        larger;
    font-weight:      normal;
    margin:           0;
    padding:          0;
  }

  div#features > div > div > ul > li > div > div > div > p
  {
    margin:           0;
    padding:          0 20px 10px 20px;
  }

  div#features > div > div > ul > li > div > div > div#eyes
  {
    top:              0px;
  }

  div#features > div > div > ul > li > div > div > div#ears
  {
    top:              -40px;
  }

  div#features > div > div > ul > li > div > div > div#jaw
  {
    top:              -80px;
  }

  div#features > div > div > ul > li > div > div > div#birthmarks
  {
    top:              -120px;
  }

  div#features > div > div > ul > li > div > div > div#fingers
  {
    top:              -160px;
  }

  div#features > div > div > ul > li > div > div > div#elbow
  {
    top:              -200px;
  }

  div#features > div > div > ul > li > div > div > div#chest
  {
    top:              -240px;
  }

  div#features > div > div > ul > li > div > div > div#feet
  {
    top:              -280px;
  }

  div#features2 > div > div > ul > li > div > div > div#eyes2
  {
    top:              0;
  }

  div#features2 > div > div > ul > li > div > div > div#ears2
  {
    top:              -40px;
  }

  div#features2 > div > div > ul > li > div > div > div#thyroid
  {
    top:              -80px;
  }

  div#features2 > div > div > ul > li > div > div > div#heart
  {
    top:              -120px;
  }

  div#features2 > div > div > ul > li > div > div > div#kidneys
  {
    top:              -160px;
  }

  div#features > div > div > ul > li:hover > div > div,
  div#features2 > div > div > ul > li:hover > div > div
  {
    visibility:       visible;
  }
}

@media print
{
  div
  {
    overflow:         visible !important;
  }

  div#content > p
  {
    visibility:       hidden;
  }

  div#features,
  div#features2
  {
    width:            auto;
    height:           auto;
    margin:           1em;
    padding:          1em;
  }

  div#features div,
  div#features2 div
  {
    width:            auto;
    height:           auto;
    margin:           0;
    padding:          0;
    page-break-before:avoid;
  }

  div#features ul,
  div#features2 ul
  {
    margin:           0;
    padding:          0;
  }

  div#features li,
  div#features2 li
  {
    margin:           0;
    padding:          0;
    clear:            both !important;
    page-break-inside:avoid;
  }

  div#features h1,
  div#features2 h2
  {
    font-size:        larger;
    font-weight:      bolder;
    margin:           0;
    padding:          1em 0 0.5em 0;
    page-break-after: avoid !important;
  }

  div#features2 h1
  {
    visibility:       hidden;
  }

  div#features li > div
  {
    min-height:       206px;
  }

  div#features img
  {
    float:            left;
    margin:           1em;
    padding:          1em;
    border:           1px solid black;
  }

  div#features p,
  div#features2 p
  {
    margin:           0;
    padding:          1em;
  }
}

