body { font-family: Verdana, Geneva, Tahoma, sans-serif; margin: 0 0 0 0; padding: 0 0 0 0; font-size: 8pt; margin: 45px 0 21px 0;}

#logo { width: 160px;  height: 40px; float: left; width: 325px; background-repeat: no-repeat; background-size: auto 100%;  cursor: pointer;}
#headerStart { height: 40px; top: 0px; width: 100%; background-color: #e7eff3; border-bottom: 1px solid #135f8e; position: fixed; z-index: 99;}
#footer { height: 16px; width: calc(100% - 5px); padding-right: 5px;  padding-top: 2px; border-top: 1px solid #135f8e; position: fixed; bottom: 0px; background-color: #e7eff3; text-align: right; }
#footer a {  text-decoration: none; font-weight: bold;  color: #135f8e; }
#starter { margin: 10px;  padding-top: 5px; }

h1 {  font-size:  11pt; color: #135f8e;  margin-top:  0px; }
h2 {  font-size:  9pt; }

.longText { display: none; }
.shortText { display: block; }

#mainContainer { border: 1px solid #135f8e;  position: relative; top: 0px; margin: 0 10px 0 10px; }

#displayContainer { width: calc(100% - 101px); margin-left: 102px; vertical-align: top; position:  absolute; top: 0px; border: 1px solid #135f8e;  border-left-width: 0; height:  calc(100% - 2px); background-color: #e7eff3; min-height: 518px; }
#displayContainer .hideDisplay { display: none; padding: 5px; }
#displayContainer h1 { display: none; }
#displayContainer h2 {  display: block; }
#displayContainer div div.linkList { position: relative; }
#displayContainer div div.linkList div{ margin-top: 2px; width: calc(100% - 12px); padding: 3px; cursor: pointer; border: 2px solid #EEEEEE; display: block;  background-color: #135f8e; text-align: right; }
#displayContainer div div.linkList div a { text-decoration: none; font-weight: bold; color: #EEEEEE; }
#displayContainer div img { margin: 0px; width: 100%; float:none;} 

#menuContainer { border-right: 2px solid #135f8e; vertical-align: top; position:  relative; height: 520px; width: 100px; }
#menuContainer div { border-top: 1px solid #135f8e; font-size: 12pt; padding: 10px 0 10px 0; text-align: center; cursor: pointer;}
#menuContainer div:first-child, #menuContainer div:nth-child(0n+1) { border-width: 0px; }
#menuContainer div:last-child { border-top: 1px solid #135f8e; }
#menuContainer div.menuActive { background-color: #e7eff3; width: calc(100% + 1px); cursor: pointer; border-width: 2px 0 1px 1px; border-style: solid; border-color: #135f8e;  z-index: 999; }
#menuContainer div.menuActiveFirst { background-color: #e7eff3; width: calc(100% + 1px); cursor: pointer;  border-width: 1px 0 1px 1px;  border-style: solid; border-color: #135f8e; z-index: 999; }

.imageContainer { position:inherit;  display: block; padding: 0px; margin: 0 0 10px 10px;  width: 50%; float: right; border: 1px solid #135f8e; max-width: 650px;}
.imageContainer .image { width: 100%; }
.imageContainer .copy { text-align: right; width: calc(100% - 4px); margin-left: 2px; margin-top: -14px; margin-bottom: 3px; font-size: 7pt; background-color: white; }

.transparent { opacity:.50; -moz-opacity:.50; filter:alpha(opacity=50); }

@media only screen and (min-width:38.75em) and (max-width:800px) {
   /* For tablets: */
   body {  font-size: 10pt;  margin: 65px 0 35px 0;}
   #logo { width: 240px;  height: 60px; }
   #starter { padding-top: 5px; }
   #headerStart { height: 60px;  border-bottom-width: 2px; position: fixed;  }
   #footer { height: 22px; width: calc(100% - 5px); padding-right: 5px;  padding-top: 8px; border-top-width: 2px; position: fixed;  }
   #displayContainer div div.linkList { position: relative; }
   #displayContainer div div.linkList div{ margin-top: 5px; width: calc(100% - 12px); padding: 5px;}
   .imageContainer .copy { margin-top: -16px; font-size: 8pt; }
}

@media only screen and (min-width:801px) { 
   /* For desktop: */
   body { font-size: 12pt; margin: 85px 0 45px 0; }
   #logo { width: 320px;  height: 80px; }
   #headerStart { height: 80px;  border-bottom-width: 2px; position: absolute;  }
   #footer { height: 30px; width: calc(100% - 5px); padding-right: 5px;  padding-top: 10px; border-top-width: 2px; position: fixed; }
   #starter { padding-top: 10px; }
   .longText { display: block; }
   .shortText { display: none; }
   h1 { font-size:  18pt; }
   h2 { font-size:  12pt; }

   #displayContainer .hideDisplay { padding: 10px; }

   #displayContainer h1 { display: block; }
   #displayContainer h2 {  display: block; }

   #displayContainer div div.linkList { bottom: 10px; left: 10px;  right: 10px;}
   #displayContainer div div.linkList div{ margin-top: 3px; width: calc(100% - 22px); padding: 10px; }

   #menuContainer div { font-size: 16pt; padding: 10px 0 10px 0; text-align: center; }
   #menuContainer { width: 40%; height: 600px; }

   #displayContainer { margin-left: calc(40% + 2px); width: calc(60% - 3px); }
   #displayContainer div div.linkList { position: absolute; bottom: 10px; left: 10px;  right: 10px; display: block;  }
   .imageContainer .copy { margin-top: -16px; font-size: 8pt; }
}

@media only screen and (min-width:800px) and (max-width:1281x){ 
   #displayContainer div div.linkList { position: static; left: 0px; }
   #displayContainer .hideDisplay p { font-size: 11pt; }
   #displayContainer h1 {  display: none; }
}