<head>
<style>
		
	.box {/*this is a box where the bottom-navigation*/
      /* and the copyright will be placed*/
  background: #FFFFFF;
  color : #000099;
  font-family : Arial, Tahoma, Verdana, Helvetica, sans-serif;
  font-size: 12px;
  padding : 2px;
  margin: 2px;
  border-color : #48D1CC;
  border-style : groove;
  border-width : 2px;/* the border property in longhand*/
  }
   .bodytxt {font-family: arial; font-size: 8pt; color: gray; }
   .body2txt {font-family: arial; font-size: 10pt; color: gray; }  
   .titletxt {font-family: arial; font-size: 10pt; color: gray; } 
   .headtxt {font-family: Helvetica; font-size: 15pt; font-style: bold; color: darkred; } 
   .head2txt {font-family: Helvetica; font-size: 13pt; font-style: bold; color: darkred; } 
   .copyright {font-family: arial; font-size: 9pt; color: darkred; }
	
</style>
</head>

<!--
<style type="text/css"> 

BODY {
      background-color : #FFFFFF;
      background-image: url(images/Pattern1.gif);
      background-repeat: repeat-y; 
      font-family : Verdana, Eyechart, Geneva, Arial, Helvetica, sans-serif;
      color : #000088;
      margin: 0px; 
      }
.Navigation {/*The navigation on the left side, positioned absolutely*/
    position: absolute;
    top: 100px;
    left: 3px;
    width: 135px;
    height: auto;
    font-family : Verdana, Eyechart, Geneva, Arial, Helvetica, sans-serif;
    line-height : 110%;/*line-height set to 110% in order to*/
                      /*have the navigation elements better separated*/
    }
.Inhalt {/*this is the main content area*/
    background: #FFFFFF;
    /*declare a color together with a contrasting background color*/
    color: #000088;/*to insure readability*/
    margin-left: 160px;
    /*to position the content area to the right of the navigation*/
    margin-right: 20px;/*breathing space for the text*/
    padding: 5px;/*space to separate navigation and content*/
    font-family : Verdana, Eyechart, Geneva, Arial, Helvetica, sans-serif; 
    width: auto;
    border: 0.1px solid #FFFFFF; 
   /*to insure that NN4.xx renders the background-color of the content area*/
    }

.Header {
    margin-top: 10px;
    margin-left: 160px;
    } 
.box {/*this is a box where the bottom-navigation*/
      /* and the copyright will be placed*/
  background: #FFFFFF;
  color : #000099;
  font-family : Arial, Tahoma, Verdana, Helvetica, sans-serif;
  font-size: 12px;
  padding : 2px;
  margin: 2px;
  border-color : #48D1CC;
  border-style : groove;
  border-width : 2px;/* the border property in longhand*/
  }

.navbox {/*button-like box for the left-side navigation*/
   font-size: 15px;/*readability for the links*/
   font-family: Arial, Tahoma, Verdana, Helvetica, sans-serif;
   border-color: #FF6633;/*or, in shorthand, the three*/
   border-style: groove; /*border-properties would read:*/
   border-width: 2px;/*border: 2px groove #FF6633;*/
   padding: 1px;
   margin: 2px;
   }

P, OL, UL, DL {font-size: 13px;}
/*font-family is already defined, here I only set the font-size*/ 
P OL, P UL, P DL, OL UL {font-size: 13px;}
/*and here the I prevent the incredible shrinking text*/
        
.six {font-size: 11px; 
  color: #999999; /*this is for small text*/
  background: transparent;}
.mit {text-align: justify;/*justified text*/}
.red {color : #FF0000; background: #FFFFFF;}
.mint {color: #009999; background: #FFFFFF;}
.ROT {font-size: 16px; /*also red, but bigger and in bold*/
  color: #FF0000; 
  font-weight: 600; 
  background: #FFFFFF;}
    
a:link {/*normal links in the text*/
  color: blue; 
  text-decoration : none; 
  background: #FFFFFF;}
a:visited {
  color: #FF0000; 
  text-decoration : none; 
  background: #FFFFFF;}
a:hover { 
  color: #999999; 
  text-decoration : underline; 
  background: #FFFFFF;}

/*now follow the section links in the navigation bar on the left side*/
a.nav:link {
  color: #FFFFFF; 
  text-decoration : none; 
  font-weight: 600; 
  font-size:14px; 
  background: transparent;}
a.nav:visited {
  color: #FF8C00; 
  text-decoration : none;
  font-weight: 600; 
  font-size:14px; 
  background: transparent;}
a.nav:hover { 
  color: #7FFFD4; 
  text-decoration : none; 
  font-weight: 600; 
  font-size:14px; 
  background: transparent;}
a.navtot {/*the style for the actual page*/
  color: #CDCDCD; 
  text-decoration: none; 
  font-weight: 600; 
  font-size: 14px; 
  background: transparent;}

strong, b {font-weight: 800;/*NN 4.xx needs that...*/ }

big {font-size: larger; /*to emphasize words, use it inline with a SPAN class*/ 
 }
small {font-size: smaller;}
/*not really necessary, but one never knows...use it inline with a span class*/
  
/*these are the sub-section links in the navigation bar on the left side*/
a.nav2:link {
  color: #FFFFFF; 
  text-decoration : none; 
  font-weight: 500; 
  font-size:13px; 
  background: transparent;}
a.nav2:visited {
  color: #FF8C00; 
  text-decoration : none;
  font-weight: 500; 
  font-size:13px; 
  background: transparent;}
a.nav2:hover { 
  color: #7FFFD4; 
  text-decoration : none; 
  font-weight: 500; 
  font-size:13px; 
  background: transparent;}
a.navtot2 {/*the actual page*/
  color: #CDCDCD; 
  text-decoration: none; 
  font-weight: 600; 
  font-size: 13px; 
  background: transparent;}
.oldbrowser {display: none;}    
    
</style>
<!-- and ending here. Do NOT copy the ::style type="text/css":: and end-style declaration  --> 
<!-- 
<script src="Mako.js" type="text/javascript"></script>

</head>
<body>

<p class="oldbrowser">This web site is about Cascading Style Sheets as a means to separate the <strong>presentation</strong> from the 
      <strong>structural markup</strong> of a web site, and it will help you answer some of those frequently asked <a href="CSSFAQ.htm"><strong>Questions</strong></a>, 
      explains some of the <a href="Basics.htm"><strong>Basics</strong></a> of CSS, gives you tips and tricks for tackling 
      the problems with <a href="Issues.htm"><strong>Netscape 4</strong></a>, offers you a tutorial about 
      <a href="Tutorial.htm"><strong>Positioning</strong></a> with CSS (CSS-P, web design 
      without tables). There is also a page with interesting <a href="Links.htm"><strong>Links</strong></a>.

<br />
<strong>This page uses CSS to present the content in the best possible manner.  If you can see this 
message, then CSS (or JavaScript) is not enabled in your browser, and the page will not appear as the 
designer intended.</strong></p>


<div class="Header">
<img src="images/CSS-P.gif" width="384" height="66" alt="Positioning with CSS" /><br />
<small class="red">good place for a tag line</small>
</div>

<div class="Navigation">
<div class="navbox"><a class="nav" href="javascript: void(0)">Link 1</a></div>
<div class="navbox"><a class="nav" href="javascript: void(0)">Link 1</a></div>
<div class="navbox"><a class="nav" href="javascript: void(0)">Link 1</a></div>

</div>
<div class="skipnav"><a name="startcontent" id="startcontent">&nbsp;</a></div>
<div class="Inhalt"><h3>CONTENT, with the nested FOOTER box</h3>
<p>Now you have the full stylesheet in the &lt;head&gt; section of this page.<br />

<br />The more elegant way is to copy all styles into a blank document, save it as &quot;examplestyles.css&quot;
and link it in the &lt;head&gt; section of each document you want to apply the styles.<br />

 
<br />The syntax for linking an external style sheet is:<br />

&lt;link rel=&quot;stylesheet&quot; href=&quot;Style.css&quot; type=&quot;text/css&quot;&gt;<br />

<br />It makes sense to use two different external styles - one for IE and NN6, the other one for NN4.xx. 
In doing so, you could adapt your font sizes, or background properties, or the other styles that NN4.xx has problems with.<br />

<br />To do that you can use the fact that NN 4.xx does not accept the @import.
Therefore you link two style sheets:<br />

&lt;link rel=&quot;stylesheet&quot; href=&quot;StyleNN.css&quot; type=&quot;text/css&quot;&gt;<br />
&lt;style type=&quot;text/css&quot;&gt; <br />
@import url(Style.css); /*IE and NN6x styles*/<br />

&lt;/style&gt;<br />

<br />Explanation: NN&lt;6 does not recognize the @import, so it uses the &lt;link&gt; style sheet. IE and NN6 accept the 
@import, and by placing it below the &lt;link&gt; style, you give it more importance, therefore IE and NN6 will give you 
the styles in the @import sheet.<br />

<br />You have to remember to use the same selectors and properties in both style sheets. If you declare a value in the 
linked stylesheet and omit this in the imported sheet, IE will take the value from the linked sheet.</p>

<br />


<div class="box">FOOTER BOX<br />
This will be the secondary navigation
</div>

</div>


</body>
</html>
-->
