/* roboto-300 - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: url('/assets/fonts/roboto-v30-latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-300italic - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 300;
    src: url('/assets/fonts/roboto-v30-latin_latin-ext-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-regular - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('/assets/fonts/roboto-v30-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-italic - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: url('/assets/fonts/roboto-v30-latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-500 - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('/assets/fonts/roboto-v30-latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-500italic - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 500;
    src: url('/assets/fonts/roboto-v30-latin_latin-ext-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-700 - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url('/assets/fonts/roboto-v30-latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




.mcc-toc {
    background-color: white;
    margin-bottom: 60px;
    padding: 10px 20px;
    width: 100%;
    max-width: 400px;
}

.mcc-toc p {
    font-weight: bold;
    font-size: 120%;
}

.mcc-toc ul {
    list-style-type: none;
    padding-left: 10px;
    margin: 15px 0;
}

.mcc-toc a {
    text-decoration: none;
    color: black;
    margin-bottom: 15px;
    display: inline-block;
}

.mcc-header {
    margin-bottom: 60px;
    padding: 10px;
}


.mcc-btn {
    border: 2px solid #1D2B77;
    background: #1D2B77;
    color: white !important;
    padding: 8px 22px;
    transition: color 0.3s;
    transition: background-color 0.3s;
    text-decoration: none;
}

.mcc-btn:hover {
    background: white;
    color: #1D2B77 !important;
    border-radius: 2px;
}

.mcc-content {

}

.mcc-content hr {
    margin: 30px 5px;
    line-height: 1px;
    height: 1px;
    border: 0;
    background-color: #adadad;
    box-shadow: 0px 2px 3px rgba(0,0,0,0.5);
    opacity: 1;
}

.mcc-section-heading {
    font-size: 30px;
    font-weight: bold;
    padding: 8px 12px;
    margin-top: 30px;
}


/*.mcc-content.article .mcc-section-heading:first-of-type {*/
/*    padding: 0 0 8px 0;*/
/*    margin-top: 0;*/
/*    margin-bottom: 4px;*/
/*}*/

.mcc-module {
    padding: 10px 0;
    margin-bottom: 20px;
}

.mcc-module-heading {
    font-weight: bold;
    margin-bottom: 15px;
}

.mcc-module.mcc-colored-module {
    padding: 10px;
}

.mcc-module ul {
    padding-left: 10px;
}

.mcc-module ul li {
    list-style-position: inside;
    text-indent: -1em;
    padding-left: 1em;
}

.mcc-has-image {
    display: grid;
    grid-template-columns: 1fr 1fr;
}



.mcc-has-image div.mcc-image {
    padding-left: 20px;
}


.mcc-has-image div.mcc-image span {
    position: relative;
    display: block;
    margin-top: 6px;
    text-align: center;
    font-style: italic;
}

.mcc-has-image div.mcc-image img {
    max-width: 100%;
    box-shadow: 0px 0px 10px 2px rgba(29, 42, 119, 0.07);
    transition: 0.3s;
}


@media (min-width: 996px) {
    .mcc-has-image div.mcc-image:hover img {
        transform: scale(1.25);
        box-shadow: 0px 0px 10px 2px rgba(29, 42, 119, 0.3);
    }
}

.mcc-footer {
    padding: 10px;
}

@media (max-width: 767.98px) {

    .mcc-section-heading {
        font-size: 18px;
    }

    .mcc-has-image {
        grid-template-columns: 1fr;
    }

    .mcc-has-image div.mcc-image {
        padding-left: 0;
        position: relative;
        text-align: center;
    }

    .mcc-has-image div.mcc-image img {
        width: 80vw;
        max-width: 600px;
        margin: 10px auto 0 auto;
    }
}


.last_updated {
    font-size: 85%;
    color: #878ea6;
}

@media print {

    @page {
        size: A4 portrait;
        margin: 0 15pt;
    }

    img {
        break-before: auto; /* 'always,' 'avoid,' 'left,' 'inherit,' or 'right' */
        break-after: auto; /* 'always,' 'avoid,' 'left,' 'inherit,' or 'right' */
        break-inside: avoid; /* or 'auto' */
    }

    .mcc-module {
        orphans:10;
    }

    .mobile_menu_right,
    .doc_banner_area,
    .forum_footer_area,
    .navbar {
        display: none;
    }


    /*body #m-content,*/
    /*body #m-content * {*/
    /*    display: block !important;*/
    /*}*/

    .mcc-image {
        text-align: center;
        border: 1px solid black;
        padding: 2px;

        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .mcc-has-image div.mcc-image:hover img {
        transform: scale(1);
    }

    .mcc-image img {
        align-self: center;
        width: 6cm !important;
    }

    .mcc-section-heading {
        background-color: #fff !important;
        color: black !important;
        font-size: 1.7rem;
        padding-left: 0;
    }

    .mcc-module-heading {
        background-color: #fff !important;
        color: black !important;
        font-size: 1.2rem;
        padding-left: 0;
    }

    .mcc-has-image {
        /*display: table-row;*/
        grid-template-columns: 1.5fr 1fr;
    }

    .mcc-has-image div {
        /*display: table-cell;*/
        align-content: start;
    }

    .mcc-has-image div:first-of-type {
        width: 99% !important;
        padding-right: 50px;
    }


}


.ql-align-left {
    text-align: left !important;
}

.ql-align-center {
    text-align: center !important;
}

.ql-align-right {
    text-align: right !important;
}

.ql-align-justify {
    text-align: justify !important;
}

@media screen {
    span.search-result {
        display: inline-block;
        padding: 0 2px;
        background-color: yellow;
    }

    .body_dark span.search-result {
        background-color: darkgreen;
    }
}

.p_search {
    border-radius: 4px;
    transition: 0.2s ease-in-out;
}

.p_search:hover {
    background-color: rgba(36,120,184,0.15);

}



body.is_index  {
    transition: 0.3s ease-in-out;
}

.doc_left_sidebarlist, .doc_rightsidebar, .doc_banner_area {
    transition: 0.3s ease-in-out;
}


@media (min-width: 768px) {
    body.is_index .doc_documentation_area .col-md-8 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (min-width: 996px) {

    body.is_index .doc_documentation_area .col-lg-3 {
        -ms-flex: 0 0 16.666666%;
        flex: 0 0 16.666666%;
        max-width: 16.666666%;
    }

    body.is_index .doc_documentation_area .col-lg-7 {
        -ms-flex: 0 0 66.666666%;
        flex: 0 0 66.666666%;
        max-width: 66.666666%;
    }
}

@media (min-width: 997px) {
    body.is_index .doc_left_sidebarlist {
        transform: translateX(-800px);
    }
}

body.is_index #sidebar_menu {
    transform: translateX(-800px);
}

body.is_index .doc_rightsidebar {
    transform: translateX(800px);
}

body.is_index .doc_banner_area {
    height: 350px;
    box-shadow: 0 4px 4px rgba(0,0,0,0.1);
}

body.is_index .doc_documentation_area {
    max-width: 1600px;
    margin-top: -200px;
    margin-left: auto;
    margin-right: auto;
}


@media (max-width: 767px ) {

    body.is_index .document_content h1 {
        font-size: 1.8rem;
    }

    body.is_index .doc_banner_area {
        height: 280px;
    }

    body.is_index .doc_documentation_area {
        margin-top: -200px;
    }

    body.is_index .doc_documentation_area h1 {
        font-size: 2rem;
    }
}

@media (max-width: 576px ) {
    body.is_index .doc_documentation_area h1 {
        font-size: 1.25rem;
    }
}


body.is_index .page_breadcrumb,
body.is_index .document_title {
    display: none;
}

.special-sidebar {
    transition: 0.05s ease-in-out;
}

.switch {
    opacity: 0;
    /*transform: translateX(-150px) scale(0.2);
    /*transform: translateX(-150px);*/
}

div.compat-list {
    display: block;
}

div.compat-list em {
    font-weight: bold;
    font-style: normal;
}

/*div.compat-list span:not(:last-child)::after {*/
/*    content: ",";*/
/*    white-space: pre-wrap;*/
/*}*/


#header-searchbox ul li a {
    padding: 4px 10px;
}

#header-searchbox ul li.selected a {
    background-color: var(--brand_color);
    color: white;
}

#header-searchbox ul li:not(.selected):hover a {
    color: var(--brand_color) !important;
    background-color: white !important;
}



.assembly-parts {
    text-align: center;
}

.assembly-parts img {
    padding: 10px;
    border: 1px solid rgba(0,0,0,0.6);
    margin-bottom: 20px;
    transition: 0.3s;
    width: 80%;
    height: auto;
}

.assembly-parts p {
    text-align: center;
}

.assembly-parts p span {
    font-weight: bold;
}

@media (min-width: 996px) {
    .assembly-parts:hover img {
        transform: scale(1.15);
        box-shadow: 0px 0px 10px 2px rgba(29, 42, 119, 0.3);
    }
}

.mobile-dropdown a {
    color: black;
    font-size: 0.9rem;
}