/**********************************************************/
/*                                                        */
/*  file name:          dvs-basic.css                     */
/*  date:               2003-10-27                        */
/*  copyright:          Rod Gobby, Deer Valley Software   */
/*  style:              multi-columns + header + footer   */
/*  browser:            NN4,7 IE5,6 OmniWeb, Opera, etc   */
/*                                                        */
/**********************************************************/

/* ====================================================================
the methods on this page is largely the hard work (freely given) of
many other people from the css-discuss list [http://www.css-discuss.org],
including (but not limited to) Big John, Holly Bergevin,
Douglas Livingstone, Scott Sauyet, Victor Caston and Mike Papageorge
-------------------------------------------------------------------- */

/**********************************************************/
/*                                                        */
/*  box layout                                            */
/*                                                        */
/**********************************************************/

.content { width: 100%; }
.header { width: 100%; }
.head70 { width: 70%; float: left; }
.head30r { width: 29%; float: right; }
.wrapper { width: 100%; float: left; }
.navigate { width: 20%; float: left; }
.main { width: 78%; float: right; }
.box20 { width: 20%; float: left; }
.box30 { width: 30%; float: left; }
.box33 { width: 32%; float: left; }
.box50 { width: 50%; float: left; }
.box70 { width: 70%; float: left; }
.box80 { width: 80%; float: left; }
.box100 { width: 97%; float: left; }
.box20r { width: 19%; float: right; }
.box30r { width: 29%; float: right; }
.box33r { width: 32%; float: right; }
.box50r { width: 49%; float: right; }
.box70r { width: 69%; float: right; }
.box80r { width: 79%; float: right; }

/**********************************************************/
/*                                                        */
/*  box clear                                             */
/*                                                        */
/**********************************************************/

/* ====================================================================
box-clear requires all sorts of hackery because of the way the
different browsers cope with clearing floats
see [#   #]
-------------------------------------------------------------------- */
.box-clear { clear: both; line-height: 0px; font-size: 1px; }
/* IE5 (mac) dealt with, now reset font-size for Geckos,
turn off for IE5 (PC) + OmniWeb and back on for IE6 (PC)
see [http://www.fu2k.org/alex/css/test/OmniWebInlineHack.mhtml] */
/*\*/
.box-clear { font-size: medium; }
.fake.box-clear { display: none; }
/* */
/* Turn off for Opera 6 and below */
html>body div.box-clear { display: none; }
/* And turn it back on again for good honest browsers
see [http://www.albin.net/CSS/OwenHack.html] */
head:first-child+body div.box-clear { display: block; }
/* ====================================================================
nn4clear is as its name suggests, only required for NN4 compatibility
If you don't need that you can remove both this rule and the
relevant div from the html
-------------------------------------------------------------------- */
.nn4clear { clear: both; line-height: 0px; font-size: 1px; }
/*/*/ .nn4clear { display: none; } /* */

/**********************************************************/
/*                                                        */
/*  position: relative                                    */
/*                                                        */
/**********************************************************/

/* CSS HACK:  position:relative needed by IE6 otherwise the header and col 2
don't show up on initial rendering - they're there but you have to minimise
the window or switch to another app and back to see the full effect. But IE5(pc)
doesn't like it. And nor does NN4. NB. the use of pos:rel has to go way beyond
skin-deep - any nested element that needs a background colour appears to require
to be relatively positioned */ 

/*/*/a{}
.content { p\osition: relative; }
.header { p\osition: relative; }
.head70 { p\osition: relative; }
.head30r { p\osition: relative; }
.wrapper { p\osition: relative; }
.navigate { p\osition: relative; }
.main { p\osition: relative; }
.box20 { p\osition: relative; }
.box30 { p\osition: relative; }
.box33 { p\osition: relative; }
.box50 { p\osition: relative; }
.box70 { p\osition: relative; }
.box80 { p\osition: relative; }
.box100 { p\osition: relative; }
.box20r { p\osition: relative; }
.box30r { p\osition: relative; }
.box33r { p\osition: relative; }
.box50r { p\osition: relative; }
.box70r { p\osition: relative; }
.box80r { p\osition: relative; }
h1 { p\osition: relative; }
h2 { p\osition: relative; }
h3 { p\osition: relative; }
h4 { p\osition: relative; }
h5 { p\osition: relative; }
h6 { p\osition: relative; }
/* */a{}

/**********************************************************/
/*                                                        */
/*  end of style                                          */
/*                                                        */
/**********************************************************/

