/* This stylesheet overwrites the walkme default styling.  All styles must be marked with !important
to ensure it will be honored. */

/* Balloons */

/* Links to other workflows */
a[data-trg],
a.walkme-custom-bbcode-link {
    color: var(--threegis-main-color) !important;
    text-decoration: underline !important;
}

/* Balloon Titles */
.walkme-custom-balloon-title  {
    background-color: var(--threegis-popup-dialog-background-color) !important;
    font-family: var(--paper-font-title_-_font-family) !important;
    -webkit-font-smoothing: var(--paper-font-title_-_-webkit-font-smoothing) !important;
    /* This should eventually not wrap, but until all titles are fixed, leave wrapping */
    /* white-space: var(--paper-font-title_-_white-space) !important; */
    white-space: normal !important;
    overflow: var(--paper-font-title_-_overflow) !important;
    text-overflow: var(--paper-font-title_-_text-overflow) !important;
    font-size: var(--paper-font-title_-_font-size) !important;
    font-weight: var(--paper-font-title_-_font-weight) !important;
    line-height: var(--paper-font-title_-_line-height) !important;
    color: var(--threegis-popup-dialog-text-color) !important;
}

.walkme-custom-balloon-title  {
    margin-top: 20px !important;
    padding: 0 32px 0 24px !important;  /* 32px to account for width of close button */
}

/* Balloon Titles */
.walkme-custom-balloon-title:empty {
    display:none !important;
}

/* Balloon Sidebar */
.walkme-custom-side-border {
    background: none !important;
}

/* Balloon section separator */
.walkme-custom-balloon-separator {
    height: 0 !important;
}

/* Balloon Content Section */
.walkme-custom-balloon-content {
    font-family: var(--paper-font-body1_-_font-family) !important;
    -webkit-font-smoothing: var(--paper-font-body1_-_-webkit-font-smoothing) !important;
    font-size: var(--paper-font-body1_-_font-size) !important;
    font-weight: var(--paper-font-body1_-_font-weight) !important;
    line-height: var(--paper-font-body1_-_line-height) !important;
    background-color: var(--threegis-popup-dialog-background-color) !important;
}

.walkme-custom-balloon-content {
    margin: 24px 0 !important;
    padding: 0 24px !important;
}

/* Balloon Content Section - Empty */
.walkme-custom-balloon-content:empty {
    display: none !important;
}

/* Balloon Button Section */
.walkme-custom-balloon-bottom-div,
.walkme-custom-balloon-top-div-bottom,
.walkme-custom-balloon-buttons-wrapper {
        position: relative !important;
        padding: 0 !important;
        margin: 0 !important;
        color: var(--paper-dialog-button-color, var(--primary-color)) !important;
        background-color: var(--threegis-popup-dialog-background-color) !important;

        @apply --layout-horizontal;
        @apply --layout-end-justified;
}

.walkme-custom-balloon-buttons-wrapper {
        padding: 8px 8px 8px 24px !important;
        margin: 0 !important;
}

/* Balloon Arrow Top / Bottom (arrow at top or bottom)*/
.walkme-custom-balloon-arrow-inner-top,
.walkme-custom-balloon-arrow-inner-bottom {
    border-right-color: transparent !important;
    border-left-color: transparent !important;
}

/* Balloon Arrow Right/Left (arrow at top)*/
.walkme-custom-balloon-arrow-inner-right,
.walkme-custom-balloon-arrow-inner-left {
    border-right-color: var(--threegis-popup-dialog-background-color) !important;
}

/* Balloon Arrow Outline (bottom is fine, right/left is not */
.walkme-custom-balloon-arrow-outer-right {
    border-right-color: rgb(198, 198, 198) !important;
}

.walkme-custom-balloon-arrow-inner-top {
    border-top-color: var(--threegis-popup-dialog-background-color) !important;
}

/* Balloon Buttons (from paper-button) */
.walkme-custom-balloon-button {
        @apply --layout-inline;
        @apply --layout-center-center;
        position: relative !important;
        box-sizing: border-box !important;
        min-width: 5.14em !important;
        margin: 0 0.29em !important;
        background: transparent !important;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
        -webkit-tap-highlight-color: transparent !important;
        font: inherit !important;
        text-transform: uppercase !important;
        outline-width: 0 !important;
        border-radius: 3px !important;
        -moz-user-select: none !important;
        -ms-user-select: none !important;
        -webkit-user-select: none !important;
        user-select: none !important;
        cursor: pointer !important;
        z-index: 0 !important;
        padding: 0.7em 0.57em !important;

        @apply --paper-font-common-base;
        @apply --paper-button;
        height: auto !important;
}

.walkme-custom-balloon-button:hover {
    background-color: var(--threegis-secondary-color) !important;
}

/* Balloon Button Text */
.walkme-custom-balloon-button-text {
    font-family: var(--paper-font-common-base_-_font-family) !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    font-variant-caps: inherit !important;
    text-transform: uppercase !important;
}

/* Balloon Buttons */
.walkme-custom-balloon-back-button,
.walkme-custom-balloon-done-button,
.walkme-custom-balloon-next-button {
    color: var(--threegis-main-color)!important;
    background-color: transparent !important;
}

/* Back Button Hover Style */
.walkme-custom-balloon-back-button:hover {
    color: var(--threegis-main-color)!important;
    background-color: var(--threegis-secondary-color) !important;
}

/* Unused content/button separator */
.walkme-custom-balloon-separator {
    display: none !important;
}

/* X Button */
.walkme-menu-click-close,
.walkme-custom-balloon-close-button {
    content: url('images/close.png') !important;
    font-size: 0 !important;
    height: 40px !important;
    width: 40px !important;
    padding: 8px !important;
}

/* Main Help Dialog */
#walkme-menu {
    border-left: none !important;
    background: var(--threegis-background-color) !important;
    box-shadow: var(--shadow-elevation-6dp_-_box-shadow) !important;
    border-radius: 0 !important;
    right: 8px !important;
    top: 45px !important;
}

#walkme-main {
    border-left: none !important;
    background: var(--threegis-background-color) !important;
}

/* Title */
#walkme-title {
    display: flex !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 15px !important;
    align-items: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    font-weight: bold !important;
    color: black !important;
    color: var(--threegis-window-header-active-title-color) !important;
    font-size: 14px !important;
    font-family: 'Roboto', 'Noto', sans-serif !important;
    background-color: #43B02A !important;
    background-color: var(--threegis-window-header-active-background-color) !important;
    overflow: hidden !important;
}

/* Tabs */
#walkme-tabs {
    height: 48px !important;
    border-bottom: none !important;
}

/* Selected Tab Button */
.walkme-tab-button-selected {
    border-bottom: 2px solid var(--threegis-tab-selection-color) !important;
    background-color: whitesmoke !important;
    background-color: var(--threegis-tab-background-color) !important;
}

/* Tab Buttons */
.walkme-tab-button {
    background-color: whitesmoke !important;
    background-color: var(--threegis-tab-background-color) !important;
    border-right: none !important;
    border-top: none !important;
}

/* Tab Text */
.walkme-tab-button-text {
    font-size: 14px !important;
    font-family: 'Roboto', 'Noto', sans-serif !important;
    font-weight: 500 !important;
    color: var(--threegis-main-tab-header-text-color) !important;
}

/* Tab Image - not consistent so hiding */
.walkme-tab-button-image {
    display: none !important;
}

/* Search Button */
.walkme-search-box-button {
    background-color: var(--threegis-main-color) !important;
}

/* Search Image */
.walkme-search-box-button-image {
    color: white !important;
}

/* Input with Walkme class, grid items */
.walkme-name {
    font-size: 14px !important;
    padding-top: 5px !important;
    font-family: 'Roboto', 'Noto', sans-serif !important;
    color: var(--threegis-main-color) !important;
}

/* Grid Icons */
.walkme-deployable-icon {
    color: var(--threegis-main-color) !important;
}

/* Grid Row Padding */
.walkme-deployable-row {
    padding: 4px 0 !important;
}

/* Player Menu Close Button */
.walkme-minimize {
    width: 24px !important;
    height: 24px !important;
    top: 0 !important;
    padding: 8px !important;
}

/* Error Dialogs */

/* Icon on Error Message */
div.walkme-popup-message-icon.maketutorialCssReset span {
	display: none !important;
}

/* Error dialog message box margins */
.walkme-popup-message-box.maketutorialCssReset {
    margin: 0 1px !important;
}

.walkme-to-destroy.walkme-to-remove.walkme-popup-message {
    padding: 0 !important;
}

/* Error Titles */
.walkme-popup-message-header.maketutorialCssReset {
    background-color: var(--threegis-popup-dialog-background-color) !important;
    font-family: var(--paper-font-title_-_font-family) !important;
    -webkit-font-smoothing: var(--paper-font-title_-_-webkit-font-smoothing) !important;
    /* This should eventually not wrap, but until all titles are fixed, leave wrapping */
    /* white-space: var(--paper-font-title_-_white-space) !important; */
    white-space: normal !important;
    overflow: var(--paper-font-title_-_overflow) !important;
    text-overflow: var(--paper-font-title_-_text-overflow) !important;
    font-size: var(--paper-font-title_-_font-size) !important;
    font-weight: var(--paper-font-title_-_font-weight) !important;
    line-height: var(--paper-font-title_-_line-height) !important;
    color: var(--threegis-popup-dialog-text-color) !important;
}

/* Error Title Padding to adjust for Dialog padding */
.walkme-popup-message-header.maketutorialCssReset {
    margin: 2px 1px 20px 1px !important;
}

/* Error Dialog Content Section */
.walkme-popup-message-content.maketutorialCssReset,
.walkme-popup-message-icon.maketutorialCssReset {
    font-family: var(--paper-font-body1_-_font-family) !important;
    -webkit-font-smoothing: var(--paper-font-body1_-_-webkit-font-smoothing) !important;
    font-size: var(--paper-font-body1_-_font-size) !important;
    font-weight: var(--paper-font-body1_-_font-weight) !important;
    line-height: var(--paper-font-body1_-_line-height) !important;
    background-color: var(--threegis-popup-dialog-background-color) !important;
}

/* Adjusting error dialog content margins for hard-coded error padding */

.walkme-popup-message-content.maketutorialCssReset {
   margin: 0 1px 8px 1px !important;
}

.walkme-popup-message-icon.maketutorialCssReset {
   margin: 8px 1px 24px 1px !important;
}

/* Error Dialog Button Section */
.walkme-popup-message-footer.maketutorialCssReset {
        position: relative !important;
        padding: 0 !important;
        margin: 0 !important;
        color: var(--paper-dialog-button-color, var(--primary-color)) !important;
        background-color: var(--threegis-popup-dialog-background-color) !important;

        @apply --layout-horizontal;
        @apply --layout-end-justified;
}

.walkme-popup-message-footer.maketutorialCssReset {
        padding: 8px 8px 8px 24px !important;
        margin: 0 !important;
        position: relative !important;
        height: 40px !important;
}

/* Error Dialog Buttons (from paper-button) */
.walkme-popup-message-ok-btn.maketutorialCssReset {
        @apply --layout-inline;
        @apply --layout-center-center;
        position: relative !important;
        box-sizing: border-box !important;
        min-width: 5.14em !important;
        margin: 0 0.29em !important;
        background: transparent !important;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
        -webkit-tap-highlight-color: transparent !important;
        font: inherit !important;
        text-transform: uppercase !important;
        outline-width: 0 !important;
        border-radius: 3px !important;
        -moz-user-select: none !important;
        -ms-user-select: none !important;
        -webkit-user-select: none !important;
        user-select: none !important;
        cursor: pointer !important;
        z-index: 0 !important;
        padding: 0.7em 0.57em !important;

        @apply --paper-font-common-base;
        @apply --paper-button;
        height: auto !important;
}

.walkme-popup-message-ok-btn.maketutorialCssReset:hover {
    font-weight: bold !important;
    background-color: var(--threegis-secondary-color) !important;
}

/* Error Dialog OK Button */
input.walkme-popup-message-ok-btn.maketutorialCssReset:hover {
    color: var(--threegis-main-color) !important;
    border: none !important;
}

input.walkme-popup-message-ok-btn.maketutorialCssReset {
	border: none !important;
    border-radius: 0 !important;
    position: absolute !important;
    bottom: 0 !important;
    right: 0 !important;
    color: var(--threegis-main-color)!important;
    background-color: transparent !important;
}

/* Player Close Button */
.walkme-menu.walkme-penguin .walkme-minimize, .walkme-menu.walkme-penguin * .walkme-minimize {
    min-width: 24px !important;
    min-height: 24px !important;
    padding-top: 3px!important;
    padding-right: 3px !important;
}

/* Player Menu  */
#walkme-menu  {
	font-family: var(--paper-font-common-base_-_font-family) !important;
	color: var(--threegis-main-color) !important;
	border-radius: 0 !important;
}

/* Player Tabs  */
#walkme-tabs {
	background-color: var(--threegis-tab-background-color) !important;
	border-color: var(--threegis-tab-background-color) !important;
  height: 48px !important;
  border-bottom: none !important;
}

div.walkme-menu.walkme-penguin.walkme-theme-white-green.walkme-direction-ltr .walkme-tab-button {
	border-right: 1px solid var(--threegis-tab-background-color) !important;
	border-top: none !important;
}

#walkme-tabs  div.walkme-css-reset.walkme-tab-button.walkme-override.walkme-css-reset.walkme-tab-button-not-selected {
	background-color: var(--threegis-tab-background-color) !important;
	font-family: var(--paper-font-common-base_-_font-family) !important;
	color: var(--primary-text-color) !important;
	font-weight: bold !important;
}

#walkme-tabs  div.walkme-1035436-tab-button.walkme-css-reset.walkme-tab-button.walkme-first-tab.walkme-override.walkme-css-reset.walkme-tab-button-not-selected  span  span.walkme-tab-button-text.walkme-css-reset.walkme-override.walkme-css-reset {
	font-size: 14px !important;
	font-weight: 500 !important;
}

#walkme-tabs  div.walkme-1035437-tab-button.walkme-css-reset.walkme-tab-button.walkme-override.walkme-css-reset.walkme-tab-button-not-selected  span  span.walkme-tab-button-text.walkme-css-reset.walkme-override.walkme-css-reset {
	font-size: 14px !important;
	font-weight: 500 !important;
}

#walkme-tabs  div.walkme-1035436-tab-button.walkme-css-reset.walkme-tab-button.walkme-first-tab.walkme-override.walkme-css-reset.walkme-tab-button-selected  span {
	font-size: 14px !important;
	font-weight: normal !important;
}

#walkme-tabs  div.walkme-1035437-tab-button.walkme-css-reset.walkme-tab-button.walkme-override.walkme-css-reset.walkme-tab-button-selected  span  span.walkme-tab-button-text.walkme-css-reset.walkme-override.walkme-css-reset {
	font-size: 14px !important;
	font-weight: 600l !important;
}

#walkme-tabs  div.walkme-css-reset.walkme-tab-button.walkme-override.walkme-css-reset.walkme-tab-button-selected {
	background-color: var(--threegis-tab-background-color) !important;
	border-bottom: 2px solid var(--threegis-main-color) !important;
}

/* Tab Icon */
#walkme-tabs > div.walkme-css-reset.walkme-tab-button.walkme-first-tab.walkme-override.walkme-css-reset.walkme-tab-button-selected > span > span.walkme-tab-button-image.walkme-icon-font.walkme-contains-flow.walkme-contains-walkthru.walkme-contains-shuttle.walkme-contains-content.walkme-visible.walkme-search.walkme-override.walkme-css-reset,
#walkme-tabs > div.walkme-css-reset.walkme-tab-button.walkme-first-tab.walkme-override.walkme-css-reset.walkme-tab-button-not-selected > span > span.walkme-tab-button-image.walkme-icon-font.walkme-contains-flow.walkme-contains-walkthru.walkme-contains-shuttle.walkme-contains-content.walkme-visible.walkme-search.walkme-override.walkme-css-reset,
#walkme-tabs  div.walkme-css-reset.walkme-tab-button.walkme-override.walkme-css-reset.walkme-tab-button-not-selected  span  span.walkme-tab-button-image.walkme-icon-font.walkme-visible.walkme-progress-bar.walkme-override.walkme-css-reset,
#walkme-tabs  div.walkme-css-reset.walkme-tab-button.walkme-override.walkme-css-reset.walkme-tab-button-selected  span  span.walkme-tab-button-image.walkme-icon-font.walkme-visible.walkme-progress-bar.walkme-override.walkme-css-reset {
	display: none !important;
}

#walkme-tabs  div.walkme-css-reset.walkme-tab-button.walkme-override.walkme-css-reset.walkme-tab-button-not-selected  span  span.walkme-tab-button-text.walkme-css-reset.walkme-override.walkme-css-reset, #walkme-tabs  div.walkme-css-reset.walkme-tab-button.walkme-override.walkme-css-reset.walkme-tab-button-selected  span  span.walkme-tab-button-text.walkme-css-reset.walkme-override.walkme-css-reset  {
	font-family: var(--paper-font-common-base_-_font-family) !important;
	color: var(--primary-text-color) !important;
	font-weight: bold !important;
}

/*  ---search area  */
div.walkme-direction-ltr.walkme-tab-header.walkme-override.walkme-css-reset > div > div.walkme-search-box-button.walkme-loading-hide.walkme-override.walkme-css-reset {
	background-color: var(--threegis-main-color) !important;
	border-radius: 0px !important;
}

div.walkme-direction-ltr.walkme-tab-header.walkme-override.walkme-css-reset > div > div.walkme-search-box-button.walkme-loading-hide.walkme-override.walkme-css-reset > div {
	color: var(--primary-background-color) !important;
}

/*  ---topics  */
div.walkme-deployables-list.walkme-loading-hide.walkme-override.walkme-css-reset.walkme-jspScrollable > div > div.walkme-jspPane > div > div.walkme-flow.walkme-visible.walkme-accessible.walkme-activatable.walkme-deployable.walkme-override.walkme-css-reset:hover,
div.walkme-deployables-list.walkme-loading-hide.walkme-override.walkme-css-reset.walkme-jspScrollable > div > div.walkme-jspPane > div > div.walkme-category.walkme-visible.walkme-accessible.walkme-deployable.walkme-override.walkme-css-reset > div.walkme-deployable-row.walkme-override.walkme-css-reset:hover,
div.walkme-deployables-list.walkme-loading-hide.walkme-override.walkme-css-reset.walkme-jspScrollable > div > div.walkme-jspPane > div > div.walkme-category.walkme-visible.walkme-accessible.walkme-deployable.walkme-override.walkme-css-reset > div.walkme-flow.walkme-visible.walkme-accessible.walkme-activatable.walkme-deployable.walkme-override.walkme-css-reset:hover,
div.walkme-deployables-list.walkme-loading-hide.walkme-override.walkme-css-reset > div > div > div > div.walkme-task.walkme-visible.walkme-uncompleted.walkme-active.walkme-accessible.walkme-activatable.walkme-deployable.walkme-override.walkme-css-reset > div.walkme-deployable-row.walkme-override.walkme-css-reset:hover,
div.walkme-deployables-list.walkme-loading-hide.walkme-override.walkme-css-reset > div > div > div > div.walkme-category.walkme-visible.walkme-accessible.walkme-deployable.walkme-override.walkme-css-reset > div.walkme-deployable-row.walkme-override.walkme-css-reset:hover,
div.walkme-deployables-list.walkme-loading-hide.walkme-override.walkme-css-reset > div > div > div > div.walkme-category.walkme-visible.walkme-accessible.walkme-deployable.walkme-override.walkme-css-reset.walkme-opened > div.walkme-task.walkme-visible.walkme-uncompleted.walkme-active.walkme-accessible.walkme-activatable.walkme-deployable.walkme-override.walkme-css-reset > div.walkme-deployable-row.walkme-override.walkme-css-reset:hover {
	background-color: var(--threegis-sidebar-hover-background-color) !important;
	color: var(--primary-text-color) !important;
}

div.walkme-deployables-list.walkme-loading-hide.walkme-override.walkme-css-reset.walkme-jspScrollable > div > div.walkme-jspPane > div > div.walkme-category.walkme-visible.walkme-accessible.walkme-deployable.walkme-override.walkme-css-reset.walkme-opened > div.walkme-flow.walkme-visible.walkme-accessible.walkme-activatable.walkme-deployable.walkme-override.walkme-css-reset > div.walkme-deployable-row.walkme-override.walkme-css-reset > div.walkme-text.walkme-override.walkme-css-reset > div.walkme-deployable-name.walkme-name.walkme-override.walkme-css-reset:hover,
div.walkme-deployables-list.walkme-loading-hide.walkme-override.walkme-css-reset > div > div > div > div.walkme-category.walkme-visible.walkme-accessible.walkme-deployable.walkme-override.walkme-css-reset > div.walkme-task.walkme-visible.walkme-uncompleted.walkme-active.walkme-accessible.walkme-activatable.walkme-deployable.walkme-override.walkme-css-reset > div.walkme-deployable-row.walkme-override.walkme-css-reset > div.walkme-text.walkme-override.walkme-css-reset > div.walkme-deployable-name.walkme-name.walkme-override.walkme-css-reset:hover {
	color: var(--primary-text-color) !important;
}

div.walkme-deployable-row.walkme-override.walkme-css-reset > div.walkme-deployable-icon.walkme-icon.walkme-override.walkme-css-reset {
	color: var(--threegis-main-color) !important;
}

/*  Makes the width of the grid items take up available horizontal space.
    Defaults to 260px, setting it to initial makes it start on a different
    line from the icon */
div.walkme-deployable-row.walkme-override.walkme-css-reset > div.walkme-text.walkme-override.walkme-css-reset {
    width: 325px !important;
}

div.walkme-deployable-row.walkme-override.walkme-css-reset > div.walkme-text.walkme-override.walkme-css-reset > div.walkme-deployable-name.walkme-name.walkme-override.walkme-css-reset {
	color: var(--primary-text-color) !important;
    width: inherit !important;
	white-space: initial !important;
}

.walkme-deployables-list .walkme-loading-hide .walkme-override .walkme-css-reset .walkme-jspScrollable {
	margin-left: 8px !important;
}

/* Styles images and videos used for demos */
div.walkme-custom-balloon-content > div > img {
    display: block; border: 1px solid black; margin: 25px auto 25px auto;
}

/* Launcher */
.custom-launcher-259147 {
	height: 40px;
	width: 40px;
	border-radius: 50%;
}

.custom-launcher-259147:hover {
	background-color: whitesmoke;
    background-color: var(--threegis-list-hover-color);
}