/**
 * @author roemke
 * css for my first own plugin a window based on dialog plugin from 
 * jquery ui
 * the dialog ist "heavily customized" by styles, so I see no way to strip
 * away the style sheets
 * instead I give "my" class (inherited from dialog) the krDialog css class
 * so you can customize "my dialog/window" by overwriting the css attributes
 * maybe I have to extend this file
 * License: MIT and GPL
 */

 /* margin-top/bottom fuer h4 ist  mir zu gross, wenn ich firefox die 
    gestaltung ueberlasse 
 */
 h4 {
  margin-top:    0.5em;
  margin-bottom: 0.1em; 
 }

/*id of dock for the windows
  Positionierung und Style des docks */  
#krWindowIdDivDock {
     /* float     : right; nicht mit fixed */
     text-align  : center;
     width       : 30px;
     height      : 600px;
     position    : fixed;     
     top         : 50px;
     right       : 5px; /*5px*/ 
     margin-right: 5px;
     border-left : 1px  solid;
     padding     : 5px 2px;  
   }

/*class of Window put in the dock - should be "small" */
.krWindowClDivDockedWindow{
  overflow   : hidden;
  border     : 4px groove #C0C0C0;
  height     : 1.2em; 
}
.krWindowClDivDockedWindow:hover {
  cursor     : pointer;
}
/* class of Window / Titlebar which is shown beside the dock if the user 
 * moves the mouse over the docked window */
.krWindowClDivDockedWindowShown {
  width         : 20em;
  height        : 1.2em;
  overflow      : hidden;
  padding       : 2px 5px;
  border        : 1px solid #231D2B;
  border-radius : 6px 6px 6px 6px;
  color         : black;
  font-weight   : bold;
  background    : #eee;
  z-index       : 5000; /*nicht schoen, aber tuts :-(  */
}

/* einiges heraus genommen - findet man ggf. in der entsprechenden 
 jquery datei */

/* Component containers
----------------------------------*/
/* da ich es immer vergesse: ohne Leerzeichen .class1.class2 -> ein element muss beide haben
 * es handelt sich um einen Einfach-Selektor
 * mit Leerzeichen .class1 .class2 -> ein element mit class 2, das in Element mit class1
 * enthalten ist, die Verschachtelungstiefe spielt dabei keine Rolle
 * hier handelt es sich um einen Kombinator (Leerzeichen ist der Nachfahrenselektor)
 */
.krWindow.ui-widget { }
.krWindow.ui-widget .ui-widget { font-size: 1em; }
.krWindow.ui-widget input, 
.krWindow.ui-widget select, 
.krWindow.ui-widget textarea, 
.krWindow.ui-widget button { 
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif; 
  font-size: 0.8em; 
}

.krWindow.ui-widget-content {
  background-image: none;
}

/*hier dann "kinder" */

.krWindow .ui-widget-content {
  padding: 0.5em 0.4em; 
  margin-top: 4px; 
  border: 1px solid;
  color: black;
  background-color: #DDD;
}
.krWindow .ui-widget-content a { color: #000; }
/* die Titelleiste der Fenster ist nur gemeinsam konfigurierbar,
   das reicht mir */
.krWindow.ui-dialog .ui-dialog-titlebar 
{
  padding: 0em 0.6em;
  background-color: #000066;
  color: white; 
}
.krWindow .ui-widget-header { border: 1px solid #231d2b; background: #eee; ; color: #000; font-weight: bold; }
.krWindow .ui-widget-header a { color: #000; }

 

