@font-face  {font-family: LinuxLibertine; font-weight: normal; font-style: normal; src: url('../font/LinLibertine_DR.woff')  format('woff');}
@font-face  {font-family: LinuxLibertine; font-weight: bold;   font-style: normal; src: url('../font/LinLibertine_RB.woff')  format('woff');}
@font-face  {font-family: LinuxLibertine; font-weight: normal; font-style: italic; src: url('../font/LinLibertine_RI.woff')  format('woff');}
@font-face  {font-family: LinuxLibertine; font-weight: bold;   font-style: italic; src: url('../font/LinLibertine_RBI.woff') format('woff');}
body        {font-family: "Trebuchet MS", "PT Sans Caption", Helvetica, sans-serif; 
             margin-top: 1ex; margin-bottom: 8ex; padding-left: 4.5em; padding-right: 4.5em;
             color: DarkSlateGrey; background-color: #FFFDD0;
             background-image: linear-gradient(90deg, #B2AF5C, 4%, #FFFDD0, 11%, #FFFDD0, 93%, #FFFFFF, 97%, #FFFFFF);} 
h1          {clear: both; font-size: 2.2em; margin-bottom: 0.3ex;font-family: LinuxLibertine; font-style: italic;}
h2          {clear: both; font-size: 2.0em; margin-bottom: 0.3ex;font-family: LinuxLibertine; font-style: italic;}
h3          {clear: both; font-size: 1.7em; margin-bottom: 0.3ex;font-family: LinuxLibertine; font-style: italic;}
h4          {clear: both; font-size: 1.4em; margin-bottom: 0.3ex;font-family: LinuxLibertine; font-style: italic;}
h1 i        {font-size: 80%; font-style: normal;}
b, strong   {font-family: "Arial", sans-serif; font-weight: 800;}
em b        {font-family: "Arial Black Italic", "Arial Black", sans-serif; font-weight: 900; font-style: normal;}
caption     {font-size: 80%; text-align: center;}
address     {display: inline;}
dt          {font-weight:bold; color: #6B8E23;}
dt small    {font-size: 70%; font-style: italic}
td          {vertical-align: top;}
ol li       {padding-bottom: 0.7ex;}
ol ul       {padding-top: 0.5ex;}
img         {padding-left: 1.5em; padding-right: 1.5em; padding-top: 2ex; padding-bottom: 2ex;}
figure img  {padding-left: 0.0em; padding-right: 0.0em; padding-top: 0ex; padding-bottom: 0ex;}
var         {font-family: LinuxLibertine; font-size:120%;}
table       {border-collapse:collapse; border:0;}
tr, td, th  {text-align:left; border:0; padding:0; border-spacing:0;}
a:link      {color: #B8860B; text-decoration: none;}       /* unvisited link */
a:visited   {color: #A0522D; text-decoration: none;}       /* visited link */
a:hover     {text-decoration: underline;}                  /* mouse over link */
a:active    {color: #606040; text-decoration: underline;}  /* selected link */ 
ul.plain    {list-style-type: none;}
ul.simple   {list-style-type: none; padding-top: 0; margin-top: -2ex;}
ul.simple  li        {padding-top: 1.5ex;}
ul.comment li        {font-style: italic; padding-top: 1ex;}
ul.comment li:before {content: "\201C";}
ul.comment li:after  {content: "\201D";}
kbd.block, code.block {white-space: pre}
col.oid-tag {width:4%;}
col.oid-name{width:21%;}
col.cipher-code{width: 6em}
col.cipher-name {width: 56em;}
.small      {font-size:80%;}
.oracle     {font-family: "Verdana","Arial","Helvetica",sans-serif;font-size:85%}
.highlight  {background-color:yellow;}
.math       {text-align: left;}
.code       {font-family: "Courier New";}
.func       {font-style: normal; font-family: LinuxLibertine; font-size:100%}
.panorama   {margin-left: auto; margin-right: auto; display:block; width:100%;}
.centre     {margin-left: auto; margin-right: auto; display:block; width:75%;}
.applet     {margin-left: auto; margin-right: auto; display:block;}
.website    {font-family: Courier New;}
.narrative  {margin-left: auto; margin-right: auto; display:block;
             background-color: #FFFDD0; background-image: none;
             padding-left: 1.5em; padding-right: 1.5em; padding-top: 2ex; padding-bottom: 2.5ex;}
.tidetimes  {float:right; width:164px;
             padding-left:20px; padding-bottom: 20px;}
.backmatter {display:block; width:60%; font-size:0.7em;
             background-color: #FFFDD0; background-image: none;
             margin-left: auto; margin-right: auto; margin-top:6ex;
             padding-left: 1em; padding-right: 1em; padding-top: 1ex; padding-bottom: 1ex;}
.slideShowWrapper {width: 40px;}
.thumbWrapper .thumbNotifier {background-color: LightSalmon;}
.thumbWrapper .thumbLoaded   {background-color: transparent;}
.left       {width:48%; padding-top:0; font-size:90%; float:left;}
.right      {width:52%; padding-top:0; font-size:90%; float:right;}
.floatright {float:right;}
.footnote   {clear: both; padding-left: 1.4em;}
.flush      {margin-top: 0; margin-bottom: 0; padding-left: 1.2em;}
.framed     {border: 1px solid black;}
.popup      {position: fixed; visibility: hidden; overflow: auto;
             padding: 10px; width: 600px; height: 450px; top: 50px; right: 50px;
             background-color: #EEE8AA; border: 1px solid black;}
.close      {text-decoration: none; float: right;}
.trap       {position: absolute; left: 0.5em; height: 400px; width: 80em; 
             background-color: #FFC0CB; opacity:0;}
.mapholder  {position: relative; height: 452px; width: 100%;
             margin-left:0em; margin-right:auto;}
.mapreset   {position: absolute; right: 5em; top: 4ex;}
#marinetraffic {width: 100%; height: 650px; border-style:solid; border-width:2px;}
#map_canv   {position: absolute; left: 0em;  height: 450px; width: 100%;  top: 0em;
             display: block; border: 1px solid black;}
#mousetrap1 {top:-400px;}
#mousetrap2 {top:450px;}
@media screen and (max-width: 640px)
    {body        {margin-top: 2%; margin-bottom: 2%;
                  margin-left: 0; margin-right: 0;
                  padding-left: 2%; padding-right: 2%;
                  background-image: none;}
     h1          {font-size: 2.0em; margin-bottom: -1.5ex;}
     h2          {font-size: 1.8em; margin-bottom: -1.5ex; margin-top: 4ex;}
     h2.runon    {font-size: 1.8em; margin-bottom: -1.5ex;}
     ul.comment li {font-style: italic; padding-top: 1ex;}
     ul.plain    {padding-left: 1em; margin-top: -1.5ex;}
     ul.plain li {font-size: 90%; padding-bottom: 2ex;}
     ul.links li {font-size: 100%; padding-bottom: 3ex;}
    }
@media screen and (max-width: 400px)
    {body        {margin-top: 1%; margin-bottom: 1%;
                  margin-left: 0; margin-right: 0;
                  padding-left: 1%; padding-right: 1%;
                  background-image: none;}
     h1          {font-size: 1.9em; margin-bottom: -1.5ex;}
     h2          {font-size: 1.7em; margin-bottom: -1.5ex; margin-top: 2ex;}
     h2.runon    {font-size: 1.7em; margin-bottom: -1.5ex;}