/* ====== Styles common to all media ====== */

/* HTML elements */

a:link, :visited {
  text-decoration:none;
  color: blue;
}
a:hover {
  color: #8b0000;
}
body {
  margin:0;
  padding:0;
  font-family: "Palatino Linotype", "Times New Roman", Serif;
  font-size: 11pt;
  color: #000000;
  font-weight: normal;
  font-style: normal;
}
button {
  padding: 2px 5px 2px 5px;
}

form {
  margin: 0;
  padding: 0;
}
h2 {
  color: #990000;
  font-size: 15pt;
  margin-top: 0;
  margin-bottom: 5px;
}
h3 {
  color: #990000;
  margin-top: 0;
  margin-bottom: 5px;
}
h4 {
  color: #990000;
  font-weight: normal;
  font-style: normal;
  margin-top: 0;
  margin-bottom: 0.5em;
}
hr {
    height: 2px;
    color: #8b0000;
    background: #8b0000;
    font-size: 0;
    border: 0;
}
/*input {font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;}*/
p {
  margin-top: 0;
  margin-bottom: 0.5em;
}
/* Not sure why the following was set, but screws up width of images in tables - so commented out for now
img {
  max-width: 100%;
}
*/
/* Not sure if this is any better - but let's give it a try
img {
  width: auto;
}
img.border {
  border: 1px solid #c0c0c0;
}
ul.menu {
  margin-left: 5px;
}

/* Classes */

.menu {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10pt;
  font-weight: bold;
  font-style: normal;
  padding: 0;
  margin: 0;
}

.orderform td {border-top: gray 1px solid;}

.qty {text-align: right;}

.widgetform td {border-top: gray 1px solid;}

/* Identifiers */

#bannerhead h1 {
  display: inline;
  position: relative;
  left: 10px;
  top: 5px;
  color: #ffffff;
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
  font-size: 18pt;
  font-weight: bold;
  font-style: normal;
}
#bannerhead h2 {
  display: inline;
  position: relative;
  left: 10px;
  top: 2px;
  color: #ffffff;
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
  font-size: 18pt;
  font-weight: bold;
  font-style: normal;
}
#bannerlogo {
  width: 92px;
  height: 100px;
  float: right;
}
#bannerlogo img {
  margin-left:11px;
  margin-right: 0;
  margin-top:0;
  margin-bottom:0;
  padding-top: 11px;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}
#sidepanel {
  font-size: 11pt;
  background-color: #f2f2f2;
}
#seealso ul {
  padding-bottom: 0;
  margin-bottom: 0;
}
#footer {
  margin-left: auto;
  margin-right: auto;
  background-color: #f2f2f2;
  border-top: 2px solid #8b0000;
  font-size: 10pt;
  text-align: left;
  margin-top: 0;
  margin-bottom: 0;
  padding-left:5px;
  padding-right:5px;
  padding-top:2px;
  padding-bottom:1px;
}

/* ====== Screen-only Styles ====== */

@media screen {
  body {
/*    background-image: url('../images/bgrockhoppers.jpg');*/
    background-image: url('../graphics/bgphylica50.jpg');
/*    background-image: url('../images/IMG_0889-50.jpg');*/
/*    background-color: #e6e6e6;*/
    background-position: center top;
    background-attachment: fixed;
    height: 100px;
  }
  .menubar {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
    width: 1024px;
  }
  .menubar ul {
    display: inline;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    padding-top: 4px;
    padding-bottom: 0;
    padding-left: 4px;
    padding-right: 4px;
  }
  .menubar ul li {
    display: inline;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 4px;
    padding-right: 4px;
    list-style-type: none;
    list-style-position: inside;
  }
  .active {
/*    border-bottom: 3px solid #990000;*/
    border-bottom: 3px solid blue;
  }
  #cse-search-box {
    margin-top: -5px;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 3px;
    float: right;
  }
  #topmenu {
    padding-top: 10px;
    padding-bottom: 0;
    height: 24px;
    background-color: #f2f2f2;
  }
  #topmenu ul {
  }
  #topmenu ul li {
    border-right: 1px solid #c0c0c0;
  }
  #midmenu {
    padding-top: 8px;
    padding-bottom: 0;
    height: 23px;
    background-color: #c0c0c0;
  }
  #midmenu ul {
  }
  #midmenu ul li {
    border-right: 1px solid #a0a0a0;
  }
  #submenu {
    padding-top: 8px;
    padding-bottom: 0;
    height: 22px;
    background-color: #f2f2f2;
    border-bottom: 2px solid #c0c0c0;
  }
  #submenu ul {
  }
  #submenu ul li {
    border-right: 1px solid #c0c0c0;
  }
  #bannerhead {
      background-image: url('../graphics/bannerisland.jpg');
      background-position: center bottom;
      height: 100px;
  }
  #bannerlogo {
    background-color: #000000;
  }
  div#seealso ul li.narrowonly {
    color: #990000;
    font-weight: bold;
    font-size: 1.2em;
    margin-left: 0;
  }

}

/* ====== Print-only Styles ====== */

@media print {
  /* Classes */
  .noprint {
    display: none;
  }
  .menu {
    display: none;
  }
  .menubar {
    display: none;
  }
  /* Identifiers */
  #bannerhead {
    height: 100px;
  }
  #bannerhead h1 {
    color: #000000;
  }
  #bannerhead h2 {
    color: #000000;
  }
  #bannerlogo {
    background-color: #ffffff;
  }
}
#banner {
  margin-left: auto;
  margin-right: auto;
  background-color: white;
}
@media screen {
  #banner {
    width: 1024px;
  }
}
@media print {
  #banner {
    width: 100%;
    border-bottom: 2px solid #8b0000;
  }
}
#main {
  margin-left: auto;
  margin-right: auto;
  padding: 0;
/*  background-color: #ffffff;*/
/*  background-image: url('../images/bgrockhoppersfaded.jpg');*/
/*  background-image: url('../images/bgphylica75.jpg');*/
/*  background-image: url('../images/IMG_0889-75.jpg'); */
  background-color: #f2f2f2;
  background-position: center top;
  background-attachment: fixed;
}
@media screen {
  #main {
    width: 1024px;
  }
}
@media print {
  #main {
    width: 100%;
  }
}
#crumbs {
  font-family: Helvetica, Arial, sans-serif;
  background-color: #c0c0c0;
  font-size: 9pt;
  font-weight: bold;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 0;
  padding-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;
  width: 1014px;
}
#localmenu {
  font-family: Helvetica, Arial, sans-serif;
  font-weight: bold;
  float: right;
}
#content {
  margin: 0;
  padding: 0;
/*
  padding-left:0.5em;
  padding-right:0.5em;
*/
  background-color: white;
}
@media screen {
  #content {
    width: 75%;
  }
}
@media print {
  #content {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
#sidepanel h2 {
  color: #990000;
  font-size: 15pt;
  margin-top: 5px;
  margin-bottom: 5px;
}
#sidepanel ul {
  margin-top: 5px;
  padding: 0;
}
#sidepanel ul li {
  list-style: disc;
  list-style-position: outside;
  margin-left: 15px;
  margin-bottom: 15px;
  margin-top: 0;
  margin-bottom: 3px;
}
@media screen {
  #tour {
    width: 7em;
    float: right;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
    text-align: center;
    color: #8b0000;
    background-color: #ffffff;
    border: 2px solid #8b0000;
    border-radius:10px;
    margin-top: 60px;
    margin-right: 10px;
    padding-top:0.25em;
    padding-bottom: 0.25em;
  }
  #footer {
    width: 1024px;
  }
}
@media print {
  #tour {
    display: none;
  }
  #footer {
    width: 100%;
    background-color: #ffffff;
  }
}

.credits {
  color: #990000;
  font-weight: normal;
  font-style: normal;
}
.picture {
  vertical-align: top;
  text-align: center;
}
.caption {
  font-style: italic;
  text-align: center;
}
.gray {
  font-size: 0.8em;
  margin-right: 0.5em;
  float: right;
}
.panel {
  margin: 0;
  padding-left: 5px;
  padding-right: 5px;
  border-bottom: 2px solid #8b0000;
}
.lastpanel {
  margin: 0;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 1em;
  border: none;
}
.floatleft {
  float:left;
  padding-right: 0.5em;
}
.floatright {
  float:right;
  padding-left: 0.5em;
}
.center {
  text-align: center;
}
.justify {
  text-align: justify;
}
.numericfield {
  text-align: right;
}