/* ------------------------------------------
 Roboto - Default
------------------------------------------ */

/* roboto-300 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/roboto-v20-latin-300.eot'); /* IE9 Compat Modes*/
    src: local('Roboto Light'), local('Roboto-Light'),
    url('../fonts/roboto-v20-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/roboto-v20-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/roboto-v20-latin-300.woff') format('woff'), /* Modern Browsers */
    url('../fonts/roboto-v20-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/roboto-v20-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/roboto-v20-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Roboto'), local('Roboto-Regular'),
    url('../fonts/roboto-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/roboto-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/roboto-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
    url('../fonts/roboto-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/roboto-v20-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-500 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/roboto-v20-latin-500.eot'); /* IE9 Compat Modes */
    src: local('Roboto Medium'), local('Roboto-Medium'),
    url('../fonts/roboto-v20-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/roboto-v20-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/roboto-v20-latin-500.woff') format('woff'), /* Modern Browsers */
    url('../fonts/roboto-v20-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/roboto-v20-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: url('../fonts/roboto-v20-latin-italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Italic'), local('Roboto-Italic'),
    url('../fonts/roboto-v20-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/roboto-v20-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/roboto-v20-latin-italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/roboto-v20-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/roboto-v20-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/roboto-v20-latin-700.eot'); /* IE9 Compat Modes */
    src: local('Roboto Bold'), local('Roboto-Bold'),
    url('../fonts/roboto-v20-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/roboto-v20-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/roboto-v20-latin-700.woff') format('woff'), /* Modern Browsers */
    url('../fonts/roboto-v20-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/roboto-v20-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* ------------------------------------------
 DIN Next LT Pro - Compassana
------------------------------------------ */
/* DINNextLTPro-Medium-300 - latin */
@font-face {
    font-family: 'DINNextLTPro';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/DINNextLTPro-Light.eot'); /* IE9 Compat Modes*/
    src: local('DINNextLTPro Light'), local('DINNextLTPro-Light'),
    url('../fonts/DINNextLTPro-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINNextLTPro-Light.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINNextLTPro-Light.woff') format('woff'), /* Modern Browsers */
    url('../fonts/DINNextLTPro-Light.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINNextLTPro-Light.svg#DINNextLTPro-Light') format('svg'); /* Legacy iOS */
}

/* DINNextLTPro-Medium-400 - latin */
@font-face {
    font-family: 'DINNextLTPro';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/DINNextLTPro-Regular.eot'); /* IE9 Compat Modes */
    src: local('DINNextLTPro Regular'), local('DINNextLTPro-Regular'),
    url('../fonts/DINNextLTPro-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINNextLTPro-Regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINNextLTPro-Regular.woff') format('woff'), /* Modern Browsers */
    url('../fonts/DINNextLTPro-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINNextLTPro-Regular.svg#DINNextLTPro-Regular') format('svg'); /* Legacy iOS */
}
/* DINNextLTPro-Medium-500 - latin */
@font-face {
    font-family: 'DINNextLTPro';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/DINNextLTPro-Medium.eot'); /* IE9 Compat Modes */
    src: local('DINNextLTPro Medium'), local('DINNextLTPro-Medium'),
    url('../fonts/DINNextLTPro-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINNextLTPro-Medium.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINNextLTPro-Medium.woff') format('woff'), /* Modern Browsers */
    url('../fonts/DINNextLTPro-Medium.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINNextLTPro-Medium.svg#DINNextLTPro-Medium') format('svg'); /* Legacy iOS */
}
/* DINNextLTPro-Italic-400 - latin */
@font-face {
    font-family: 'DINNextLTPro';
    font-style: italic;
    font-weight: 400;
    src: url('../fonts/DINNextLTPro-Italic.eot'); /* IE9 Compat Modes */
    src: local('DINNextLTPro Italic'), local('DINNextLTPro-Italic'),
    url('../fonts/DINNextLTPro-Italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINNextLTPro-Italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINNextLTPro-Italic.woff') format('woff'), /* Modern Browsers */
    url('../fonts/DINNextLTPro-Italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINNextLTPro-Italic.svg#DINNextLTPro-Italic') format('svg'); /* Legacy iOS */
}
/* DINNextLTPro-Bold-700 - latin */
@font-face {
    font-family: 'DINNextLTPro';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/DINNextLTPro-Bold.eot'); /* IE9 Compat Modes */
    src: local('DINNextLTPro Bold'), local('DINNextLTPro-Bold'),
    url('../fonts/DINNextLTPro-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/DINNextLTPro-Bold.woff2') format('woff2'), /* Super Modern Browsers */
    url('../fonts/DINNextLTPro-Bold.woff') format('woff'), /* Modern Browsers */
    url('../fonts/DINNextLTPro-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/DINNextLTPro-Bold.svg#DINNextLTPro-Bold') format('svg'); /* Legacy iOS */
}

/* ------------------------------------------
 TitilliumWeb - Barmer
------------------------------------------ */


@font-face {
    font-family: 'Titillium Web';
    src: url('../fonts/TitilliumWeb-Bold.eot');
    src: local('Titillium Web Bold'), local('TitilliumWeb-Bold'),
        url('../fonts/TitilliumWeb-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TitilliumWeb-Bold.woff2') format('woff2'),
        url('../fonts/TitilliumWeb-Bold.woff') format('woff'),
        url('../fonts/TitilliumWeb-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}


@font-face {
    font-family: 'Titillium Web';
    src: url('../fonts/TitilliumWeb-LightItalic.eot');
    src: local('Titillium Web Light Italic'), local('TitilliumWeb-LightItalic'),
        url('../fonts/TitilliumWeb-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TitilliumWeb-LightItalic.woff2') format('woff2'),
        url('../fonts/TitilliumWeb-LightItalic.woff') format('woff'),
        url('../fonts/TitilliumWeb-LightItalic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Titillium Web';
    src: url('../fonts/TitilliumWeb-Light.eot');
    src: local('Titillium Web Light'), local('TitilliumWeb-Light'),
        url('../fonts/TitilliumWeb-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TitilliumWeb-Light.woff2') format('woff2'),
        url('../fonts/TitilliumWeb-Light.woff') format('woff'),
        url('../fonts/TitilliumWeb-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Titillium Web';
    src: url('../fonts/TitilliumWeb-Regular.eot');
    src: local('Titillium Web Regular'), local('TitilliumWeb-Regular'),
        url('../fonts/TitilliumWeb-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TitilliumWeb-Regular.woff2') format('woff2'),
        url('../fonts/TitilliumWeb-Regular.woff') format('woff'),
        url('../fonts/TitilliumWeb-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Titillium Web';
    src: url('../fonts/TitilliumWeb-SemiBold.eot');
    src: local('Titillium Web SemiBold'), local('TitilliumWeb-SemiBold'),
        url('../fonts/TitilliumWeb-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TitilliumWeb-SemiBold.woff2') format('woff2'),
        url('../fonts/TitilliumWeb-SemiBold.woff') format('woff'),
        url('../fonts/TitilliumWeb-SemiBold.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

/* ------------------------------------------
 Concordia - AvenirMedium, sans-serif
------------------------------------------ */

@font-face {
    font-family: 'AvenirMedium';
    src: local('AvenirMedium Bold'), local('AvenirMedium-Bold'),
        url('../fonts/AvenirLTW05-95Black.woff2') format('woff2'),
        url('../fonts/AvenirLTW05-95Black.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}


@font-face {
    font-family: 'AvenirMedium';
    src: local('AvenirMedium Regular Italic'), local('AvenirMedium-RegularItalic'),
        url('../fonts/AvenirLTW05-55Oblique.woff2') format('woff2'),
        url('../fonts/AvenirLTW05-55Oblique.woff') format('woff');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'AvenirMedium';
    src: local('AvenirMedium Regular'), local('AvenirMedium-Regular'),
        url('../fonts/AvenirLTW05-55Roman.woff2') format('woff2'),
        url('../fonts/AvenirLTW05-55Roman.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'AvenirMedium';
    src: local('AvenirMedium Regular'), local('AvenirMedium-Regular'),
        url('../fonts/AvenirLTW05-55Roman.woff2') format('woff2'),
        url('../fonts/AvenirLTW05-55Roman.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'AvenirMedium';
    src: local('AvenirMedium SemiBold'), local('AvenirMedium-SemiBold'),
        url('../fonts/AvenirLTW05-85Heavy.woff2') format('woff2'),
        url('../fonts/AvenirLTW05-85Heavy.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

/* ------------------------------------------
  - AOK+ - AOKBuenosAiresText
------------------------------------------ */


@font-face {
    font-family: 'AOKBuenosAiresText';
    src: local('AOKBuenosAiresText Bold'), local('AOKBuenosAiresText-Bold'),
        url('../fonts/AOKBuenosAiresText-Bold.woff2') format('woff2'),
        url('../fonts/AOKBuenosAiresText-Bold.woff') format('woff'),
        url('../fonts/AOKBuenosAiresText-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}


@font-face {
    font-family: 'AOKBuenosAiresText';
    src: local('AOKBuenosAiresText Regular Italic'), local('AOKBuenosAiresText-RegularItalic'),
        url('../fonts/AOKBuenosAiresText-RegularItalic.woff2') format('woff2'),
        url('../fonts/AOKBuenosAiresText-RegularItalic.woff') format('woff'),
        url('../fonts/AOKBuenosAiresText-RegularItalic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'AOKBuenosAiresText';
    src: local('AOKBuenosAiresText Regular'), local('AOKBuenosAiresText-Regular'),
        url('../fonts/AOKBuenosAiresText-Regular.woff2') format('woff2'),
        url('../fonts/AOKBuenosAiresText-Regular.woff') format('woff'),
        url('../fonts/AOKBuenosAiresText-Regular.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'AOKBuenosAiresText';
    src: local('AOKBuenosAiresText Regular'), local('AOKBuenosAiresText-Regular'),
        url('../fonts/AOKBuenosAiresText-Regular.woff2') format('woff2'),
        url('../fonts/AOKBuenosAiresText-Regular.woff') format('woff'),
        url('../fonts/AOKBuenosAiresText-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'AOKBuenosAiresText';
    src: local('AOKBuenosAiresText SemiBold'), local('AOKBuenosAiresText-SemiBold'),
        url('../fonts/AOKBuenosAiresText-SemiBold.woff2') format('woff2'),
        url('../fonts/AOKBuenosAiresText-SemiBold.woff') format('woff'),
        url('../fonts/AOKBuenosAiresText-SemiBold.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}


/* ------------------------------------------
 Material Icons
------------------------------------------ */

/*@font-face {*/
/*    font-family: 'Material Icons';*/
/*    font-style: normal;*/
/*    font-weight: 400;*/
/*    src: url('../fonts/MaterialIcons-Regular.eot'); !* For IE6-8 *!*/
/*    src: local('Material Icons'),*/
/*    local('MaterialIcons-Regular'),*/
/*    url('../fonts/MaterialIcons-Regular.woff2') format('woff2'),*/
/*    url('../fonts/MaterialIcons-Regular.woff') format('woff'),*/
/*    url('../fonts/MaterialIcons-Regular.ttf') format('truetype');*/
/*}*/
/*.root-pf-chatbot .material-icons {*/
/*    font-family: 'Material Icons';*/
/*    font-weight: normal;*/
/*    font-style: normal;*/
/*    font-size: 24px;  !* Preferred icon size *!*/
/*    !*display: inline-block; *!*/
/*    line-height: 1;*/
/*    text-transform: none;*/
/*    letter-spacing: normal;*/
/*    word-wrap: normal;*/
/*    white-space: nowrap;*/
/*    direction: ltr;*/
/*    -webkit-font-smoothing: antialiased; !* Support for all WebKit browsers. *!*/
/*    text-rendering: optimizeLegibility; !* Support for Safari and Chrome. *!*/
/*    -moz-osx-font-smoothing: grayscale; !* Support for Firefox. *!*/
/*    font-feature-settings: 'liga'; !* Support for IE. *!*/
/*}*/


/* ------------------------------------------
 SVG replacements for Material Icons
 @TODO We have to move this code and SVG files to a proper place.
------------------------------------------ */

html.root-pf-chatbot .radio.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons {
    color: transparent !important;
    display: block !important;
    content: ' ' !important;
    background-size: 22px 22px !important;
    height: 22px !important;
    width: 22px !important;
}

html:not(.root-pf-chatbot) .radio.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons {
    color: transparent !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
}

.radio.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons:not(.icon--radio) {
    background-image: url('./material-icons-alternatives/Radio_Button_Unchecked.svg') !important;
}
.radio.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons.icon--radio {
  /*  background-image: url('./material-icons-alternatives/Radio_Button_Checked.svg') !important;*/
}
html.root-pf-chatbot .choose-main-symptom-popup .radio.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons.icon--radio {
    /*background-image: url('./material-icons-alternatives/Radio_Button_Checked.svg') !important;*/
}
/* Fix for Languages dropdown (in authenticated user's header) */
.account-settings .radio.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons {
    bottom: 4px;
}

html:not(.root-pf-chatbot) .checkbox.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons {
    color: transparent !important;
    display: block !important;
    content: ' ' !important;
    background-image: url('./material-icons-alternatives/Check_Box_Unchecked.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
}
html:not(.root-pf-chatbot) .checkbox.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons.icon--checkbox {
  /*  color: transparent !important;*/
    display: block !important;
    content: ' ' !important;
  /*  background-image: url('./material-icons-alternatives/Check_Box_Checked.svg') !important;*/
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
}
html:not(.root-pf-chatbot) .checkbox.no-selected-symptom.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons {
    color: transparent !important;
    display: block !important;
    content: ' ' !important;
    background-image: url('./material-icons-alternatives/Check_Box_No_Unchecked.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
}
html:not(.root-pf-chatbot) .checkbox.no-selected-symptom.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons.icon--checkbox {
    color: transparent !important;
    display: block !important;
    content: ' ' !important;
    background-image: url('./material-icons-alternatives/Check_Box_No_Checked.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
}

/** ##### DATATABLE icons (used for Assessment List) - ##### **/

/* --- Sort/Order --- */
html:not(.root-pf-chatbot) .theme--light .datatable.table th.column.sortable > i.icon.material-icons {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 16px 16px !important;
    height: 16px !important;
    width: 16px !important;
}
html:not(.root-pf-chatbot) .theme--light .datatable.table thead th.column.sortable.active > i.icon.material-icons {
    /*background-image: url('./material-icons-alternatives/Sort_Up_Red.svg') !important;*/
}
html:not(.root-pf-chatbot) .theme--light .datatable.table thead th.column.sortable:hover:not(.active) > i.icon.material-icons {
    background-image: url('./material-icons-alternatives/Sort_Up_Grey.svg') !important;
}

/* --- Clear Search --- */
html:not(.root-pf-chatbot) .assessment-list-table-container .assessment-list-search-criteria-row .input-group__input .input-group__append-icon {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 20px 20px !important;
    height: 20px !important;
    width: 20px !important;
    /*background-image: url('./material-icons-alternatives/Clear_Red.svg') !important;*/
}
/* --- Filter: calendar/date picker --- */
html:not(.root-pf-chatbot) .picker.picker--date .date-picker-header i.icon.material-icons {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
}
html:not(.root-pf-chatbot) .picker.picker--date .date-picker-header .btn--icon:first-of-type i.icon.material-icons:first-of-type {
    background-image: url('./material-icons-alternatives/Arrow_Left.svg') !important;
}
html:not(.root-pf-chatbot) .picker.picker--date .date-picker-header .btn--icon:last-of-type i.icon.material-icons {
    background-image: url('./material-icons-alternatives/Arrow_Right.svg') !important;
}

/* --- Pagination --- */
html:not(.root-pf-chatbot) .theme--light .datatable .datatable__actions .datatable__actions__range-controls button.btn.btn--icon .icon.material-icons {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
}
/* "Next Page" arrow */
html:not(.root-pf-chatbot) .theme--light .datatable .datatable__actions .datatable__actions__range-controls button.btn.btn--icon:last-of-type .icon.material-icons {
    background-image: url('./material-icons-alternatives/Arrow_Right.svg') !important;
}
html:not(.root-pf-chatbot) .theme--light .datatable .datatable__actions .datatable__actions__range-controls button.btn.btn--icon.btn--disabled:last-of-type .icon.material-icons {
    background-image: url('./material-icons-alternatives/Arrow_Right_DIsabled.svg') !important;
}
/* "Previous Page" arrow */
html:not(.root-pf-chatbot) .theme--light .datatable .datatable__actions .datatable__actions__range-controls button.btn.btn--icon:first-of-type .icon.material-icons {
    background-image: url('./material-icons-alternatives/Arrow_Left.svg') !important;
}
html:not(.root-pf-chatbot) .theme--light .datatable .datatable__actions .datatable__actions__range-controls button.btn.btn--icon.btn--disabled:first-of-type .icon.material-icons {
    background-image: url('./material-icons-alternatives/Arrow_Left_Disabled.svg') !important;
}
/* "Rows Per Page" dropdown */
html:not(.root-pf-chatbot) .theme--light .datatable .datatable__actions__select .input-group--select .input-group__input .input-group__append-icon {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    background-image: url('./material-icons-alternatives/Arrow_Drop_Down.svg') !important;
    background-position: center;
}


/** ##### DROPDOWN ARROW - ##### **/
html:not(.root-pf-chatbot) .input-group--select.select-value .icon.material-icons.input-group__append-icon,
html:not(.root-pf-chatbot) .language-option .icon.material-icons,
html:not(.root-pf-chatbot) .user-account-card .input-group .icon.material-icons {
  /*  background-image: url('./material-icons-alternatives/Arrow_Down_Red.svg') !important;*/
    background-size: 36px 36px !important;
    height: 36px !important;
    width: 36px !important;
    color: transparent !important;
   /* margin-right: 9px;*/
}

html:not(.root-pf-chatbot) .input-group--select.select-value.answer-value .icon.material-icons.input-group__append-icon,
html:not(.root-pf-chatbot) .language-option.answer-value .icon.material-icons,
html:not(.root-pf-chatbot) .translation-selector__select__input-group .icon.material-icons,
html:not(.root-pf-chatbot) .user-registration-input-field.select-option .icon.material-icons,
html:not(.root-pf-chatbot) .user-decision-container .icon.material-icons.input-group__append-icon {
    background-image: url('./material-icons-alternatives/Arrow_Down_Grey.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    color: transparent !important;
    margin-right: 9px;
}


/** ##### EXPAND/COLLAPSE PANELS -  ARROW ##### **/
html:not(.root-pf-chatbot) .symptoms-container .header__icon .icon,
html:not(.root-pf-chatbot) .scrolling-content-scoring .header__icon .icon,
html:not(.root-pf-chatbot) #expansions-list .header__icon .icon {
    background-image: url('./material-icons-alternatives/Expand.svg') !important;
    background-size: 30px 30px !important;
    height: 30px !important;
    width: 30px !important;
    color: transparent !important;
}

html:not(.root-pf-chatbot) .symptoms-container .expansion-panel__container--active .header__icon .icon,
html:not(.root-pf-chatbot) .scrolling-content-scoring .expansion-panel__container--active .header__icon .icon,
html:not(.root-pf-chatbot) #expansions-list .expansion-panel__container--active .header__icon .icon{
    background-image: url('./material-icons-alternatives/Colapse.svg') !important;
    background-size: 30px 30px !important;
    height:30px !important;
    width: 30px !important;
    color: transparent !important;
    transform: none !important;
}

html:not(.root-pf-chatbot) .general-container .expansion-panel__container .header__icon,
html:not(.root-pf-chatbot) .summary-content .expansion-panel__container .header__icon {
    border: none !important;
}


/** ##### SEARCH MAIN SYMPTOM INPUT -  SEARCH ICON ##### **/
html:not(.root-pf-chatbot) .main-symptom-container .input-searchSymptom.input-group .input-group__prepend-icon,
html:not(.root-pf-chatbot) .assessment-list-page-content .input-group .input-group__prepend-icon {
    background-image: url('./material-icons-alternatives/Search.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    color: transparent !important;
}

/** ##### SEARCH MAIN SYMPTOM INPUT -  CLEAR ICON ##### **/
html:not(.root-pf-chatbot) .main-symptom-container .input-searchSymptom.input-group .input-group__icon-clearable,
html:not(.root-pf-chatbot) .popup-scoring.sendAssessment .icon.input-group__icon-clearable,
html:not(.root-pf-chatbot) .assessment-list-page-content .input-group__icon-clearable {
    background-image: url('./material-icons-alternatives/Close_Grey.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    color: transparent !important;
    -webkit-animation: fadein 0.7s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 0.7s; /* Firefox < 16 */
    -ms-animation: fadein 0.7s; /* Internet Explorer */
    -o-animation: fadein 0.7s; /* Opera < 12.1 */
    animation: fadein 0.7s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/** ##### USER REGISTER PAGE - PASSWORD VISIBILITY ##### **/
.password-input .icon {
    background-image: url('./material-icons-alternatives/Visibility.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    color: transparent !important;
}

.password-input.password-visibility .icon {
    background-image: url('./material-icons-alternatives/Visibility_Off.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    color: transparent !important;
}

/** ##### LOGIN PAGE - CAROUSEL ##### **/
.login-container .carousel .btn--icon.carousel__controls__item {
    background-image: url('./material-icons-alternatives/Bullet_Transparency.svg') !important;
    background-size: 16px 16px !important;
    height: 16px !important;
    width: 16px !important;
    color: transparent !important;
}

.login-container .carousel .btn--icon.carousel__controls__item.carousel__controls__item--active {
    background-image: url('./material-icons-alternatives/Bullet.svg') !important;
    background-size: 16px 16px !important;
    height: 16px !important;
    width: 16px !important;
    color: transparent !important;
}

/* PRO mobile menu icon */
.header-bar-pathfinder .mobile-menu-btn .icon {
    background-image: url('./material-icons-alternatives/chatbot/Menu.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    color: transparent !important;
}


/** ###### CHATBOT only ###### **/

/* CHATBOT mobile menu icon */
html:not(.root-pf-chatbot) .header-menu .icon {
    background-image: url('./material-icons-alternatives/chatbot/Menu.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    color: transparent !important;
}

/* --- Edit answer --- */

/* Close popup, Close Edit Answer popup */
html.root-pf-chatbot i.icon.material-icons.icon-close-popup,
html.root-pf-chatbot i.icon.material-icons.close-edit-answer-icon {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    background-image: url('./material-icons-alternatives/Close_Grey.svg') !important;
}

/* Main Symptom popup */
html.root-pf-chatbot .popup-symptoms .main-symptom-search-input-container i.icon.material-icons.search-main-symptom-pf {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    /*background-image: url('./material-icons-alternatives/Search_Red.svg') !important;*/
}
/*html.root-pf-chatbot .choose-main-symptom-popup .search-main-symptom-wrapper .chatbot-search-input-main-symptom i.icon.material-icons.input-group__prepend-icon, */
html.root-pf-chatbot .choose-main-symptom-popup .search-main-symptom-wrapper i.icon.material-icons.search-main-symptom-pf {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    background-image: url('./material-icons-alternatives/Search_Red.svg') !important;
}
html.root-pf-chatbot .popup-symptoms .chatbot-search-input-main-symptom i.icon.material-icons.input-group__prepend-icon {

    /* @TODO Replace SVG file arrow with another arrow, as designed. */

    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    background-image: url('./material-icons-alternatives/Arrow_back.svg') !important;
}
html.root-pf-chatbot .popup-symptoms .chatbot-search-input-main-symptom i.icon.material-icons.input-group__append-icon {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
   /* background-image: url('./material-icons-alternatives/Clear_Red.svg') !important;*/
}
html.root-pf-chatbot .choose-main-symptom-popup .search-main-symptom-wrapper i.icon.material-icons.input-group__append-icon {

    display: none; /* We initially set display:none, but it will be override from javascript with display:initial only after the theme colored icon has been added to the page. This is needed in order to prevent "clear" text to be shown instead of the "X" icon. */

    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    /* background-image: url('./material-icons-alternatives/Clear_Red.svg') !important;*/
}
html.root-pf-chatbot .popup-symptoms .chatbot-chapters .header-chapter .close-expanded-chapter i.icon.material-icons,
html.root-pf-chatbot .popup-symptoms .chatbot-chapters .chapter-symptoms-list i.icon.material-icons.close-symptoms {
    color: transparent !important;
    font-size: 1px !important;
    display: block !important;
    content: ' ' !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    background-image: url('./material-icons-alternatives/Close_Grey.svg') !important;
}
html.root-pf-chatbot .popup-symptoms .input-group.radio .input-group__input > .icon.icon--selection-control.material-icons {
    top: 3px;
}
html.root-pf-chatbot .choose-main-symptom-popup .chapter-tree--chapter-list .chapter-list-row .icon.chapter-list-row--icon--close,
html.root-pf-chatbot .choose-main-symptom-popup .chapter-tree--chapter-list .subchapter-list-row .icon.subchapter-list-row--icon--close {
    background-image: url('./material-icons-alternatives/Close_Grey.svg') !important;
}


/* Related Symptoms */

html.root-pf-chatbot .related-symptom-list-related-symptoms .checkbox.input-group--selection-controls > .input-group__input > i.icon.icon--selection-control.material-icons:not(.icon--checkbox) {
    color: transparent !important;
    display: block;
    content: ' ' !important;
    /*background-image: url('./material-icons-alternatives/Radio_Button_Unchecked – 1.svg') !important;*/
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    top: 4px;
    position: absolute;
    opacity: 0.5;
}
html.root-pf-chatbot.theme--light .related-symptom-list-related-symptoms .checkbox.input-group--selection-controls > .input-group__input > i.icon.icon--selection-control.material-icons:not(.icon--checkbox) {
    background-image: url('./material-icons-alternatives/check_circle_Light.svg') !important;;
}
html.root-pf-chatbot.theme--dark .related-symptom-list-related-symptoms .checkbox.input-group--selection-controls > .input-group__input > i.icon.icon--selection-control.material-icons:not(.icon--checkbox) {
    background-image: url('./material-icons-alternatives/check_circle_Dark.svg') !important;;
}
html.root-pf-chatbot.theme--light.high--contrast .related-symptom-list-related-symptoms .checkbox.input-group--selection-controls > .input-group__input > i.icon.icon--selection-control.material-icons:not(.icon--checkbox) {
    background-image: url('./material-icons-alternatives/check_circle_HC.svg') !important;;
}
html.root-pf-chatbot.theme--dark.high--contrast .related-symptom-list-related-symptoms .checkbox.input-group--selection-controls > .input-group__input > i.icon.icon--selection-control.material-icons:not(.icon--checkbox) {
    background-image: url('./material-icons-alternatives/check_circle_Dark_HC.svg') !important;;
}
html.root-pf-chatbot .related-symptom-list-related-symptoms .checkbox.input-group--selection-controls > .input-group__input > i.icon.icon--selection-control.material-icons.icon--checkbox {
    color: transparent !important;
    display: block;
    content: ' ' !important;
  /*  background-image: url('./material-icons-alternatives/Radio_Button_Checked – 1.svg') !important;*/
    background-size: 22px 22px !important;
    height: 22px !important;
    width: 22px !important;
    top: 4px;
    position: absolute;
}

/* --- Chatbot - Share Assessment --- */
html.root-pf-chatbot--assessment-share .checkbox.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons {
    color: transparent !important;
    display: block !important;
    content: ' ' !important;
    background-image: url('./material-icons-alternatives/Check_Box_Unchecked.svg') !important;
    background-size: 22px 22px !important;
    height: 22px !important;
    width: 22px !important;
}
html.root-pf-chatbot--assessment-share .checkbox.input-group--selection-controls > .input-group__input > .icon.icon--selection-control.material-icons.icon--checkbox {
    color: transparent !important;
    display: block !important;
    content: ' ' !important;
   /* background-image: url('./material-icons-alternatives/Check_Box_Checked.svg') !important;*/
    background-size: 22px 22px !important;
    height: 22px !important;
    width: 22px !important;
}
html.root-pf-chatbot--assessment-share .assessment-share-page-btn-action.sendAssessment .icon.input-group__icon-clearable {
    background-image: url('./material-icons-alternatives/Close_Grey.svg') !important;
    background-size: 24px 24px !important;
    height: 24px !important;
    width: 24px !important;
    color: transparent !important;
    -webkit-animation: fadein 0.7s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 0.7s; /* Firefox < 16 */
    -ms-animation: fadein 0.7s; /* Internet Explorer */
    -o-animation: fadein 0.7s; /* Opera < 12.1 */
    animation: fadein 0.7s;
}


/* ------------------------------------------
 @TODO | This is not related to fonts!!!
 @TODO | WE MUST MOVE THIS CODE to a proper place!!!
 @TODO | We temporary added this code here because of some wrong configuration in webpack (that should be fixed
 @TODO | when we have time) that prevents the image files to be loaded when used in .scss files.
------------------------------------------ */
/* When the chatbot page is loading without this styling the chatbot section in the middle will not have full height.*/
/* We need this to simulate a full height chatbot section before the content is loaded.*/
html.theme--light.root-pf-chatbot body {
    background-image: url('../img/chatbot-light-theme-bg.png');
    background-repeat: repeat-y;
    background-position: top center;
}
html.root-pf-chatbot.theme--dark body {
    background-image: url('../img/chatbot-dark-theme-bg.png');
    background-repeat: repeat-y;
    background-position: top center;
}
html.root-pf-chatbot.theme--light.high--contrast body {
    background-image: url('../img/chatbot-light-high-contrast-theme-bg.png');
    background-repeat: repeat-y;
    background-position: top center;
}
html.root-pf-chatbot.theme--dark.high--contrast body {
    background-image: url('../img/chatbot-dark-high-contrast-bg.png');
    background-repeat: repeat-y;
    background-position: top center;
}