@media screen and (max-width:850px) {
  div.left, div.right {
    width:100%;
    float: none;
    clear: both;
  }
  h1{
   font-size:3.0vw !important;
  }
  h2, h3{
   font-size:2.5vw !important;
  }
}


@media screen and (max-width:650px) {
  p, td, th{
   font-size:2.8vw !important;
  }
  h1, h2, h3{
   font-size:3.5vw !important;
  }
}


@media screen and (max-width:550px) {
  p, td, th{
   font-size:3.0vw !important;
  }
  h1, h2, h3{
   font-size:3.5vw !important;
   /*color:green;*/
  }
  body, table, td, th, h1, h2{
   margin-left:1px !important;
   padding-left:1px !important;
  }
}

@media screen and (max-width:450px) {
  p, td, th{
   font-size:3.4vw !important;
  }
  h1, h2, h3{
   font-size:3.5vw !important;
   /*color:green;*/
  }
  body, table, td, th, h1, h2{
   margin-left:1px !important;
   padding-left:1px !important;
  }
}


h1{
 font-size:2.0vw;
 /*color:red;*/
}

h2, h3{
font-size:1.5vw;
}

body{
max-width:1200px;  /* might not be a good idea.  Seems to help on really wide monitors, though */
font-size:100%;
/*background-color:#f5faf3;*/ /*Kjell*/
background-color:#FFFFCC;
font-family:Arial,Garuda,Helvetica,sans-serif;   /* Garuda: font for Linux */
padding: 20px 20px 20px 20px;
margin: 0 auto 0 auto;
border: 2px solid  #a030a0;
}

h1,h2,h3,h4{
 font-family:arial,sans-serif;
}

h1{
 text-align:center;
}

table,td{
 font-family:arial,sans-serif;
 border:none;/*solid red 1px;*/
}

td{
 vertical-align:top;
 padding:5px;
}

p
{
margin-left: 2pt;
margin-right: 2pt;
}

table
{
margin-left: 2pt;
margin-right: 2pt;
}

#intro p:first-letter{font-size:1.3em;}

.blue  {color:blue;}
.red   {color:red;}
.green {color:green;}

a:link     { color:blue; }
a:visited  { color:#A02000; }
a:active   { color:red; }
a:hover    { color:red; }