/*
 * ==============================================
 * Skin for oXygen generated WebHelp.
 * ==============================================
 */


/*
 * ------------------------------------------------------------------
 *  
 * Fonts.
 *  
 */
@import url("https://fonts.googleapis.com/css?family=Onest:400,700,300");
@font-face {
    font-family: 'Aptos-Mono';
    src: url(../font/Aptos-Mono.ttf);
}

body {
    font-family: 'Onest', sans-serif;
}
a,
a:hover,
a:visited {
    color: #ff443a;
}
a:hover {
    text-decoration: underline;
}
/*
 * ------------------------------------------------------------------
 *  
 * Titles
 *  
 */
.wh_publication_title > a {
    font-size: 2.2em;
    color: black;
}
.wh_publication_title a {
    margin: .7em 0;
}
.wh_publication_title > a:hover {
    text-decoration: none;
}
.wh_publication_title {
    text-align: left;
    min-width: 1000px;
}
@media only screen and (max-width : 1513px) {
    .wh_publication_title {
        min-width: 800px;
    }
}
@media only screen and (max-width : 1313px) {
    .wh_publication_title {
        min-width: 600px;
    }
}
@media only screen and (max-width : 1113px) {
    .wh_publication_title {
        min-width: 400px;
    }
}
@media only screen and (max-width : 913px) {
    .wh_publication_title {
        min-width: 200px;
        font-size:smaller;
    }
    h1.title {
        font-size:25px !important;
    }
}
@media only screen and (max-width : 768px) {
    .wh_publication_title {
        min-width: 0px;
    }
}
.wh_logo_and_publication_title{
    margin:auto;
}
.sectiontitle {
    line-height: 20px;
    font-size: 18px;
    font-family: inherit;
    font-weight: 500;
    color: inherit;
    margin-top: 18px;
    margin-bottom: 9px;
}
h1.title {
    line-height: 35px;
    font-size: 28px;
}
h2.title {
    line-height: 25px;
    font-size: 22px;
}
@media only screen and (max-width: 767px) {
    .wh_logo_and_publication_title_container {
        justify-content: center;
    }
}
.wh_logo+.wh_publication_title {
    margin:0;
}
/*
 * ------------------------------------------------------------------
 *  
 * Tools and navigation
 * 

 */
.wh_print_link,
.wh_navigation_links,
.wh_navigation_links .navnext,
.wh_navigation_links .navprev {
}

.wh_print_link button,
.webhelp_expand_collapse_sections,
.wh_hide_highlight,
.oxy-icon-pdf-link,
.wh_navigation_links a,
.wh_print_link a:before {
    color: #8F8F8B;
    text-decoration: none;
    font-size: 20px;
}
.wh_navigation_links a:hover{
    color:#ff443a;    
}
.wh_tools {
    background-color: #F4EBE1;
    margin: 1em 0 2em;
}

.wh_breadcrumb a {
    color: #8F8F8B !important;
}
.wh_breadcrumb a:hover {
    color: #ff443a !important;
}
.wh_indexterms_link{
    margin-right:5px;
}
.wh_nav_and_search{
    display: flex;
    margin: auto;
}
.wh_top_menu_and_indexterms_link.navbar-collapse {
    padding-top: 4px;
}
#wh_header_container {
    padding:0;
}
#wh_topic_container {
    padding-left:15px;
    padding-right:15px;
}

.wh_header{
    padding:0;
}
.d-sm-block {
        display: block!important;
}
/*
 * ------------------------------------------------------------------
 *  
 * Tiles
 * 
 */

@media only screen and (max-width : 767px) {
    .wh_tile > div {
        height: auto;
    }
}
div.tile, .wh_tile {
    margin: 1em;
    padding: 2em 0.5em 1em;
    min-width: 240px;
    max-width: 20%;
    min-height: 300px;
    background-color: #F4EBDE;
    border-radius: 3px;
    transition: all 200ms ease-out;
    font-weight: 300;
    text-align: center;
    box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);
}
div.tile:hover, .wh_tile:hover {
    box-shadow: 0 6px 6px rgba(0, 0, 0, .4);
    /* box-shadow:0 10px 20px rgba(0,0,0,0.19),0 6px 6px rgba(0,0,0,0.23); */
}

div.tile a, .wh_tile_title a {
    font-size: 20px;
    line-height: normal;
    padding-bottom: 20px;
}

div.tile p, .wh_tile_shortdesc{
    max-height: 300px;
    overflow: hidden;
    padding:0 5px;
    color:black;
}

section.tile {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: wrap;
}
.wh_tiles {
    justify-content: center;
}
/*  div.tile img{
    display: block;
    margin-left: auto;
    margin-right: auto;
}*/
/*
 * ------------------------------------------------------------------
 *  
 * Search area
 * 
 */
.wh_search_input {
    background: none;
    padding: 0;
    min-width: 200px;
}

.wh_search_button {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    border-radius: 4px;
    background-color: white;
    border: solid 1px #CCC;
    color: black;
    font-weight: 600;
    width: 1.8em;
}

/* Search autocomplete */
.ui-menu-item {
    font-size: 1.4em;
}

.ui-autocomplete {
    z-index: 1000;
    font-size: x-small;
    max-width: 300px;
    overflow-x: auto;
}
.searchresult {
    list-style: none;
}
.searchresult li a {
    color: #ff443a;
}
#advanced_search{
    margin-top: 0.5em;
}
a.advanced_search{
    font-size: 1.2em;
    display: block;
    position: relative;
}
@media only screen and (max-width: 1325px) {
    a.advanced_search {
        text-align: right;
        padding:0;
    }
}
@media only screen and (max-width: 1256px) {
    .wh_search_input {
        padding:0;
    }
}
.wh_search_input {
    margin:auto;
}
#searchForm>div {
    width:100%;
}
.search-breadcrumb li a {
    background: #F4EBE1;
    color: #7b7a7a !important;
}
.search-breadcrumb li .title:after {
    border-color: transparent transparent transparent #F4EBE1;
}
.search-breadcrumb li .title:before {
    border: .8em solid #F4EBE1;
    border-left-color: transparent;
}
.page-item.active .page-link {
    background-color: #ff443a;
    border-color: #ff443a;
}
.page-link {
    color: #ff443a;
}
.page-link:hover {
    color: #ff443a;
}
/*
 * ------------------------------------------------------------------
 *  
 * Publication TOC
 * 
 */
.wh_publication_toc {
    border-radius: 3px;
    /*background-color: #eeeeee;
    padding: 1.5em 2em;*/
    line-height: 2em;
    background-color: #FBF8F4;
}
.wh_publication_toc .active > .topicref a {
    color: #ff443a;
    font-weight: normal;
}
.wh_publication_toc div,
.wh_publication_toc a,
.wh_publication_toc a:visited,
.wh_publication_toc a:hover {
    color: #7b7a7a;
}
.wh_publication_toc a:hover {
    text-decoration: underline;
    color:#ff443a;
}
#wh_publication_toc_content {
    padding-left: 20px;
    position: sticky !important;
    top: 10px !important;
}
@media only screen and (max-width : 767px) {
    .wh_publication_toc {
        border-radius: 0;
        padding: 1em 0.5em;
        margin-top: 10px;
    }
}

.close-toc-button {
    top: -5px !important;
}
.close-toc-button:hover {
    background-color: #F4EBE1;
}
/*
 * ------------------------------------------------------------------
 *  
 * Topic content
 * 
 */
.wh_topic_content,
.wh_content_area {
    color: #000000;
    line-height: 1.7em
}
.wh_related_links,
.wh_child_links,
.wh_topic_content .related-links {
    background-color: #F4EBE1;
    padding: 1.5em;
    margin-top: 1.5em;
}
.related-links a,
.related-links a:visited {
    color: #8F8F8B;
    padding-bottom: .3em;
}
.related-links a:hover{
    color:#ff443a;
}
#wh_topic_toc_content {
    position: sticky !important;
    top: 10px !important;
}
.wh_topic_content .body {
    margin-top: 2em;
}
.header-sticky{
    position:relative;
}
.breadcrumb-sticky{
    position:static;
}
#wh_topic_toc_content li .current_node{
    padding-left: 7px;
    border-left: 3px solid #ff443a;
    margin-left: -10px;
    font-weight: normal;
    color: #ff443a;
}
#wh_topic_toc_content li a {
    color: #7b7a7a;
    text-decoration: none;
}
#wh_topic_toc_content li a {
    color: #7b7a7a;
    text-decoration: none;
}
#wh_topic_toc_content li a:hover {
    text-decoration: underline;
    color: #ff443a;
}
/*
 * ------------------------------------------------------------------
 *  
 * Index terms.
 * 
 */
.indexTerms-sticky {
    position: static;
}
.wh_index_terms #indexList {
    padding: 0;
}
/*
 * ------------------------------------------------------------------
/* Hide copyright title from toc
.wh_publication_toc .copyright {
    display: none;
} */

/* Styling for labels */
span.label {
    border: 1px solid darkslategrey;
    padding: 5px 6px;
    border-radius: 7px;
    font-size: 13px;
    margin-right: 0.5em;
    margin-top: 0.5em;
    color: darkslategrey;
    display: inline-block;
    line-height: normal;
}
/*
 * ------------------------------------------------------------------
 *  
 * Tables
 */
thead th {
    text-align: left;
}
thead {
    font-size: 1.1em;
    background-color: #ddd;
    border-bottom: 1px solid #eee;
}
table {
    border: 1px solid #eee;
}
tr {
    border-bottom: 1px solid #eee;
}
.p + div.table-container > table {
    margin-top: -6px;
}
.dd > div.table-container > table,
.p > div.table-container > table {
    margin-top: 3px;
}
.frame-all, .frame-none {
    border: solid 1px #eee;
}
/*
 * ------------------------------------------------------------------
 *  
 * Notes
 */

div.note>span.note__title {
    text-transform: uppercase;
}
div.note {
    padding-left: 49px;
    padding-top: 12px;
    padding-bottom: 12px;
    border: 2px solid;
    border-radius: 11px;
    background-position-x: 9px;
    background-size: 30px;
}
div.note_note{
    background-image: url(../../../oxygen-webhelp/template/images/NOTE.png);
    background-color: #E8F3F6;
    border-color: #0078A0;
}
div.caution {
    background-image: url(../../../oxygen-webhelp/template/images/CAUTION.png);
    background-color: #FDFDEB;
    border-color: #F2DD17;
}
div.warning,
div.danger {
    background-image: url(../../../oxygen-webhelp/template/images/DANGER.png);
    background-color: #F5E5E5;
    border-color: #B80404;
}
div.notice {
    background-image: url(../../../oxygen-webhelp/template/images/ALERT.png);
    background-color: #FCEAD7;
    border-color: #FA6E0A;
}
span.new_icon {
    background-image: url(../../../oxygen-webhelp/template/images/NEW.png);
    background-repeat: no-repeat;
    padding: 10px 20px;
    line-height: 32px;
    vertical-align: middle;
}

/*
 * ------------------------------------------------------------------
 *  
 * Button for PDF link
 * 
 */
.wh_print_link,
.wh_navigation_links,
.wh_navigation_links .navnext,
.wh_navigation_links .navprev
{
    display: inline-block;
    color:#8F8F8B !important;
}

.wh_print_link button {
    border: none;
    background-color: transparent;
    padding: 0;
    color: #8F8F8B;
}
.wh_print_link button:hover {
    color:#ff443a;
}

.pdf_link img {
    width: 10px;
    height: 10px;
}
.webhelp_expand_collapse_sections:hover{
    color: #ff443a;
}
a.pdf_link{
    color: #3077be !important;
    right: 20px;
    position: absolute;
    top: 0;
}
/* a.pdf_link:hover{
    background-color:#f4f4f4;
} */
a.pdf_link:hover > h1{
    text-decoration: underline;  
}

.oxy-icon-pdf-link:before {
    content: "1";
    vertical-align: top;
}
.pdf_link {
    display: inline-block;
}
/**
 * Content area
 */
@media screen {
/* On media print it creates problems if there is a two column page layout: big spaces around the elements that span all columns. */
    .wh_content_area {
        min-height: 500px;
    }
}
/*
 * ------------------------------------------------------------------
 *  
 * Typographical Conventions
 * 
 */
.dtype,
.cmdname,
.option,
.tt,
.userinput,
.systemoutput,
.codeph {
    font-family: 'Aptos-Mono';
    font-size: 1.2em;
    line-height: 1.2em;
}
kbd {
    all: unset;
}

.i,
.apiname,
.varname,
.parmname,
.envar,
.cite,
.term {
    font-style: italic;
    font-family: inherit;
    padding-left: 0px;
    padding-right: 1.5px;
}

.filepath,
.key,
.uicontrol,
.wintitle {
    font-weight: bold;
    font-family: inherit;
}

.pre {
    font-family: 'Aptos-Mono';
    font-size: 1.2em;
    line-height: 1.2em;
    padding: 0px 3px;
    margin: 6px 3px;
    background-color: transparent;
}
.entry > .pre {
    margin: 0px;
}
/* Don't know why this doesn't work with code tag */
.codeph, .codeblock {
    color: #390a0d;
}
/* The codeblock tag inherits the styling rules of the pre tag.
 * Here, we add a border and set the padding and background colour... */
.codeblock {
    border: 1px solid #ccc;
    padding: 6px 9px;
    background-color: #eee;
}
/* ...except for codeblocks within table entries. */
.entry .codeblock {
    border: none;
    padding: 0px 3px;
    background-color: transparent;
}
/* Disable grey background and default font styling for <code> tag, which is set by other CSS files in oxygen-webhelp/app */
code {
    all: unset;
}

sup {
    font-family: 'Roboto', sans-serif;
    /* Must use fixed font size because parent tag affects relative font size */
    font-size: 14px;
    top: -0.3em;
}

/*
 * ------------------------------------------------------------------
 *  
 * Styling for images
 * 
 */
img.image {
    margin: 6px 0px;
}
img.icon {
    margin: -6px 0px;
}
.figcap {
    font-weight: bold;
    margin-top: 1.0em;
    /*  This ensures readability of multi-line captions */
    line-height: 1.5em;
}
.fig {
    /* This prevents too much space above the image */
    line-height: 0.5em;
}

a.wh_logo img{
    width: 200px;
}
/*
 * ------------------------------------------------------------------
 *  
 * Spacing for tags
 * 
 */
.ddexpand {
    margin-top: 0px;
}
p + ol, p + ul, p + dl {
    margin-top: -3px;
}
dd > dl, dd .p, li, li .p {
    margin: 6px 0px;
}
.entry .p {
    margin: 9px 0px;
}
.entry .p:first-child, .note .p:first-child {
    margin-top: 0px;
}
.entry .p:last-child, .note .p:last-child {
    margin-bottom: 0px;
}
