@import url('ReferenceTheme.OutSystemsUIWeb.BaseTheme.Plain.css?86444');
@import url('ReferenceTheme.DigitalUI_Th.DigitalUI_Th.Plain.css?86474');

/*/Certifications_Th/Theme.Training_DigitalUI.css*/
.align-self-flex-start {
    align-self: flex-start;
}

.align-self-flex-end {
    align-self: flex-end;
}

.avoid-clicks {
    pointer-events: none;
}

.line-height-xl    {
    line-height: var(--space-xl);
}

.border-bottom-neutral-0 {
    border-bottom: var(--border-size-s) solid var(--color-neutral-0);
}

.border-bottom-neutral-1 {
    border-bottom: var(--border-size-s) solid var(--color-neutral-1);
}

.break-word {
    overflow-wrap: break-word;
}

a.link-no-underline { 
    text-decoration: none;
}

.img-max-width-none img {
    max-width: none;
}

.input::-webkit-input-placeholder { 
    color: var(--color-neutral-4);
    opacity: 1; 
}

.input::-moz-placeholder { 
    color: var(--color-neutral-4);
    opacity: 1; 
}

.input::placeholder { 
    color: var(--color-neutral-4);
    opacity: 1; 
}

.input:-ms-input-placeholder { 
    color: var(--color-neutral-4);
}

.input::-ms-input-placeholder { 
    color: var(--color-neutral-4);
}

.justify-content-center {
    justify-content: center;
}

.justify-content-flex-end {
    justify-content: flex-end;
}

.justify-content-space-between {
    justify-content: space-between;
}

.margin-left-auto {
    margin-left: auto;
}

.phone .Button.hidden {
    display: none;
}

.phone h2 {
    font-size: var(--font-size-h4);
}

.phone h1 {
    font-size: var(--font-size-h2);
}




.card-content {
    background-color: var(--color-white);
    border-radius: var(--border-radius-mid-rounded);
    box-shadow: var(--shadow-s);
    overflow: hidden;
    padding: var(--space-l);
    position: relative;
    transition: all 200ms ease;
}

.card-content.has-pointer {
    cursor: pointer;
}

.card-content.is-pop-up:hover {
    box-shadow: var(--shadow-l);
    transform: translate(-1px, -3px);
}

.card-content:before {
    background-color: var(--color-red);
    bottom: var(--space-none);
    content: "";
    left: var(--space-none);
    position: absolute;
    top: var(--space-none);
    width: var(--space-xs);
}

.card-content__title {
    font-size: var(--font-size-l);
    font-weight: var(--font-semi-bold);
    margin-bottom: var(--space-base);
}

.card-content__title:empty {
    display: none;
}

a .card-content {
    color: initial;
}

.card-content ul {
    padding-left: var(--space-m);
}



a .course-card {
    color: initial;
}

.gray-out {
    filter: alpha(opacity = 60); 
    opacity: 0.6; 
}

.course-card { 
    background-color: var(--color-white);
    border: var(--space-none);
    border-radius: var(--border-radius-mid-rounded);
    box-shadow: var(--shadow-s);
    transition: all 200ms ease;
}

.course-card.search-result {
    height: 23.5rem;
}

.course-card.pop-out:hover {
    box-shadow: var(--shadow-l);
    transform: translate(-1px, calc(var(--space-xs) * -1));
}

.course-card .course-card-header:empty {
    padding-top: var(--space-none);
}

.course-card .course-card-header {
    border-radius: var(--border-radius-mid-rounded);
    border-top: var(--space-xs) solid var(--color-neutral-10);
    padding: var(--space-base) var(--space-m) var(--space-none);
}

.course-card .course-card-header .course-card-header__content {
    height: 4.4375rem;
}

.course-card.gray-out .course-card-header .course-card-header__content {
    border-bottom: none;   
}

.course-card .course-card-header .course-card-header__content .guided-path {
    height: var(--space-base);
    line-height: var(--space-base);
}

.course-card .course-card-header .course-card-header__content .course-name {
    height: 3.375rem;
    line-height: 3.375rem;
}

.course-card .course-card-header .course-card-header__content .guided-path > span,
.course-card .course-card-header .course-card-header__content .course-name > span {
    display: inline-block;
    line-height: normal;
    vertical-align: middle;
}

.course-card .course-card-header__content .fa {
    color: var(--color-neutral-2);  
    font-size: var(--font-size-s);
}

.course-card .course-card-content {
    padding: var(--space-none) var(--space-m) var(--space-m);
}

.course-card .course-card-tags {
    line-height: var(--space-base);
}

.course-card .course-card-tags {
    line-height: var(--space-base);
}

.phone .course-card.search-result {
    height: auto;
}


.course-card .course-card-ratings > div:first-child {
    font-size: var(--font-size-m);     
}

.course-card .course-card-ratings > div:last-child {
    font-size: var(--font-size-xs);      
    margin-left: var(--space-s); 
}





.learn-progress-bar {
    display: table;
    width: 100%;
}

.learn-progress-bar__bar {
    display: table-cell;
}

.learn-progress-bar__value {
    color: var(--color-neutral-10);
    display: table-cell;
    font-size: var(--font-size-xs);
    font-weight: var(--font-regular);
    width: var(--space-xl);
}

.learn-progress-bar__grey {
    background-color: var(--color-neutral-1);
    border-radius: var(--border-radius-soft-rounded);
    height: var(--space-xs);
    text-align: left;
    width: 100%
}

.learn-progress-bar__progress {
    background: var(--color-green-light);
    border-radius: var(--border-radius-soft-rounded);
    height: var(--space-xs);
    width: var(--space-none);
}




.course-enroll-card {
    border-color: var(--color-neutral-1);
    justify-content: space-between;
}

.course-enroll-card__button {
    align-self: flex-end;
}

.phone .course-enroll-card__button {
    background-color: var(--color-transparent);
}




.course-entry-page__layout.columns > .columns-item:first-child {
    margin-top: calc(var(--space-m) * -1); 
    padding-right: 7.5rem;
}

.course-entry-page__layout.columns > .columns-item:nth-child(2) {
    padding-left: var(--space-none);
    padding-right: var(--space-none);
}

.course-entry-page__sidebar-content {
    border-color: var(--color-neutral-1);
}

.phone .course-entry-page__layout.columns > .columns-item:first-child {
    margin-top: initial;
    padding-right: calc(var(--space-xl) / 2);
}



  
.accordion.course-accordion-content {
    border-radius: var(--border-radius-mid-rounded);
    max-height: 41.8rem;
}

.course-accordion .accordion-item-header {
    align-items: center;
    border-bottom: var(--border-size-s) solid var(--color-neutral-1);   
    border-bottom-left-radius: var(--border-radius-mid-rounded);
    border-bottom-right-radius: var(--border-radius-mid-rounded);
    display: flex;
    height: 4.3rem;
}
 
.accordion-item.is--open .accordion-item-header {
    border-bottom-left-radius: var(--border-radius-none);
    border-bottom-right-radius: var(--border-radius-none);
}

.course-accordion .accordion-item-content.is--expanded a {
    text-decoration: none;
}

.course-accordion .accordion-item-content a:last-child .course-lesson {
    border-bottom-left-radius: var(--border-radius-mid-rounded);
    border-bottom-right-radius: var(--border-radius-mid-rounded);
}

.course-accordion .accordion-item-content.is--expanded {
    padding: var(--space-none);
}

.course-accordion-content .accordion-item .accordion-item-content, 
.course-accordion-content .accordion-item .accordion-item-content.is--collapsed {
    padding: var(--space-none);
}

.course-accordion .course-lesson.in-progress {
    background-color: var(--color-neutral-0);
}

.course-accordion .course-lesson.disabled {
    color: var(--color-neutral-4);
}

.course-accordion-content .accordion-item {
    box-shadow: var(--shadow-s);  
}

.course-accordion .course-lesson {
    height:4.6rem;
    padding-left: var(--space-m);
    padding-right: var(--space-m);
}

.course-accordion .course-lesson:hover {
    background-color: var(--color-neutral-0);
}

.course-accordion .lesson {
    border-bottom: var(--border-size-s) solid var(--color-neutral-1);
    padding-top: var(--space-m);
    padding-bottom: var(--space-m);
}

.course-accordion a:last-child .lesson {
    border-bottom: var(--border-size-none);
}

.course-accordion .lesson img {
    display: block;
}

.course-accordion .accordion-item-icon .fa.fa-fw.fa-angle-down {
    font-size: var(--font-size-xxl);
}

.course-accordion__max-height {
    max-height: 41.875rem;
    overflow-y: auto;
    padding: var(--space-xs);
}

.course-accordion__max-height::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: transparent;
}

.course-accordion__max-height::-webkit-scrollbar {
    width: var(--space-s);
    background-color: #F5F5F5;
}

.course-accordion__max-height::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: var(--color-neutral-2);
}

.course-accordion__wrapper .accordion .accordion-item {
    position: relative;
    background-color: var(--color-white);
    margin-bottom: var(--space-xs);
    border-radius: var(--space-xs);
    box-shadow: var(--shadow-m);
}




.course-accordion__wrapper .tabs.tabs-horizontal .tabs-header-item {
    background-color: transparent;
    border: var(--border-size-none);
    border-bottom: var(--border-size-s) solid var(--color-neutral-1);   
    color: var(--color-neutral-5);
    font-size: var(--font-size-s);
    padding: var(--space-base) var(--space-base) var(--space-xs);  
    text-shadow: none;
}

.course-accordion__wrapper .tabs.tabs-horizontal .tabs-header-item.active {
    border: var(--border-size-none);
    border-bottom: var(--border-size-m) solid var(--color-red-light);
    color: var(--color-red-light);
    font-size: var(--font-size-s);
    font-weight: 600;
    padding: var(--space-base) var(--space-base) var(--space-xs);
}

.course-accordion__wrapper .tabs.tabs-horizontal .tabs-header-item.active:first-child {
    border-left: var(--border-size-none);
}

.transcript-highlight {
    background-color: transparent;
    color:var(--color-neutral-8);
    font-size: var(--font-size-s);
    padding:var(--space-s);
    transition: background-color 0.3s ease-out 0s;   
}

.transcript-highlight.active {
    background-color: var(--color-neutral-0);
    border-radius:var(--border-radius-mid-rounded);
    color: var(--color-neutral-10);
    transition: all 0.5s ease-in 0.5s;
    font-weight: var(--font-bold);
}

.transcript-highlight .transcript-time {
    display: table-cell;
}

.transcript-highlight .transcript-number,
.transcript-highlight.active .transcript-number {
    color: var(--color-blue-dark);
    cursor: pointer; 
    font-size: var(--font-size-s);   
}

.transcript-highlight .transcript-text {
    display: table-cell;
    padding-left: var(--space-m);
}




.course-level { 
    justify-content: flex-end;   
}

.course-level-difficulty { 
    position: relative;
    top: 0.375rem;
    width: var(--space-m);
}

.course-level-difficulty > div { 
    bottom: var(--space-none);
    position: absolute;
    width: 0.1875rem;
}

.course-level-difficulty .intro { 
    height: 0.375rem;
    left: var(--space-none);
}

.course-level-difficulty .intermediate { 
    height: 0.625rem;
    left: 0.3125rem;
}

.course-level-difficulty .advanced { 
    height: 0.875rem;
    left: 0.625rem;
}




.course-progress__graph {
    height: 7rem;
    width: 7rem;
}

.phone .course-progress__graph {
    height: initial;
    width: initial;
}

.phone .course-progress__graph .progress-bar { 
    background-color: var(--color-green-light); 
}




.ListRecords.filter-options > div:first-child {
    margin-top: var(--space-s);
}

.filter-options .checkbox {
    height: 1.25rem;
    width: 1.25rem;
}

.filter-options .checkbox:before {
    height: var(--space-base);
    width: var(--space-base);
}

.filter-options .checkbox:not(:checked):before {
    background-color: var(--color-white);
    border: var(--border-size-s) solid var(--color-neutral-4);
}

.filter-options .checkbox:after {
    height: var(--space-xs);
    left: var(--space-xs);
    top: var(--space-xs);
    width: var(--space-s);
}

.selected-filters .tag {
    background-color: var(--color-info-lighter);
    padding: var(--space-none) var(--space-s);
}

.selected-filters .tag-content a {
    color: var(--color-neutral-5);
}

.selected-filters a .tag {
    margin-top: var(--space-s);
    transition: all 200ms ease;
}

.selected-filters a:hover .tag {
    text-decoration: none;
}

.selected-filters a:hover .tag.background-blue-lightest {
    background-color: var(--color-info-light);
    color: var(--color-blue);
}

.selected-filters .line-bg.background-blue-lightest {
    border: var(--border-size-s) solid var(--color-blue-light);
    color: var(--color-blue-light);
}

.selected-filters a:hover .line-bg.background-blue-lightest {
    border: var(--border-size-s) solid var(--color-blue);
    color: var(--color-blue);
}




.choices[data-type*="select-one"]:after { 
    color: var(--color-neutral-3);
}

.choices__list--single .choices__item,
.choices__list--dropdown .choices__item { 
    font-size: var(--font-size-m);
    font-weight: var(--font-regular);
}

.choices__list--single .choices__item { 
    color: var(--color-neutral-8);
}

.choices__list--single .choices__item[data-value="0"] { 
    color: var(--color-neutral-4);
}





.feedback-form {
    background: var(--color-neutral-0);
    height: auto;
    width: 61.5rem;
}

.feedback-form__left-content {
    width: 16.5rem;    
}

.feedback-form__right-content {
    width: 39.375rem;    
}

.feedback-form__title {
    background: var(--color-white);
    height: 3.5rem;
    margin-left: var(--space-none);
    padding-top: var(--space-base);
    width: 61.5rem;
}

.feedback-form__confirmation {
    background: var(--color-neutral-0);
    min-height: 22.8125rem;
    width: 61.5rem;
}

.feedback-form__content {
    min-height: 9.5rem;
    padding: var(--space-l) var(--space-xl) var(--space-xl) var(--space-l);
    width: 61.5rem;
}

.feedback-form__review-text {
    min-height: 10rem;
}

.feedback-form__rate-half-course {
    height: auto;
    min-height: 18.75rem;
    width: 31rem;
}

.feedback-form__close {
    -webkit-transition: all .3s ease;
         -o-transition: all .3s ease;
            transition: all .3s ease;
}

.feedback-form__close:hover {
    opacity: .7;
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
}

.phone .feedback-form,
.phone .feedback-form__rate-half-course,
.phone .feedback-form__flag-inappropriate {
    height: 100%;
    width: 100%;
}

.phone .feedback-form__left-content {
    width: 100%;
}

.phone .feedback-form__right-content {
    margin: var(--space-none);
    width: 100%;
}

.phone .feedback-form__title {
    width: 100%;
}

.phone .feedback-form__content {
    font-size: var(--font-size-s);
    padding: var(--space-base);
    width: 100%;    
}

.phone .feedback-form__confirmation {
    height: 100%;
    width: 100%;
}

.phone .feedback-form__review-text {
    min-height: 100%;
}



.hidden-guided-path {
    display: none;
}

.guided-path-left-col-degrade {
    align-self: flex-end;
    background: linear-gradient(180deg, rgba(245, 246, 250, 0) 0%, var(--color-neutral-0) 100%);
    bottom: var(--space-none);
    height: calc(var(--space-xxxl) + 2*var(--space-xxl) + var(--space-xs));
    position: absolute;
    right: var(--space-none);
    width: 50vw;
}

.osicons-v2-select.border-radius-circle.background-green-light {
    height: var(--space-l);
    min-width: var(--space-l);
}




.mobile-background-header-grey {
    background-image: url(/Training_Th/img/mobile_header_background_grey.png?82394);
}

.mobile-background-header-white {
    background-image: url(/Training_Th/img/mobile_header_background_white.png?82394);
}



.l2c-custom .layout-2cols:before {
    left: 40%;
}

.l2c-custom .layout-2cols__left {
    width: 40%;
}

.l2c-custom .layout-2cols__right {
    width: 60%;
}

.layout-2cols .ThemeGrid_Container {
    display: flex;
}




.lesson-buttons .os-btn-cancel,
.lesson-buttons a.os-btn-cancel:visited,
.lesson-buttons .os-btn-cancel:hover,
.lesson-buttons a.os-btn-cancel:hover,
.lesson-buttons .os-btn-secundary,
.lesson-buttons a.os-btn-secundary:visited,
.lesson-buttons .os-btn-secundary:hover,
.lesson-buttons a.os-btn-secundary:hover    {
    background-color: inherit;
}




.HtmlContent iframe {
    width: 100%;
    height: 25.375rem;
}

.phone .HtmlContent iframe {
    width: 100%;
    height: 8.375rem;
}




.multiselection-dropdown .ms-choice {
    background-image: none;
    border: var(--border-size-s) solid var(--color-neutral-2);
    border-radius: var(--border-radius-mid-rounded);
    box-shadow: none;
    color: var(--color-neutral-8);
    font-size: var(--font-size-m);
    height: 2.5rem;
}

.multiselection-dropdown .ms-choice:hover {
    border: var(--border-size-s) solid var(--color-black);
}

.multiselection-dropdown .ms-choice.disabled {
    background-color: var(--color-neutral-2);
    border: var(--border-size-s) solid var(--color-neutral-2);
}

.multiselection-dropdown .ms-choice.error {
    border: var(--border-size-s) solid var(--color-red);
}

.multiselection-dropdown .ms-choice > span {
    padding-left: var(--space-base);
    padding-right: var(--space-l);
}

.multiselection-dropdown .ms-choice > span.placeholder {
    color: var(--color-neutral-4);
    font-size: var(--font-size-m);
}

.multiselection-dropdown .ms-choice > div:after {
    content: "\e907";
    font-family: osicons-v2;
    position: absolute;
    right: var(--space-base);
    top: 0.18rem;  
}
 
.multiselection-dropdown .ms-choice > div.open:after {
    content: "\e90d";
}

.multiselection-dropdown .ms-drop {
    border: var(--border-size-none);
    border-radius: var(--border-radius-mid-rounded);
    box-shadow: var(--shadow-s);
    color: var(--color-neutral-8);
    margin-top: var(--space-xs);
}

.multiselection-dropdown .ms-drop ul {
    overflow-x: hidden;
    padding: var(--space-s) var(--space-base);  
}

.multiselection-dropdown .ms-drop ul > li {
    margin-bottom: var(--space-base);
}

.multiselection-dropdown .ms-drop ul > li label {
    white-space: normal;   
}

.multiselection-dropdown .ms-drop ul > li:last-child {
    margin-bottom: var(--space-none);
}

.multiselection-dropdown .ms-drop ul > li span {
    margin-left: var(--space-xs);
    vertical-align: middle;
}

.multiselection-dropdown input[type='checkbox'] {
    height: 0.75rem;
    margin-right: var(--space-s);
    position: relative;
    vertical-align: baseline;
    width: 0.75rem;
}

.multiselection-dropdown input[type='checkbox']:after {
    background: var(--color-white);
    border: var(--border-size-m) solid var(--color-neutral-4);
    border-radius: var(--border-radius-soft-rounded);
    content: "";
    cursor: pointer;
    font-size: var(--font-size-xxs);
    height: 0.75rem;
    position: absolute;
    text-align: center;
    width: 0.75rem;  
}
  
.multiselection-dropdown input[type='checkbox']:checked:after {
    background: var(--color-blue-light);
    border: var(--border-size-m) solid var(--color-blue-light);
    border-radius: var(--border-radius-soft-rounded);
    color: var(--color-white);
    content: "\e90a";
    font-family: osicons-v2;
}

.multiselection-dropdown input:disabled + span {
    color: var(--color-neutral-1);
}

.multiselection-dropdown input:disabled:after {
    background: var(--color-neutral-1);
    border: var(--border-size-m) solid var(--color-neutral-1);
    cursor: default;
}





.quiz-card {
    border: 1px solid #E0E0E0;
    border-radius: 4px;
    display: table;
    width: 100%;
}

.phone .quiz-card {
    display: inline-block;
}

.quiz-card.grey,
.quiz-card.grey a,
.quiz-card.grey .quiz-card__info {
    color: #596669;
}

.quiz-card.grey a {
    text-decoration: underline;
}

.quiz-card__info {
    color: #212529;
    display: table-cell;
    padding: 25px;
    vertical-align: middle;
}

.phone .quiz-card__info {
    display: inline-block;
    width: 100%;
}

.quiz-card__score {
    display: table-cell;
    padding: 25px;
    padding-left: 25px;
    vertical-align: middle;
    white-space: nowrap;
    width: 50px;
}

.phone .quiz-card__score {
    display: inline-block;
    font-size: 12px;
    padding: 15px;
    width: 100%;
}

.quiz-card__content {
    font-size: 14px;
    font-weight: 700;
}

.quiz-card__more {
    font-size: 12px;
    margin-top: 5px;
}


.quiz-question {
    background-color: #F1F3F5;
    border-radius: 4px;
    display: table;
    font-size: 16px;
    margin-bottom: 15px;
    min-height: 40px;
    width: 100%;
}

.quiz-question > div {
    padding-bottom: 10px;
    padding-top: 10px;
}

.quiz-question__count {
    color: #ADB5BD;
    display: table-cell;
    font-weight: 700;
    text-align: center;
    padding-left: 15px;
    vertical-align: middle;
    white-space: nowrap;
    width: 20px;
}

.quiz-question__text {
    color: #000;
    display: table-cell;
    font-weight: 600;
    padding-left: 15px;
    vertical-align: middle;
}

.quiz-question__points {
    color: #868E96;
    display: table-cell;
    font-size: 16px;
    font-weight: 600;
    padding-left: 15px;
    padding-right: 15px;
    vertical-align: middle;
    width: 20px;
}


.quiz-answer {
    border: var(--border-size-s) solid var(--color-white);
    border-radius: 12px;
    display: table;
    padding: var(--space-xs);
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -o-transition: all 300ms ease;  
    width:100%;
}

.quiz-answer:last-child {
    margin-bottom: var(--space-none);
}

.quiz-answer:hover {
    background-color:var(--color-info-lighter);  
    cursor:pointer;
}

.quiz-answer-container {
    display: table;
    width:100%;
}

.phone .quiz-answer {
    display: inline-block;
}

.quiz-answer.selected {
    background-color: var(--color-info-lighter);
    border-color: var(--color-info-light);
}

.quiz-answer.selected .quiz-answer__letter {
    background-color: var(--color-blue-light);
    border:var(--color-blue-light);
    color: var(--color-white);
    line-height: 24px;
}

.quiz-answer.correct {
    background-color:var(--color-success-lighter);
    border-color: var(--color-success-light);
}

.quiz-answer.correct .quiz-answer__answer {
    color: var(--color-green);
}

.quiz-answer.wrong {
    border-color: var(--color-error-light);
    background-color:var(--color-error-lighter);
}

.quiz-answer.wrong .quiz-answer__letter,
.quiz-answer.correct .quiz-answer__letter {
    border: var(--border-size-none);
}

.quiz-answer.wrong .quiz-answer__answer {
    color: var(--color-red);
}

.quiz-answer__l {
    display: table-cell;
    vertical-align: middle;
    width: 1%;
}

.quiz-answer__points {
    color:var(--color-green);
    display: table-cell;
    font-size:var(--font-size-s);
    padding-right: var(--space-base);
    text-align: end; 
}

.quiz-answer__points img {
    margin-right: var(--space-s);
    vertical-align: bottom;
}

.phone .quiz-answer__l {
    display: table-cell;
    vertical-align: top;
}

.quiz-answer__letter {
    background-color: var(--color-white);
    border: var(--border-size-s) solid var(--color-neutral-1);
    border-radius: var(--border-radius-circle);
    color: var(--color-blue-light);
    font-size: var(--font-size-s);
    font-weight: 600;
    height: 24px;
    text-align: center;
    text-transform: uppercase;
    width: 24px;   
}

.quiz-answer__score {
    display: table-cell;
    padding-top: var(--space-s);
    vertical-align: middle;
    width: 7%;
    white-space: nowrap; 
}

.quiz-answer__score .tryagain-btn {
    background-color: var(--color-blue-light);
    border-radius: var(--border-radius-mid-rounded);
    color: var(--color-white);
    display: block;
    font-size: var(--font-size-s);
    font-weight: 400;
    height: 32px;
    line-height: 30px;
    width: 85px;    
}

.quiz-answer__scoreanswer a,
.quiz-answer__scoreanswer span {
    vertical-align:top;
}   

.quiz-answer__scoreanswer a {
    color: var(--color-blue);
}  

.phone .quiz-answer__score {
    display: inline-block;
    width: 100%;
}

.quiz-answer__score:empty {
    display: none;
}

.quiz-answer__answer {
    color: var(--color-neutral-8);
    font-size: var(--font-size-m);
    line-height: 24px;
    padding-left: var(--space-s);
    min-width: 390px;
}

.phone .quiz-answer__answer {
    max-width: 190px;
    min-width: initial; 
}

.quiz-answer__more {
    font-size:var(--font-size-xs);
    margin-bottom: var(--space-base);
    margin-left: 35px;
}

.quiz-answer__more:empty {
    display: none;
}




.desktop .body-radial-bg,
.tablet .body-radial-bg {
    background: radial-gradient(30.63% 36.82% at 50% 0%, var(--color-neutral-0) 0%, var(--color-white) 100%);   
}

.banner-radial {
    background: radial-gradient(56.04% 5928.98% at 26.84% 50%, var(--color-neutral-9) 0%, var(--color-neutral-10) 100%);
}




.list-rating-number  {
    color: var(--color-neutral-5);
    font-size: var(--font-size-xs);
    font-weight: var(--font-semi-bold);
    line-height: 1.8rem;
}

.list-avg-number  {
    color: var(--color-neutral-8);
    font-size: var(--font-size-m);
    font-weight: bold;
    line-height: 1.70rem;
}




.rate-button-top {
    margin-left: 6.8125rem;
    position: relative;
}

.rate-button__balloon {
    height: 6rem;
    position: absolute;
}

.rate-button__balloon .balloon-title {
    font-size: inherit;
}

.rate-button__balloon .balloon-content {
    padding: var(--space-none);
}

.phone .rate-button-top {
    margin-left: initial;
}

.phone .rate-button__balloon .balloon-content {
    position: absolute;
    top: 40%;
}

.tippy-popper[x-placement="top"] .rate-button__balloon {
    border-top: var(--border-size-l) solid var(--color-blue-light);
    right: -8.5rem;
    top: -6.625rem;
    width: 16.75rem;
}

.tippy-popper[x-placement="bottom"] .rate-button__balloon {
    border-bottom: var(--border-size-l) solid var(--color-blue-light);
    right: -3.5rem;
    top: var(--space-base);
    width: 15.625rem;
}

.tippy-popper[x-placement="top"] .rate-button__balloon,
.tippy-popper[x-placement="bottom"] .rate-button__balloon {
    border-radius: var(--border-radius-soft-rounded);
}

.tippy-popper[x-placement="top"] .tippy-arrow,
.tippy-popper[x-placement="bottom"] .tippy-arrow { 
    display: none;
}

.tippy-popper[x-placement="top"] .rate-button__balloon:after,
.tippy-popper[x-placement="bottom"] .rate-button__balloon:before { 
    background-color: var(--color-white);
    box-shadow: var(--shadow-none), var(--shadow-l);
    content: '';
    display: inline-block;
    height: var(--space-base);
    width: var(--space-base);
}

.tippy-popper[x-placement="top"] .rate-button__balloon:after { 
    border-bottom: var(--border-size-s) solid var(--color-neutral-1);
    border-left: var(--border-size-s) solid var(--color-white);
    border-right: var(--border-size-s) solid var(--color-neutral-1);
    border-top: var(--border-size-s) solid var(--color-white);
    transform: rotate(45deg) translate(50%, 60%);
}

.tippy-popper[x-placement="bottom"] .rate-button__balloon:before { 
    border-bottom: var(--border-size-s) solid var(--color-white);
    border-left: var(--border-size-s) solid var(--color-neutral-1);
    border-right: var(--border-size-s) solid var(--color-white);
    border-top: var(--border-size-s) solid var(--color-neutral-1);
    transform: rotate(45deg) translate(var(--space-base), -4.9rem);
}


.tippy-popper .rate-button__balloon .rate-button__balloon-close { 
    position: absolute;
    right: 0.8rem;
    top: 0.5rem;
}


.feedback-mechanisms__reviews-anchor {
    opacity: 0; 
    pointer-events: none;
    transform: translate(0, -10rem);
}

.feedback-mechanisms__reviews-rating-card {
    border-color: var(--color-neutral-1);
    width: 27.5rem;
}

.phone .feedback-mechanisms__reviews-rating-card {
    margin: var(--space-none);
    margin-bottom: var(--space-em-l);
    width: -webkit-fill-available;
}



.feedback-mechanisms__review-content {
    margin-left: 5rem;
}

.feedback-mechanisms__review-deleted {
    border: var(--border-size-s) solid var(--color-red);
}

.feedback-mechanisms__review-header.columns > .columns-item {
    margin-bottom: var(--space-none);
}

.feedback-mechanisms__review-header.columns > .columns-item:first-child {
    align-items: center;
    display: flex;
}

.feedback-mechanisms__review-header.columns > .columns-item:nth-child(2) {
    padding-left: var(--space-none);
    padding-right: var(--space-none);
}

.feedback-mechanisms__review-highlighted {
    animation-delay: 1s;
    animation-duration: 3s;
    animation-fill-mode: both;
    animation-name: bg-color;
    background-color: var(--color-success-lighter);
}

.feedback-mechanisms__review-spam-tag {
    background-color: var(--color-transparent);
    border: var(--border-size-s) solid var(--color-red);
    color: var(--color-red);
}



.rate-button__disabled-tooltip {
    width: 15.625rem;
}

.tooltipster-sidetip.tooltipster-shadow .tooltipster-box {
    background: var(--color-neutral-8);
}

.tooltipster-sidetip.tooltipster-shadow.tooltipster-top .tooltipster-arrow-border {
    border-top-color: var(--color-neutral-8)
}






.tabs .tabs-content {
    padding: var(--space-none);
}




.tabs-squared .tabs-header .tabs-header-item {
    background-color: var(--color-neutral-0);
    border: var(--border-size-s) solid var(--color-neutral-1);
    color: var(--color-neutral-5);
    font-weight: 400;
}

.tabs-squared .tabs-header .tabs-header-item.active {
    background-color: var(--color-white);
    border-bottom: var(--border-size-none);
    border-top: var(--border-size-m) solid var(--color-red-light);
    color: var(--color-red-light);    
    font-weight: 600;
    text-shadow: none;
}

.tabs-squared .tabs-header .tabs-header-item:first-child,
.tabs-squared .tabs-header .tabs-header-item:last-child {
    border-radius: var(--border-size-none);
}

.tabs-squared.tabs-squared-l .tabs-header .tabs-header-item {
    font-size: var(--font-size-m); 
    max-height: 3rem; 
    width: 8rem; 
}

.tabs-squared.tabs-squared-m .tabs-header .tabs-header-item {
    font-size: var(--font-size-s); 
    max-height: 2.5rem; 
    width: 7.3rem; 
}

.tabs-squared.tabs-squared-s .tabs-header .tabs-header-item {
    font-size: var(--font-size-s); 
    max-height: 2rem; 
    width: 7.3rem; 
}



.tabs.tabs-sticky .tabs-header {
    align-items: center;
    background-color: var(--color-white);
    justify-content: center;
    position: sticky;
    top: 3.9rem; 
}

.tabs.tabs-sticky .tabs-content {
    background-color: var(--color-neutral-0);
    padding: var(--space-xl);
    text-align: center;
}

.tabs.tabs-sticky .tabs-content-card {
    max-width: 47.6rem;
    width: 47.6rem;  
}

.tabs.tabs-sticky.tabs-horizontal .tabs-header-item {
    background-color: var(--color-white);
    border-bottom: var(--border-size-s) solid var(--color-neutral-1);
    border-radius: var(--border-radius-none);
    color: var(--color-neutral-5); 
    max-height: 2.5rem;
    min-width: 9.5rem;
}

.tabs.tabs-sticky.tabs-horizontal .tabs-header-item:first-child,
.tabs.tabs-sticky.tabs-horizontal .tabs-header-item:last-child {
    border-radius: var(--border-radius-none);
}

.tabs.tabs-sticky.tabs-horizontal .tabs-header-item.active {
    background-color: var(--color-neutral-0);
    border-bottom: var(--border-size-none);
    border-top: var(--border-size-m) solid var(--color-red-light);
    box-shadow: 0px -4px 10px rgb(10 20 30 / 10%);
    color: var(--color-red-light);
    font-weight: 600;
    text-shadow: none;
} 

.tabs.tabs-sticky.tabs-horizontal .tabs-header-item.active:first-child {
    border-left: var(--border-size-s) solid var(--color-neutral-1);
}

.tabs.tabs-sticky.tabs-horizontal .tabs-header-item.active:last-child {
    border-right: var(--border-size-s) solid var(--color-neutral-1);
}



.tabs-underlined .tabs-header .tabs-header-item {
    background-color: var(--color-white);
    border: var(--border-size-none);
    border-bottom: var(--border-size-s) solid var(--color-neutral-1);
    color: var(--color-neutral-5);
    font-size: var(--font-size-s); 
    width: 11.4rem;
}

.tabs-underlined .tabs-header .tabs-header-item.active {
    border-bottom: var(--border-size-m) solid var(--color-red-light);
    border-top: var(--border-size-none);
    color: var(--color-red-light);
    font-weight: 600;
    text-shadow: none;
}

.tabs-underlined .tabs-header .tabs-header-item:first-child,
.tabs-underlined .tabs-header .tabs-header-item:last-child {
    border-left: var(--border-size-none);
    border-radius: var(--border-size-none); 
    border-right: var(--border-size-none);
} 

.tabs-underlined .tabs-header .tabs-header-item.active:first-child {
    border-left: var(--border-size-none);   
}




.course-card.tech-talk {
    height: 17.6875rem;
    position: relative;
}

.course-card.tech-talk .course-card-header .course-card-header__content {
    height: var(--space-xxl);
}

.course-card.tech-talk .course-card-content .course-card-tags-wrapper {
    bottom: var(--space-m);
    height: var(--space-l);
    position: absolute;
}

.tech-talks__image-banner {
    background: url(/training/img/tech_talks_series.png?86444) no-repeat center center;
    background-size: auto 100%;
    height: 26rem;
}

.tech-talks_see-live-sessions_button {
    transform: translateY(-5.5rem);
}

.layout.tech-talk .course-entry-page__layout.columns > .columns-item:first-child {
    margin-top: initial;
}

.layout.tech-talk .rate-button-top {
    margin-left: 22rem;
}

.phone .tech-talks__image-banner {
    background: url(/training/img/tech_talks_mobile.png?86444) no-repeat center center;
    background-size: auto 100%;
    height: 16rem;
}

.phone .tech-talks_see-live-sessions_button {
    transform: translateY(-6rem);
}

.phone .course-card.tech-talk {
    height: auto;
}




.timeline-item.active .timeline-item-icon,
.timeline-item.active .timeline-item-separator {
    background-color: var(--color-green-light);
}

.timeline-item-left {
    margin-right: var(--space-xl);
}

.timeline-item-right {
    width: 100%;
}



.title-body-separator {
    border-top: var(--border-size-l) solid var(--color-neutral-1);
}



.phone .user-image img {
    min-width: 1.5625rem;
}


.card {
    display: flex;
}

.card_col2 {
    flex: 1;
    padding-left: 1.96078431372549%;
}


.card-cert-title {
    display: flex;
}

.card-cert-title__text {
    flex: 1;
}

.card-cert-title__action:empty {
    display: none;
}


.certification-cardlist-desktop {
    padding-left: 40px;
    margin-left: 20px; 
}


.button-normal-popup {
    font-family: Cabin;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #686E76;
    align-items: center;
    text-align: center;
    background-color: #FFFFFF;
}

.button-default-popup {
    font-family: Cabin;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: white;
    align-items: center;
    text-align: center;
    background-color: #00802D;
}