/**
 * Layout:       tabs-widget.css
 * Project:      WTG
 * Version:      1.0
 * Last change:  12/01/10
 * Assigned to:  Diego Lago (dl)
 * Primary use:  Website
 *
 *
 * Note: Rest of css from contractors
 */

/* tabs container */
#tabs-widget {
  background-color: #e9e9e9;
  float: right;
  position: relative;
}

/* tabs  */
#tabs-widget ul.tabs { 
  list-style:none; 
  margin: 0 !important; 
  padding: 6px 0 0 5px;
  border-bottom: 1px solid #666;
  height: 26px;
  background: #455560 url(../images/bg-tabs.gif) repeat-x 0 0;
  width: 247px;
}

/* single tab */
#tabs-widget ul.tabs li {
  float: left;
  text-indent: 0;
  padding: 0;
  margin: 0 !important;
  list-style-image: none !important;
}

/* link inside the tab. uses a background image */
#tabs-widget ul.tabs a { 
  display: inline-block;
  height: 26px;
  line-height: 26px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  padding: 0 15px;
  margin: 0;
  position: relative;
  top: 1px;
  font-weight: bold;
}
#tabs-widget ul.tabs a:active,
#tabs-widget ul.tabs a:focus {
  outline: none;
}
#tabs-widget ul.tabs a:hover {
  color: #e04f42;
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
  cursor: default !important; 
  color: #000 !important;
  background: #e9e9e9 url(../images/bg-tab.gif) repeat-x 0 0;
}

/* panes */
div.panes div.pane {
  display: none; /* initially all panes are hidden */
  background: #e9e9e9;
  padding: 10px;
}
div.panes #news-events,
div.panes #blog,
div.panes #twitter {
  background-color: #E9E9E9;
  float: right;
  /*height: 178px;*/
  height: 16em;
  padding: 10px;
  position: relative;
  width: 232px;
}
div.panes .pane p.news-link {
  padding: 0 0 0 40px;
}

/* twitter */
#twitter ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#twitter li {
  margin-bottom: 1em;
}
#tweets li {
  background:url(../images/ico-tweet.gif) no-repeat 0 4px;
  margin-bottom: 10px;
  padding-left: 40px;
}

/* blog */
.blog {
  background:url(../images/blog_icon.png) no-repeat 0 -6px;
}
* html .blog {
  height: 1%;
}
.teaser {
  margin-left: 40px;
}

div.panes #news-events {
  display: block;    
}