/*
This css file implements a fixed banner with scrolling content. The fixed banner must
be at the top of the viewport and use id="titleframe". The scrolling content must
follow directly and use id="contentframe".

It works in Mozilla, Opera and IE6/7 in standards mode.
In IE6/7 javascript is required but it will degrade gracefully with normal scrolling.
To ensure standards mode in IE, use HTML 4.01 Transitional doctype and include the url.

====== IE7 BUG ======
http://www.gtalbot.org/BrowserBugsSection/MSIE7Bugs/
Bug 41: Infinite loop related to overflow and position: fixed

If position:fixed is applied to a div with overflow:auto and an element within the div
uses width:xx% then an infinite loop may result (on a single thread) and the scrollbar
is displayed incorrectly. This occurs if the element is initially below the viewport.
To prevent this problem occuring, position:static must be applied to the div i.e. even
though IE7 supposedly supports position:fixed, it cannot be used on a scrolling div.
Javascript can be used to provide a workaround. The following code must be added to the
html directly AFTER this stylesheet is included...

<!--[if IE]>
  <style type="text/css" media="screen">
    #contentframe { position : static }
  </style> 

  <noscript>
  <style type="text/css" media="screen">
    body          { overflow : visible; height:auto; max-height:none }
    #contentframe { overflow : visible }
  </style> 
  </noscript>

  <script type="text/javascript">
  document.open();
  document.writeln('<style type="text/css" media="screen">');
  document.writeln('html { overflow : hidden }');
  document.writeln('<\/style>');
  </script>
<![endif]-->

The following code must be placed at the end of the page directly BEFORE </body>

<!--[if IE]>
<script type="text/javascript">
  function resizeContentFrame(){
//  The line below is only required if an additional navigation frame is defined to the left of the contentframe.
//  document.all.navframe    .style.height = document.documentElement.clientHeight - document.all.navframe    .offsetTop  + "px";

    document.all.contentframe.style.height = document.documentElement.clientHeight - document.all.contentframe.offsetTop  + "px";
    document.all.contentframe.style.width  = document.documentElement.clientWidth  - document.all.contentframe.offsetLeft + "px";
  }

  resizeContentFrame();
  resizeContentFrame(); // called twice deliberately to overcome odd scrollbar behaviour

  document.body.onresize = resizeContentFrame;
</script>
<![endif]-->

*/

@media screen {
  body {
  margin     : 0;
  padding    : 0;
  height     : 100%; 
  max-height : 100%; 
  overflow   : hidden; 
  }

  #titleframe {
  height   : 51px;  /* See comment below */
  overflow : hidden;
  }

  #contentframe {
  position : fixed; /* Mozilla, Opera only. For IE7 see comments above.          */
  top      : 52px;  /* Height of #titleframe including padding border and margin */
  left     : 0;
  bottom   : 0; 
  right    : 0; 
  overflow : auto;
  padding  : 0;    /* padding, border and margin must be null.           */
  margin   : 0;    /* If required they should be applied to an inner div */
  border   : none;   
  }
}