#template { border: 1px solid #000000; margin: 0px auto; }
#courseArea { width: 100%; }
#courseArea > table { margin: auto auto; }
#courseArea > div { margin: auto auto; }

a img {border: 0px;}

/* --- checkbox ---------------------------------------------------------------------- */

/* gadżet obok poszczególnych opcji checkboxa */
div.cbGadget
{
  width: 19px;
  height: 19px;
  vertical-align: middle;
  font-size: 3px;
  background-position: 0px;
  z-index: 1000;
}
  
/* opcja wyświetlana podczas pytania */
td.cbQuestion
{
  cursor: default;
  color: #54533E;
}

/* opcja prawidłowo wybrana */
td.cbGoodAnswer
{
  color: #31B24D;
}

/* opcja błędnie wybrana */
td.cbWrongAnswer
{
  color: #E92D2B;
}

/* checkbox z obwódką lub bez */
table.cbNoBorder, table.cbBorder
{
  vertical-align: middle;
  margin-right: 5px;
}

table.cbBorder
{
  border: 1px solid #D6D7E4;
}

/* --- radio ------------------------------------------------------------------------- */

/* gadżet obok poszczególnych opcji radio */
div.rdGadget
{
  width: 18px;
  height: 18px;
  vertical-align: middle;
  font-size: 3px;
  background-position: 0px;
  z-index: 1000;
}

/*
 *  pozostałe klasy brane są z komponentu checkbox
 */

/* --- true-false -------------------------------------------------------------------- */

table.tfTrueFalse
{
  display: inline;
  vertical-align: middle;
  margin-right: 5px;
}

div.tfTrueFalse, div.tfTrue, div.tfFalse, div.tfCorrect
{
  width: 19px;
  height: 19px;
  vertical-align: middle;
  font-size: 3px;
  z-index: 1000;
}

div.tfTrueFalse 
{
  background-position: 0px;
}

div.tfTrue
{
  background-position: -114px;
}

div.tfFalse
{
  background-position: -76px;
}

div.tfCorrect
{
  background-position: -95px;
}


/* --- drop-down --------------------------------------------------------------------- */

span.ddBox
{
  margin-left: 5px;
  padding-right: 2px;
  border-bottom: 1px solid #A9A889;
  white-space: nowrap;
}

span.ddText, span.ddGoodAnswer
{
  padding-left: 3px;
  padding-right: 3px;
  cursor: default;
  color: #54533E;
  border-left: 1px solid #A9A889;
}

span.ddGoodAnswer
{
  font-style: italic;
  color: #31B24D;
}

div.ddAnswerList
{
  position: absolute;
  z-index: 1000;
  border: solid 1px black;
  cursor: default;
  background-color: #F8F8F8;
  padding: 2px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
}

td.ddSelected
{
  background-color: #6474A4;
  color: #FFFFFF;
}

td.ddGoodAnswer, td.ddGoodAnswerSelected
{
  color: #31B24D;
}

td.ddGoodAnswerSelected 
{
  background-color: #D7F5DD;
}

td.ddWrongAnswer, td.ddWrongAnswerSelected
{
  color: #B03532;
}

td.ddWrongAnswerSelected
{
  background-color: #F4D9D8;
}

/* --- select-phrases ---------------------------------------------------------------- */

/* frazy wchodzące w skład komponentu */
a.phPhrase, span.phPhrase, td.phPhrase
{
  /*font-family: Arial;*/
  text-decoration: none;
  font-size: 100%;
  color: #54533E;
}

a.phPhrase:Hover
{
  color: #E00000;
}

/* fraza prawidłowo wybrana */
span.phGoodAnswer
{
  color: #31B24D;
}

/* fraza błędnie wybrana */
span.phWrongAnswer
{
  color: #E92D2B;
}

/* --- gfx --------------------------------------------------------------------------- */

img.gfx
{
  vertical-align: middle;
}

img.gfxLink
{
  vertical-align: middle;
  cursor: pointer;
  border: 0px none Black;
}

/* --- ordering-list ----------------------------------------------------------------- */

/* obiekty, które mogą być przesuwane */
div.reorderObj, div.reorderObjHover, div.reorderObjSelect
{
  position: absolute;
  top: 2px;
  vertical-align: top;
  padding: 2px 2px 2px 2px;
  border: 1px solid #C0C0C0;
  background-color: #F8F8F8;
  cursor: default;
}

/* obiekty, nieprzesuwalne */
div.reorderFix
{
  position: absolute;
  top: 2px;
  vertical-align: top;
  padding: 3px 3px 3px 3px;
  white-space : nowrap;
}

/* obiekt aktualnie przesuwany */
div.reorderObjSelect
{
  border: 1px solid #FF0000;
  background-color: #D6E1E6;
  z-index: 10000;
  filter: alpha(opacity=50);
  opacity: 0.5;
}

/* obiekt po najechaniu myszką */
div.reorderObjHover
{
  border: 1px solid #000000;
  background-color: #D6E1E6;
}
			
/* miejsce, w którym są umieszczone obiekty */
div.reorderBox
{
  position: relative;
  vertical-align: middle;
  background-color: transparent;
}

/* prawidłowo ułożone zdanie */
td.rlGoodAnswer, span.rlGoodAnswer
{
  color: #31B24D;
}

/* błędnie ułożone zdanie */
td.rlWrongAnswer, span.rlWrongAnswer
{
  color: #E92D2B;
}


/* --- spellpad ---------------------------------------------------------------------- */

/* podkreślenie na wpisanie treści w pytaniu */
span.spFrameQuestion
{
  border-bottom: 1px solid #A9A889;
  padding-left: 3px;
  margin-right: 5px;
}

/* klawiaturka wyświetlana z boku */
span.spFrameCharPad
{
  cursor: pointer;
}

/* dobra odpowiedź */
span.spFrameGood, span.spFrameGood2
{
  color: #31B24D;
  padding-left: 3px;
  padding-right: 3px;
}

/* błędna odpowiedź */
span.spFrameWrong
{
  color: #E92D2B;
  /*border-right: 1px solid #A9A889;*/
  padding-left: 3px;
  padding-right: 3px;
}

/* prawidłowa odpowiedź (jaką należało wpisać) */
span.spFrameCorrect, span.spFrameCorrect2
{
  color: #31B24D;
  font-style: italic;
  padding-left: 3px;
  padding-right: 3px;
}

/* jeśli istnieje wiecej prawidłowych odpowiedzi */
span.spFrameGood2, span.spFrameCorrect2
{
  border-bottom: 1px dashed #31B24D;
}

/* pole na wpisanie odpowiedzi */
input.spInputQuestion
{
  border: 0px none #000000;
  background-color: transparent;
/*  text-align: center; */
}

/* nakładka z listą pozostałych prawidłowych odpowiedzi */
div.spAllCorect
{
  position: absolute;
  border: 1px solid #404040;
  background-color: #FFFFE1;
  color: #000000;
  padding: 2px;
  white-space: nowrap;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
}

/* nakładka z klawiaturką */
div.spCharMap
{
  position: absolute;
}

/* tytuł 'prawidłowe odpowiedzi' wyświetlany w nakładce */
span.spCorrectAnswers
{
  font-size: 9px;
  font-weight : bold;
}

/* tryb edycji */
input.spInputEdit
{
  border: 1px solid #8E8F8F;
  background-color: #F8F8F8;
  margin: 1px 3px 2px 3px;
  vertical-align: middle;
}

/* --- textbox ----------------------------------------------------------------- */

/* tryb edycji */
textarea.ebTextareaEdit
{
  border: 1px solid #8E8F8F;
  margin: 1px 3px 2px 3px;
  font-family: Arial;
}

/* --- drag-and-drop ----------------------------------------------------------------- */

div.dropBox
{
  position: absolute;
  border: 1px solid #D6D7E4;
  background-color: #EDEDF7;
}

div.dropGfx
{
  position: relative;
  border: 1px solid #D6D7E4;
}

/* --- translation-------------------------------------------------------------------- */

div.translation, div.translation512, div.translation1024
{
  position: absolute;
  border: 1px solid #606060;
  background-color: #FFFFE1;
  padding: 5px;
  white-space : nowrap;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  cursor: help;
/*  width: 50%; */
}

div.translation512
{
  font-size: 10px;
}

div.translation1024
{
  font-size: 17px;
}

span.translation
{
  cursor: help;
}

/* --- nowy drag - drop -------------------------------------------------------------- */

div.dpDraggedElement 
{
    cursor: default;
    font-family: Arial;
    font-size: 12px;
	background-color: #D6D7E4;
  	position: absolute;
  	border: 1px solid #606060;
	padding: 2px;
	z-index: 1000;
	filter: alpha(opacity=70);
	opacity: 0.7;
}

span.dpDropHighlighted
{
  background-color: #677DA1;
  color: #F0F0F0;
  cursor: default;
}

span.dpDropDefault
{
  cursor: default;
}

span.dpDropGoodAnswer
{
  color: #31B24D;
}

span.dpDropWrongAnswer
{
  color: #E92D2B;
}

span.dpDragDefault
{
  color: #333388;
  cursor: pointer;
}

span.dpDragDisabled 
{
  color: #CCCCFF;
  cursor: default;
}

span.dpDragDropped
{
  
  text-decoration: underline;
}

/* --- nowy multi drop --------------------------------------------------------------- */

div.mdDraggedElement 
{
    cursor: default;
	background-color: #D6D7E4;
	font-family: Arial;
	font-size: 12px;
  	position: absolute;
  	border: 1px solid #606060;
	padding: 2px;
	z-index: 1000;
	filter: alpha(opacity=70);
	opacity: 0.7;
}

div.mdDropHighlighted
{
  background-color: #F6D7E4;
  cursor: default;
}

div.mdDropDefault
{
  cursor: default;
  background-color: #FFFFFF;
}

td.mdDropGoodAnswer
{
  color: #31B24D;
}

td.mdDropWrongAnswer
{
  color: #E92D2B;
}

td.mdDropMissing
{
  color: #C0C0C0;
  font-style: italic; 
}

span.mdDragDefault
{
  color: #333388;
  cursor: pointer;
}

span.mdDragDisabled 
{
  color: #AAAAFF;
  cursor: default;
}

span.mdDragDropped
{
  color: #333388;
}

/* --- Default Good Answer------------------------------------------------------------ */

span.goodAnswer
{
  color: #31B24D;
}

span.wrongAnswer 
{
  color: #E92D2B;
}