/* *************************************************************************
****************** EXERCISES **********************************************
************************************************************************* */
/* #ww4_printFilter {
  border: 2px #bd3f95 solid;
  position: absolute;
  width: 100%;
}
#doc_list {
  border: 2px solid red;
  *//* width: 100%; *//*
  position: absolute;
}
#fo .exerciseWrapper {
  border: 2px red solid;
  position: absolute;
  width: 100%;
}
#fo .exerciseWrapper .exercise {
  border: 2px #0e1ec7 solid;

  position: absolute;
}

#fo #quizzesList {
  border: 2px #0ec746 solid;
  width: 100%;
  max-width: 1800px;
  position: absolute;
}#fo #quizContainer {
  border: 2px #29aeff solid;
  width: 100%;
   position: absolute;
}*/

 /*.body {*/
  /*border: 2px red solid;*/
  /*position: relative;*/
  /*width: 100%;*/
   /*height:1000px;*/
/*}*/

#fo #quizContainer { margin: 0px 0 150px 0; float:left;width: 90% }
#fo .exerciseWrapper {
  /*overflow: auto;*/
  font-size:14px;
  color:#000;
  float:left;
  padding:0px;
  margin:0px;
  width: 100%;

 }

/* SALVATTORE - la chiamata al js deve essere prima della chiusura del body ==> inclusa in wp_footer */
/*#fo .exerciseWrapper[data-columns]::before { content: "2 .column.size-1of2"; }*/
/* These are the classes that are going to be applied: */
#fo .column { float: left; }
#fo .size-1of2 {
  width: 50%;
  max-width: 650px;
}

#fo .exerciseWrapper .exercise {
  background-color: white;
  box-shadow: 1px 1px 5px #999;
  float: left;
  height: auto;
  margin: 30px 20px 0px 2px;
  min-height: 200px;
  /*min-width: 430px;*/
  padding: 10px;
  /*width: 40%;*/
 }

#fo #ww4_printFilter .exerciseWrapper .exercise div.questionTitle {
  margin: 0px;
  color:  #000000;
  font-weight: bold;
  padding: 2px;
  text-align: center;
}
#fo .green #ww4_printFilter .exerciseWrapper .exercise div.questionTitle {background-color: #01ABC5;}
#fo .blue #ww4_printFilter .exerciseWrapper .exercise div.questionTitle {background-color: #005BB7;}

#fo #ww4_printFilter .exerciseWrapper .exercise div.questionFile img,
#fo #ww4_printFilter .exerciseWrapper .exercise .questionsContainer img {
  border-radius: 10px;
  box-shadow: 0 0 0.3em rgba(0, 0, 0, 0.8);
}

#fo #ww4_printFilter .exerciseWrapper .exercise div.questionFile { text-align: center; }
#fo #ww4_printFilter .exerciseWrapper .exercise div.questionFile img {
  width: 80%;
  margin-top: 10px;
}

#fo #ww4_printFilter .exerciseWrapper .exercise .questionsContainer img { margin-top: 5px; }

#fo .exerciseWrapper .exercise table { padding: 10px; }
#fo .exerciseWrapper .exercise .mbMiniPlayerBig table { padding: 0px; }  /* inline player */
#fo .exerciseWrapper .exercise .mbMiniPlayerBig table img { width: 30px; }  /* inline player */
#fo .exerciseWrapper .exercise table tr.alternateTrue, #fo .exerciseWrapper .exercise table tr.alternateFalse { height: 45px; }
#fo .exerciseWrapper .exercise table tr.alternateTrue { background-color: #ebebeb; }
#fo .exerciseWrapper .exercise table td { vertical-align: top; }
#fo #ww4_printFilter .exerciseWrapper .exercise p { margin-top: 2px; }
#fo .exerciseWrapper .exercise input[type="text"] {
  background-color: white;
  padding: 4px;
  border: 1px solid #CCCCCC;
  font-size: 10pt;
  /*  questa forzatura inibisce l'allargamento automatico dell'input*/
  /*width: 300px !important;*/
  max-width: 150px;
  margin-top: 10px;
}

#fo .exerciseWrapper .exercise .ok {
  color: #53C21A;
  font-weight: bold;
}

#fo .exerciseWrapper .exercise .ko {
  color: #C20000;
  font-weight: bold;
}

#fo .exerciseWrapper .exercise .background-ok { background-color: #53C21A; }
#fo .exerciseWrapper .exercise .background-ko { background-color: #C20000; }
#fo .exerciseWrapper .exercise td.imageRecognition input { width: 100%; }
/* free sentence completion span soluzione */
#fo .exercise .quiz-sol { text-decoration:underline; display: block;}

/* OPT_SENTENCE_COMPLETION starts */
/* Main content area */
#fo #ww4_printFilter .exerciseWrapper .exercise .generalContainer {
  text-align: center;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  width: 100%;
}

#fo .exerciseWrapper .exercise img.draggableImage { width: 50%; }
/*#fo .exerciseWrapper .exercise table tr td span:not(.button),*/
/*#fo .exerciseWrapper .exercise table tr td span:not(.buttonSelected) { font-size: 90%; font-style: italic; }*/
#fo .exerciseWrapper .exercise table tr td span:not(.button):not(.buttonSelected) { font-size: 90%; font-style: italic; }

#fo #ww4_printFilter .exerciseWrapper .exercise .droppableContainer,
#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer,
#fo #ww4_printFilter .exerciseWrapper .exercise .questionsContainer {
  padding: 5px;
  /* display: inline-table; */  
  display: inline-block;        
  vertical-align: bottom;
  margin-top: 10px;
}

/* Individual cards and slots */
#fo #ww4_printFilter .exerciseWrapper .exercise .questionsContainer div,
#fo #ww4_printFilter .exerciseWrapper .exercise .droppableContainer div,
#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div {
  border: 2px solid #333;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  margin: 10px 0px;
  background: #fff;
  width: 115px; /*  todo responsive */
  position: relative;
  height: 100px;
  /*max-height: 100px;*/
  /*overflow: auto;*/
  text-align: center;
}

#fo #ww4_printFilter .exerciseWrapper .exercise .questionsContainer div p,
#fo #ww4_printFilter .exerciseWrapper .exercise .droppableContainer div p ,
#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div p {
  font-size: 12px;
  width: 100%;
  margin: 0;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
}

/* Slots for final card positions */
#fo #ww4_printFilter .exerciseWrapper .exercise .droppableContainer {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow: 0 0 .3em rgba(0, 0, 0, .8);
  -webkit-box-shadow: 0 0 .3em rgba(0, 0, 0, .8);
  box-shadow: 0 0 .3em rgba(0, 0, 0, .8);
}
#fo .green #ww4_printFilter .exerciseWrapper .exercise .droppableContainer {background: #01ABC5;}
#fo .blue #ww4_printFilter .exerciseWrapper .exercise .droppableContainer {background: #005BB7;}

#fo #ww4_printFilter .exerciseWrapper .exercise .droppableContainer div.hovered { background: #aaa; }
#fo #ww4_printFilter .exerciseWrapper .exercise .droppableContainer div { border-style: dashed; }

#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div { background: #666; }
#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer .ui-draggable p {
  color: #fff;
  text-shadow: 0 0 3px #000;
}

#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div.ui-draggable{ cursor: pointer; }
#fo .exerciseWrapper .exercise .draggableContainer div.ui-draggable-dragging {
  -moz-box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
  -webkit-box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
  box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
}

#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div.correct { background: #DAF28C; }
#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div.correct p {
  color: #000000;
  text-shadow: 0 0 0px;
}

#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div.uncorrect { background: #EF8B8B; }
#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div.uncorrect p {
  color: #FFF;
  text-shadow: 0 0 0px;
}

#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div.incorrect {
  background: #FFD4CC;
  color: #000000;
  text-shadow: 0 0 0px;
}

#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer span.help {font-size: 80%;}
#fo .green #ww4_printFilter .exerciseWrapper .exercise .draggableContainer span.help {color: #01ABC5;}
#fo .blue #ww4_printFilter .exerciseWrapper .exercise .draggableContainer span.help {color: #005BB7;}
/* OPT_SENTENCE_COMPLETION end */

#fo #quizzesList { padding-top: 10px; clear: both;position: absolute;
 }
#fo #quizzesList h2 { padding-top: 20px; }

/* controlla le innerlabel in mozilla */
*::-moz-placeholder {
  color: #000;
  font-weight: 300;
}

/* hidden text */
#fo .hiddentext {
  width: 100%;
  height: 100%;
}

#fo .hiddentext h1 {
  padding: 0px 0 20px 0;
  text-align: center;
}

#fo .monospace {
  font-family: "Courier New",Courier,"Lucida Sans Typewriter","Lucida Typewriter",monospace;
  /*font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;*/
  margin-left: 30px;
  margin-right: 30px;
  margin-bottom: 20px !important;
}

#fo .right { float: right; }
#fo .buttonhide {cursor: pointer;border-radius: 10px;padding: 8px;}
#fo .green .buttonhide {border: 1px solid #01ABC5;}
#fo .blue .buttonhide {border: 1px solid #003366;}

/* FIELDS */
#fo .userCell {
  width: 45%;
  display: table-cell;
  padding: 0 30px;
  position: relative;
  text-align: center;
  vertical-align: middle;
}

#fo .left { text-align: left; }

#fo .userMiddleCell {
  width: 10%;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

#fo .userMiddleCell span {
  background-image: url("/applications/webwork/site_ladingherdeina/media/arrowRight.png");
  background-repeat: no-repeat;
  display: inline-block;
  vertical-align: middle;
  height: 24px;
  width: 40px;
}

#fo .exerciseWrapper  textarea.userInput {
  /*height: 100px !important;*/
  min-height: 100px;
  border: 1px solid #8E8E8E;
  border-radius: 10px;
  font-size: 18px;
  padding: 10px 12px;
  width: 100%;
  -moz-box-sizing: border-box;
  background: none repeat scroll 0 0 #FFFFFF;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05) inset;
  color: #3C3C3C;
  display: block;
  vertical-align: top;
}

#fo .exerciseWrapper  input.userInput  {
  min-height: 25px;
  border: 1px solid #8E8E8E;
  border-radius: 2px;
  font-size: 14px;
  width: 100%;
  -moz-box-sizing: border-box;
  background: none repeat scroll 0 0 #FFFFFF;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05) inset;
  color: #3C3C3C;
  display: block;
}

#fo .green .exerciseWrapper textarea.userInput:focus, #fo .green input.userInput:focus { border: 2px solid #01ABC5; }
#fo .blue .exerciseWrapper textarea.userInput:focus, #fo .blue input.userInput:focus { border: 2px solid #003366; }

#fo #questionButtons {
  margin: 10px;
  float: right;
}

#fo .inlineExercise .button {
  border: medium none;
  border-radius: 10px;
  color: #FFF;
  cursor: pointer;
  font-size: 12px;
  font-weight: normal;
  letter-spacing: 1px;
  padding: 3px;
  float: right;
  margin: 7px 5px;
}
#fo .green .inlineExercise .button {background: none repeat scroll 0 0 #01ABC5;}
#fo .blue .inlineExercise .button {background: none repeat scroll 0 0 #003366;}

/* MULTIPLE CHOICE start */
#fo .multichoiceContainer { width: 100%; }
/*#fo .singlechoiceContainer { font-size: 80%; }*/

#fo .singlechoiceContainer {
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  width: 95%;
  padding: 5px 0 5px 0;
  border: 1px dotted #AAA;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

#fo .singlechoiceContainer .multiquestion {
  width: 50%;
  vertical-align: top;
  padding: 0 5px 0 10px;
  display: inline-block;
}

#fo .singlechoiceContainer .multianswer {
  width: 40%;
  padding-right: 10px;
  display: inline-block;
}

#fo .singlechoiceContainer .multianswer .singleanswer div {
  text-align: right;
  right: 0px;
}

#fo .singleanswer { font-style: italic; }
/* MULTIPLE CHOICE end */

/****************** TINY IMAGES **********************************************/
#fo .floatRight {
  float: right;
  margin:0px 0px 0px 10px;
  width: 200px;
  max-width: 200px;
}
#fo .floatLeft {
  float: left;
  margin:0px 10px 0px 0px;
  width: 200px;
  max-width: 200px;
}
#fo .centered {
  float: none;
  display: block;
  margin:10px auto;
  width: 460px;
  max-width: 460px;
}