/* File olympics2.css */
/* Enter new styles here, or override styles from file 'olympics1.css'. */


/* Define behaviour that is inherited by all left column lists (menus). */
#leftcol ul {
  display:block;
  list-style:none;
  background-color:transparent;
  border:1px solid #6E627A;
  text-align:center;
  padding:0;
  margin:0 0 12px 0;
}

#leftcol li {
  display:block;
  background-color:transparent;
  text-align:center;
  line-height:1.7em;
  padding:2px; 
  margin:0px;
  border-bottom: 1px solid #6E627A;
}

#leftcol li a:link {
  color:#ffffff;
  text-decoration: none;
  margin:0px;
  display:block;
}
	
#leftcol li a:visited {
  color:#ffffff;
  text-decoration:none;
  margin:0px;
  display:block;
}

#leftcol li a:hover {
  display:block;
  color:#ffffff;
  background-image:url(../images/layout/dark-blue-background-narrow.png);
  background-position:top;
  background-repeat:no-repeat;
  margin:0px;
}

#leftcol .last-in-list {
  border-bottom:none;
}

.research p {
  text-indent:12px;
  text-align:justify;
}

.page-title {
  color:#000;
  text-align:left;
}

.page-title-centered{
  color:#000;
  text-align:center;
}


/* This area is used on the main page for the main image and any background
   image and text associated with it. See some personal web sites where it is
   used fully. */

.banner-area {
  display:block;
  text-align:center;
  padding:0;
  margin:0;
  border:none;
  /*background-color:#fff;*/
}

.banner-area img {
  display:inline;
}

/* This will contain main images which we will use javascript rollover on. */

#mainimage {
  display: block;
  width:540px;
  margin:0;
  margin:auto;
  padding:0;
}

#mainimage img {
  float:left;
  margin:auto;
  border:1px solid black;
}

#slideshow-boundary {
  margin:0;
  padding:0;
  width:612px;
}

#slideshow {
  position: relative;
  width: 460px;
  left:74px;
  height: 180px;
  border:1px solid #999;
  /*border:1px solid #666;*/
}

/* This represents the left side of the slideshow rectangular area. */ 

#slideshow #slideshow-left-text {
  display:block;
  position:relative;
  top:10px;
  left:26px;
  margin:0;
  padding:0;
  max-height:160px;
  max-width:160px;
}

/* These slides are displayed on the right side of the slideshow rectangular
   area. */
#slideshow div {
  position: absolute;
  top: 9px;
  left: 270px;
}

#slideshow img {
  max-height:160px;
  max-width:160px;
}

/* Second slide show in left sidebar. */

#slideshow-left {
  position: relative;
  margin:0;
  margin-bottom:8px;
  padding:0;
  width: 158px;
  height: 158px;
  border:1px solid #000066;
}


/* These slides are displayed on the right side of the slideshow rectangular
   area. */

#slideshow-left div   {
  position: absolute;
  top: 2px;
  left: 2px;
  padding:0;
  margin:0;
}

#slideshow-left img {
  padding:0;
  margin:0;
  max-height:154px;
  max-width:154px;
}

/* End second slide show. */

.centered-images {
  text-align:center;
  margin:auto;
  padding:2px;
}

.centered-images img {
  display: inline;
  padding:2px;
  margin-top:4px;
  border:1px solid #003399;
}

.mainpage-body {
  display:block;
  margin:0;
  padding:4px;
  /*border:px solid #000066;*/
}

.mainpage-body p {
  text-align:justify;
  text-indent:12px;
}

.yellow-back {
  background-color:#FFFFCC;
}

.blue-back {
  background-color: #CCCCFF;
}

.darkblue-back {
  background-image:url(../images/layout/dark-blue-background.png);
  background-position:top;
  background-repeat:repeat-y;
}

/* Define classes for table columns.

.meetings-table {
  width:100%;
  border-collapse:collapse;
  margin:0;
  margin-bottom:10px;
  padding:0;
  border:2px solid black;
}

.meetings-c1 {
  width:60px;
  text-align:center;
}

.meetings-c2 {
  width:265px;
  text-align:center;
}

.meetings-c3 {
  width:65px;
  text-align:left;
}

.meetings-c4 {
  width:145px;
  text-align:left;
}

For striped table - see what we need here. Then we don't need striped-table.css.

.meetings-table tr td {
  font-family: sans-serif;
  font-size: 11px;
  padding: 4px 4px;
  color: #660099;
  color:#000;
  background: #fff;
} */

#trailer-box {
  display:block;
  margin-top:8px;
  border:1px solid #33CCFF;
  padding:2px;
  text-align:center;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:12px;
}

#trailer-box a:link {
  color:#fff;
  text-decoration:none;
}

#trailer-box a:hover {
  color:#ffff99;
  text-decoration:none;
}

#extra-top-menu {
  display:block;
  width:612px;
  margin:4px 0 4px 0;
  padding:2px;
  text-align:center;
}

#extra-top-menu img {
  display:inline;
  max-width:280px;
  margin:2px;
  padding:2px;
  border:1px solid #000;
}

/* definitions for photo items page - Henry */

#gallery-events {
display:block;
margin:4px;
padding:4px;
}

.photo-item {
display: block;
clear:both;
width:510px;
margin:4px 4px 15px 0;
padding-top:10px;
padding-bottom:8px;
border-top:1px solid #aaa;
}


.photo-item img{
display: block;
float:left;
margin: 5px 5px 3px 4px;
padding: 4px;
border: 1px solid gray;
}

.photo-item a img{
display: block;
float:left;
margin: 5px 5px 3px 4px;
padding: 4px;
border: 1px solid gray;
}


.photo-item p {
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin: 3px 0 0 3px;
}


.news-item {
display: block;
clear:both;
border-bottom:0px dashed #000;
margin:0 0 1.5em 0;
padding:4px;
}


.news-item img{
display: block;
float:left;
margin: 5px 10px 3px 4px;
padding: 4px;
border: 1px solid gray;
/* max-height:120px; */
}

/*
.news-item p {
font-size:11px;
line-height:1.3em;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin: 3px 0 0 0;
}
*/