body { width: 980px; 
    margin: 20px auto; 
    font-size: 100%
}

#edit_title { background: #fed; padding: 0.1em; border: 1px dotted #bbb; 
min-height: 2em; position: relative }
#edit_title:before { display: block; font-size: 60%; font-weight: normal; content: "Titulek";position: absolute; top: -1.3em }

#edit_task { background: #ddd; padding: 0.2em; border: 1px dotted #bbb; min-height: 2em; position: relative;}
#edit_task:before { display: block; font-size: 70%; font-weight: normal; content: "Zadání"; position: absolute; top: -1.3em }
legend {
    font-size: 80%;
  }
  fieldset {
    padding: 0.2em
  }
  th {
    font-size: 80%; 
    font-weight: normal;
    text-align: left;
  }
  td {vertical-align: top}
  #controlls {
    float: left;
    width: 275px;
    background: #def;
    margin-right: 10px;
  }
  #controlls fieldset {
   width: auto; margin-top: 1em;
  }
    #question {
      float: left;
      border: 3px outset;
      padding: 0.5em;
      margin-left: 0em;
      /*width: 500px;*/
     /* margin-left: 20px;
      margin-right: auto;*/
      /*display: none;*/
      background: rgb(255,204,153)
      }
    #question textarea {
      border: 1px solid;
      font-family: Verdana, sans-serif;
      font-size: smaller;
      padding: 0.2em;
    }
    #question li, #question textarea { 
      vertical-align: top;
    }
    #output {
     /* clear: both;
      display: none;*/
    }
    #numberingType {
      visibility: hidden;
    }
    .abc_big {list-style-type: upper-alpha;}
    .abc {list-style-type: lower-alpha;}
    .decimal {list-style-type: decimal}
    .bullets {list-style-type: disc}
    .no-bullets { list-style-type: none; margin-left: 0; padding-left: 0}
    
    textarea {width: auto}
    #q_title textarea {font-weight: bold; font-size: 120%;width: 600px;}
    #q_task textarea {font-weight: bold; font-size: 100%; width: 600px;}
    
    input.btn { 
      border: 2px outset rgb(212,208,200)
      padding: 2px; 
      background: rgb(212,208,200)
      }
    
    /* styly pro ukazkova okno */
    #shower {
      z-index: 100;
      
      /*visibility: hidden;*/ 
      position: absolute;
      
      top: 10em; 
      left: -10000px;
      width: 40em;
      /*height: 20em;*/
      background: #fff;
      border: 3px groove;
      /*padding: 0.3em*/
      
      }
      /* titulek ukazkoveho okna*/ 
    #shower_heading { 
      background: url(ikony/window_title.png) repeat-y darkblue; 
      color: white; 
      font-weight: bold; 
      padding: 0.3em;
      cursor: pointer;
      height: 1em;
    }
    #shower-title { 
      float:left;
    }
      img.closer {float: right;}
    
    #shower-content {
      clear: both;
      padding: 0.5em;
      max-height: 400px;
      overflow: auto;
      }
    #shower-content h3 {
      font-family: verdana, arial, sans-serif; 
      font-size: 100%;
      margin-top: 1em;
      margin-bottom: 0.2em
    }
    #shower-content p {
      margin-top: 0em;
      margin-bottom: 0.2em
    }
    pre.example {
      background: #eee;
      border: 1px solid #ccc;
      padding: 0.5em;
      line-height: 150%
    }
    /* nadpis nahledu otazky */
    #shower .title {
      font-weight: bold;
      font-size: 120%;
      margin: 0.8em 0 0.3em 0;
      }
      /* nadpis zdani otazky */
    #shower .task {
      font-weight: bold;
      margin: 0.5em 0 0.5em 0
    }
    /* obsah nahledu otazky */
    #shower .content {
      margin-left: 2em
    }
  
    .question { padding: 0.3em }
    
    .clearer { clear: both}
  
  .helper {display: none}
  a.help {
    padding-left: 20px; 
    background: url(ikony/n-aplikace-help-ico.gif) no-repeat;
    cursor: help;
  }
  /* matematicke otazky typu l */
  span.math {}
span.math img { vertical-align: middle}
img.maple_result { visibility: hidden}
img.syntax_checker { cursor: pointer} 

/*****************   Drag and Drop  ************************/
 .droparea { 
  display: table-cell;
  
  min-height: 1.4em; padding-left: 0.0em;
  background: #eee ;
  border: 2px solid #ddd; vertical-align: -0.3em;
  text-align: center;
  padding: 3px;
  border-radius: 5px;  } 
  
  .droparea img { display: inline-block; vertical-align: middle; }
    
  .testitem { display: inline-block; background-color: #fff; padding: 0.2em; margin: 0 0.2em; }
  
  .testitem { color: white; background-color: darkblue}
  .tt { }
  .tn { background-color: purple }
  
  
  .ui-right {float: right; width: 220px} 
  #qArea { /*padding: 0.5em;*/ min-width: 600px; border: 1px solid #bbb; min-height: 2em; }
  
  #qArea input[type="button"] { font-size: 90%; width : 100% } 
  
  #bg-init { width: 700px; height: 400px;
  /* content: " ";*/ 
   background: url("document_background.png")center center no-repeat #ffc;
 
   }               
  #bg-init:hover { background-color: #ffe; cursor: pointer} 
  
  #dragbase { color: #eee; min-height: 3em; width: 100%}
  
  #dragbase input { display: inline-block; /*vertical-align: top*/ }
   #dragbase #del_draggable { display: none}
  .qArea table, .qArea td, .qArea th { border: 1px solid #bbb}
  .qArea th { background: #ddd }
  
  .sidebar { /**/float: right; /*position: absolute;  left: 650px; top:300px; width: 100px;*/ 
  background: #fff; 
  display: none;
  }
 
   p.label, p.droparea_copy, p.checks { display: inline-block} 
  p.label {}
  p.droparea_copy {width: 150px; height: 80px;
    padding: 0.3em;
   background: #fed; border: 1px solid #bbb; vertical-align: top;}
  
  .droparea_move, .droparea_move_sc { display: inline-block; 
    height: 1.4em; padding-left: 0.2em;
  background: #fed; border: 1px solid #bbb; vertical-align: -0.3em;
  text-align: center; 
   }
  
  p.checks { width: 200px} 
  
  .droparea .draggable { display: block}
  *[draggable='true'], .draggable { display: inline-block; padding: 0.1em; margin: 5px; font-weight: bold; 
    position: relative; 
  /*border: 1px solid #800; */ color: black; background: transparent
  } 
  .draggable.actual { border: 1px solid red; }
  
  .but_delete {display: inline-block; width: 16px; height: 16px; 
    background: url(images/delete.png) no-repeat; 
    position: absolute; top: -2px; right: -8px;
    cursor: pointer;
      }
  .droparea_copy .draggable { display: block; margin-bottom: 0.3em }
  .droparea_move .draggable, .droparea_move_sc .draggable { margin: 1px 5px 1px 0 ; /**/ border: 0px none; background-color: transparent; font-weight: bold; padding: 0; vertical-align: 0.3em   }
  
  .droparea_move_sc input[type="text"] { display: none; font-size: 0; width: 0; height: 0; vertical-align: middle}
  .dragbase { min-height: 2em; background: #ddd }
  p.lines7 { height: 8.4em }
  
  #dragbase { display: none}

  .popis-t:before { display: block; position: absolute; left: -1px; top: -1px; 
  
  border: 1px solid #bbb; 
  height: 30px; width: 30px; content: " "; 
   }
   
 /* dialogy UI */  
   #dialog-addImage label { font-size: small } 
   #dialog-addImage input[type='text'], #dialog-setBgImage input[type='text'] { width: 100%;} 
   #dialog-showCode textarea { width: 100%; height: 100%;  font-family: monospace; font-size: 100%}
   .ui-modal { }
   
 #del_draggable { display: none }