/*
 * ==============================================
 * Skin for oXygen generated WebHelp.
 * ==============================================
 */
/*
 * ------------------------------------------------------------------
 *
 * Fonts.
 *
 */
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 100;
    src: url(resources/fonts/Roboto-Thin.ttf);
}
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 300;
    src: url(resources/fonts/Roboto-Light.ttf);
}
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    src: url(resources/fonts/Roboto-Regular.ttf);
}
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 700;
    src: url(resources/fonts/Roboto-Bold.ttf);
}

.container-fluid {
    max-width: unset;
}
*[class~="topic/note"]:not([class~="hazard-d/hazardstatement"]) {
    border: 1px solid;
    border-radius: 11px;
  }

  /*notes-content-two-lines*/
  span.note__title {
    display: block;
  }

  /*notes-colors-colorful*/
  *[class~="topic/note"]:not([class~="hazard-d/hazardstatement"]) {
    background-color: rgba(0, 120, 160, 0.09);
    border-color: #0078A0;
  }
  *[class~="topic/note"].note_danger,
  *[class~="topic/note"].note_caution {
    background-color: rgba(255, 202, 45, 0.1);
    border-color: #606060;
  }
  *[class~="topic/note"].note_warning,
  *[class~="topic/note"].note_attention,
  *[class~="topic/note"].note_important {
    background-color: rgba(255, 202, 45, 0.1);
    border-color: #FFCA2D;
  }
  *[class~="topic/note"].note_restriction {
    background-color: rgba(255, 226, 225, 0.32);
    border-color: #FF342D;
  }

/* Fix for scrollbar */
html {
    width: 100vw;
    overflow-x: hidden;
}

body {
    font-family: Roboto, sans-serif;
}

/*
     * ------------------------------------------------------------------
     *
     * Fight with bootstrap
     *
     */
.navbar-brand {
    height: auto;
}
.navbar {
    border: none;
    border-radius: 0;
    margin: 0;
}
.navbar-toggler-icon,
.navbar-toggler,
.wh_toggle_button {
    color: #333333 !important;
    background-color: #ebf0f5;
}
.wh_header {
    background: #FFFFFF none;
    color: #333333;
    text-align: left;
}
a,
a:hover,
a:visited {
    color: #0087be;
}
a:hover {
    text-decoration: none;
}


/*
 * ------------------------------------------------------------------
 *
 * Publication titles
 *
 */
.wh_publication_title > a {
    color: #333333;
    font-size: 2em;
    margin: .25em;
}

/*
 * ------------------------------------------------------------------
 *
 * Language Toggle
 *
 */

#langToggle {
    display: flex;
    flex-direction: row;
    margin-left: auto;
}

#langToggleIcon {
    background-repeat: no-repeat;
    background-image: url('resources/images/language.svg');
    
}

.langToggleDivider{
    border-left: 2px solid #EBF0F5;
    
    height: 18px;
    
    left: 50%;
    margin: 0;
    top: 0;

}

.langToggleLanguage {
    margin-left: 0.25em;
    margin-right: 0.25em;
    background-repeat: no-repeat;
    background-size: contain;
    width: 27px;
    height: 18px;
    background-size: 27px 18px; 
}

.lang_switch_link {
    display: block;
    height: 100%;
    
   
}

.wh_logo_and_publication_title_container {
    width: 100%;
}


.lang-en{
    background-image: url('resources/images/english.svg');   
}

.lang-de{
    background-image: url('resources/images/german.svg');
}

/*
 * ------------------------------------------------------------------
 *
 * Menu
 *
 */
.wh_top_menu {
    /*text-transform: uppercase;*/
    margin: 0 1em 0 1em;
    font-size: 1.0em;
}
.wh_top_menu a {
    color: #333333;
    line-height: 1.5em;
}

/* The submenus */
.wh_top_menu ul ul {
    background-color: #ebf0f5;
    color: #333333;
}
.wh_top_menu ul li:hover {
    /*background-color: #2d373c;*/
    background-color: #ebf0f5;
}
.wh_top_menu ul ul li a:hover {
    background: #dfe6ee;
}
.wh_top_menu ul ul li {
    border-top-color: #d2d7dc;
    width: 270px;
    text-transform: capitalize;
}
.wh_top_menu ul ul li.has-children:after {
    color: #333333;
}

/*
 * ------------------------------------------------------------------
 *
 * Link to the index.
 *
 */
.wh_indexterms_link a span {
    display: none;
}
.wh_indexterms_link a:before {
    color: #fff;
}

.wh_letters {
    width: auto;
}

/*
 * ------------------------------------------------------------------
 *
 * Breadcrumb
 *
 */
.wh_breadcrumb ol {
    color: #878787;
}
.wh_breadcrumb ol a {
    color: inherit;
}
.wh_breadcrumb ol .active {
    color: #5185cb;
}


/*
 * ------------------------------------------------------------------
 *
 * Tools and navigation
 *
 */
.wh_tools {
    background-color: #e5e5e9;
    margin: 1em 0 2em;
    color: #0087be;
}

.wh_print_link,
.wh_navigation_links,
.wh_navigation_links .navnext,
.wh_navigation_links .navprev {
}

.webhelp_expand_collapse_sections,
.wh_hide_highlight,
.wh_print_link button,
.wh_navigation_links a,
.wh_navigation_links a:hover,
.wh_navigation_links a:active,
.wh_navigation_links a:visited,
.wh_print_link a:before,
.wh_navigation_links a:before,
.wh_navigation_links a:hover:before,
.wh_navigation_links a:active:before,
.wh_navigation_links a:visited:before {
    color: #0087be;
    text-decoration: none;
}

/*
 * ------------------------------------------------------------------
 *
 * Tree TOC for the main page.
 *
 */
.wh_main_page_toc {
    width: 25%;
    float: left;
    margin-top: 0px;
    order: 1;
    border-radius: 5px;


    margin: auto;
    margin-left: 1vw;

}

.wh_content_flex_container {
    width: 100%;
    overflow: hidden;
    flex-direction: row;
}


.wh_main_page_toc .expanded,
.wh_main_page_toc .wh_main_page_toc_accordion_header:hover,
.wh_main_page_toc>.wh_main_page_toc_entry:hover,
.wh_main_page_toc_accordion_entries {
    background-color: #F2F8FF;


}


/*
 * ------------------------------------------------------------------
 *
 * Tiles
 *
 */
.wh_tiles {
    order: 2;
    align-content: flex-start;
    padding: 1%;
}
.wh_tile {
    display: inline-block;
    background-color: #ebf0f5;
    background-repeat: no-repeat;
    vertical-align: middle !important;
    position: relative;
    width: 15vw;
    max-height: 250px;
    min-height: 100px;
    padding: 0%;
    margin: 0.5%;

    border-radius: 5px;
    word-break: break-word;
    background-position: center 60%;
    background-size: 50% 50%;


    /* Dummy icon */
    background-repeat: no-repeat;
    /*background-image: url('resources/images/releases.svg');*/
}

.wh_tile_image img {
  max-height: 40px;
  margin-top: 1em;
}

.wh_tile_text {
    margin-top: 1vh;

}

.wh_tile_shortdesc {
    text-align: center;
    color: #66667e;
    /*font-size: 0.8em;*/
    display: none;
}
.wh_tile_title a {
    color: #3077be;
}
.wh_tile_text:after {
    background: linear-gradient(to bottom, rgba(236, 242, 249, 0), rgba(236, 242, 249, 1) 75%);
}
.wh_tile_title {
    font-size: 200;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
}

.wh_tile:hover {
    background-color: #dfe6ee;
}

.wh_tile>div {
    align-content: center;
    background-position: center;
    fill:#0087be;
}



/*
 * ------------------------------------------------------------------
 *
 * Search area
 *
 */
.wh_search_input {
    display: block;
    margin: 0;
    position: relative;
    background: #000028;
    padding: 20px 0;
    background: url('resources/images/csm_headerimg_fba4dae7c4.png') center no-repeat #000028;
}

.wh_welcome:not(:empty) {
    font-size: 0;
    margin: 0 auto;
    font-family: Roboto, sans-serif;
    padding: 0 0 0.5em 0;
    text-shadow: none;
    font-weight: 300;
    line-height: 1.2em;
}

.wh_main_page .wh_search_input {
    background: url('resources/images/csm_headerimg_fba4dae7c4.png') center no-repeat #000028;
}

.wh_search_textfield {
    border: solid 1px #CCC;
    border-radius: 5px;
    padding: 0 .5vw;
    position: relative;
    height: 2.8em;
}
.wh_search_button {
    border: solid 1px #CCC;
    border-radius: 0 5px 5px 0;
    padding: 0.6em 1em;
    color: #fff;
    background-color: #fe8389;
    height: 2.8em;
}

/* Search autocomplete icons */
.search-autocomplete-proposal-type-history a,
.search-autocomplete-proposal-type-history a:hover,
.search-autocomplete-proposal-type-history a:visited,
.search-autocomplete-proposal-type-history a:active {
    text-decoration: none;
    color: inherit;
    font-size: 0.8em;
}
.ui-state-active .search-autocomplete-proposal-type-history a,
.ui-state-active .search-autocomplete-proposal-type-history a:hover,
.ui-state-active .search-autocomplete-proposal-type-history a:visited,
.ui-state-active .search-autocomplete-proposal-type-history a:active {
    color: #fff;
}

/* Active search page */
#wh-search-pagination > ul > li.active > a {
    background-color: #346ec5;
}


/*
 * ------------------------------------------------------------------
 *
 * Publication TOC
 *
 */
.wh_publication_toc {
    border-radius: 3px;
    padding: 1.5em .5em;
    background-color: #f8f8f8
}
.wh_publication_toc .active > .topicref a {
    color: #5185cb;
}
.wh_publication_toc span,
.wh_publication_toc a,
.wh_publication_toc a:visited,
.wh_publication_toc a:hover {
    color: #878787;
}
.wh_publication_toc a:hover {
    text-decoration: underline;
}

.wh_publication_toc ul li,
#wh_topic_toc ul li {
    margin-top: .7em;
}

/* Publication TOC tooltip */
.wh_breadcrumb .topicref .wh-tooltip,
.wh_publication_toc .topicref .wh-tooltip {
    background-color: #5185cb;
    color: #fff;
    font-size: 1.4rem;
}

.wh_breadcrumb .topicref .wh-tooltip a,
.wh_publication_toc .topicref .wh-tooltip a {
    color: #fff;
    text-decoration: underline;
}

/* Tooltip arrow. */

[data-tooltip-position = "left"] .topicref .wh-tooltip::before {
    border-left-color: #5185cb;
}

[data-tooltip-position = "right"] .topicref .wh-tooltip::before {
    border-right-color: #5185cb;
}

[data-tooltip-position = "bottom"] .topicref .wh-tooltip::before {
    border-bottom-color: #5185cb;
}

[data-tooltip-position = "top"] .topicref .wh-tooltip::before {
    border-top-color: #5185cb;
}


/*
 * ------------------------------------------------------------------
 *
 * Topic content
 *
 */
.wh_topic_content,
.wh_content_area {
    color: #000000;
    line-height: 1.7em;
}
.wh_main_page .wh_content_area {
    /*margin: 40px auto;*/
}
.wh_topic_content .title.topictitle1 {
    font-size: 2em;
    line-height: 1.1em;
    font-weight: bold;
}

.topictitle3,
.topictitle4,
.topictitle5,
.topictitle6 {
    font-weight: 400;
}

.wh_related_links .related-links,
.wh_topic_content .related-links,
.wh_child_links {
    border-top: 1px solid #ccc;
    padding-top: 7px;
    margin-top: 0;
}

.wh_related_links .related-links,
.wh_topic_content .related-links {
    padding: .5em 1.5em;
}

.wh_child_links {
    padding: 1.5em;
}

.related-links strong {
    font-weight: 700;
}

.related-links a,
.related-links a:visited {
    color: #5185cb;
    display: inline-block;
}

.filepath {
    color: #c7254e;
}

/*
 * ------------------------------------------------------------------
 *
 * Search results.
 *
 */
.searchresult {
    list-style: none;
}

.searchresult li a {
    color: #346ec5;
}
.searchresult .shortdesclink {
    margin: .3em .5em 0 0;
}
.wh_search_expression {
    font-weight: bold;
}

/* Search relative path */
.searchresult li .relativePath a {
    color: #006621;
}

/*--------- Search results breadcrumb ----------*/
.search-breadcrumb li a {
    background: #ECF2F9;
}
.search-breadcrumb li .title:before,
.search-breadcrumb li .title:after {
    border-color: #ECF2F9;
}
.search-breadcrumb li .title:before {
    border-left-color: transparent;
}
.search-breadcrumb li .title:after {
    border-color: transparent;
    border-left-color: #ECF2F9;
}


/*
 * ------------------------------------------------------------------
 *
 * Index terms.
 *
 */
.wh_index_terms span.wh_first_letter {
    color: #346ec5;
}
.wh_index_terms #indexList {
    padding: 0;
}



/*
 * ------------------------------------------------------------------
 *
 * Tree TOC for the main page.
 *
 */
.wh_main_page_toc {
    padding-top: 0%;
    margin-top: 0.5%;
    margin-right: 0.5%;
}


.wh_main_page_toc .expanded,
.wh_main_page_toc .wh_main_page_toc_accordion_header:hover,
.wh_main_page_toc > .wh_main_page_toc_entry:hover,
.wh_main_page_toc_accordion_entries {
    background-color: #F2F8FF;
}

.wh_menu_mobile_button {
    display: none;
}

/**
 *
 * Styles used for RTL pages
 *
 */
html[dir = 'rtl'] .wh_top_menu ul li:hover > ul {
    max-width: 270px;
}



.wh_tile {
  cursor: pointer;
}

div.[class="float-right mb-2 overflow-auto rounded-lg py-3 px-4"] {
    background-color: #3077be !important;
}

/* Settings for images, to set caption below image */
figure {
    display: flex;
    flex-flow: column-reverse;
    align-items: flex-start;
  }
  
 figure img {
    margin-bottom: 0;
    max-width: 1000px !important;
  }

figure figcaption {
    align-self: flex-start;
    font-style: italic;
    font-size: 80%;
  }

#go2top {
    right: 70px;
    bottom: 13px;
  }

/* Table Settings */

tbody tr {
    border-bottom: 1px solid #898989;    
}

tr:last-of-type{
    border-bottom: none;
}

tr:nth-child(even) {
    background-color: #ebf0f5;
}

th {
    color: white;
    font-weight: bold;
    background-color: #000028;
}

/* Code Refernce Design */
.codeph{
    font-family: monospace;
    background-color: transparent;
    font-size: 110%;
    color: #000000;
}
/*  Video Tutorial Chapters */
.video_description {
    width: 50%;
    float: left;
    margin-right: 1vw;
}
.video_table {    
    border: none;
    font-size: smaller;
    padding: 1%;
    width: 90%;
}
.video_table caption{
    display: none;
}
.video_table tr {
    border-bottom: #878787 1px;
    border: none;
}

.video_table tr:hover {   
    background-color: #f8f8f8;  
}

.video_table td {
    border-bottom: #000000 2px;
    width: 90%;    
    border-style: none none solid none;
    border-width: 1px;   
    padding: 0 0 0.5% 0; 
}

.video_table td a {
   display: block;
}

.video_table td:first {
    border-bottom: #000000 2px;
    border-style: none none solid none;
    border-width: 1px;    
}
.table-container {
padding-bottom: 20px;
}

/* Release Notes Images */

.rln_image {
    float: right; 
    padding: 15px;
    max-width: 400px;
}
    border: 1px solid light-dark(#000000, transparent);