/****************************/
/*       EXAM GENERAL       */
/****************************/
@media only screen and (min-width: 700px){
    .nav-wrap #endExam, .nav-wrap #endInterview{
        display: none;
    }
}


.nav-wrap #endExam svg, .nav-wrap #endInterview svg{
    width: 9px;
    height: 9px;
    margin-left: 5px;
    border-radius: 6px;
    margin-bottom: -2px;
    padding: 1px;
}

section.exam .ci_buttonExam{
    width: 100%;
    height: 50px;
    font-size: 14px;
    font-weight: bold;
    margin-top: 15px;
}

section.exam .prevAndNext{
    display: flex;
}

section.exam .ci_buttonExam.previous{
    margin-right: 15px;
}

section.exam .originalP{
    margin: 10px 0;
}

.questionImageZoom {
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99994;
    background-color: rgba(100, 100, 100, 0.5);
    align-items: center;
    justify-content: center;
}

.questionToolTip {
    max-width: 250px;
    z-index: 9999;
    border: 1px solid;
    padding: 10px;
}

.questionImageZoom .centerContainer{
    width: 100%;
    position: relative;
}

.questionImageZoom .centerContainer .closeButton {
    padding: 5px;
    background-color: white;
    border-radius: 25px;
    position: absolute !important;
    top: 10px;
    right: 10px;
    cursor: pointer;
    z-index: 1;
}

@media (min-width: 700px){
    .questionImageZoom .centerContainer{
        width: 60%;
    }
}

@media (max-width: 400px) {
    section.exam .prevAndNext{
        flex-direction: column;
    }
}


.questionImageZoom .centerContainer .closeButton .st11{
    fill: black;
}

.examWrapper{
  width: 100vw;
  max-width: 1500px;
}

.fixedWidth  .examWrapper{
  width: 100%;
}

.question-preview-holder {
    padding: 40px 30px;
}

.examQuestions  .radio, .examAnswer .radio {
    display: table-cell;
    vertical-align: top;
}

.examQuestions .iradio_amTemplate.hover svg,
.examAnswer .iradio_amTemplate.hover svg,
.examAnswer .icheckbox_amTemplate.hover svg,
.examQuestions .icheckbox_amTemplate.hover svg {
    visibility: visible;
}

.examQuestions .iradio_amTemplate.hover:not(.checked) svg circle,
.examAnswer .iradio_amTemplate.hover:not(.checked) svg circle,
.examAnswer .icheckbox_amTemplate.hover:not(.checked) svg path#check,
.examQuestions .icheckbox_amTemplate.hover:not(.checked) svg path#check {
    fill: #FFF !important;
}

.examQuestions .iradio_amTemplate.checked svg,
.examAnswer .iradio_amTemplate.checked svg,
.examAnswer .icheckbox_amTemplate.checked svg,
.examQuestions .icheckbox_amTemplate.checked svg {
    visibility: visible;
}
.examQuestions .iradio_amTemplate svg,
.examAnswer .iradio_amTemplate svg,
.examAnswer .icheckbox_amTemplate svg,
.examQuestions .icheckbox_amTemplate svg {
    visibility: hidden;
    display: block;
}

.noShow {
    display: none !important;
}

.imageBlockContainer {
    display: block;
}

.imageInnerRatio {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.image {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.image img{
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
}

.examQuestions .image img, .examAnswer .image img {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    position: relative;
    object-fit: contain;
    object-position: center;
}

@media (min-width: 576px){
    section.exam .ci_buttonExam{
        max-width: 250px;
    }
}

/****************************/
/*         FEEDBACK         */
/****************************/
.feedbackContainer *, .examAnswer *, section.exam *, .exam-main-holder *, .examQuestions * {
    line-height: 1.5;
}


.answerFeedback input.ci_buttonExam{
    font-size: 14px;
}

.answerFeedback input.ci_buttonExam{
    font-weight: bold;
}

form[name="StudentCourseForm"] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.answerFeedback {
    padding: 60px 40px;
}

.answerFeedback .feedbackContainer{
    padding: 40px 30px;
    margin-bottom: 30px;
    display: flex;
    justify-content: space-between;
}

.answerFeedback .feedbackContainer .answer .icon {
    border: 2px solid;
    border-radius: 100%;
}

.answerFeedback .feedbackContainer .answer p{
    margin: 0;
}

.answerFeedback .feedbackContainer .answer{
    font-size: 22px;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.answerFeedback .feedbackContainer .answer .logo{
    float: left;
    margin-right: 40px;
}

[dir="rtl"] .answerFeedback .feedbackContainer .answer .logo{
    float: right;
    margin-left: 40px;
    margin-right: unset;
}

.answerFeedback .feedbackContainer .feedback{
    width: 50%;
}

.ci_buttonExam.feedback {
    height: 50px;
    width: 250px;
    margin-top: 15px;
}

.tableHeaderOptionsRight.interview .btnGlobalGrey{
    padding: 2px 15px 4px 15px !important;
}

@media (max-width: 1024px) {
    .answerFeedback {
        padding: 40px 30px;
    }

    .answerFeedback .feedbackContainer{
        margin-bottom: 30px;
    }
}

@media (max-width: 600px) {
    .answerFeedback {
        padding: 30px 10px;
    }

    .answerFeedback .feedbackContainer{
        padding: 30px 10px;
        flex-direction: column;
    }

    .answerFeedback .feedbackContainer .answer{
        width: 100%;
        margin-bottom: 20px;
    }

    .answerFeedback .feedbackContainer .feedback{
        width: 100%;
    }

    .ci_buttonExam.feedback {
        width: auto;
        height: 50px;
    }
}

/****************************/
/*         EXAM HOME        */
/****************************/


.exam-overview-area {
    display: inline-flex;
    width: 100%;
}

.exam-overview-area p {
    margin: 0;
}

.exam-info-holder, .exam-main-holder {
    width: 50%;
}

.exam-info-holder {
    padding: 25px;
    box-sizing: border-box;
}

.exam-info-holder .exam-buttons{
    display: none;
}

.exam-information-area, .interview-information-area {
    display: flex;
    flex-wrap: wrap;
}

.exam-information-area .halfInfo{
    width: 50%;
    display: flex;
}

.interview-information-area .halfInfo{
    width: 50%;
    display: flex;
}

.exam-main-area {
    padding: 25px 50px 25px 25px;
    box-sizing: border-box;
}

[dir="rtl"] .exam-main-area {
    padding: 25px 25px 25px 50px;
}

.exam-information-box {
    flex: 1 0 45%;
    margin: 5px;
    box-sizing: border-box;
    padding: 18px;
}

.exam-information-box .value svg {
    height: 51px;
}

.exam-information-box .infinite.noShow,
div.noShow, span.noShow{
    display: none;
}

.start-exam-btn {
    width: 100%;
    border: 0;
    height: 60px;
    margin-top: 45px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
}

.start-exam-btn *{
    font-size: 14px;
}

.start-exam-btn.disabled {
    cursor: default;
}

.start-exam-btn .btn-center {
    display: inline-flex;
    justify-content: space-around;
}

.start-exam-btn .inlinetext_font_and_size {
    margin-left: 20px;
}

.exam-main-area .small {
     margin-top: 20px;
}

.exam-main-area .desc {
    margin-top: 30px;
}

.exam-status-box {
    margin: 5px;
    height: 100px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
}

.exam-status-box .text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 10%;
    width: fit-content;
}

[dir="rtl"] .exam-status-box .text {
    padding-left: unset;
    padding-right: 10%;
}

.exam-status-box .text .value {
    white-space: nowrap;
}

svg.exam-opacity {
    opacity: 0.6;
}

.naviBoxTc {
    border: 0 !important;
}

.icon {
    display: inline-flex;
    align-items: center;
}

.exam-header-image {
    overflow: hidden;
}

.exam-header-image.noHeader{
    display: none;
}

.exam-header-image img {
    width: 100%;
}

.exam-header-image .imageBlockContainer {
    display: block;
}

.exam-header-image .imageOuterRatio {
    position: relative;
    padding-top: calc(100% / 970 * 240);
}

.exam-header-image .imageInnerRatio {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.exam-header-image .image {
    width: 100%;
    height: 100%;
}

.exam-header-image .imagePlaceholderDiv {
    background: url('/academymaker/images/imagePlaceholder.jpg');
    background-position-x: 50%;
    background-position-y: 50%;
    z-index: 98;
    height: 100%;
    min-height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.exam-information-area .exam-information-box p.value,
.exam-information-area .exam-status-box p.value {
    font-size: 30px !important;
}

/*IE 11 Flex fix*/
@media all and (-ms-high-contrast:none){
    *::-ms-backdrop, .ie-11-flex-fix { display: flex; }
    *::-ms-backdrop, .ie-11-flex-fix > div { flex: 1; }
}

@media only screen and (max-width: 700px) {
    .exam-info-holder .headline {
        font-size: 11px;
    }

    .exam-info-holder .exam-overview-area p {
        font-size: 25px;
    }
}

@media (max-width: 600px) {

    .exam-overview-area {
        flex-direction: column;
    }

    .exam-info-holder {
        order: 1;
        padding: 10px;
    }

    .exam-info-holder, .exam-main-holder {
        width: 100%;
    }

    .exam-main-area .exam-buttons {
        display: none;
    }

    .exam-main-area {
        padding: 25px;
    }

    .exam-info-holder .exam-buttons {
        display: block;
    }

    .exam-information-area .exam-information-box {
        flex-direction: row;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px;
    }

    .exam-information-area .exam-information-box .headline {
        width: 50px;
    }

    .exam-info-holder .exam-status-box {
        align-items: center;
        height: 65px;
    }

    .exam-info-holder .exam-status-box .icon {
        width: 20px;
    }

    .exam-info-holder .exam-status-box .text {
        flex-direction: row;
        align-items: center;
        padding-left: 5%;
    }

    .exam-info-holder .exam-status-box .text .headline {
        margin-right: 30px;
    }
}
@media (max-width: 400px) {
    .exam-information-area .exam-information-box {
        flex-direction: column;
    }

    .exam-information-area .exam-information-box .headline {
        width: auto;
    }
}

/****************************/
/*        EXAM HEADER       */
/****************************/
#tcContentContainer{
    display: flex;
    flex-direction: column;
}

.examProgressHeader {
    height: 60px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    padding: 0 25px;
    border-bottom: 2px solid;
    width: 100%;
    box-sizing: border-box;
}

.examProgressHeader .remainingTime {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.examProgressHeader .remainingTime .description {
    margin-right: 20px;
}

.examProgressHeader .remainingTime div {
    display: flex;
    align-items: center;
}

.examProgressHeader .remainingTime .headline_font_and_size {
    font-size: 20px;
}

.bold-font {
    font-weight: bold;
}

.examProgressHeader .progress {
    display: flex;
    width: 60%;
    justify-content: flex-end;
}

.examProgressHeader .progress .exam-progressbar-text {
    width: 10%;
    min-width: 70px;
    white-space: nowrap;
}

.examProgressHeader .exam-progressbar{
    display: flex;
    align-items: center;
    width: 90%;
    margin-left: 25px;
    height: 10px;
}

.examProgressHeader .exam-progressbar .complete{
    height: 100%;
    border-radius: 3px;
}

@media (max-width: 600px) {
    .examProgressHeader {
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        height: 80px;
    }

    .examProgressHeader .remainingTime {
        width: 100%;
    }

    .examProgressHeader .remainingTime .ci_extended_exam_box_normal_text{
        width: 100%;
        display: flex;
        justify-content: space-between;
    }

    .examProgressHeader .progress{
        width: 100% !important;
        justify-content: space-between;
        margin-top: 10px;
    }

    .examProgressHeader .progress .exam-progressbar{
        width: 60%;
    }
}


/****************************/
/*    QUESTION CONTAINER    */
/****************************/

section.exam {
    margin: 40px 60px;
    display: flex;
    flex-direction: column;
}

@media (max-width: 1024px) {
    section.exam {
        margin: 30px;
    }
}

@media (max-width: 600px) {
    section.exam {
        margin: 30px 15px;
    }
}

/****************************/
/*  GENERAL QUESTIONS CSS   */
/****************************/

.imageBlockContainer{
    display: block;
}

.questionImage, .examAnswer .questionImage {
    width: 100%;
    padding-right: 20px;
    box-sizing: border-box;
}

[dir="rtl"] .questionImage, [dir="rtl"] .examAnswer .questionImage {
    padding-right: unset;
    padding-left: 20px;
}

.questionAndImage .imageBlockContainer .imageOuterRatio {
    position: relative;
    padding-top: calc(100% /  375 * 249);
}

.imageBlockContainer .imageOuterRatio .imageInnerRatio {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.questionImage .imageBlockContainer .imageOuterRatio .imageInnerRatio .image {
    display: flex;
    justify-content: center;
}

.examQuestions .textHolder{
    position: relative;
}

.examQuestions .textHolder .showMore{
    position: absolute;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 20px;
    font-weight: bold;
}

.examAnswer .textHolder{
    position: relative;
}

.examAnswer .textHolder .showMore{
    position: absolute;
    background-color: #D0E0ED;
    right: 0;
    width: 30px;
    height: 20px;
    font-weight: bold;
}

/*Desktop Container*/
.examQuestionDesktop{
    display: none;
    margin-top: 15px;
}

/*Mobile Container*/
.examQuestionMobile{
    display: block;
    margin-top: 15px;
}

.examQuestionMobile .element-holder:not(:first-child) {
    margin-top: 25px;
}

.gu-mirror {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dadada;
    background: white;
    overflow: hidden;
    text-align: center;
}

.textItem.gu-mirror{
    display: block;
}

.itemPlaceholder .itemElementContainer{
    display: flex;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-items: center;
    background-color: #eeeeee;
}

@media (min-width: 576px){
    /*Desktop Container*/
    .examQuestionDesktop{
        display: block;
    }

    /*Mobile Container*/
    .examQuestionMobile{
        display: none;
    }
}

/****************************/
/*       SINGLE-CHOICE      */
/****************************/

.examSingleMultipleChoice .questionAndImage {
    display: flex;
    flex-direction: row;
    margin-top: 15px;
}

.examSingleMultipleChoice .questionAndImage .questionImage {
    width: 75%;
}

.examSingleMultipleChoice .answers {
    justify-content: flex-start;
    display: flex;
    flex-direction: row;
    width: 100%;
    flex-wrap: wrap;
}

.examSingleMultipleChoice .answers.noQuestionImage {
    flex-direction: row;
}

.examSingleMultipleChoice .answers {
    flex-direction: column;
}

.examSingleMultipleChoice .answers .answerBox {
    padding: 13px 15px 13px 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    box-sizing: border-box;
    margin-right: 10px;
}

.examSingleMultipleChoice .answers.noQuestionImage .answerBox {
    width: 32%;
}

.examSingleMultipleChoice .answers .answerBox {
    width: 100%;
}

.examSingleMultipleChoice .answers.onlyTwo.noQuestionImage .answerBox {
    width: 49%;
}

.examSingleMultipleChoice .answers.onlyTwo .answerBox {
    width: 100%;
}

.examSingleMultipleChoice .answers.hasImage.noQuestionImage .answerBox{
    width: 49%;
}

.examSingleMultipleChoice .answers.hasImage .answerBox {
    width: 100%;
}

.examSingleMultipleChoice .answers .answerBox.hasImage .radio {
    display: none;
}

.examSingleMultipleChoice .imageOuterRatio {
    width: 100%;
    position: relative;
    padding-top: calc(100% * 105 / 160);
}

.examSingleMultipleChoice .answerBox .text.answer {
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1024px) {
    .examSingleMultipleChoice .answers:not(.hasImage) {
        flex-direction: column !important;
    }

    .examSingleMultipleChoice .answers .answerBox {
        width: auto;
        max-width: 100%;
        box-sizing: border-box;
    }
}

@media (max-width: 1118px) {
    .examSingleMultipleChoice .answers.hasImage.noQuestionImage .answerBox,
    .examSingleMultipleChoice .answers.onlyTwo.noQuestionImage .answerBox,
    .examSingleMultipleChoice .answers.noQuestionImage .answerBox,
    .examSingleMultipleChoice .answers.onlyTwo .answerBox,
    .examSingleMultipleChoice .answers .answerBox{
        width: 100%;
    }
}

@media (max-width: 450px) {
    .examSingleMultipleChoice .answerBox.hasImage  {
        flex-direction: column;
    }

    .examSingleMultipleChoice .answerBox.hasImage .answerImage {
        min-width: 100%;
        margin-bottom: 15px;
        overflow: hidden;
    }

}
@media (max-width: 700px) {
    .examSingleMultipleChoice .answers.hasImage.noQuestionImage .answerBox{
        width: 100%;
    }

    .examSingleMultipleChoice .questionAndImage .questionImage {
        padding-right: 0;
        padding-bottom: 20px;
        width: 100%;
    }

    .examSingleMultipleChoice .questionAndImage {
        flex-direction: column;
    }
}

@media (min-width: 450px) {
    .examSingleMultipleChoice .answers .answerBox.hasImage .answerImage{
        min-width: 160px;
        min-height: 105px;
        width: 160px;
        height: 105px;
        position: relative;
        margin-right: 45px;
        justify-content: center;
    }
}

/****************************/
/*         GAP-TEXT         */
/****************************/

.examGapText .gap-text-container{
    width: 100%;
    box-sizing: border-box;
    padding: 25px;
    margin: 15px 0 10px 0;
    font-size: 16px;
    line-height: 45px;
}

.examGapText .gap-text-container p{
    line-height: 45px;
}

.examGapText .gap-text-select {
    width: auto;
}

.examGapText .gap-text-select {
    font-family: icomoon!important;
    position: relative;
    display: inline-block;
    margin: 5px;
}

.examMappingPairs .itemPool .textItem:hover {
    cursor: pointer;
    transform: scale(1.15);
    height: auto;
    z-index: 999999 !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.examMappingPairs .itemPool .textItem:hover .showMore {
    display: none !important;
}

.examGapText .gap-text-select select, .mappingPairs-text-select select {
    background-color: #fff;
    color: #000;
    padding: 5px;
    width: 100%;
    border: 1px solid #325B7F;
    font-size: 15px;
    -webkit-appearance: button;
    appearance: button;
    outline: none;
    height: 30px;
    opacity: unset;
}

.examGapText .gap-text-select select {
    padding-right: 20px;
}

.examGapText .gap-text-input {
    border: none !important;
    padding: 3px;
}

.examGapText .gap-text-input:focus {
    outline-width: 0;
}

.examGapText .gap-text-input.disabled {
    background-color: white;
}

.examGapText .gap-text-select::before, .mappingPairs-text-select::before {
    content: "\E900";
    font-size: 14px;
    position: absolute;
    line-height: 1.5;
    top: 0;
    right: 0;
    width: 30px;
    height: 100%;
    text-align: center;
    padding-top: 6px;
    box-sizing: border-box;
    background-color: #325B7F;
    pointer-events: none;
}

.examGapText .gap-text-select select option, .mappingPairs-text-select select option {
    padding: 30px;
}

.examGapText .gap-text-select select option, .mappingPairs-text-select select option {
    background: #fff;
    color: #000;
    box-shadow: inset 20px 20px #fff;
}

.examGapText .gap-text-select select option:hover, .mappingPairs-text-select select option:hover {
    color: #000;
    box-shadow: inset 20px 20px #325B7F;
}

.examGapText .questionAndImage .questionImage {
    width: 75%;
}

.examGapText .questionAndImage {
    display: flex;
    flex-direction: row;
}

@media (max-width: 700px) {
    .examGapText .answers.hasImage.noQuestionImage .answerBox{
        width: 100%;
    }

    .examGapText .questionAndImage .questionImage {
        padding-right: 0;
        padding-bottom: 20px;
    }

    .examGapText .questionAndImage .questionImage {
        width: 100%;
    }

    .examGapText .questionAndImage {
        flex-direction: column;
    }
}

/****************************/
/*       Free question      */
/****************************/

.examFreeQuestion .free-question-container {
    margin-top: 15px;
}

.examFreeQuestion .free-question-container textarea {
    padding: 10px;
    box-sizing: border-box;
    max-width: 100%;
    min-width: 100%;
    max-height: 460px;
    min-height: 220px;
    margin-bottom: 15px;
}

.examFreeQuestion .free-question-container{
    width: 100%;
    box-sizing: border-box;
    margin: 15px 0 10px 0;
    font-size: 16px;
    line-height: 45px;
}

.examFreeQuestion .free-question-container textarea {
    border: 0;
    padding: 15px;
}

.examFreeQuestion .questionAndImage .questionImage {
    width: 75%;
}

.examFreeQuestion .questionAndImage {
    display: flex;
    flex-direction: row;
}

.examFreeQuestion .questionAndImage .noQuestionImage {
    width: 100%;
}

@media (max-width: 700px) {
    .examFreeQuestion .questionAndImage .questionImage {
        padding-right: 0;
        padding-bottom: 20px;
    }

    .examFreeQuestion .questionAndImage .questionImage {
        width: 100%;
    }

    .examFreeQuestion .questionAndImage {
        flex-direction: column;
    }
}
/****************************/
/*           ORDER          */
/****************************/

.examSequenceQuestion .questionViewContainer.correct-answer,
.examSequenceQuestion .questionViewContainer.correct-answer .sequenceContainer {
    width: 100%;
}

.examSequenceQuestion .questionViewContainer.correct-answer .sequenceContainer.qestionType-orderText {
    width: 100%;
    justify-content: center;
    display: flex;
}

.examSequenceQuestion .sequenceContainer {
    display: flex;
    margin-top: 5px;
}

.examSequenceQuestion .sequenceContainer ul{
    width: 50%;
    padding-left: 0;
}

.examSequenceQuestion .sequenceContainer .targetItemPlaceholder {
    margin-bottom: 10px;
    display: flex;
    height: 50px;
}

.examSequenceQuestion .sequenceContainer .targetItemPlaceholder:hover {
    height: auto;
    min-height: 50px;
}

.examSequenceQuestion .sequenceContainer .targetItemPlaceholder .itemNumber {
    font-size: 15px;
    font-weight: bold;
    width: 25px;
    justify-content: center;
    display: flex;
    align-items: center;
    background: rgba(0, 0, 0, 0.2);
}

.examSequenceQuestion .sequenceContainer .targetItemPlaceholder .textContainer {
    width: 100%;
    overflow: hidden;
    text-align: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.examSequenceQuestion .sequenceContainer .targetItemPlaceholder .textContainer:hover .showMore {
    display: none !important;
}


.examSequenceQuestion .sequenceContainer .itemPlaceholder {
    width: 100%;
    height: 50px;
    overflow: hidden;
}

.examSequenceQuestion .sequenceContainer .itemPlaceholder {
    border: 1px solid #eeeeee;
    margin-bottom: 10px;
}

.examSequenceQuestion .questionType-orderImageText .imageOuterRatio ,
.examSequenceQuestion .questionType-orderImage .imageOuterRatio {
    position: relative;
    padding-top: calc(100% / 150 * 100);
}

.examSequenceQuestion .questionType-orderImageText .image{
    display: flex;
    flex-direction: column;
    justify-content: center;
}


.examSequenceQuestion .questionType-orderImage ul ,
.examSequenceQuestion .questionType-orderImageText ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.examSequenceQuestion .questionType-orderImage .targetItemPlaceholder ,
.examSequenceQuestion .questionType-orderImageText .targetItemPlaceholder {
    width: 45%;
    height: auto;
}

.examSequenceQuestion .questionType-orderImage .answerContent ,
.examSequenceQuestion .questionType-orderImageText .answerContent {
    width: 100%;
}
.examSequenceQuestion .questionType-orderImage .textContainer ,
.examSequenceQuestion .questionType-orderImageText .textContainer {
    padding: 10px 0;
}

@media (max-width: 600px) {
    .examSequenceQuestion .sequenceContainer ul  {
        width: 85%;
    }
}

@media (max-width: 450px) {
    .examSequenceQuestion .questionType-orderImage .targetItemPlaceholder,
    .examSequenceQuestion .questionType-orderImageText .targetItemPlaceholder{
        width: 90%;
    }

    .examSequenceQuestion .sequenceContainer ul{
        padding: 0;
        width: 100%;
    }
}


/****************************/
/*       Mapping Pairs      */
/****************************/

/*GENERAL*/
.examMappingPairs .questionAndAnswerContainer {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
    margin-bottom: 50px;
    margin-top: 15px;
}

.examMappingPairs .questionAndAnswerContainer .itemPool,
.examMappingPairs .questionAndAnswerContainer .questionViewContainer {
    margin: initial;
    position: relative;
}

.examMappingPairs .questionViewContainer.answerView {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.examMappingPairs .questionAndAnswerContainer .itemPool{
    width: 40%;
}

.examMappingPairs .questionAndAnswerContainer .questionViewContainer {
    width: 60%;
}

.examMappingPairs .questionAndAnswerContainer .questionViewContainer {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.examMappingPairs .textItem {
    border: 1px solid;
    display: block;
    box-sizing: border-box;
    text-align: center;
    overflow: hidden;
    cursor: pointer;
}

.examMappingPairs .textHolder {
    display: flex;
    flex-direction: column;
    height: -webkit-fill-available;
    justify-content: center;
}

.examMappingPairs .questionViewContainer .textContainer  {
    background-color: white;
    border: 1px solid #dadada;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.examMappingPairs .questionViewContainer .secondItem{
    border: 1px solid;
}

.examMappingPairs .questionViewContainer .itemContent   {
    margin-right: 10px;
    margin-bottom: 10px;
    width: 31%;
}

.examMappingPairs .itemPool .textItem{
    position: absolute;
}

.mappingPairs-text-select {
    width: 200px;
}

.mappingPairs-text-select {
    font-family: icomoon!important;
    position: relative;
    display: inline-block;
    margin: 5px;
}

/*TEXT TO TEXT*/
.examMappingPairs.textToText .questionViewContainer .secondItem,
.examMappingPairs.textToText .textItem {
    width: 100%;
    height: 40px;
}

.examMappingPairs.textToText .questionViewContainer .secondItem,
.examMappingPairs.textToText .textItem:hover {
    width: 100%;
    height: auto;
    min-height: 40px;
}

.examMappingPairs.textToText .textItem:hover .showMore {
    display: none !important;
}

.examMappingPairs.textToText .itemPool .textItem {
    width: 46%;
}

.examMappingPairs.textToText .questionViewContainer .textContainer {
    width: 100%;
    min-height: 40px;
    box-sizing: border-box;
    text-align: center;
}

.examMappingPairs.textToText .questionViewContainer .textContainer *{
    text-align: center;
}

/*TEXT TO IMAGE*/
.examMappingPairs.textToImage .questionViewContainer .secondItem,
.examMappingPairs.textToImage .textItem {
    width: 100%;
    height: 40px;
}

.examMappingPairs.textToImage .questionViewContainer .secondItem:hover,
.examMappingPairs.textToImage .textItem:hover {
    width: 100%;
    min-height: 40px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.examMappingPairs.textToImage .itemPool .textItem {
    width: 46%;
    height: 40px;
}

.examMappingPairs.textToImage .itemPool .textItem:hover {
    width: 46%;
    min-height: 40px;
    height: auto;
}

.examMappingPairs.textToImage .textItem:hover .showMore {
    display: none !important;
}

.examMappingPairs.textToImage .imageOuterRatio {
    position: relative;
    padding-top: calc(100% / 300 * 150);
}

.examMappingPairs.textToImage .image{
    flex-direction: column;
    justify-content: center;
}

.examMappingPairs .ci_buttonExam {
    display: none;
}

.examMappingPairs .mappingPairs-text-select {
    font-family: icomoon!important;
}

.examMappingPairs .mappingPairs-text-select::before{
    border-bottom: 1px solid;
    border-right: 1px solid;
    border-top: 1px solid;
    padding-top: 6px;
    content: "\E900";
}

@media (max-width: 774px) {
    .examMappingPairs.textToText .itemPool .textItem,
    .examMappingPairs.textToImage .itemPool .textItem{
        width: 66%;
    }

    .examMappingPairs .questionViewContainer .itemContent{
        width: 45%;
    }
}

@media (max-width: 576px) {
    .questionViewContainer {
        width: 100%;
    }

    .examMappingPairs .questionViewContainer .itemContent {
        width: 100%;
        padding-bottom: 20px;
        box-sizing: border-box;
    }

    .mappingPairs-text-select {
        margin: 5px 0;
        width: 100%;
    }

    .examMappingPairs.examQuestionMobile .imageContainer{
        border: 1px solid;
        padding: 10px;
    }

    .examMappingPairs .ci_buttonExam {
        font-size: 12px;
        padding: 0;
        margin-bottom: 10px;
        display: inline-block;
        height: 40px;
        width: 100%;
        margin-bottom: 20px;
    }
}

/****************************/
/*      Mapping Groups      */
/****************************/

.examMappingGroups .questionAndAnswerContainer {
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-top: 15px;
}

.examMappingGroups .itemPool {
    width: 34%;
    min-height: 200px;
    order: 0;
    position: relative;
}

.examMappingGroups .itemPool .itemElementContainer {
    width: 60%;
}

.examMappingGroups .groupContainer {
    margin-bottom: 20px;
    border: 4px solid #eeeeee ;
    position: relative;
}

.examMappingGroups .questionAndAnswerContainer .itemElementContainer {
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 5px;
    height: 40px;
    display: block;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    overflow: hidden;
}

.examMappingGroups .questionAndAnswerContainer .groupContainer .itemElementContainer {
    box-sizing: border-box;
    width: 85%;
    margin: 5px;
    position: relative;
    top: auto !important;
    left: auto !important;
}

.examMappingGroups .groupHeader {
    text-align: center;
    padding: 15px 0;
    font-weight: bold;
    border-bottom: none;
}

.examMappingGroups .groupItemsWrapper {
    box-sizing: border-box;
}


.examMappingGroups .mobileTextAnswer {
    width: 100%;
    text-align: center;
    padding: 10px;
    box-sizing: border-box;
}

.examMappingGroups .mobileTextAnswer img{
    width: 100%;
}

.examMappingGroups .mobileGroupSelection {
    width: 100%;
    text-align: center;
    padding: 15px 0;
    margin: 5px 0;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
}

.examMappingGroups .mobileGroupSelection img{
    width: 100%;
}

.examMappingGroups .mobileGroupSelection .answer-checked {
    position: absolute;
    left: 10px;
    top: 12px;
    display: none;
}

.examMappingGroups .mobileGroupSelection.selected:not(.image-template) .answer-checked {
    display: block;
}

.examMappingGroups .groupContainer{
    height: auto;
}

.examMappingGroups .groupContainer .dropText{
    height: 190px;
}

.examMappingGroups .questionAndAnswerContainer  .itemElementContainerPadding {
    background-color: #ffffff;
    padding: 5px;
    /*border: 1px solid #325B7F;*/
}
.examMappingGroups .questionAndAnswerContainer  .itemElementContainerPadding  {
    background-color: #ffffff;
    padding: 5px !important;
    box-sizing: border-box !important;
}
.examMappingGroups .questionAndAnswerContainer  .itemElementContainerPadding.gu-transit  {
    background-color: #ffffff;
    padding: 5px !important;
}

.examMappingGroups .questionAndAnswerContainer  .itemElementContainerPadding.gu-transit .textHolder {
    display: block;
}
.examMappingGroups .questionAndAnswerContainer .itemElementContainer {
    transition: transform .2s;
    cursor: pointer;
    transform: scale(1);
    border: 1px solid #d9d9da;
    overflow: hidden;
}
.examMappingGroups .questionAndAnswerContainer .itemElementContainer:hover {
    cursor: pointer;
    transform: scale(1.1);
    height: auto;
    min-height: 40px !important;
    z-index: 999999 !important;
}

.examMappingGroups .questionAndAnswerContainer .itemElementContainer:hover .showMore {
    display: none !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:not(.textItem){
    z-index: 99;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(-n+2):not(.textItem){
    top: 0 !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+3):nth-child(-n+4):not(.textItem){
    top: -40px !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+5):nth-child(-n+6):not(.textItem){
    top: -80px !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+7):nth-child(-n+8):not(.textItem){
    top: -120px !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+9):nth-child(-n+10):not(.textItem){
    top: -160px !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+11):nth-child(-n+12):not(.textItem){
    top: -200px !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+13):nth-child(-n+14):not(.textItem){
    top: -240px !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+15):nth-child(-n+16):not(.textItem){
    top: -280px !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+17):nth-child(-n+18):not(.textItem){
    top: -320px !important;
}
.examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:nth-child(n+19):nth-child(-n+20):not(.textItem){
    top: -340px !important;
}

.examMappingGroups .groupContainer {
    min-height: 0 !important;
}

.examMappingGroups .groupItemsWrapper:not(.imageWrapper) {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-content: start;
    justify-content: space-around;
    overflow-y: auto;
    overflow-x: hidden;
}


.examMappingGroups .groupItemsWrapper.imageWrapper {
    height: 100%;
    background-size: contain !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.examMappingGroups .dontShow {
    display: none;
}
.examMappingGroups .ImageAndItemContainer .imageContainer {
    width: 100%;
    z-index: -1;
}
.examMappingGroups .ImageAndItemContainer .imageOuterRatio {
    padding-top: calc(100% / 15 * 10);
    position: relative;
}

.imageContainer.answer.examMappingGroups .imageOuterRatio {
    position: relative;
    padding-top: calc(100% / 300 * 150);
}
.imageContainer.answer.examMappingGroups {
    width: 100%;
}

.examMappingGroups .questionAndAnswerContainer .imageContainer.answer.examMappingGroups {
    z-index: 1;
}

.examMappingGroups .questionAndAnswerContainer .imageWrapper {
    position: absolute;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-content: start;
    overflow-y: auto;
    overflow-x: hidden;
}

.examMappingGroups .questionAndAnswerContainer .groupContainerHolder {
    display: flex;
    flex-direction: row;
    width: 66%;
    height: 100%;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.examMappingGroups .questionAndAnswerContainer.imageAnswers .itemPool {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-content: start;
    min-height: 150px;
}

.examMappingGroups .questionAndAnswerContainer.imageAnswers .itemElementContainer {
    height: auto; /*for Fire-Fox*/
    height: fit-content;
    width: 45%;
    position: relative;
}

/* Mobile */
.examMappingGroups .mobileImageAnswer {
    width: 100%;
    display: block;
}

.examMappingGroups .mobileImageAnswer img {
    width: 100%;
    height: auto;
}

.examMappingGroups .mobileImageAnswer{
    margin-bottom: 25px;
}
.examMappingGroups .mobileImageAnswer .mobileImageAnswerImage{
    padding-bottom: 5px;
}

.examMappingGroups .mobileImageAnswerCheck .mobileImageAnswerCheckItem{
    transition: all .2s;
    display: flex;
    align-items: center;
    flex-direction: row;
    padding: 10px;
    background-color: #eeeeee;
    cursor: pointer;
    border: 4px solid #eeeeee;
    margin-bottom: 5px;
}
.examMappingGroups .mobileImageAnswerCheck .mobileImageAnswerCheckItem.selectedAnswer {
    background-color: #fff;
}

.examMappingGroups.showAnswers {
    display: flex;
    justify-content: center;
    min-height: auto;
}

.examMappingGroups.showAnswers .questionAndAnswerContainer {
    justify-content: center;
}

.examMappingGroups.showAnswers .questionAndAnswerContainer {
    width: 100%;
}

.examMappingGroups .noImageShowText {
    display: flex;
    height: 100%;
    width: 100%;
    flex-direction: column;
    justify-content: center;
}

.examMappingGroups.showAnswers .groupContainer {
    width: 48%;
    margin-right: 10px;
    height: 100%;
}

@media (max-width: 770px){
    .examMappingGroups .questionAndAnswerContainer .groupItemsWrapper .itemElementContainer:not(.textItem){
        top: auto !important;
    }

    .examMappingGroups.showAnswers .questionAndAnswerContainer {
        width: 100%;
    }

    .examMappingGroups .questionAndAnswerContainer.imageAnswers .itemElementContainer {
        width: 43%;
    }
}

@media (max-width: 800px) {
    .examMappingGroups .questionAndAnswerContainer .groupContainerHolder {
        width: 60%;
    }
}

/****************************/
/*  Semantic Differential   */
/****************************/

.examSemanticDifferential.examWrapper {
    width: auto;
}

.examSemanticDifferential .bottomRow {
    border-bottom: 2px solid #F6F6F6;
}


.examSemanticDifferential .bottomRow .icheckbox_amTemplate {
    margin: 0;
}

.examSemanticDifferential .checkboxText {
    padding-left: 10px;
}

.examSemanticDifferential .singleCell {
    justify-content: center;
    align-items: center;
    display: flex;
    padding: 10px;
}


.examSemanticDifferential .examQuestionDesktop table {
    width: 100%;
}

.examSemanticDifferential .examQuestionDesktop table .icheckbox_amTemplate{
    margin: 0;
}

.examSemanticDifferential .examQuestionDesktop table .tableBody td {
    padding: 10px;
    vertical-align: middle;
}

.examSemanticDifferential .examQuestionDesktop table .tableBody td.lineData {
    text-align: center;
}

.examSemanticDifferential .examQuestionDesktop table .tableHead th {
    text-align: center;
    padding: 10px;
    vertical-align: middle;
    font-weight: bold;
    white-space: nowrap;
}

.examSemanticDifferential .examQuestionDesktop table .firstRow {
    max-width: 20%;
}

@media (max-width: 700px) {

    .examSemanticDifferential .bottomRow {
        flex-direction: column;
    }

    .examSemanticDifferential .bottomRow .singleCell {
        width: auto;
        justify-content: left;
    }

    .examSemanticDifferential .bottomRow .singleCell.firstCell{
        font-weight: bold;
    }

    .examSemanticDifferential .bottomRow .singleCell .noShow {
        display: block !important;
        margin-left: 15px;
    }
}

.questionDescription p, .feedback p{
    word-break: break-word;
}
