diff -r 000000000000 -r d4dc097a6083 web/LdtPlayer.css
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/web/LdtPlayer.css	Thu Dec 15 14:02:15 2011 +0100
@@ -0,0 +1,496 @@
+    #demo-frame > div.demo { padding: 5px !important; };
+
+    button.ui-button-icon-only  {
+      height:1.5em;
+      width:1.5em;
+    }
+
+    #Ldt-loader {
+      background:url(imgs/loader.gif) no-repeat;
+      width:20px;
+      height:16px;
+      float:left;
+    }
+
+   /* general class for all buttons */
+   .Ldt-button {
+
+   }
+
+    .Ldt-SegmentsWidget {
+      background-color: #b6b8b7;
+      overflow: auto; /* clear the floats */
+      margin-top: 1px;
+    }
+
+    .Ldt-iri-chapter{
+      float: left;
+      height: 10px;
+    }
+
+    .tooltip {
+      display:none;
+      background:transparent url(imgs/white_arrow_mini.png);
+      font-size:12px;
+      height:55px;
+      width:180px;
+      padding:10px;
+      padding-left:15px;
+      padding-top:15px;
+      padding-right:15px;
+      color:#000;
+      font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
+    }
+    #Ldt-Root{
+      font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
+    }
+    #Ldt-Hat{
+      height:3px;
+    }
+
+    .Ldt-AnnotationsWidget {
+      font-size: 12px;
+      font-family: "Arial",  "Verdana", "sans-serif";
+      background-color:#eeeeee;
+      background:url('imgs/wire_pattern.png') repeat scroll transparent ;
+      border: 1px solid #b6b8b8;
+    }
+
+    .Ldt-Annotation-DoubleBorder {
+      border: 1px solid white;
+      overflow: auto;
+    }
+
+    .Ldt-AnnotationContent {
+      padding:5px;
+      padding-left: 12px;
+
+    }
+
+    .Ldt-SaTitle{
+      padding-top:2px;
+      padding-bottom:3px;
+      font-size: 12pt;
+      color : #0068c4;
+    }
+
+    .Ldt-SaDescription{
+      font-size:12px;
+    }
+
+    .Ldt-SaKeyword{
+      background-color:#b9b9b9;
+      color:#4D4D4D;
+      padding:5px;
+      font-weight:bold;
+      text-align:left;
+      float:left;
+      font-size:10px;
+    }
+
+    .Ldt-AnnotationShareIcons {
+      float:right;
+      position: relative;
+    }
+
+
+    #Ldt-PlaceHolder{
+      position:absolue;
+      float:none;
+    }
+
+    .Ldt-Segments{
+      float:left;
+      font-size: 62.5%;
+    }
+
+    .Ldt-mode-radio{
+      visibility:hidden;
+      height:0px;
+      display:none
+    }
+
+    /* player */
+    .Ldt-controler {
+      font-size: 62.5%;
+      font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
+      background:url('imgs/player_gradient.png') repeat-x transparent ;
+      height: 25px;
+      border-top: 1px solid #b6b8b8;
+      border-bottom: 1px solid #b6b8b8;
+    }
+
+ 
+    .Ldt-LeftPlayerControls {
+      float:left;
+    }
+
+    .Ldt-RightPlayerControls {
+      float: right;
+    }
+
+    .Ldt-button {
+      border-left: 1px solid #b6b8b8;
+      float: left;
+      cursor: pointer;
+     
+    }
+
+    .Ldt-CtrlPlay {
+      background:url('imgs/play_sprite.png') no-repeat transparent ;
+      background-position: 0 0;
+      width: 59px;
+      height: 25px;
+    }
+
+    .Ldt-CtrlPlay:hover {
+      background-position: 0 -25px;
+    }
+
+    .Ldt-CtrlPlay:active {
+      background-position: 0 -50px;
+    }
+
+    .Ldt-CtrlAnnotate {
+      background:url('imgs/annotate_sprite.png') no-repeat scroll 0 0 transparent ;
+      width: 33px;
+      height: 25px;
+      border-right: 1px solid #b6b8b8;
+      float: left;
+    }
+
+    .Ldt-CtrlAnnotate:hover {
+      background-position: 0 -25px;
+    }
+
+    .Ldt-CtrlAnnotate:active {
+      background-position: 0 -50px;
+    }
+
+    .Ldt-CtrlSearch {
+      background:url('imgs/search_sprite.png') no-repeat scroll 0 0 transparent ;
+      width: 33px;
+      height: 25px;
+      border-right: 1px solid #b6b8b8;
+      float: left;
+      border-left: none;
+    }
+
+    .Ldt-CtrlSearch:hover {
+      background-position: 0 -25px;
+    }
+
+    .Ldt-CtrlSearch:active {
+      background-position: 0 -50px;
+    }
+
+
+    .Ldt-Time {
+      position: inherit;
+      float: left;
+      border-right: 1px solid #b6b8b8;
+      height: 25px;
+      padding-right: 2px;
+      font-size: 12px;
+      font-family: Arial, Verdana, sans-serif;
+    }
+    
+    .Ldt-ElapsedTime {
+      margin-top: 4px;
+      float: left;
+      color: #4a4a4a;
+    }
+    
+    .Ldt-TimeSeparator {
+      margin-top: 4px;
+      float: left;
+      padding-left: 1px;
+      padding-right: 1px;
+    }
+
+    .Ldt-TotalTime {
+      margin-top: 4px;
+      float: left;
+      color: #b2b2b2; 
+    }
+
+    .Ldt-CtrlSound {
+      background:url('imgs/sound_sprite.png') no-repeat scroll 0 0 transparent ;
+      width: 33px;
+      height: 25px;
+      border-right: 1px solid #b6b8b8;
+      float: right;
+      border-left: none;
+    }
+
+    .Ldt-CtrlSound:hover {
+      background-position: 0 -25px;
+    }
+
+    .Ldt-CtrlSound:active {
+      background-position: 0 -50px;
+    }
+/*
+    .Ldt-CtrlSound {
+      float: right;
+      border-left: none;
+      height: 25px;
+      top: 7px;
+      position: inherit;
+    }
+*/    
+    .Ldt-cleaner {
+      clear:both;
+    }
+
+    /* Arrow Widget */
+    .Ldt-arrowWidget {
+      position: relative;
+      background:url('imgs/arrow.png') no-repeat scroll 0 0 transparent ;
+      height:16px;
+      width:27px;
+      margin-bottom: -3px;
+      z-index: 4;
+      left: 0%;
+    }
+ 
+    .cleaner {
+      clear:both;
+    }
+
+    .share {
+      background:url('imgs/widget20.png') no-repeat scroll 0 0 transparent ;
+      display:block;
+      height:16px;
+      line-height:16px !important;
+      overflow:hidden;
+      width:16px;
+      float:left;
+      cursor:pointer;
+      margin:2px;
+    }
+    .shareFacebook{
+      background-position:0 -704px;
+    }
+    .shareMySpace{
+      background-position:0 -736px;
+    }
+    .shareTwitter{
+      background-position:0 -1072px;
+    }
+    .shareGoogle{
+      background-position:0 -752px;
+    }
+    .shareDelicious{
+      background-position:0 -672px;
+    }
+    .shareJamesPot{
+      background-position:0 -1808px;
+    }
+
+    .tip{
+      position : fixed; /* why not absolute instead of fixed ? because the div containing the tooltip widget is not a subdiv of its parent
+                           widget */
+      padding : 3px;
+      z-index: 10000000000;
+      max-width: 200px;
+      background: transparent url("imgs/white_arrow_long.png");
+      font-size: 12px;
+      height: 125px;
+      width: 180px;
+      padding: 10px;
+      padding-left: 15px;
+      padding-top: 15px;
+      padding-right: 15px;
+      color: black;
+      font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif";
+      overflow:hidden;
+    }
+
+    /* slider */
+    .Ldt-SliderMinimized {
+      height: 6px;
+    }
+
+    .Ldt-SliderMaximized {
+      height: 11px;
+    }
+
+    .Ldt-sliderElementMinimized {
+      width: 100%;
+      height: 5px;
+    }
+
+    .Ldt-sliderElementMaximized {
+      width: 100%;
+      height: 10px;
+    }
+
+    .Ldt-sliderBackground  {
+      background-color: #B6B8B8;
+      position: absolute;
+      z-index: 2;
+      bottom: 1px;
+      width: 100%;
+      height: 5px;
+ 
+    }
+
+    .Ldt-sliderForeground  {
+      background-color: #747474;
+      z-index: 2;
+      width: 0px;
+      position: absolute;
+      bottom: 1px;
+      height: 5px;
+    }
+
+    .Ldt-sliderPositionMarker {
+      position: absolute;
+      z-index: 100;
+      background-color: blue;
+      height: 5px;
+      width: 5px;
+      top: 0%;
+      bottom: 1px;
+    }
+
+    .positionMarker {
+      position: absolute;
+      z-index: 100;
+      width: 1px;
+      height: 20px;
+      background-color: white;
+    }
+
+    /* tweet Widget */
+    .Ldt-tweetWidget {
+      font-size: 12px;
+      font-family: "Arial",  "Verdana", "sans-serif";
+      background:url('imgs/wire_pattern.png') repeat scroll transparent ;
+      border: 1px solid #b6b8b8;
+      border-top: none;
+      overflow: auto;
+    }
+
+    .Ldt-tweet-DoubleBorder {
+      border: 1px solid white;
+      padding: 5px;
+      overflow: auto;
+    }
+
+    .Ldt-tweetAvatar {
+      float: left;
+    }
+
+    .Ldt-tweetAvatar-profileArrow {
+      float: left;
+      height: 48px;
+      margin-left: 5px;
+      margin-right: 5px;
+    }
+
+    .Ldt-tweet_userHandle {
+       float: left;
+       color: #5c8df1;
+    }
+
+    .Ldt-tweet_realName {
+      float: left;
+      margin-left: 3px;
+    }
+
+    .Ldt-tweetContents {
+    }
+
+    .Ldt-tweet_date {
+      float: left;
+    }
+
+    .Ldt-tweetWidgetKeepOpen {
+      position: relative;
+      float: right;
+      height: 17px;
+      width: 17px;
+      margin-right: 1px;
+    }
+
+    .Ldt-tweetWidgetMinimize {
+      position: relative;
+      float: right;
+      height: 17px;
+      width: 17px;
+      right: 9px;
+    }
+
+    .Ldt-tweetWidget * a:link {
+      color: #729efa;
+
+    }
+
+    .Ldt-TweetReply {
+      float: left;
+      margin-left: 16px;
+    }
+
+    .Ldt-TweetReplyIcon {
+      background:url('imgs/reply_sprite.png') no-repeat scroll 0 0 transparent ;
+      width: 14px;
+      height: 11px;
+      float: left;
+      margin-top: 2px;
+    }
+
+    .Ldt-TweetReplyIcon:hover {
+      background-position: 0 -11px;
+    }
+
+    .Ldt-TweetReplyIcon:active {
+      background-position: 0 -22px;
+    }
+
+    .Ldt-Retweet {
+      float: left;
+      margin-left: 16px;
+    }
+
+    .Ldt-RetweetIcon {
+      background:url('imgs/retweet_sprite.png') no-repeat scroll 0 0 transparent ;
+      width: 14px;
+      height: 8px;
+      float: left;
+      margin-top: 3px;
+    }
+
+    .Ldt-RetweetIcon:hover {
+      background-position: 0 -8px;
+    }
+
+    .Ldt-RetweetIcon:active {
+      background-position: 0 -16px;
+    }
+
+    /* styling of a "++" in a tweet */
+    .Ldt-PolemicPlusPlus {
+      background-color: #1d973d;
+    }
+
+    /* styling of a "==" in a tweet */
+    .Ldt-PolemicEqualEqual {
+      background-color: #5c8df1
+    }
+
+    /* styling of a "--" in a tweet */
+    .Ldt-PolemicMinusMinus {
+      background-color: #ce0a15;
+    }
+
+    /* styling of a "??" in a tweet */
+    .Ldt-PolemicQuestion {
+      background-color: #c5a62d;
+    }
+
+    /* the styling of a spacer div */
+    .Ldt-spacer {
+      background-color:#eeeeee;
+    }