/* 
    Document   : main.css
    Created on : Jul 27, 2009, 12:27:11 PM
    Author     : ryan
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

body {
  margin: 0;
  
  color: #636161;
  font: 13px "lucida grande",tahoma,verdana,arial,sans-serif;
}

a, a:visited, a:hover {
  color: #667c50;
  text-decoration: none;
  outline: none;
}

a:hover {
  cursor: pointer;
  text-decoration: underline;
}

img {
  border: 0;
}

.hide {
  display: none;
}

.clearfix {
  display: block;
  clear: both;
}

/* Tabbar */
ul.tabbar {
  z-index: 2;
  position: relative;
  top: 1px;
  display: block;
  clear: left;
  list-style: none;
  padding: 0 5px;
  margin: 0;
  font: 13px "lucida grande",tahoma,verdana,arial,sans-serif;
  font-weight: bold;
  text-transform: capitalize;
}
ul.tabbar li {
  float: left;
  padding: 0 2px 0 0;
  margin: 1px 1px 0 0;
  overflow: hidden;
}
ul.tabbar li a {
  display: block;
  padding: 3px 11px;
  background-color: #CBD1DD;
  color: #2D457F;
}
ul.tabbar li.activetab a {
  border: 1px solid #C2C2C5;
  border-bottom: 0;
  background-color: #E5E5E5;
  color: #424242;
}
ul.tabbar li.activetab:hover a:hover {
  cursor: default;
  text-decoration: none;
}
div.tabbar-border {
  clear: both;
  border-bottom: 1px solid #C2C2C5;
}

/* Wrapper */
#wrapper {
  position: relative;
  width: 800px;
  margin: auto;
}

#header {
  position: relative;
  width: 100%;
  height: 50px;
  background-color: #afbda0;
  color: #FFFFFF;
  font: 1em sans-serif;
}

#header h1 {
  float: left;
  position: absolute;
  margin: 10px 0 0 10px;
  color: #FFFFFF;
  font: 36px "Constantia", "Century", serif;;
}

#header .logo {
  width: 100%;
  height: 45px;
  background-color: #5c7d95;
}

#header a {
  color: #FFFFFF;
}

#menu {
  position: absolute;
  top: 12px;
  left: 150px;
  font-size: 16px;
}

#menu ul {
  list-style: none;
}

#menu ul li {
  display: inline;
  margin: 10px;
  padding: 5px 5px 0 5px;
}

#menu ul li:hover {
  background-color: #415C6D;
}

#menu ul li a:hover {
  text-decoration: none;
}

#content {
  width: 800px;
  margin: auto;
  margin-top: 10px;
}

#center-canvas {
  width: 580px;
  height: 100%;
}
#center-canvas.full {
  width: 800px;
}
#center-canvas > .header {
  margin-bottom: 10px;
}
#left-canvas {
  float: left;
  width: 200px;
  margin-right: 20px;
  height: 100%;
}
#right-canvas {
  float: right;
  width: 200px;
  margin-left: 20px;
  height: 100%;
}

#footer {
  clear: both;
  border-top: 1px solid #e1dcdc;
  font-size: .8em;
}

#footer #copyright  {
  float: left;
}

#footer .links {
  float: right;
}

.alignright {float: right;}
.alignleft {float: left;}

.notice-box {
  text-align: center;
  border: 2px solid #8E8DA4;
  background-color: #F2F5FF;
  margin: 10px 0;
  padding: 2px 5px;
}

#center-canvas .head {}
#center-canvas .head .name {
  font-size: 20px;
}
#center-canvas .head .status {

}

/* Column-boxes */
.column-box {
  position: relative;
  border-bottom: 1px solid #A4A4A4;
  padding-bottom: 5px;
}

.column-box > .title {
  padding: 0 0 0 3px;
  margin: 0 0 3px 0;
  border-bottom: 1px solid #BFBFBF;
  background-color: #e7e7e7;
  font-size: 14px;
}

.column-box > .more-link {
  font-size: 10px;
  text-align: right;
}

/* Column-box Picture */
.column-box.picture {
  min-width: 200px;
  min-height: 100px;
  border: 0;
}

.column-box.picture .noimage {
  width: 200px;
  height: 200px;
  background-color: #6A726A;
}


/* Feed-canvas */
#feed-canvas {}

#feed-canvas .feedlet {
  min-height: 60px;
  padding: 10px;
  padding-bottom: 0;
  border-top: 1px solid #9B9B9B;
}

#feed-canvas .feedlet:first-child {
  border-top: none;
}

#feed-canvas .feedlet > div {
  padding: 0 0 0 60px;
}

#feed-canvas .feedlet .message {
  min-height: 37px;
}

#feed-canvas .feedlet .message a:first-child {
  font-weight: bold;
}

#feed-canvas .feedlet .metadata {
  float: left;
  display: block;
  color: #CFCFCF;
  font-style: italic;
  font-size: 0.8em;
}

#feed-canvas .feedlet .actions {
  float: right;
  display: inline;
  font-size: .9em;
  font-style: normal;
}

#feed-canvas .feedlet {
  clear: left;
  min-height: 50px;
  padding: 5px 0;
}

#feed-canvas .feedlet .author_picture {
  float: left;
  width: 50px;
  height: 100%;
}