﻿:root {
    --vi-base: #000;
    --vi-colour-01: #222;
    --vi-colour-02: #333;
    --vi-colour-03: #444;
    --vi-colour-04: #555;
    --vi-colour-05: #666;
    --vi-colour-06: #777;
    --vi-colour-07: #888;
    --vi-colour-08: #999;
    --vi-colour-09: #aaa;
    --vi-colour-10: #ccc;
    --vi-colour-11: #eee;
    --vi-lightest: #fff
}

header .accessibility:focus, header a:focus, header a:focus .logo_olt, header input:focus {
    outline: var(--vi-base) dotted 2px !important
}

.accessibility:focus, a:focus, a:focus .logo_olt, input:focus {
    outline: var(--vi-lightest) dotted 2px !important
}

a.focus, input.focus {
    *border: var(--vi-base) dotted 2px !important;
    padding: 0 !important
}

a, a:link, a:visited {
    color: var(--vi-colour-11);
    text-decoration: underline
}

    a:focus, a:hover {
        color: var(--vi-base) !important;
        background-color: var(--vi-lightest) !important;
        text-decoration: none !important
    }

    #header_container .main_menu li > a, .ls_curriculum_based, a:active {
        color: var(--vi-base)
    }

.dottedLine {
    border-bottom-color: var(--vi-colour-08) !important
}

h1, h2, h3, h4, h5 {
    color: var(--vi-lightest) !important;
    font-weight: 400
}

body, html {
    background-color: var(--vi-base) !important
}

#main_content .welcome, header, .large_panel_button {
    background-color: var(--vi-colour-02)
}

#nav li a, #nav > ul > li > a, #nav > ul > li > button, #top_menu a, .resources_hosting, body {
    color: var(--vi-lightest)
}

    #nav > ul > li > button:focus, #nav > ul > li > button:hover {
        background-color: var(--vi-lightest);
        color: var(--vi-base)
    }

footer {
    background-color: var(--vi-base)
}

#footer_container * {
    text-decoration: none
}

a.hype_page_no {
    background-color: var(--vi-colour-07)
}

a.selectedbox, .new_admin_button i {
    background-color: var(--vi-lightest)
}

a.lockedbox {
    background-color: var(--vi-colour-04)
}

.main_content {
    background-color: inherit
}

#page_content_previous_scores, .login_button {
    color: var(--vi-lightest) !important
}

.resources_link:focus, .resources_link:hover {
    color: var(--vi-lightest);
    -webkit-box-shadow: inset 0 0 0 2px #ccc !important;
    -moz-box-shadow: inset 0 0 0 2px #ccc !important;
    box-shadow: inset 0 0 0 2px #ccc !important
}

.user .main_content {
    -webkit-box-shadow: inset 0 0 0 2px #ccc !important;
    -moz-box-shadow: inset 0 0 0 2px #ccc !important;
    box-shadow: inset 0 0 0 2px #ccc !important
}

.user .main_content_fullwidth {
    -webkit-box-shadow: 0 0 0 2px #ccc !important;
    -moz-box-shadow: 0 0 0 2px #ccc !important;
    box-shadow: 0 0 0 2px #ccc !important
}

.column_box_sub_title, .welcome h1 {
    color: var(--vi-colour-10) !important
}

.resources_status_progress_bar, .resources_status_progress_bar_reward {
    background-color: var(--vi-colour-04)
}

.resources_status_star {
    border-color: var(--vi-colour-04)
}

.status_btn a {
    color: var(--vi-base)
}

.logo_sub_footer a, .logo_sub_footer img {
    background-color: var(--vi-lightest);
    border-radius: 2px;
    padding: 5px
}

#top_menu .signin, .course_info .tab a, .tab a {
    background-color: var(--vi-colour-05)
}

.subnav li.menu-item-has-children ul li a:focus, .subnav li.menu-item-has-children ul li a:hover {
    background-color: var(--vi-lightest);
    background-color: #fff;
    color: var(--vi-base)
}

.subnav li.menu-item-has-children ul {
    background-color: var(--vi-colour-05);
    background-color: #666
}

#nav > ul > li > a:focus, #nav > ul > li > a:hover {
    background-color: var(--vi-colour-04) !important;
    color: var(--vi-lightest) !important
}

#nav li div > ul, #nav li ul, #nav li > ul, #nav > ul > li:hover > a {
    background-color: var(--vi-colour-04)
}

    #nav li ul a {
        border-bottom: 1px var(--vi-colour-05) solid
    }

input, select, textarea {
    color: var(--vi-base);
    border: 1px solid var(--vi-base);
    background-color:var(--vi-colour-10);
}

::-webkit-input-placeholder {
    color: var(--vi-colour-05)
}

:-moz-placeholder {
    color: var(--vi-colour-05)
}

::-moz-placeholder {
    color: var(--vi-colour-05)
}

:-ms-input-placeholder {
    color: var(--vi-colour-02)
}

#scroll_to_top {
    color: var(--vi-lightest)
}

    #scroll_to_top span {
        color: var(--vi-colour-02);
        background-color: var(--vi-colour-11)
    }

    #scroll_to_top:hover span {
        background-color: var(--vi-colour-09)
    }

    #scroll_to_top:hover {
        color: var(--vi-colour-11)
    }

.tab a, .tab.active a {
    color: var(--vi-lightest) !important;
    text-decoration: none
}

    .tab a:hover {
        color: var(--vi-colour-04) !important
    }

.tab span {
    text-decoration: underline
}

.popup-end, a.old_course_next, a.old_course_prev {
    color: var(--vi-lightest);
    text-decoration: none
}

.icons_members_inner, article {
    background-color: var(--vi-base) !important
}

a.column_pillers, ul#comments, ul#posts {
    background-color: var(--vi-colour-02)
}

a:focus.column_pillers, a:hover.column_pillers {
    background-color: var(--oltmaincolour) !important
}

#news_columns {
    background-color: var(--vi-colour-05)
}

/*.highlight, */
.border_box, .highlight_box, .highlight_box_blogs, .highlight_box_news, .membership_status_inner, .news_column, .profiles_bio, .profiles_bio::after, .short_course_inner, .side_menu_title, .tab.active a, .tabs-bg, #pagecontent .responsive_video_container + .highlight {
    background-color: var(--vi-colour-02) !important
}

/*.highlight {
    color: var(--vi-lightest);
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid var(--vi-colour-08)
}*/

.external_link {
    color: var(--vi-colour-10)
}

.courses_countries_list a, .quote_box {
    color: var(--vi-base)
}

#side_menu .nav_content, .byline:hover, .quote_text, .table_admin tbody:hover {
    background-color: var(--vi-colour-05)
}

    .quote_text::after {
        border-color: var(--vi-colour-05) transparent
    }

#side_menu .navbyline:focus, #side_menu .navbyline:hover, .courses_countries_list a:focus, .courses_countries_list a:hover {
    background-color: var(--vi-lightest)
}

#login_box a, .button_form_clear, .button_form_send, .column_box_button, .login_box_lower, .login_box_lower h2, .login_sign_in, a.login_button {
    color: var(--vi-base) !important
}

#login_box {
    background-color: inherit
}

.feedback_pc1, .feedback_pc2, .feedback_pc3, .feedback_pc4 {
    color: #004d03
}

#tooltip {
    background-color: var(--vi-lightest) !important;
}

#tooltip:after {
    width: 0.625em;
    height: 0.625em;
    border-left: 1px solid var(--vi-base) !important;
    border-bottom: 1px solid var(--vi-base) !important;
    border-top: none;
    border-right: none;
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    background-color: var(--vi-lightest) !important;
    bottom: -5px;
}
#tooltip.top::after {
    top: -5px;
    -o-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    background-color: var(--vi-lightest) !important;
}

#tooltip {
    color: var(--vi-base) !important;
    text-shadow: none !important;
    border: 1px solid var(--vi-base) !important
}

#tooltip::after, .HYPE .tooltip-end::after {
    margin-left:-4px;
}
#hype_footer, .byline, .toggle_content, .toggle_course_content {
    background-color: var(--vi-colour-02)
}

.course_outline_content {
    background-color: var(--vi-base) !important
}

.byline {
    color: var(--vi-lightest)
}

.button:focus, .button:hover {
    color: var(--vi-base) !important;
    background-color: var(--vi-lightest)
}

.button_form_clear, .button_form_send {
    text-decoration: underline
}

    .button_form_clear:focus, .button_form_clear:hover, .button_form_send:focus, .button_form_send:hover {
        text-decoration: none;
        background-color: var(--vi-lightest)
    }

#hype_footer a, #hype_header a {
    color: var(--vi-colour-02);
    text-decoration: none
}

#main_container, .HYPE_scene, .progress-step h3, .progress-step h4 {
    background-color: var(--vi-base) !important
}

    .HYPE_scene .HYPE_scene {
        background-color: transparent !important
    }

.responsive_hype_wrapper .hype_element .HYPE_scene {
    background-color: var(--vi-lightest) !important
}

.HYPE_element, ul.help li::before {
    color: inherit
}

    .HYPE .vi, .hype_element .vi, .vi_apply {
        background-color: var(--vi-colour-02) !important;
        color: var(--vi-lightest) !important
    }

    .HYPE .vi_buttons, .hype_element .vi_buttons {
        background-color: var(--vi-colour-11) !important;
        color: var(--vi-colour-02) !important
    }

        .HYPE .vi_buttons:hover, .hype_element .vi_buttons:hover {
            background-color: var(--vi-colour-05) !important;
            color: var(--vi-colour-11) !important
        }

.white-popup {
    background: var(--vi-base);
    border: 1px solid var(--vi-colour-10)
}

#comment a.likelink, #comment a.likelist, .popup_buttons a {
    color: var(--vi-lightest);
    text-decoration: none
}

#blog_menu {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important
}

.blog_newsletter, .blog_search, .blog_title {
    background-color: var(--vi-colour-05) !important
}

#comments a, .comment_text {
    color: var(--vi-lightest)
}

#comments {
    margin-top:20px;
    background-color: var(--vi-colour-01) !important
}
.comment_text {
    background-color: var(--vi-colour-05)
}

#side_menu_mobile.side_menu_mobile_l::before, .side_menu_mobile_text {
    color: var(--vi-lightest) !important
}

.side_menu_mobile_line {
    background-color: var(--vi-lightest) !important
}

.contributions_fixed_position {
    background-color: var(--vi-colour-02) !important
}

.deletelink::before, .editlink::before, .replylink::before, .showrepbut::before {
    color: inherit !important
}

#side_menu_inner {
    background-color: var(--vi-colour-02);
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

#blog_menu, .non-contained {
    background-color: var(--vi-colour-04) !important
}

#side_menu .nav_content a, .external_link::after, .table_admin th, .table_admin tr:hover td, li a[target=_blank]::after, p a[target=_blank]::after {
    color: var(--vi-lightest)
}

#side_menu .navbyline:focus > a, #side_menu .navbyline:hover > a, #side_menu a.navbyline:focus .navbylineinner, #side_menu a.navbyline:hover .navbylineinner, a.hub_blog_link:focus .hub_blog_icons, a.hub_blog_link:focus .msg_lgrey, a.hub_blog_link:focus h4, a.hub_blog_link:focus p, a.hub_blog_link:hover .hub_blog_icons, a.hub_blog_link:hover .msg_lgrey, a.hub_blog_link:hover h4, a.hub_blog_link:hover p, a.hub_cont_link:focus .hub_cont_icons, a.hub_cont_link:hover .hub_cont_icons, a.hub_msg_link:focus .hub_msg_text, a.hub_msg_link:focus .hub_msg_title, a.hub_msg_link:focus .msg_lgrey, a.hub_msg_link:hover .hub_msg_text, a.hub_msg_link:hover .hub_msg_title, a.hub_msg_link:hover .msg_lgrey {
    color: var(--vi-base) !important
}

.table_admin { /*, table.table_admin tbody*/
    background-color: var(--vi-colour-02) !important
}

/*.table_quiz_results tr:hover td, table {
    color: var(--vi-base)
}*/

#quiz fieldset {
    border-color: var(--vi-lightest)
}

.table_pay {
    background-color: inherit
}

    .table_pay th {
        background: var(--vi-colour-05)
    }

.three_col_cell {
    background-color: var(--vi-colour-05)
}

a.courses_link:focus, a.courses_link:hover {
    background-color: inherit;
    color: inherit
}

.cpd_info {
    color: var(--vi-base)
}

.testimonials_box {
    background-color: var(--vi-colour-02)
}

.external_link:focus::after, .external_link:hover::after, li a:focus[target=_blank]::after, li a:hover[target=_blank]::after, p a:focus[target=_blank]::after, p a:hover[target=_blank]::after {
    color: var(--vi-base)
}

.feedback_inner_wrapper, .testimonials_bubble {
    background-color: var(--vi-colour-02);
    color: var(--vi-lightest)
}

    .testimonials_bubble::after {
        border-top-color: var(--vi-colour-02)
    }

.icon_container, .ticket_content {
    background-color: var(--vi-colour-04)
}

.ticket_theircomment {
    background-color: #007bff
}

    .ticket_theircomment::after {
        border-color: #007bff transparent
    }

.ticket_mycomment {
    background-color: #b35e00
}

    .ticket_mycomment::after {
        border-color: #b35e00 transparent
    }

a.resources_icon_link:focus, a.resources_icon_link:hover, a.summary_icon:focus, a.summary_icon:hover {
    background-color: inherit !important
}

.resources_icon {
    background-color: var(--vi-lightest)
}

.summary_menu {
    background-color: var(--vi-colour-03);
    color: var(--vi-lightest);
    filter: none;
    border: 1px solid var(--vi-colour-10)
}

    .summary_menu::after {
        border-bottom-color: var(--vi-lightest)
    }

#chat_window, #chat_window_in {
    -moz-box-shadow: inherit;
    -webkit-box-shadow: inherit;
    box-shadow: inherit;
    border: 1px solid var(--vi-lightest)
}

.chat_body {
    background-color: var(--vi-colour-05)
}

.ai_inner_wrapper, .ai_inner_wrapper .chat_body, .chat_comments {
    background-color: var(--vi-colour-03)
}

.banner_free, .live_chat_popup {
    background-color: #e67700;
    color: var(--vi-base)
}

.course_dropbtn, .dropdown-content {
    background-color: var(--vi-colour-04) !important
}

    .dropdown-content a {
        border-bottom: 1px solid var(--vi-colour-05) !important
    }

#footer_container .footer_copyright {
    color: var(--vi-colour-06)
}

.code_reveal {
    color: var(--vi-lightest)
}

#tut_profiles_wrapper .byline, .table_alerts .readbutton:hover {
    background-color: var(--vi-colour-08)
}

#tut_profiles_wrapper .toggle_content {
    background-color: var(--vi-colour-05)
}

#costs_styles .costs_go_back, #costs_styles .resources_title, #vimeo_options_dropdown .vimeo_title, #vimeo_options_nondropdown .vimeo_title {
    color: var(--vi-lightest)
}

.final_highlight, .resources_link:focus, .resources_link:hover {
    background-color: var(--vi-colour-05) !important
}

.checker {
    background-color: var(--vi-lightest)
}

#vimeo_options_dropdown, #vimeo_options_nondropdown {
    background-color: inherit;
    color: inherit
}

.textrow {
    background-color: var(--vi-colour-02) !important
}

.speechbubble {
    color: var(--vi-base)
}

    #activity .stats_table tbody:hover, #activity .stats_table tbody:hover a, #upcoming .stats_table tbody:hover, #upcoming .stats_table tbody:hover a, .clear_input, .speechbubble a, .webinar_choice_2 h3 {
        color: var(--vi-colour-05) !important
    }

#guide_menu #side_menu_mobile, #guide_menu .highlight_box, .divBoxoutTableCell {
    background-color: var(--vi-colour-04) !important
}

.guide_selected {
    background-color: var(--vi-colour-06) !important
}

#guide_menu a:hover {
    color: var(--vi-base) !important
}

.alert_message {
    background-color: inherit
}

.message_highlight {
    background-color: var(--vi-colour-05)
}

svg g text {
    fill: var(--vi-lightest) !important
}

svg .google-visualization-tooltip text {
    fill: var(--vi-base) !important
}

.icon_scroll_down::after, .list_scroll li a::after {
    color: var(--vi-colour-11)
}

.hub_tab, .pagination > li > a, .pagination > li > span, .search_highlight {
    color: var(--vi-base)
}

.hub_tab {
    background-color: var(--vi-colour-10)
}

    .hub_tab a {
        background-color: var(--vi-colour-06)
    }

.hub_msg_text, .hub_msg_title, .hub_side_menu_blogs p, .hub_side_menu_rem td {
    color: var(--vi-lightest)
}

.hub_blog_icons, .hub_cont_icons, .msg_lgrey {
    color: var(--vi-colour-11)
}

.msg_highlight {
    background-color: var(--vi-lightest);
    color: var(--vi-base);
    text-decoration: none
}

.c-day, .c-event-item {
    color: #000
}

.goal_info::before, .sliderContent {
    background-color: #000
}

.goal_info::before {
    color: var(--vi-lightest)
}

.exampleItem, .exampleItemDifficulties, .exampleItemStrengths {
    color: var(--vi-base)
}

#summaryContent, .observationToWorkOn {
    border-color: var(--vi-lightest);
    color: var(--vi-lightest);
    font-weight: 700
}

.areaSelect:focus, .areaSelect:hover {
    background-color: var(--vi-colour-05)
}

.goals_prompt_result {
    color: var(--vi-colour-02)
}

.levelsText {
    border-bottom-color: var(--vi-colour-08)
}

.choose_goal_type_wrapper {
    background-color: var(--vi-base)0 !important;
    color: var(--vi-lightest)
}

.infobutton_larger {
    color: var(--vi-lightest)
}

.learner_highlight {
    color: var(--vi-base) !important
}

#activity .stats_table tbody a:hover, #upcoming .stats_table tbody a:hover {
    background-color: var(--vi-colour-08) !important;
    color: var(--vi-lightest) !important
}

.note-box {
    background: #dc143c
}

.expandabletaskdescription, .frame_shaded, .goalcontainer, .infoclosebutton::before, .sg_highlight_box, .supportinfo {
    background-color: var(--vi-colour-01) !important
}

.sg_editbutton {
    color: var(--vi-lightest) !important;
    text-decoration: underline
}

    .sg_editbutton:focus, .sg_editbutton:hover {
        background-color: var(--vi-lightest);
        color: var(--vi-base) !important
    }

.sg_example_prompts {
    color: var(--vi-colour-10) !important
}

    .sg_example_prompts::after {
        border-color: var(--vi-base) transparent transparent !important
    }

a.sg_printbutton {
    color: var(--vi-lightest) !important
}

    a.sg_printbutton:focus, a.sg_printbutton:hover {
        color: var(--vi-base) !important
    }

.smart_goals_divTable, .smart_goals_step_wrapper .tab a {
    background-color: var(--vi-colour-02)
}

#summaryContent_new, .observationToWorkOn_new, .smart_goals_domain_select, .smart_goals_highlight {
    background-color: var(--vi-colour-01)
}

.smart_goals_description_text, .smart_goals_question_numbering, .smart_goals_you_wrote {
    color: var(--vi-lightest)
}

.smart_goals_inner_wrap .byline, .smart_goals_inner_wrap .toggle_content, .smart_goals_wrapper {
    background-color: var(--vi-colour-01)
}

.smart_goal_title > span {
    background: var(--vi-colour-02)
}

.smart_goals_q_highlighted, .smart_goals_tab_body {
    background-color: var(--vi-colour-05)
}

.smart_goals_done1, .smart_goals_done2, .smart_goals_done3, .smart_goals_done4, .smart_goals_todo {
    color: var(--vi-colour-08) !important
}

.medal_highlight h3, .smart_goals_q_highlighted .smart_goals_todo, .underlined_info h3 {
    color: var(--vi-lightest) !important
}

.smart_goals_choices_wrapper {
    background-color: var(--vi-colour-11)
}

.smart_goals_step_wrapper .tab a {
    border: initial;
    border-bottom: 1px solid var(--vi-colour-10)
}

@media screen and (max-width:750px) {
    .smart_goals_step_wrapper .tab a {
        background-color: var(--vi-colour-02);
        border: 2px solid transparent
    }

    .smart_goals_step_wrapper .tab.active a {
        background-color: var(--vi-colour-11) !important;
        color: var(--vi-base) !important
    }
}

.slider_course_wrapper {
    background-color: var(--vi-colour-05)
}

.slider_course_enrolling, .slider_course_hours, .slider_course_info, .slider_course_name, .slider_course_type {
    color: var(--vi-lightest)
}

.bg_colour_grey {
    background-color: var(--vi-colour-02)
}

a.button_download:link {
    color: var(--vi-base)
}

.achieve_goals_bg {
    background-color: var(--vi-colour-08)
}

.medal_highlight, .table_membership {
    background-color: var(--vi-colour-05)
}

    .table_membership, .table_membership td, .table_membership th {
        border: 5px solid var(--vi-base)
    }

        .table_membership .bg_colour {
            background-color: var(--vi-base)
        }

.table_membership_remove_border_btm {
    border-bottom-color: var(--vi-colour-05) !important
}

.table_membership_remove_border_top {
    border-top-color: var(--vi-colour-05) !important
}

.membership_status_divTable {
    background-color: var(--vi-colour-05)
}

.bringout {
    background-color: var(--vi-colour-02)
}

.table_membership_remove_border_btm.bringout {
    border-bottom-color: var(--vi-colour-02) !important
}

.memberships .tab a, .memberships_benefits, .memberships_buy_note, .memberships_info_inner_partner {
    background-color: var(--vi-colour-05)
}

.new_admin_button span, .testimonials_members_from, .testimonials_members_name, .testimonials_members_title {
    color: var(--vi-lightest)
}

.white-popup {
    background-color: var(--vi-base)
}

.webinars_divTable {
    background-color: var(--vi-colour-05)
}

.learn_box_blue, .toggle_course_page_titles .toggle_content {
    background-color: var(--vi-base)
}

.choose_course_wrapper, .choose_webinar_wrapper, .general_newsletter_wrapper {
    background-color: var(--vi-colour-02)
}

.choose_certs, .choose_hours, .choose_members {
    color: var(--vi-colour-10)
}

.highlight_box_dbl, .webinar_coming_soon_wrapper {
    background-color: var(--vi-colour-02) !important
}

.new_admin_button.selected span, .webinar_title_main, .webinar_title_main h1, .webinar_title_main h2, .webinar_title_main h3, .webinar_title_main h4, .webinar_title_main h5 {
    color: var(--vi-base) !important
}

.box_inner_style, .contact_box {
    background-color: var(--vi-colour-02) !important
}

.new_admin_button {
    background-color: var(--vi-base) !important
}

    .new_admin_button.selected {
        background-color: var(--vi-lightest) !important
    }

.updateerrortext, .updatesuccesstext {
    color: var(--vi-base) !important
}

.screen_reader_vi {
    background-color: inherit
}
.courses_type_1>h3,
.courses_type_2>h3,
.courses_type_3>h3 {
    color: var(--vi-base) !important;
}
/* CK EDITOR */
.vi_box_spacing {
    padding:20px;
}
.cke_chrome {
    border:none !important;   
}
.cke_top {
    background-color: var(--base) !important
}
.cke_wysiwyg_frame, .cke_wysiwyg_div {
    background-color: var(--vi-colour-04) !important
}
.cke_reset {
    background: none !important;
}
iframe.cke_wysiwyg_frame,
.cke_bottom  {
    background-color:var(--vi-colour-10) !important;
}
.cke_toolbar_separator {
    background-color: var(--vi-colour-11) !important;
}
.cke_toolgroup a.cke_button:last-child::after, .cke_toolgroup a.cke_button.cke_button_disabled:hover:last-child::after, .cke_combo::after {
    border-right: 1px solid var(--vi-colour-11) !important;
}
.cke_resizer {
    border-color: transparent var(--vi-colour-01) transparent transparent !important;
}
.cke_button_icon {
    -webkit-filter: invert(100%);
    filter: invert(100%);
}
.cke_button_label,
.cke_combo_text {
    color: var(--vi-lightest) !important;
}
.cke_combo_arrow {
    border-top-color: var(--vi-lightest) !important;
}
iframe.cke_wysiwyg_frame.cke_reset html body.cke_editable p {
    color:#ff00ff !important;
}
.cke_combo_on a.cke_combo_button, .cke_combo_off a.cke_combo_button:hover, .cke_combo_off a.cke_combo_button:focus, .cke_combo_off a.cke_combo_button:active, .cke_combo_button:hover .cke_combo_text, .cke_combo_button:focus .cke_combo_text, .cke_combo_button:active .cke_combo_text, .cke_combo_button:active .cke_combo_text, .cke_combo_on .cke_combo_text {
    color:var(--vi-base) !important;
}
.cke_editable::after {
    border-top:red !important;
}
.tutor_comments, .tutor_comments th, .tutor_comments h3 {
    color:var(--vi-base) !important;
}
/* STEPS */
.registration-box {
    background-color:var(--vi-colour-02) !important;
}
.info-panel {
    background-color:var(--vi-colour-01) !important;
}
.info-panel strong {
    background-color:var(--vi-colour-04) !important;
}
.summary-card {
    background-color:var(--vi-colour-01) !important;
}