@import url("/common/css/pagebase.css");
@import url("/common/css/topmenu.css");
@import url("/common/css/eventbase.css");

body { margin: 1em 2em }
h1, h2, h3 { font-weight: normal; margin: 3% }
h1.page { margin-left: 250px }

a { font-style: italic; text-decoration: none }
a:link, a:visited, a:active { color: #090 }
a:hover { text-decoration: underline; color: #0f0 }
#creditlink a { font-style: normal }

.headimage { position: relative; top: -20px; left: -5px; float: left }
.textpage p { margin: 1em 15% 1em 10% }
.textpage h2 { margin-left: 10% }
.strike, a.strike { text-decoration: line-through }
.center img { margin-left: auto; margin-right: auto }

.odd { background: transparent url("/common/resources/white.10.png") repeat }
.even { background: transparent url("/common/resources/black.10.png") repeat }


/*
 *   top menu style overrides
 */

#menuoffset { width: 150px }
#menupad { top: -10px; height: 300px; width: 500px }

#menubar { margin: 6px 0 0 2em }
#menubar a { font-style: normal; font-weight: bold }
#menubar a:link, #menu a:visited, #menu a:active { border: 1px solid white }

#menubar a:hover,
#menubar a.hover:link, #menubar a.hover:visited,
#menubar a.active:link, #menubar a.active:visited {
  border: 1px solid #797;
  background-color: transparent;
  color: #454;
}

#menu .menubag div {
  margin-top: 0.8em;
  border-color: #454;
}

#menu .menubag a { font-style: normal }

#menu .menubag a:link, #menu .menubag a:visited,
#menu .menubag a:hover, #menu .menubag a:active {
  border-width: 0;
}

#menu .menubag a:hover, .contextmenu a:active, .contextmenu a.active {
  background-color: #797;
  color: white;
}

#menu .menubag, .contextmenu { opacity: 0.85 }
/* non-standard alpha settings - will not validate */
#menu .menubag, .contextmenu { -moz-opacity: 0.85 }        /* early Gecko */
#menu .menubag, .contextmenu { -khtml-opacity: 0.85 }      /* early Konqueror/Safari */

#menu .menubag, .contextmenu {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; /* IE8 native */
  filter: alpha(opacity=85); /* IE5-7 and IE8 in IE7 mode (must be in this order!) */
} /* IE/Win */

.popover { opacity: 0.9 }


/*
 *   thumbnail and gallery styles
 */

.thumb {
  position: absolute;
  width: 110px;
  height: 110px;
  text-align: center;
}

.thumb img {
  border-style: none;
  margin-left: auto;
  margin-right: auto;
}

.piximage img { border-style: none }

.thumbnail { position: relative }

.loading {
  margin: 40px 100px 10px 100px;
  background-color: #797;
  padding: 10px;
  text-align: center;
  font-size: 130%;
  color: white;
}

.thumblist {
  float: right;
  margin-top: 40px;
  width: 60px;
}

.thumblist img { border: 1px solid white; margin: 4px 1px }
.thumblist img.missing { border-color: #ddd }

.thumblist .selected img {
  border-color: white;
  opacity: 0.3;
  /* non-standard alpha settings - will not validate */
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /* IE8 native */
  filter: alpha(opacity=30);
}

.thumblist a { border-bottom-width: 0 }
.thumblist a:hover img { border-color: #357910 }

.pagenav .thispage { background-color: #797; color: white }

#imageview { margin: 0 0 0 0; text-align: center }
#imageview img { margin-left: auto; margin-right: auto }


/*
 *   news article page styles
 */

.newsfilter { float: right }

.headlinelist, form.newsfilter {
  float: right;
  width: 33%;
  min-width: 20em;
  margin: 10px;
  border: 1px solid black;
  padding: 10px;
}

div.headline { clear: left; width: auto }
div.headline h3 { margin: 1em 0 0 0 }
p.byline { margin: 0; font-weight: bold }
p.byline span { font-weight: normal; text-transform: lowercase }
div.article img { clear: left; float: left; margin: 1em 1.5em 1em 0 }
div.newscommentblock { clear: left }


/*
 *   form control styles
 */

input, select, textarea {
  border-width: 1px;
  border-style: solid;
  border-color: #999 #eee #eee #999;
}

input, select, option, textarea {
  background-color: #fffdfb;
}

input.button {
  border-color: #eee #999 #999 #eee;
}

input [type=button], input [type=file], input [type=submit], input [type=reset] {
  border-color: #eee #999 #999 #eee;
}


/*
 *  extras...
 */

.twitter {
  float: right;
  width: 10em;
  margin: 0 0 1em 1em;
  border: 1px solid orange;
  background-color: #fed;
  padding: 0.5em;
  overflow-x: hidden;
  text-overflow: ellipsis;
}

.newsflash {
  float: right;
  width: 40%;
  margin: 0 0 1em 1em;
  border: 1px solid orange;
  background-color: #fed;
  padding: 0.5em;
}

.medialog {
  float: left;
  margin: 0.5em 1em 0.5em 0;
  border: 1px solid orange;
  padding: 0 1em;
}

.medialog h3 { font-size: 110% }