.drag-drop-question { background: var(--primary-natural);}
.drag-drop-question__intro {color: #808080;}
.drag-drop-question__drop-zones { min-height: 22.5rem; padding: 2.4rem; border-radius: 2rem; border: 1px solid #00090B; background: #E4E5FE;}
.drop-zone__placeholder { height: 11rem; border-radius: 2rem; background: var(--primary-natural);}
.drag-drop-question .draggable-item { border-radius: 2rem; border: 1px solid #011013; background: var(--secondary-light-purple); padding: 3.8rem 2.4rem 3.8rem 6.4rem; line-height: 2.8rem; cursor: grab; clip-path: inset( 0 round 2rem);}
.drag-drop-question .draggable-item:active { cursor: grabbing; overflow: hidden;}
.drag-drop-question .draggable-item:before { width: 2.6rem; height: 2.6rem; position: absolute; content: ""; border-radius: 50%; border: 1px solid var(--primary-carbon); top: 0; bottom: 0; margin: auto; left: 2.4rem;}
.drag-drop-question .draggable-item.correct-answer {background: var(--secondary-dark-mint); /* transition: 0.5s all ease;*/ transition: background-color 0.5s ease;}
.drag-drop-question .draggable-item.incorrect-answer {/*transition: 0.5s all ease;*/ transition: background-color 0.5s ease;}
.drag-drop-question .draggable-item.correct-answer:before { background: #333 url(/~/media/Images/D/drinkiq-v2/Universal/quiz/new-drinkiq-quiz/icon-correct) no-repeat center / 2rem; transition: 0.4s opacity ease-in-out;}
.drag-drop-question .draggable-item.incorrect-answer:before { background: #333 url(/~/media/Images/D/drinkiq-v2/Universal/quiz/new-drinkiq-quiz/icon-close) no-repeat center / 1.4rem; transition: 0.4s opacity ease-in-out;}
.drag-drop-question__drop-zones:has(.incorrect-answer) {/*transition: 0.5s all ease*/ transition: background-color 0.5s ease;}
.drag-drop-question__drop-zones:has(.correct-answer) {background: var(--secondary-light-mint); /*transition: 0.5s all ease*/ transition: background-color 0.5s ease;}
.drag-drop-question .draggable-item * { pointer-events: none;}
.drag-drop-question .draggable-item.dragging {visibility: hidden; overflow: hidden; z-index: 1000; pointer-events: none; transition: none !important;}
.drop-zone__placeholder.drag-over { border: 1px solid #000;}
.drop-zone__placeholder * { pointer-events: none;}
.drag-drop-question .draggable-item { position: relative; z-index: 1; pointer-events: auto;}
.drag-drop-question .drinkiq-quiz-questions__incorrect-panel, .drag-drop-question .drinkiq-quiz-questions__correct-panel {
  min-height: 20rem;
  transform: translateY(100%);
  transition: transform 1s ease;
  pointer-events: none;
}
.drag-drop-question .drinkiq-quiz-questions__incorrect-panel.visible,
.drag-drop-question .drinkiq-quiz-questions__correct-panel.visible {
    display: flex !important;
    transform: translateY(0);
    animation: none;
    pointer-events: auto;
}
.draggable-text {overflow-wrap: break-word; hyphens: auto;}
/*.safari-browser .drag-drop-question .draggable-item {
clip-path: none !important;
-webkit-border-radius: 2rem;
  border-radius: 2rem;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  will-change: opacity;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.safari-browser .drag-drop-question .draggable-item.dragging {
  opacity: 0 !important;
  transition: none !important;
}
.safari-browser .drag-drop-question .draggable-item:not(.dragging) {
  -webkit-transition: opacity 0s 0s !important;
  transition: opacity 0s 0s !important;
}
.drag-drop-question:not([data-q]) {
    pointer-events: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}*/

@media only screen and (max-width:1199.98px){
.drag-drop-question__draggable-items {margin: 0px 0.8rem; row-gap: 2rem;}
}

/*@media (min-width:992px) and (max-width:1199.98px){
.drag-drop-question__draggable-items.three-draggable-items {margin: 0 3.2rem;}
}*/

@media only screen and (max-width:767.98px){
.drag-drop-question__drop-zones { padding: 1.6rem 0.8rem; min-height: 16rem;}
.drop-zone__placeholder { height: 5.6rem; border-radius: 1.2rem;}
.drag-drop-question .draggable-item:before { width: 2.1rem; height: 2.1rem; left: 1.2rem; }
.drag-drop-question .draggable-item { padding: 1.8rem 1.2rem 1.8rem 4.1rem; border-radius: 1.2rem; font-size: 1.4rem; line-height: 2.1rem; clip-path: inset( 0 round 1.2rem);}
.drag-drop-question__draggable-items {row-gap: 2rem; margin: 0px 1.5rem;}
.drag-drop-question__draggable-items.three-draggable-items { margin: 0px 1.2rem; }
.drag-drop-question .draggable-item.correct-answer:before { background: #333 url(/~/media/Images/D/drinkiq-v2/Universal/quiz/new-drinkiq-quiz/icon-correct) no-repeat center / 17px;}
.drag-drop-question .draggable-item.incorrect-answer:before { background: #333 url(/~/media/Images/D/drinkiq-v2/Universal/quiz/new-drinkiq-quiz/icon-close) no-repeat center / 11px;}
.drag-drop-question__title {font-size: 2.4rem; line-height: 2.8rem;}
.drag-drop-question__drop-zones-text { overflow-wrap: break-word; hyphens: auto;}
}