section .dd-sort-elements li {
  display: block;
  touch-action: none;
}
section.the-test .test-controls .btn-hint,
section.the-test .test-controls .btn-solution,
section.the-test .test-controls .btn-repeat {
  border: 0;
}

section blockquote {
  display: inherit !important;
}

.homepage .module-header {
  min-height: inherit !important;
}

.homepage section.all-modules .col-5,
.dot-nav {
  height: inherit !important;
}

#search-results ul {
  list-style-type: none;
}

ul.ui-sortable {
  /*overflow: auto;*/
}

/* uz pretpostavku da ima max 10 grupa */
div.pill-sorting div.pill[data-dragged-group-value="0"],
div.pill-sorting div.pill[data-dragged-group-value="1"],
div.pill-sorting div.pill[data-dragged-group-value="2"],
div.pill-sorting div.pill[data-dragged-group-value="3"],
div.pill-sorting div.pill[data-dragged-group-value="4"],
div.pill-sorting div.pill[data-dragged-group-value="5"],
div.pill-sorting div.pill[data-dragged-group-value="6"],
div.pill-sorting div.pill[data-dragged-group-value="7"],
div.pill-sorting div.pill[data-dragged-group-value="8"],
div.pill-sorting div.pill[data-dragged-group-value="9"] {
  display: inline-block;
}

div.pill-sorting div.pill[data-dragged-group-value="-1"] {
  display: none;
  position: absolute;
}

div.pill-sorting div.pill[data-dragged-group-value="-1"]:first-child {
  display: inline-block;
  position: relative;
}

section.the-test .pill-sorting .pill {
  max-width: 225px;
}

.dos-sort-pills .pill-container {  
  position: relative;
}

.dos-answer-item.pill-container:first-child {
  text-align: left;
  margin-right: 19px;
}

/* overflow prevents D'n'D - override property from main_* CSS files until it is removed from there */
section.the-test .connect-pairs ul {
  overflow: visible;
}
.pair {
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

table.question-body.select-answer td {
  padding: 20px;
  display: inline-block;
  border: none;
}
.mathoverflow {
  display: block; /* this container is rendered as SPAN element to prevent browser from ejecting it from parent P, thus we have to make it a block this way */
  overflow: hidden;
  overflow-x: auto;
}

/** ----- These classes give space to mathml to render properly. Classes are removed from elements once math is rendered. */

/* in order to render properly, math requires rendered container (ie. NOT display:none), but also, to prevent FOUC, it's container should be hidden until rendering is done */
/* other loadingMath-* classes should be ported to this solution? */
.loadingMath-container, .loadingMath-collectionContainer,
		/* remove specialized classes (solution, result) after they are removed from HTML; container class should be applied to every math loading container */
		.loadingMath-solution, .loadingMath-result {
  display: block !important; /* force initial display to override possible display:none etc. */
  visibility: hidden;
  /* reduce vertical height to 0 */
  height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.loadingMath-questionHelp {
  visibility: hidden;

  position: absolute !important;
  right: 5000px !important;
  width: 99% !important;
}
.loadingMath-owl {
  visibility: hidden !important;
  display: block !important;
  position: absolute !important;
  top: -15000px !important;
}
.loadingMath-knowledgeAssesment {
  display: block !important;
}
.loadingMath-ZadaciGroup {
  visibility: visible !important;
  display: block !important;
  position: absolute !important;
  top: -25000px !important;
}

/* this class causes problems with formuals longer than 200px, and since it's applied to table cells
 * they will (probably) keep their width enough to render math
 * this is manipulated on the code (fe, be) so should be remove from them as well after this has been proved to work
.loadingMath-td{
	width: 200px!important;
	display: block!important;
}
*/
.loadingMath-WordDrag {
  width: 200px;
}

.custom-ordering-placeholder {
  visibility: hidden;
}

.question-help,
.question-result {
  /*font-size: 14px;*/
}

.question-help span[class^="mjx"],
.question-result span[class^="mjx"] {
  /*font-size: 100%!important;*/
}
.pair-draggable {
  /* Required to make elements draggable in old WebKit */
  -khtml-user-drag: element;
  -webkit-user-drag: element;
  cursor: move;
  /*touch-action none will ensure that the page is not scrolled while dragging*/
  touch-action: none;
}

.pair-static {
  cursor: default;
}

/* active draggable elemet */
.draggable.draggable-active,
.pair-draggable.draggable-active,
.draggable-restricted.draggable-active {
  z-index: 10009 !important; /* keep dragged elements above "world" */
}

/* Allow centered formulas in "paired" questions. */
.pair .mjx-full-width {
  text-align: center;
  display: inline-block !important;
  width: inherit;
}

/* Temporary override of prospekt's class that messes formulas with large fraction. */
section.the-test .pill-sorting .pill .mjx-chtml {
  line-height: 0px;
}

/* Memory game. */
.memory {
  margin: 0;
  padding: 0;
  border: solid 2px #ffd452;
  border-radius: 4px;
  margin-bottom: 30px;
  padding: 47px 50px;
}

.game-holder {
  width: 480px;
  max-height: 480px;
  margin: auto;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  perspective: 1000px;
}

.card-holder {
  width: 110px;
  height: 110px;
  margin: 5px;
  position: relative;
  transform-style: preserve-3d;
  transition: transform 0.5s;
  box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.3);
}

.card-holder.flip {
  transform: rotateY(180deg);
}

.cover,
.card {
  width: 100%;
  height: 100%;
  position: absolute;
}

.card {
  transform: rotateY(180deg);
  visibility: hidden;
}

.card.visible {
  visibility: visible;
}

.cover.hidden {
  visibility: hidden;
}

.memory-tooltip {
  text-align: center;
}

@media only screen and (max-width: 1080px) {
  .game-holder {
    width: 360px;
    max-height: 360px;
  }

  .card-holder {
    width: 80px;
    height: 80px;
  }
}

@media only screen and (max-width: 768px) {
  .game-holder {
    width: 320px;
    max-height: 320px;
  }
  .card-holder {
    width: 70px;
    height: 70px;
  }
}

@media only screen and (max-width: 480px) {
  .memory {
    padding: 0;
    padding-bottom: 4px;
  }
}

@media only screen and (max-width: 365px) {
  .game-holder {
    width: 275px;
    max-height: 275px;
  }
  .card-holder {
    width: 58px;
    height: 58px;
  }

  .memory {
    padding: 0;
    padding-bottom: 2px;
  }
}
/* Memory game end. */

div.dos-item-input,
div.dos-item-input__label,
div.inline-select,
div.inline-input {
  display: inline;
}

/* .dropzone-holder {
  position: relative;
} */

iframe {
  max-width: 100%;
}

.dos-col-main.dos-col-main-student {
  width: calc(100% - 100px);
  width: -webkit-calc(100% - 100px);
}

@media only screen and (max-width: 1024px) {
  .dos-col-main.dos-col-main-student {
    width: 100%;
  }
}

.dos-col-main-student .d-lg-block {
    display: block !important;
}

.sortableOrder {
  border: none;
}

.dos-col-wrapper a {
  word-wrap: break-word;
  word-break: break-word;
}

.dos-col-wrapper .dos-question-result,
.dos-col-wrapper .question-help {
  display: none;  
}

.dos-tasks-slide .question {
  border: none;
}

.slick-slide .dos-part-question__controls img {
  display: inline;
}

/** keyboard css START **/
.keyboard.open {
  border: solid 2px #ffd452;
  border-radius: 4px;
  margin-bottom: 30px;
}

.keyboard button.close_keyboard {
  font-size: 13px !important;
  background-color: #ffd452;
  border: solid 2px #ffd452;
}

.keyboard button {
  text-align: center;
  outline: none;
  box-shadow: none;
  color: #313131;
  font-size: 1rem;
  font-weight: 300;
  font-family: "MerriweatherSans", sans-serif;
  border: 1px solid #a5a5a5;
  border-radius: 4px;
  background: white;
}
/** keyboard css END **/

div[id^="checkbox-comment"] {
  min-height: 28px;
}

.length-tiny,
input[type="number"].length-tiny,
input[type="text"].length-tiny {
  max-width: 60px;
}

input[type="number"].length-tiny {
  max-width: 80px;
}

.length-small,
input[type="number"].length-small,
input[type="text"].length-small {
  max-width: 90px;
}

.length-medium,
input[type="number"].length-medium,
input[type="text"].length-medium {
  max-width: 130px;
}

.length-long,
input[type="number"].length-long,
input[type="text"].length-long {
  max-width: 170px;
}

.length-verylong,
input[type="number"].length-verylong,
input[type="text"].length-verylong {
  min-width: 220px;
}


div.dos-answer--incorrect,
div.answer-incorrect {
  background-image: url(../../img/common/error-2.svg);
  width: 18px;
  height: 18px;
  display: inline-block;
  background-repeat: no-repeat;
  background-size: 10px;
  background-position: center;
  border-radius: 50%;
  -webkit-transform: translateY(3px);
  -ms-transform: translateY(3px);
  transform: translateY(3px);
  margin-left: 6px;
  width: 20px !important;
  background-size: 15px 15px;
}

div.dos-answer--correct,
div.answer-correct,
div.feedback-image {
  background-image: url(../../img/common/correctly-2.svg);
  width: 18px;
  height: 18px;
  display: inline-block;
  background-repeat: no-repeat;
  background-size: 10px;
  background-position: center;
  border-radius: 50%;
  -webkit-transform: translateY(3px);
  -ms-transform: translateY(3px);
  transform: translateY(3px);
  margin-left: 6px;
  width: 20px !important;
  background-size: 15px 15px;
}


/** quiz added css */
.dos-option-checkbox input,
.dos-option-radio-view-2 input,
.dos-option-radio input {
	display: initial;
	z-index: -10; 
	position: absolute;
}

.dos-option-checkbox input:focus ~ label:after,
.dos-option-checkbox input:checked ~ label:after,
.dos-option-radio input:focus ~ label:after,
.dos-option-radio input:checked ~ label:after {
	opacity: 1;
}

.dos-option-checkbox input:not(:checked):not(:focus) ~ label:after,
.dos-option-radio input:not(:checked):not(:focus) ~ label:after {
	opacity: 0;
}

.dos-question-insert-field .dos-answer-wrapper {
  position: relative;
  display: block;
  overflow: visible;
}

[data-question-type="Povlačenje parova"] .table, [data-question-type="Uređivanje poretka elemenata"] .table {
  width: 100%;
}

div.question[data-question-type="Uparivanje odgovora"] small,
div.question[data-question-type="Upisivanje riječi"] small,
div.question[data-question-type="Upisivanje u elemente"] small,
div.question[data-question-type="Odabiranje riječi"] small,
div.question[data-question-type="Povlačenje riječi"] small,
div.question[data-question-type="Povlačenje parova"] small,
div.question[data-question-type="Razvrstavanje elemenata"] small,
div.question[data-question-type="Uređivanje poretka elemenata"] small,
div.question[data-question-type="Numerički"] small,
div.question[data-question-type="Povlačenje na sliku"] small,
div.question[data-question-type="REPL zadatak"] small {
  display:none;
}


.drag-drop.can-drop, .can-drop-style {
  background-color: #ffd452;
  border-color: #000000 !important;
}

.dos-dropzone-while-element-dragging-style {
  z-index: 1;
}

