/** basic types ******************************/
a {text-decoration:none}
a:link {color:#0000FF;}      /* unvisited link */
a:visited {color:#CC00FF;}  /* visited link */
a:hover {color:#FF00FF;}  /* mouse over link */
a:active {color:#FF0000;}  /* selected link */ 


body {
    background-color : white;
    font-family : "Trebuchet MS", tahoma, Helvetica, sans-serif;
    font-style:normal;
    font-size:105%;
    color : black;
    line-height: 125%;
    border-style : none;
    text-align : left;
  	vertical-align: top;
    margin-right: 5%;
    margin-left: 5%;
    max-width: 70em;         /* avoid  massively long lines for readability */
    min-width:20em;
}

.left_col {
  	vertical-align: top;
    width:210px;
    margin-left: 0px;
    float: left;
}
.right_col {
  	vertical-align: top;
    text-align : right;
    width:210px;
    margin-right: 0px;
    float:right;
}
.middle_col {
  	vertical-align: top;
    text-align : left;
    margin-left: 0px;
    max_width: 60em;
}


table {
    border-collapse : collapse;
/*    clear: both;*/
}
h1 {
    text-align : center;
    color: #3367A3;
    line-height: 100%;
} 
h4 { margin-bottom: 2px;
} 
p {
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}
hr  {color: #5d97c7;
   size: 4px;
   background: #5d97c7;
}
li  {
    margin-left: 2em;   
}


/** classes ******************************/
.align_right {
    float: right;
}
.align_left {
    float: left;
}

.pic{   
//    display : inline;
    border : 2px solid;
	  margin-top: 5px;
	  margin-bottom: 5px;
}

/*****************
.pics a:hover .med {
    display: block;
}

.right .pics a:hover .med {
    right: 0;
}

.med {
    display:  none;
    position:  absolute;
}
**************/

.pics a:hover .med {
    background:none repeat scroll 0 0 white;
    border:1px solid gray;
    display:block;
    left:380px;
    margin-top:auto;
    margin-bottom:auto;
    padding:10px;
    position:fixed;
    top:0;
    bottom:0;
}
.pics   .med {
    border-style: none;
    display: none;
    background: white;
} 

 


/** basic page layout (table laid out in 3 cols: |210px|whatever|210px|) ****/
td.left  {  
  	vertical-align: top;
    width:210px;
    margin-left: 0px;
}
td.left_index  {  
  	vertical-align: top;
    width:100px;
    margin-left: 0px;
}

td.middle_index  {
    font-size : 100%;
    font-weight:bold;
    align: left;
    vertical-align: middle;
    margin-left: 5px;
}

td.middle  {
  	vertical-align: top;
    width:auto;
    margin-left: 5px;
    margin-right: 5px;
}
td.right  {
  	vertical-align: top;
    text-align : right;
    width:210px;
    margin-right: 0px;
}
td.chg1  {  /* 2 col change-log  */
  	vertical-align: top;
    width:90px;
    font-weight: bold;
} 
td.chg2  {  /* 2 col change-log  */
  	vertical-align: top;
    width:auto;
}

.main_nav {  
  background:#5d97c7;
  font-size: 100%;
  width: 100%;
  text-decoration:none;
  font-weight:bold; 
}
.nav_entry {
  padding-right: 10px;
  text-align : left;
  text-decoration:none;
  color: white
}


.nav_entry a  { text-decoration:none;}  
.nav_entry a:visited  {color: white;}   
.nav_entry a:focus    {color: white;}   
.nav_entry a:active   {color: white;}   
.nav_entry a:hover    {color: white;}   


.intro_pic { 
     width: 500px;   /* to force right alignemnt of pic */
     margin-top: 0;
     margin-left: 5px;
     float: right;

}