/*     
    Campus Course Full ID: molsa+GOV_SafetyTrustees_HE+2022_1
*/

/* ######################
    COLORS:
    Orange:   #db5c2f
    Beige:    #e2dbca
    Gray:     #f3f3f3

     ###################### */

/* ######################
  	   UNIT NAV MENU
     ###################### */

     @import url('https://fonts.googleapis.com/css?family=Alef&display=swap');

     button.certificate {
         background: #fff;
         color: #3077B4;
         border: 1px solid #3077B4;
     }
     button.certificate:hover {
         background: #3077B4;
         color: white;
         border: 1px solid white;
     }
     
     div .sequence-nav,
     button.button-previous {
         background-color: white;
         color: #3077B4;
         border: 1px solid #3077B4;
     }
     
     main#main div.sequence-nav button.sequence-nav-button.button-previous,
     main#main div.sequence-nav button.sequence-nav-button.button-next,
     main#main nav.sequence-bottom button.sequence-nav-button.button-previous,
     main#main nav.sequence-bottom button.sequence-nav-button.button-next {
         background-color: #3077B4;
         color: white;
     }
     
     
     
     main#main div.sequence-nav button.sequence-nav-button.button-previous:hover,
     main#main div.sequence-nav button.sequence-nav-button.button-next:hover,
     main#main nav.sequence-bottom button.sequence-nav-button.button-previous:hover,
     main#main nav.sequence-bottom button.sequence-nav-button.button-next:hover {
         background-color: white !important;
         color: black !important;
     }
     
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button.active {
         background-color: #3077B4;
         color: white;
         border-bottom: 3px solid #EC9620 !important;
     
     }
     
     /* new temp */
     .sequence-nav button:hover,
     .sequence-nav button.active:hover {
         border-bottom-color: black !important;
         padding-top: 2px;
     }
     
     /* icon hover*/
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button:hover .icon,
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button:active .icon {
         color: #ffca00;
     }
     
     /* text hover */
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button:hover span,
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button:active span {
         color: black;
     }
     
     /*bottom line hover*/
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button:hover {
         border-bottom-color: black;
         padding-top: 2px;
     }
     
     button.active span.icon {
         color: white;
     }
     
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button.active .icon {
         color: #3C3C3C;
     }
     
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button.active {
         background-color: #EC9620;
         border-color: #EC9620;
     }
     
     .xmodule_display.xmodule_SequenceBlock .sequence-nav ol li button {
         background-color: #2F75B1;
     }
     
     .xmodule_display.xmodule_SequenceBlock .sequence-nav ol li button .icon {
         color: white;
     }
     
     span.icon.fa.fa-chevron-next,
     span.icon.fa.fa-chevron-prev {
         color: white;
     }
     
     /* next/prev icon hover color */
     .xmodule_display.xmodule_SequenceBlock .sequence-nav button:hover .icon {
         color: black;
     }
     
     .sequence-nav {
         background-image: url(unit_nav_bar_career.jpg);
     }
     
     /* ######################
                    SIDE NAVIGATION PANEL
                  ###################### */
     nav.course-navigation span.group-heading {
         background-color: #3077B4;
         color: white;
         margin-top: 3px;
         margin-bottom: 3px;
     }
     
     .course-index .accordion .course-navigation .button-chapter.active .group-heading {
         background-color: #EC9620;
     }
     
     .course-index .accordion .course-navigation .button-chapter.active .group-heading {
         color: white
     }
     
     .course-index .accordion .course-navigation .button-chapter .group-heading {
         font-size: 131%;
         color: white;
     }
     
     
     
     .course-index .accordion .course-navigation .chapter-content-container .chapter-menu {
         padding: 0;
     }
     
     .course-index .accordion .course-navigation .chapter-content-container .chapter-menu .menu-item {
         background-color: #f3f3f3;
         margin: 0;
     }
     
     /* current select menu item - remove rounded corners */
     .course-index .accordion .course-navigation .chapter-content-container .chapter-menu .menu-item a {
         border-radius: 0;
     }
     
     .course-index .accordion .course-navigation .chapter-content-container .chapter-menu .menu-item.active a {
         background-color: lightgray;
     }
     
     /* current menu item text color */
     div.chapter-menu.is-open div.active p.accordion-display-name {
         color: black !important;
         font-size: medium;
     }
     
     
     /* ######################
                    TOP NAVIGATION MENU
                  ###################### */
     body.view-in-course .wrapper-course-material .course-material .course-tabs {
         background-color: #f3f3f3;
         height: 140px;
         background-repeat: no-repeat;
         background-image: url(Banner.png);
         background-position: left;
         background-size: cover;
     }
     
     
     #content .wrapper-course-material .course-tabs li.tab a {
         font-weight: bold;
     }
     
     #content .wrapper-course-material .course-tabs li.tab a.active {
         color: #3077B4;
         background-color: white;
         border-bottom-color: white;
         font-weight: bold;
     }
     
     .wrapper-course-material .course-tabs li a:hover,
     .wrapper-course-material .course-tabs li a:visited:hover {
         color: black;
         border-bottom-color: black;
         border-bottom-width: 3px;
     }
     
     .wrapper-course-material .course-tabs li a,
     .wrapper-course-material .course-tabs li a:visited {
         font-size: 110%;
         color: white;
         /*background-color: rgba(243, 243, 243, 0.8);*/
     }
     
     
     .course-wrapper .course-content h3 {
         color: #3077B4;
         font-size: 140% !important;
     }
     
     .course-wrapper .course-content p {
         font-size: 115%;
     }
     
     
     .breadcrumbs {
         font-size: 111%;
     }
     
     /* breadcrumbs/learning map under main header */
     /*
          header.page-header.has-secondary {
           display: none;
          }
          */
     
     
     
     /* ######################
                      MAIN CONTENT AREA
                  ###################### */
     div#seq_content {
         background-color: #f7f7f7;
         padding: 12px 12px 12px 12px;
     }
     
     h2.unit-title {
         color: #3077B4;
         font-size: 160%;
     }
     
     ol,
     ul {
         margin-top: 0 !important;
     }
     
     .course-wrapper .course-content .vert-mod>div ul,
     .course-wrapper .course-content .vert-mod>div ol {
         font-size: 105%;
     }
     
     
     .xmodule_display.xmodule_HtmlBlock a:link {
         text-decoration-line: underline;
     }
     
     button.submit {
         border-color: #24adfe;
         border-width: 2px;
         color: white;
         background: #ffffff;
         border-radius: 5px;
         padding: 0.325rem 1.3rem;
     }
     
     .center {
         display: block;
         margin-left: auto;
         margin-right: auto;
     }
     
     .textPage001 img {
         border-color: lightgray;
         border-width: 1px;
         border-style: solid;
     }
     
     .gradientDiv {
         border-top-right-radius: 15px;
         border-bottom-right-radius: 15px;
         background-color: #A6B6E2;
         background: linear-gradient(270deg, rgba(116, 110, 199, 0.1) 0%, rgba(0, 212, 255, 0) 100%);
         padding: 15px;
     }
     
     /* #################################################
              MAIN CONTENT AREA - FOOTER NAV BUTTONS PREV/NEXT
           ################################################# */
     nav.sequence-bottom button.sequence-nav-button {
         color: white;
         background-color: #3077B4;
     }
     
     .xmodule_display.xmodule_SequenceBlock .sequence-nav-button:hover .icon,
     .xmodule_display.xmodule_SequenceBlock .sequence-nav-button:hover {
         border-bottom-color: black;
         padding-top: 2px;
         color: black;
     }
     
     
     nav.sequence-bottom button.sequence-nav-button:hover {
         border-bottom-color: black;
         padding-top: 2px;
     }
     
     .xmodule_display.xmodule_SequenceBlock .sequence-nav-button {
         background-color: #3077B4;
     }
     
     
     /* ######################
                 VIDEO COMPONENTS
         ###################### */
     
     /* left border out of bounds FIX*/
     .xmodule_display.xmodule_VideoModule .video {
         margin-left: 0px;
     }
     
     /* ######################
                 PROBLEMS
               ###################### */
     
     div .problem {
         /*background-color: #393939;*/
         background-image: url(q_mark_bg_02.png);
         background-repeat: no-repeat;
         background-position: left bottom;
         margin-top: 0px;
         margin-left: 0px;
         padding-right: 50px;
         padding: 50px 50px 50px 50px;
         border-radius: 15px;
         /*color: white;*/
     }
     
     div.xblock--drag-and-drop div.problem {
         padding: 0px;
     }
     
     div div.field {
         width: 300 px;
     }
     
     .xmodule_display.xmodule_ProblemBlock div.problem {
         background-color: white;
         background-image: url("https://courses.campus.gov.il/asset-v1:molsa+GOV_SafetyTrustees_HE+2022_1+type@asset+block@problem__BG.png");
         background-size: cover;
     }
     /*
     .xmodule_display.xmodule_ProblemBlock div.problem .action {
         display: flex;
         flex-direction: row;
         align-items: center;
     }
     */
     
     .xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-buttons-wrapper button.save {
         display: none;
     }
     
     /*
     .xmodule_display.xmodule_ProblemBlock div.problem .action .submit-attempt-container {
         display: inline-flex;
         padding: 20px 0px;
     }
     */
     
     .xblock.xmodule_display.xmodule_ProblemBlock .problem .wrapper-problem-response {
         overflow-x: visible;
     }
     
     .xmodule_display.xmodule_ProblemBlock div.problem .action .submit-attempt-container .submit {
         width: 110px;
     }
     
     .xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-buttons-wrapper {
         padding: 20px 0px;
         justify-content: flex-start;
     }
     
     button.show span.show-label {
         font-size: 15px;
     }
     
     .xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-btn {
         text-decoration: none;
         background-color: #2F75B1;
         color: white;
         height: 37px;
         line-height: 1;
     }
     
     .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup label {
         padding: 13px 43px 10px 10px;
         border-radius: 10px;
         background-color: white;
     }
     
     .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup label:hover {
         background-color: #2F75B1;
         color: white;
         transition: 0.5s;
         text-shadow: none;
     }
     
     
     
     
     /*
          div.problem div.field label {
            color: white;
            font-family: "Assistant";
          }
            */
     div.problem p,
     div.problem legend,
     button.submit {
         font-size: 115%;
     }
     
     .problem-header {
         font-weight: bold;
         color: #ea7d00;
     }
     
     .wrapper-problem-response input {
         font-size: 115%;
     }
     
     div.problem p.instruction-text {
         color: #003354;
         font-weight: bold;
     }
     
     button.submit .submit-label {
         font-size: 96%;
         color: #24adfe;
     }
     
     
     /* multiple choice question - options' text and background */
     .xmodule_display.xmodule_CapaModule div.problem .choicegroup label {
         /*color: white;*/
         /*background-color: #24adff;*/
         font-size: 115%;
         border-radius: 0px;
     }
     
     /* radio button adjustments*/
     .xmodule_display.xmodule_CapaModule div.problem .choicegroup input[type="radio"] {
         right: 0.2em;
     }
     
     /*fix feedback label right offset bug - 2. actually hide it*/
     .xmodule_display.xmodule_CapaModule .hint-label,
     .xmodule_display.xmodule_ProblemBlock .hint-label {
         padding-right: 0;
         display: none;
     }
     
     /*hide feedback explanation title*/
     .xmodule_display.xmodule_CapaModule .explanation-title {
         display: none;
     }
     
     /*problem feedback font*/
     .xmodule_display.xmodule_CapaModule .hint-text {
         font-size: 110%;
         ;
     }
     
     /* ######################
                 PROBLEM custom JS
               ###################### */
     
     div.problem div.wrapper-problem-response p {
         font-size: 118%;
     }
     
     /* ######################
                 TABLES
               ###################### */
     
     .xmodule_display.xmodule_HtmlModule table {
         width: auto;
     }
     
     .xmodule_display.xmodule_HtmlModule table th {
         background-color: #3077B4;
         color: white;
         font-size: 1.1rem;
     }
     
     .xmodule_display.xmodule_HtmlModule table td {
         font-size: 1.1rem;
     }
     
     .xmodule_display.xmodule_HtmlModule div.hideme table td {
         font-size: 17px;
     }
     
     .course-wrapper .course-content table p {
         font-size: 1.1rem;
     }
     
     table.striped-table tr:nth-child(even) {
         background-color: #b4b2b2;
     }
     
     tbody {
         font-size: 116%;
     }
     
     table audio {
         width: 210px;
     }
     
     .xmodule_display.xmodule_HtmlBlock table.centered {
         text-align: center;
         font-weight: bold;
     }
     
     
     .xmodule_display.xmodule_HtmlBlock table.no-border td {
         border: none;
         width: 150px;
     }
     
     .highlightTextContainer {
         background-image: linear-gradient(to bottom, #4FB2D4, #3077B4);
         display: block;
         width: 100%;
         height: 100%;
         display: flex;
         justify-content: center;
         align-items: center;
         align-content: center;
     
     }
     
     .highlightTextDiv {
         width: 90%;
         background-color: white;
         -webkit-border-radius: 40px 40px 40px 40px;
         border-radius: 40px 40px 40px 40px;
         -webkit-box-shadow: 5px 5px 10px 0 #424242;
         box-shadow: 5px 5px 10px 0 #424242;
         margin: 40px;
         padding: 20px 40px;
     }
     
     /* strong{
                                       background-image: url("/static/highlight.jpg");
                                       background-position:center;
                                       background-size:500px 30px;
                                       background-repeat: no-repeat;
                                       padding: 10px 30px;
                                   } */
     
     
     .sketchy {
         padding: 10px;
         display: inline-block;
         border: 3px solid orange;
         border-radius: 40px;
         position: relative;
     }
     
     .sketchy::before {
         content: '';
         border: 2px solid orangered;
         display: block;
         width: 100%;
         height: 100%;
         position: absolute;
         top: 50%;
         left: 50%;
         transform: translate3d(-50%, -50%, 0) scale(1.015) rotate(0.5deg);
         border-radius: 40px;
     }
     
     .hideme {
         opacity: 0;
     }
     
     .h-frame {
         color: firebrick;
         font-weight: bold;
         padding: 10px;
         border-right: 4px double firebrick;
         border-top: 4px double firebrick;
         border-top-right-radius: 20px;
     }
     
     h4 {
         color: firebrick;
         border-right: 4px double firebrick;
         padding-right: 10px;
         font-size: 130% !important;
     }
     
     /*  PDF Mobile Fix */
     .pdf-mob-instr {
         display: none;
         line-height: 80px!important;
     }
     
     .mob-instr {
         display: none;
     }
     
     .mob-instr p {
         text-align: center;
     }
     
     .xblock.xmodule_display.xmodule_HtmlBlock .pdf-mob-instr img {
         float: right;
         height: 80px;
         margin-left: 20px;
     }
     
     @media (pointer: coarse)  {
         /* mobile device */
         .pdf-mob-instr, .mob-instr {
             display: block;           
         }
     
         .pdf-iframe {
              display: none; 
         }
              
     }
     
     
     /* Checkbox Questions Feedback Fix*/
     .xmodule_display.xmodule_ProblemBlock div.problem .qchb-alt .indicator-container .status.partially-correct .sr,
     .xmodule_display.xmodule_ProblemBlock div.problem .qchb-alt .indicator-container .status.correct .sr,
     .xmodule_display.xmodule_ProblemBlock div.problem .qchb-alt .indicator-container .status.incorrect .sr
      {
         width: 100px;
         height: 20px;
         display: block;
         position: relative;
         padding-right: 30px;
         background-color:transparent;
         font-weight: bold;
     }
     
     .xmodule_display.xmodule_ProblemBlock div.problem .qchb-alt .indicator-container .status.partially-correct .status-icon::after,
     .xmodule_display.xmodule_ProblemBlock div.problem .qchb-alt .indicator-container .status.correct .status-icon::after,
     .xmodule_display.xmodule_ProblemBlock div.problem .qchb-alt .indicator-container .status.incorrect .status-icon::after 
     {
         transform: translateY(-1.125em);
     }
     




/***************************************/
/*       EdX Quince Fixes 2025         */
/***************************************/


/*         TOP MENU & BANNER           */

nav.nav.nav-underline-tabs {
    background-color: #f3f3f3;
    height: 140px;
    background-repeat: no-repeat;
    background-position: left;
    background-size: cover;
    background-image: url(https://courses.campus.gov.il/asset-v1:molsa+GOV_SafetyTrustees_HE+2022_1+type@asset+block@Banner.png);
}

.course-tabs-navigation .nav a:hover {
    background-color: transparent;
}

.nav-underline-tabs .nav-link {
    /*font-family: 'Assistant';*/
    color: #313131;
    font-size: 16px;
    font-weight: 700;
    height: 2.5em;
    padding: 0.25rem 0.75rem;
}

.nav-underline-tabs .nav-link:hover {
    border-bottom-color: #126f9a;
}

.course-tabs-navigation .nav-underline-tabs a.nav-link.active {
    color: white;
    background-color: #2F75B1;
    border-bottom-color: #2F75B1;
}

.course-tabs-navigation .nav-underline-tabs a.nav-link:not(.active):hover {
    color: #2F75B1;
    font-weight: 700;
    background-color: transparent;
    border-bottom: solid 4px #2F75B1;
}

/*        UNITS' MENU           */

.sequence-navigation {
    background-color: #fff;
}

.sequence-navigation .sequence-navigation-tabs {
    overflow: hidden;
}

.sequence-navigation .btn {
    color: #fff; /* unit icon color */
    background-color: #2F75B1;
}

.sequence-navigation .btn.active {
    color: #3C3C3C;
    background-color: #EC9620;
}

.sequence-navigation .btn:not(.active):hover::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #2F75B1;
    height: 4px;
}

.sequence-navigation .btn.active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #2F75B1;
    height: 0;
}


/*           SIDE MENU             */

[dir=rtl] .sequence-container section.ml-lg-4 {
    margin-right: 0 !important;
}

[dir=rtl] #course-outline-sidebar {
    padding: 17px 4px 20px 4px;
}

#courseHome-outline .mb-2 {
    margin-bottom: 0.25rem !important;
}

.collapsible-card .collapsible-icon, /* ??? */
.collapsible-card-lg .collapsible-icon {
    margin-inline-start: 0.25rem;
}

#courseHome-outline .col-10 { /* subsection's name width (remain on same line with icon) */
    max-width: calc(100% - 25px);; /* 83.33333333%; */
    margin-right: 0.25rem!important;
}

#courseHome-outline .col-10 span:first-child { /* subsection's names */
    /*font-family: 'Assistant';*/
    font-size: 18px;
    color: #fff; 
    font-weight: 700;
}

#courseHome-outline .is-open>.collapsible-trigger {
    color: #fff;
    background-color: #EC9620;
}

#courseHome-outline li .collapsible-trigger {
    padding: 4px 8px;
    background-color: #3077B4;
}

#courseHome-outline li .collapsible-trigger svg.svg-inline--fa {
    filter: contrast(100);
}

#courseHome-outline .btn-icon.btn-icon-primary {
    color: #fff;
}

#courseHome-outline .btn-icon.btn-icon-primary:hover {
    color: #fff;
}

#courseHome-outline .collapsible-body ol li {
    padding: 4px 10px 4px 0;
    background-color: #f3f3f3;
}

.collapsible-body ol li a {
    font-size: 16px;
    color: #313131;
    font-weight: normal;
}


/*           UNIT AREA           */

.course-wrapper .course-content .vert-mod .vert {
    height: fit-content;
}

/*nav[aria-label="breadcrumb"] {
    font-family: 'Assistant';
}*/

.unit-container .unit h1.h3:first-child {
    /*font-family: 'Assistant';*/
    font-size: 24px;
    color: #003354;
    font-weight: 600;
}

section#course-content {
    background-color: #f3f3f3;
}


/*         BOTTOM NAV BUTTONS        */

.unit-navigation .next-button, 
.unit-navigation .previous-button {
    box-sizing: border-box;
    border-radius: 4px;
    white-space: nowrap;
    flex-basis: 22%;
    background-color: #3077B4;
    color: white;
    border-bottom: 3px solid #3077B4;
}

.unit-navigation .next-button:hover, 
.unit-navigation .previous-button:hover {
    background-color: white;
    color: black;
    border-bottom: 3px solid #1790c8;
}