/* Always show scrollbar */
html
{
  overflow: scroll;
}

body
{
  font: 14px Arial,Verdana,sans-serif;
  text-align: center;
	background: #787a79 url(../images/img_bkg.jpg) repeat-x;
  padding-bottom: 20px;
}

div#fullpage
{
	background: transparent url(../images/img_blank.gif) no-repeat; /* Trick IE into showing hover */
}

.fade
{
  filter: alpha(opacity=30); /* for IE */
  opacity: 0.3; /* CSS3 standard */
}

.normal
{
  filter: alpha(opacity=100); /* for IE */
  opacity: 1.0; /* CSS3 standard */
}

a:hover
{
  color: red;
}

img
{
  border-width: 0px;
}

p
{
  margin-top: 0;
}

h1, h2, h3, h5
{
  font: normal normal 150% Arial,Verdana,sans-serif;
}

h2
{
  font-size: 160%;
}

h2 img
{
  margin-left: 10px;
}

h3
{
  font-size: 140%;
  font-weight: bold;
}

h4
{
  font-size: 110%; 
  font-weight: bold;
}

h5
{
  padding: 0px;
  margin: 0px;
  font-size: 125%; 
  font-weight: bold;
}

h4#clubname
{
  color: red; 
  position: relative; 
  z-index: 2;
}

ul
{
  margin-left: 15px;
  padding-left: 20px;
}

li
{
  list-style-type: circle;
  list-style-position: outside;
}

div#header
{
  width: 100%;
  overflow: hidden;
  background: #FFFFFF;
  padding-top: 2px;
}

div#header img
{
  width: 800px;
  height: 100px;
  padding-bottom: 5px;
}

div#header h1, div#menu
{
  margin: 0 auto;
  text-align: left;
}

div#header h1
{
  padding: 10px 0 0px;
}

div#header h2
{
  padding-left: 20px;
  color: red;
  font-size: 150%;
  font-weight: bold;
}

ul#nav, ul#nav li
{
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

ul#nav
{
  float: right;
  font-size: 75%;
  font-weight: bold;
  line-height: 1em;
  /* text-transform: uppercase; */
}

ul#nav li
{
  float: left;
  margin-left: 2px;
  text-align: center;
}

ul#nav a
{
  float: left;
  width: 85px;
  padding: 6px 0;
  text-decoration: none;
  background: #CCCCCC;
  color: #333333;
}

/* Colors of the nav bar tabs when 'hover' over the tabs */
ul#nav li.tab1 a:hover { background: #909090; color: #FFFFFF; }
ul#nav li.tab2 a:hover { background: #888888; color: #FFFFFF; }
ul#nav li.tab3 a:hover { background: #7F7F7F; color: #FFFFFF; }
ul#nav li.tab4 a:hover { background: #777777; color: #FFFFFF; }
ul#nav li.tab5 a:hover { background: #6E6E6E; color: #FFFFFF; }
ul#nav li.tab6 a:hover { background: #666666; color: #FFFFFF; }
ul#nav li.tab7 a:hover { background: #5D5D5D; color: #FFFFFF; }
ul#nav li.tab8 a:hover { background: #555555; color: #FFFFFF; }
ul#nav li.tabS a { background: red; color: #FFFFFF; }

div#container
{
  padding: 10px 0 10px;
  margin: 0 auto 10px;
  text-align: left;
  background: #EEEEEE;
}

div#container, div#header h1, div#menu
{
  width: 800px;
}

div#title, div#title2, div#footer
{
  width: 780px;
}

div#title, div#title2
{
  clear: both;
  margin: 0 10px 0;
  margin-bottom: 20px;
  padding: 10px 0;
  background: #AAAAAA;
  text-align: center;
  font-size: 150%;
  font-weight: normal;
}

div#title p, div#title2 p
{
  margin: 0;
}

div#content
{
  float: left;
  display: inline;
  margin: 0px 0px 20px 20px;
  width: 720px;
  padding: 0px 20px;
  border: 0px solid black;
}

div#content h2
{
  margin: 10px 0;
}

div#footer
{
  clear: both;
  margin: 0 10px 0;
  padding: 10px 0;
  background: #999999;
  color: white;
  text-align: center;
  font-size: 90%;
  line-height: 1.2em;
}

div#footer p
{
  margin: 0px;
}

div#footer a
{
  padding: 0px 5px;
  color: white;
  text-decoration: none;
}

.table_left, .table_right
{
  border-color: Silver;
  border-style: solid;
  border-width: 0px 1px 1px 0px;
}

.table_left
{
  border-width: 0px 1px 1px 1px;
}

.table_header_left, .table_header_right
{
  background-color: red;
  border-color: silver;
  border-style: solid;
  border-width: 1px 1px 1px 0px;
  color: white;
  font-weight: bold;
}

.table_header_left
{
  border-width: 1px;
}

.bold 
{
  font-weight: bold;
}

th#calendar, span#calendar
{
  text-align: left;
  color: #007BC4; 
  font-weight: bold;
}

th#calendar
{
  font-size: 20px;
}

div#map ul
{
  list-style-type: none;
  margin: 0 0px;
  padding: 0;
}

div#map li
{
  width: 561px;
  margin: 10px 10px 10px 0;
  background-color: #FFFFFF;
}

div#map li img
{
  width: 541px;
  height: 541px;
  display: block;
  margin: 10px 10px;
  border-width: 0px;
}

div#logo ul
{
  list-style-type: none;
  margin: 0 0px;
  padding: 0;
}

div#logo li
{
  list-style-type: none;
  width: 170px;
  margin: 10px 10px 10px 0;
  background-color: #FFFFFF;
}

div#logo li img
{
  width: 150px;
  height: 170px;
  display: block;
  margin: 10px 10px;
  border-width: 0px;
}

div#img_parties ul
{
  list-style-type: none;
  margin: 0 0px;
  padding: 0;
}

div#img_parties li
{
  float: left;
  width: 148px;
  margin: 10px 20px 10px 0;
  background-color: #FFFFFF;
  list-style-type: none;
}

div#img_parties li img
{
  width: 128px;
  height: 86px;
  display: block;
  margin: 10px 10px;
  border-width: 0px;
}

ul#links a
{
  text-decoration: none;
  font-weight: normal;
}

ul#links a:hover
{
  color: red;
}

.caption
{
  font-weight: bold;
  font-size: 14px;
  color: red;
}

a, div#title, div#title2, div#content h2, ul#links a
{
  color: #007BC4;
}

div#bkg_picture
{
  margin: 0px auto 20px;
  background-image: url(../images/img_collage.jpg); 
  background-repeat: no-repeat;
  width: 700px; 
  height: 627px;
  filter: alpha(opacity=100); /* for IE */
  opacity: 1.0; /* CSS3 standard */
}

div#picture_links
{
  position: relative;
  top: 150px;
  margin: 0px auto;
  width: 400px;
  text-align: center;
  padding: 10px 0px;
  filter: alpha(opacity=80); /* for IE */
  opacity: 0.8; /* CSS3 standard */
  background-color: black;
  border: 5px solid #007BC4;
}

div#picture_links hr
{
  color: #007BC4;
}

div#picture_links a
{
  font-size: 100%;
  font-weight: normal;
  color: #FFFFFF;
  text-decoration: none;
}

p.highlight_first_letter:first-letter
{
  font: normal 250% Arial, Times, serif;
  color: #007BC4;
	float: left;
	margin-right: 0.1em;
  margin-top: 3px;
  padding: 0px;
	border:	0px solid #007BC4;
}

p.highlight_first_song_letter:first-letter
{
  font: normal 200% Arial, Times, serif;
  color: #007BC4;
	float: left;
	margin-right: 0.1em;
  margin-top: 3px;
  padding: 0px;
	border:	0px solid #007BC4;
}

/* Buttons */

input[type="submit"], input[type="reset"], input[type="button"], input.cm_button, input.cm_delete, input.cm_disable_button, input.cm_green_button, input.cm_red_button
{
  font: normal 11px Arial,Helvetica,sans-serif;
  color: #555555;
  background: #E2E2E2;
  border: 1px solid #888888;
  padding: 0px 3px;
  margin: 0px 3px;
  cursor: pointer;
}

.google
{
  border: 1px solid #888888;
}

/* Used in metric.asp */

td.metric_left
{
  width: 33%;
  text-align: center;
}

td.metric_center
{
  width: 34%;
  text-align: center;
}

td.metric_right
{
  width: 33%;
  text-align: center;
}

span.close
{
  font-weight: bold;
  font-size: 12px;
  color: White;
  background-color: #007BC4;
  padding: 0px 5px 2px 5px;
  margin: 0px 2px;
}

span.here a
{
  font-weight: normal;
  text-decoration: none;
  background: #CCCCCC;
  color: #333333;
  padding: 1px 5px;
  margin: 0px 2px;
}

li img
{
  cursor: pointer;
}

/* In-line pictures - keep pictures to a reasonable size */
.photo_left_landscape, .photo_left_portrait, .photo_right_landscape, .photo_right_portrait, .logo_right, .logo_left
{
  padding: 0;
  margin: 0;
  display: block;
}

.photo_right_landscape, .photo_right_portrait, .logo_right
{
  float: right;
}

.photo_left_landscape, .photo_left_portrait, .logo_left
{
  float: left;
}

.photo_left_landscape img, .photo_right_landscape img
{
  width: 300px;
  height: 200px;
}

.photo_left_portrait img, .photo_right_portrait img
{
  width: 200px;
  height: 300px;
}

.logo_left img, .logo_right img
{
  width: 150px;
  height: 170px;
}

.photo_left_landscape img, .photo_left_portrait img, .logo_left img
{
  margin-right: 20px;
  margin-bottom: 10px;
}

.photo_right_landscape img, .photo_right_portrait img, .logo_right img
{
  margin-left: 20px;
  margin-bottom: 10px;
}

.logo_left img, .logo_right img
{
  width: 100px;
  height: 113px;
}

div.song
{
  width: 350px;
  margin: 0 auto;
}

div.song h4
{
  padding: 0px 0px 10px 0px;
  margin: 0px;
  font-size: 110%; 
  font-weight: bold;
}

div#content p
{
  text-align: justify;
}

/* For thumbnails */
img.mouseover
{
  filter: alpha(opacity=60); /* for IE */
  opacity: 0.6; /* CSS3 standard */
	border:	0px solid red;
}

img.mouseout
{
  filter: alpha(opacity=100); /* for IE */
  opacity: 1.0; /* CSS3 standard */
	border:	0px solid red;
}

table.imagegridborder
{
  background-color: white;
}

table.imagegrid
{
  background-color: white;
  /* background-image: url(../images/img_red_white_bg_2.jpg); */
}

tbody.imagegrid td
{
  background-color: white;
}

tbody.imagegrid td img
{
  display: block;
}

div.imagehelp
{
  padding-bottom: 10px;
  padding-left: 20px;
  text-align: left;
}

div.pictureframe {
  overflow:auto;
  height: 400px;
  width: 100%;
}

div.pictureframe1, div.pictureframe {
  padding-top: 10px;
}

div#container li {
  margin-left: 50px;
  margin-right: 20px;
}

div.arrow_bullet
{
  margin-left: 20px;
  padding-left: 20px;
  background-position: left top;
  background-repeat: no-repeat;
  background-image: url(../images/img_arrow_bullet.gif); /* This is the flag on hover over */
}

div.bullets
{
  padding-bottom: 10px;
}

span.new
{
  padding: 0px 10px;
  color: red;
  font-weight: bold;
}