body{
  margin:0;
  padding:0;
  padding-top: 25px;
  padding-bottom: 25px;
  background-color: #ffffff;
  font-family: Trebuchet MS, sans-serif;
  font-size: 12px;
}

ol {
  padding-left: 20px;
}

ol li{
  margin-bottom: 1em;
}

/*------------------------------------------------------------
  basic layout - main
------------------------------------------------------------*/
#maincontainer{
  width: 900px; /*Width of main container*/
  min-height: 700px; /*Width of main container*/
  margin: 0 auto; /*Center container on page*/
  display: inline-block; /*sets hasLayout - required for IE*/
  overflow: hidden; /*causes modern browsers to enclose child floats*/ 
  position: relative;
  padding-bottom: 20px;
}

#maincontainer{
  display: block; /*resets to proper property value without resetting layout*/
}

.home {
  background-color: #6e97cb;
  background-image: url(/graphics/bg_green.jpg); 
  background-repeat: repeat-x;
}

.browse {
  background-color: #f2b12f;
  background-image: url(/graphics/bg_orange.jpg); 
  background-repeat: repeat-x;
}

.blue {
  background-color: #b9dbda;
  background-image: url(/graphics/bg_blue.jpg); 
  background-repeat: repeat-x;
}

/*------------------------------------------------------------
  basic layout - top
------------------------------------------------------------*/
#topbar {
  top: 0px;
  left: 0px;
  width: 745px;
  height: 120px;  
  position: relative;
}

.topbarhome {
  background: url(/graphics/topbar_home.jpg) no-repeat top left;
}

.topbarbrowse {
  background: url(/graphics/topbar_browse.jpg) no-repeat top left;
}

.topbarblue {
  background: url(/graphics/topbar_blue.jpg) no-repeat top left;
}

#headline {
  position: absolute;
  top: 108px;
  left: 0px;
}

/*------------------------------------------------------------
  floating logo
------------------------------------------------------------*/
#logohome {
  position: absolute;
  top: 80px;
  right: 20px;
  width: 110px;
  height: 78px;
  background-color: #d3e27e;
  border: 6px solid white;
  z-index: 1000;
}

#logobrowse {
  position: absolute;
  top: 80px;
  right: 100px;
  width: 110px;
  height: 78px;
  background-color: #efd06b;
  border: 6px solid white;
  z-index: 1000;
}

#logoblue {
  position: absolute;
  top: 122px;
  right: 30px;
  width: 110px;
  height: 78px;
  background-color: #ADDDDD;
  border: 6px solid white;
  z-index: 1000;
}

#logo {
  padding: 4px 0px 0px 7px;
}

/*------------------------------------------------------------
  basic layout - colummns
------------------------------------------------------------*/
#leftcolumn {
  width: 163px;
  float: left;
  display: inline;
  position: relative;
}

.innertubel {
  margin-top: 20px;
  background-color: #6e97cb;
}

#rightcolumn {
  width: 737px;
  min-height: 700px; /*Width of main container*/
  float: left;
  display: inline;
  background-image: url(graphics/ccbc_bg.jpg); 
}

#picpane {
  float: left;
  border: 9px solid #ffffff;
  margin-top: 10px;
  margin-bottom: 10px;
  background-color: #ffffff;
  width: 254px;
  height: 297px;
  width: 250px;
  height: 290px;
  display: inline;
}

/*------------------------------------------------------------
  copypane variations and contents
------------------------------------------------------------*/
#copypane {
  float: right;
  margin-right: 73px;
  margin-top: 10px;
  margin-bottom: 16px;
  width: 375px;
  min-height: 408px;
  height:auto !important;
  height:408px;
  display: inline;
  padding: 0;
}

.copypanehome {
  border: 9px solid #ffffff;
  background-color: #dee9a4;
}

.copypanebrowse, .copypaneblue {
  border: 9px solid #000000;
  background-color: #ffffff;
}

h1 {
  display: block;
  text-align: center;
     font-family: Trebuchet MS, times, serif;
     font-variant: small-caps;
     color: #000000; font-size: 24px; line-height: 24px;
}

.hpage {
     font: 15px/1.5em impact, sans-serif; 
     text-align: center;
     letter-spacing: .04em;
}

.hpage a {
   color: red;
}

#copypane a {
  font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
  font-weight: bold;
  text-decoration: none;
  color: #000000;
}

.copypanehome   a:hover {color: #48822d !important;}
.copypanebrowse a:hover {color: #bf8500 !important;}
.copypaneblue   a:hover {color: #20999a !important;}

.innertuber {
  padding: 10px;
}

.innertubebrowse {
  padding: 10px 30px 10px 30px;
  height:310px;
  overflow-y: scroll;
}

.innertubeblue {
  padding: 10px 30px 10px 30px;
  height:460px;
  overflow-y: scroll;
}

/*------------------------------------------------------------
  shadow stuff
------------------------------------------------------------*/
.dropshadow {
  -moz-box-shadow: 3px 3px 3px #666;
  -webkit-box-shadow: 3px 3px 3px #666;
  box-shadow: 3px 3px 3px #666;
  filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135);
}

