@import url("https://rsms.me/inter/inter.css");

* {
    box-sizing: border-box;
}

.javascripthref {
    color: blue !important;
}

.javascripthrefb {
    color: blue !important;
    font-weight: bold;
}

.colorful-inner a {
    color: white !important;
    font-weight: bold;
}

.amaran {
    margin-bottom: 10px !important;
    margin-top: 0 !important;
}

.amaran.colorful .colorful-inner {
    font-size: 15px !important;
}

.javascripthref:hover {
    cursor: pointer;
}

.sourcecodel {
    color: blue !important;
    font-style: italic;
}

.sourcecodel:hover {
    cursor: pointer;
}

.autor_photo {
    border-radius: 3px;
    display: block;
    float: left;
    height: 50px;
    margin-left: -5px;
    position: relative;
}

.autor_name {
    display: block;
    float: right;
    font-size: 0.9rem;
    font-weight: bold;
    margin-left: -5px;
    margin-top: 4px;
    position: relative;
    width: 130px;
}

.autor_location {
    display: block;
    float: right;
    width: 130px;
    text-align: left;
    font-size: 0.9rem;
}

.tooltiptext_autor_svg {
    fill: rgb(255, 255, 255);
    height: 14px;
    position: relative;
    top: 2px;
}

.codegallerytitle {
    border-radius: .3rem;
    bottom: 1px;
    color: #567482;
    display: inline;
    font: 1rem Consolas, "Liberation Mono", Menlo, Courier, monospace;
    line-height: normal;
    margin: 0;
    padding: 0;
    position: relative;
    word-wrap: normal;
}

.page-header {
    color: #fff;
    text-align: center;
    position: relative;
}

.page-header-container {
    opacity: 0;
    visibility: hidden;
}

.page-header-container.onstart {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

/* fade in up */
@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        visibility: hidden;
        transform: translate3d(0, 50%, 0);
    }
    to {
        opacity: 1;
        visibility: visible;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        visibility: hidden;
        transform: translate3d(0, 50%, 0);
    }
    to {
        opacity: 1;
        visibility: visible;
        transform: translate3d(0, 0, 0);
    }
}

#background-page-header-colored {
    bottom: 0;
    display: none;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: -2;
}

#background-page-header {
    bottom: 0;
    display: none;
    left: 0;
    opacity: 0.8;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: -1;
}

.parallax-mirror {
    display: none;
    opacity: 0.9;
}

#contentBackground {
    -moz-box-shadow: 0 0 13px 0 rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 0 13px 0 rgba(0, 0, 0, 0.3);
    box-shadow: 0 0 13px 0 rgba(0, 0, 0, 0.3);
    position: relative;
    width: 100%;
    z-index: 2;
}

#buttonfile1text {
    color: #333333;
    display: none;
}

#buttonfilectext {
    color: #ffffff;
    display: none;
}

#badgeslistdiv {
    display: none;
    margin-top: 5px;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

hr.style1 {
    border-top: 1px solid #8c8b8b;
}

hr.style2 {
    border-top: 3px double #8c8b8b;
}

hr.style3 {
    border-top: 1px dashed #8c8b8b;
}

hr.style4 {
    border-top: 1px dotted #8c8b8b;
}

hr.style5 {
    background-color: #fff;
    border-top: 2px dashed #8c8b8b;
}

hr.style6 {
    background-color: #fff;
    border-top: 2px dotted #8c8b8b;
}

hr.style7 {
    border-top: 1px solid #8c8b8b;
    border-bottom: 1px solid #fff;
}

hr.style8 {
    border-top: 1px solid #8c8b8b;
    border-bottom: 1px solid #fff;
}

hr.style8:after {
    border-bottom: 1px solid #fff;
    border-top: 1px solid #8c8b8b;
    content: '';
    display: block;
    margin-top: 2px;
}

hr.style9 {
    border-bottom: 1px dashed #fff;
    border-top: 1px dashed #8c8b8b;
}

hr.style10 {
    border-top: 1px dotted #8c8b8b;
    border-bottom: 1px dotted #fff;
}

hr.style13 {
    height: 10px;
    border: 0;
    box-shadow: 0 10px 10px -10px #8c8b8b inset;
}

hr.style14 {
    background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
    border: 0;
    height: 1px;
}

hr.style15 {
    border-top: 4px double #8c8b8b;
    text-align: center;
}

hr.style15:after {
    background: #f0f0f0;
    color: #8c8b8b;
    content: '\002665';
    display: inline-block;
    font-size: 18px;
    padding: 0 10px;
    position: relative;
    top: -15px;
}

hr.style16 {
    border-top: 1px dashed #8c8b8b;
}

hr.style16:after {
    background: #f0f0f0;
    color: #8c8b8b;
    content: '\002702';
    display: inline-block;
    font-size: 18px;
    left: 40px;
    padding: 0 3px;
    position: relative;
    top: -12px;
}

hr.style17 {
    border-top: 1px solid #8c8b8b;
    text-align: center;
}

hr.style17:after {
    background: #f0f0f0;
    color: #8c8b8b;
    content: '§';
    display: inline-block;
    font-size: 18px;
    padding: 0 10px;
    position: relative;
    top: -14px;
    transform: rotate(60deg);
}

hr.style18 {
    height: 30px;
    border: 0 solid #8c8b8b;
    border-top-width: 1px;
    border-radius: 20px;
}

hr.style18:before {
    border: 0 solid #8c8b8b;
    border-bottom-width: 1px;
    border-radius: 20px;
    content: "";
    display: block;
    height: 30px;
    margin-top: -31px;
}

body:before {
    background-size: cover;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: -10;
}

html {
    max-width: 100%;
    overflow-x: hidden;
}

body.modal-open, .modal-open .navbar-fixed-top, .modal-open .navbar-fixed-bottom {
    margin-right: 0;
}

body {
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    background-attachment: fixed;
    color: #363636;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 14px;
    font-weight: normal;
    line-height: 1.5;
    margin: 0;
    max-width: 100%;
    overflow-x: hidden;
    padding: 0;
    text-rendering: optimizeLegibility;
}

@supports (font-variation-settings: normal) {
    body {
        font-family: 'Inter var', sans-serif;
    }
}

.help-links {
    font-size: 0.9rem;
}

a.back-to-top {
    background: #27AE61 url(../res/ui/up-arrow.png) no-repeat center 43%;
    bottom: 20px;
    display: none;
    position: fixed;
    right: 20px;
    text-indent: -9999px;
    z-index: 999;
}

@media screen and (min-width: 64em) {
    a.back-to-top {
        -moz-border-radius: 35px;
        -webkit-border-radius: 35px;
        border-radius: 35px;
        height: 70px;
        width: 70px;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    a.back-to-top {
        -moz-border-radius: 30px;
        -webkit-border-radius: 30px;
        border-radius: 30px;
        height: 60px;
        width: 60px;
    }
}

@media screen and (max-width: 42em) {
    a.back-to-top {
        -moz-border-radius: 25px;
        -webkit-border-radius: 25px;
        border-radius: 25px;
        height: 50px;
        width: 50px;
    }
}

.functtitlstyle {
    cursor: default;
    font-weight: 500 !important;
}

@media screen and (min-width: 64em) {
    .functtitlstyle {
        font-size: 1.2rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .functtitlstyle {
        font-size: 1.1rem;
    }
}

@media screen and (max-width: 42em) {
    .functtitlstyle {
        font-size: 1.0rem;
    }
}

.iconbutton {
    position: relative;
    margin-left: 5px;
}

@media screen and (min-width: 64em) {
    .iconbutton {
        height: 16px;
        top: 3px;
        width: 16px;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .iconbutton {
        height: 14px;
        top: 2px;
        width: 14px;
    }
}

@media screen and (max-width: 42em) {
    .iconbutton {
        height: 13px;
        top: 3px;
        width: 13px;
    }
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.fecha-estilo {
    color: #819198;
    font-size: 15px;
    position: relative;
    bottom: 0;
}

.btn {
    -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.75);
    -webkit-backdrop-filter: blur(15px);
    -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.75);
    backdrop-filter: blur(15px);
    background-color: rgb(100 100 100 / 10%);
    border-radius: 0.3rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.75);
    color: rgba(255, 255, 255, 1);
    display: inline-block;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 1.75rem;
    opacity: 1.0;
    outline: none;
    transition: color 0.2s, background-color 0.2s, border-color 0.2s;
}

.btn:hover {
    opacity: 1.0;
}

.btn-pro {
    -moz-box-shadow: 0 0 5px 0 rgba(10, 10, 10, 0.75);
    -webkit-box-shadow: 0 0 5px 0 rgba(10, 10, 10, 0.75);
    background-color: rgba(210, 210, 210, 0.85);
    border-radius: 0.3rem;
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: 0 0 5px 0 rgba(10, 10, 10, 0.75);
    color: rgba(20, 20, 20, 1);
    display: inline-block;
    font-weight: bolder;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 1.5rem;
    opacity: 0.9;
    outline: none;
    transition: color 0.2s, background-color 0.2s, border-color 0.2s;
}

.btn-pro:hover {
    opacity: 1.0;
}

.btn i, .btn-pro i {
    padding-left: 8px;
}

.btn-pro:hover {
    cursor: pointer;
    text-decoration: none;
}

.page-header .btn-pro:last-child {
    margin-right: 0 !important;
}

.btn + .btn {
    margin-left: 0;
}

.btn-pro + .btn-pro {
    margin-left: 0.5rem;
}

.btn:hover {
    text-decoration: none;
}

@media screen and (min-width: 64em) {
    .btn, .btn-pro {
        font-size: 1.1rem;
        padding: 1rem 1.5rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .btn, .btn-pro {
        font-size: 1rem;
        padding: 0.8rem 1rem;
        margin-right: 1rem;
    }
}

@media screen and (max-width: 42em) {
    .btn, .btn-pro {
        display: block;
        font-size: 0.9rem;
        margin-right: 0.5rem;
        padding: 0.75rem;
        width: 100%;
    }

    .btn + .btn, .btn-pro + .btn-pro {
        margin-left: 0;
    }
}

.page-header {
    position: relative;
    z-index: 2;
}

@media screen and (min-width: 64em) {
    .page-header {
        padding: 7rem 6rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .page-header {
        padding: 6rem 4rem;
    }
}

@media screen and (max-width: 42em) {
    .page-header {
        padding: 3rem 1rem;
    }
}

.project-name {
    cursor: default;
    margin-bottom: 0.1rem;
    margin-top: 0;
    text-shadow: 2px 2px 4px #000000;
}

@media screen and (min-width: 64em) {
    .project-name {
        font-size: 4rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .project-name {
        font-size: 3.2rem;
    }
}

@media screen and (max-width: 42em) {
    .project-name {
        font-size: 2.5rem;
    }
}

.project-tagline {
    cursor: default;
    font-weight: normal;
    margin-bottom: 2.5rem;
    margin-top: 0.3rem;
    opacity: 1.0;
    text-shadow: 2px 2px 5px #000000;
}

@media screen and (min-width: 64em) {
    .project-tagline {
        font-size: 1.25rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .project-tagline {
        font-size: 1.15rem;
        margin-bottom: 2rem;
    }
}

@media screen and (max-width: 42em) {
    .project-tagline {
        font-size: 1rem;
        margin-bottom: 1.5rem;
    }
}

.main-content :first-child {
    margin-top: 0;
}

.main-content img {
    max-width: 100%;
}

.main-content h1, .main-content h2, .main-content h4, .main-content h5, .main-content h6 {
    cursor: default;
    font-weight: normal;
    margin-bottom: 1rem;
    margin-top: 2.5rem;
}

.main-content h3 {
    cursor: default;
    font-weight: normal;
    margin-bottom: 1rem;
    margin-top: 1.5rem;
}

.main-content p {
    margin-bottom: 1em;
    /*text-align: justify;*/
}

.justified-text {
    text-align: justify;
}

li {
    text-align: justify;
}

.main-content code {
    background-color: #e7e7e7;
    border-radius: 0.3rem;
    color: #383e41;
    font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
    font-size: 0.9rem;
    padding: 2px 4px;
}

.main-content pre {
    /*background-color: #f3f6fa;
    border-radius: 0.3rem;
    border: solid 1px #dce6f0;*/
    color: #567482;
    font: 1rem Consolas, "Liberation Mono", Menlo, Courier, monospace;
    margin-bottom: 1rem;
    margin-top: 0;
    padding: 0.8rem;
    word-wrap: normal;
}

.main-content pre > code {
    background: transparent;
    border: 0;
    color: #567482;
    font-size: 0.9rem;
    margin: 0;
    padding: 0;
    white-space: pre;
    word-break: normal;
}

.main-content .highlight {
    margin-bottom: 1rem;
}

.main-content .highlight pre {
    margin-bottom: 0;
    word-break: normal;
}

.main-content .highlight pre, .main-content pre {
    border-radius: 0.3rem;
    line-height: 1.45;
    /*margin-bottom: -9px;*/
    overflow: auto;
    padding: 0.8rem;
}

@media screen and (min-width: 64em) {
    .main-content .highlight pre, .main-content pre {
        font-size: 0.9rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .main-content .highlight pre, .main-content pre {
        font-size: 0.82rem;
    }
}

@media screen and (max-width: 42em) {
    .main-content .highlight pre, .main-content pre {
        font-size: 0.61rem;
    }
}

@media screen and (min-width: 64em) {
    .lateximg {
        height: 21px;
        position: relative;
        top: 8px;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .lateximg {
        height: 18px;
        position: relative;
        top: 4px;
    }
}

@media screen and (max-width: 42em) {
    .lateximg {
        height: 15px;
        position: relative;
        top: 3px;
    }
}

.newline_br {
    display: block;
}

.main-content pre code, .main-content pre tt {
    background-color: transparent;
    border: 0;
    display: inline;
    line-height: inherit;
    margin: 0;
    max-width: initial;
    overflow: initial;
    padding: 0;
    word-wrap: normal;
}

.main-content pre code:before, .main-content pre code:after, .main-content pre tt:before, .main-content pre tt:after {
    content: normal;
}

.li-code-parent {
    margin-bottom: 30px
}

.config-parent {
    margin-bottom: 15px
}

.main-content ul, .main-content ol {
    margin-top: 0;
    padding-left: 3%;
}

@media screen and (min-width: 64em) {
    .menu-big-entry {
        font-size: 20px;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .menu-big-entry {
        font-size: 19px;
    }
}

@media screen and (max-width: 42em) {
    .menu-big-entry {
        font-size: 17px;
    }
}

@media screen and (min-width: 64em) {
    .menu-little-entry {
        font-size: 18px;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .menu-little-entry {
        font-size: 17px;
    }
}

@media screen and (max-width: 42em) {
    .menu-little-entry {
        font-size: 16px;
    }
}

.main-content li pre b {
    color: #000;
    /*font-size: 1.1rem;*/
    position: relative;
    /*bottom: -1.1px;*/
}

.main-content blockquote {
    /*color: #819198;
    border-left: 0.3rem solid #dce6f0;*/
    margin-left: 5px;
    padding: 0 .5rem;
}

.section-template {
    color: #159957;
}

@media screen and (min-width: 64em) {
    .section-template {
        font-size: 0.9rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .section-template {
        font-size: 0.8rem;
    }
}

@media screen and (max-width: 42em) {
    .section-template {
        font-size: 0.8rem;
    }
}

.main-content blockquote > :first-child {
    margin-top: 0;
}

.main-content blockquote > :last-child {
    margin-bottom: 0;
}

.main-content table {
    display: block;
    overflow: auto;
    width: 100%;
    word-break: normal;
}

.main-content table th {
    font-weight: bold;
}

.main-content table th, .main-content table td {
    padding: 0.5rem 1rem;
    border: 1px solid #e9ebec;
}

.main-content dl {
    padding: 0;
}

.main-content dl dt {
    padding: 0;
    margin-top: 1rem;
    font-size: 1rem;
    font-weight: bold;
}

.main-content dl dd {
    padding: 0;
    margin-bottom: 1rem;
}

.main-content hr {
    background-color: #eff0f1;
    border: 0;
    height: 2px;
    margin-bottom: 1.15rem;
    margin-top: 1rem;
    padding: 0;
}

@media screen and (min-width: 64em) {
    .main-content {
        font-size: 1rem;
        margin: 0 auto;
        max-width: 70rem;
        padding: 2rem 6rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .main-content {
        padding: 2rem 4rem;
        font-size: 0.95rem;
    }
}

@media screen and (max-width: 42em) {
    .main-content {
        padding: 2rem 1rem;
        font-size: 0.9rem;
    }
}

.site-footer {
    padding-top: 2rem;
    margin-top: 2rem;
    border-top: solid 1px #eff0f1;
}

.site-footer-owner {
    display: block;
    font-weight: bold;
}

.site-footer-credits {
    color: #819198;
}

@media screen and (min-width: 64em) {
    .site-footer {
        font-size: 1rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    .site-footer {
        font-size: 1rem;
    }
}

@media screen and (max-width: 42em) {
    .site-footer {
        font-size: 0.9rem;
    }
}

a.aimg, a:hover.aimg, .page-header.aimg {
    border: none;
    color: #fff;
    height: auto;
    letter-spacing: normal;
    line-height: normal;
    margin: 0;
    padding: 0;
    visibility: visible;
    width: auto;
    word-spacing: normal;
    z-index: auto;
}

a#templatestats, a:hover#templatestats, .page-header#templatestats {
    border: none;
    color: #fff;
    height: auto;
    letter-spacing: normal;
    line-height: normal;
    margin: 0;
    padding: 0;
    visibility: visible;
    width: auto;
    word-spacing: normal;
    z-index: auto;
}

.error_msg_1 {
    background-color: rgb(235, 235, 235);
    border-radius: 5px;
    border: 1px solid rgb(218, 218, 218);
    /*box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2);*/
    cursor: pointer;
    display: block;
    font-size: 1.2rem;
    font-weight: 300;
    margin: 10% auto auto;
    padding: 20px;
    position: relative;
    text-align: center;
    width: 60%;
    word-wrap: break-word;
}

.error_msg_1:hover {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2);
}

.error_msg_1 img {
    display: inline-block;
    margin-bottom: auto;
    margin-right: 10px;
    opacity: 0.6;
    position: relative;
    top: 5px;
    width: 25px;
}

.tooltip .tooltiptext_errormsg {
    -moz-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.75);
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.75);
    background-color: rgba(30, 30, 30, 1.0);
    border-radius: 5px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.75);
    color: #fff;
    font-size: 13px;
    left: 50%;
    margin-left: -42.5%;
    opacity: 0.97;
    padding: 10px;
    position: absolute;
    text-align: center;
    top: 115%;
    visibility: hidden;
    width: 80%;
    z-index: 1;
}

.tooltip .tooltiptext_errormsg::after {
    border: 5px solid transparent;
    border-bottom-color: rgba(0, 0, 0, 0.8);
    bottom: 100%;
    content: "";
    left: 50%;
    margin-left: -5px;
    opacity: 1.0;
    position: absolute;
}

.tooltip:hover .tooltiptext_errormsg {
    visibility: visible;
}

.linkssection a {
    color: blue;
}

#lean_overlay {
    background: #000;
    display: none;
    height: 100%;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 3;
}

#downloadother {
    -moz-border-radius: 5px;
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
    background: #FFF;
    border-radius: 5px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
    display: none;
    padding-bottom: 2px;
    z-index: 3;
}

@media screen and (min-width: 64em) {
    #downloadother {
        width: 650px;
    }

    .downloadother-entry {
        font-size: 0.9rem;
    }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
    #downloadother {
        width: 650px;
    }

    .downloadother-entry {
        font-size: 0.9rem;
    }
}

@media screen and (max-width: 42em) {
    #downloadother {
        width: 90%;
    }

    .downloadother-entry {
        font-size: 0.7rem;
    }

    .downloadother-name {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        padding-right: 10px;
    }

    .downloadother-link {
        font-size: 0.6rem;
    }

    .downloadother-link-double {
        font-size: 0.6rem;
    }
}

#downloadother-header {
    background: url(../res/ui/hd-bg.png);
    padding: 14px 12px 12px 14px;
    border-bottom: 1px solid #CCC;
    border-top-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
}

#downloadother h2 {
    color: #444;
    font-size: 2em;
    font-weight: 700;
    margin-bottom: 3px;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

#downloadother p {
    color: #444;
    font-size: 1.3em;
    margin: 0;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
}

#downloadother .downloadtitle {
    font-weight: 700;
    font-size: 1.3rem;
    color: black;
}

.modal_close {
    color: #636363;
    display: block;
    font-size: 1rem;
    height: 14px;
    outline: 0;
    position: absolute;
    right: 18px;
    text-decoration: none;
    top: 18px;
    width: 14px;
    z-index: 2;
}

#downloadother-contents {
    padding: 0;
    color: rgb(0, 0, 0);
    height: 350px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.downloadother-entry {
    display: inline-block;
    padding: 3px 8px;
    width: 100%;
}

.downloadother-entry:hover {
    background-color: rgb(246, 246, 246);
}

.downloadother-compact {
    border-bottom: 1px rgb(205, 205, 205) dashed;
}

.downloadother-name {
    cursor: default;
    display: block;
    float: left;
    font-weight: 700;
    padding: 0.1rem;
    width: 85%;
}

.downloadother-link {
    display: block;
    float: left;
    text-align: center;
    width: 15%;
}

.downloadother-link-double {
    display: block;
    float: left;
    text-align: center;
    width: 15%;
}

.parallax-mirror img {
    opacity: 0.65 !important;
}

#preloadresources {
    display: none;
}

.codeFunContainer {
    background-color: #eeeeee;
    box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.3) inset;
    display: none;
    margin-bottom: 2px;
    margin-top: 0;
    padding: 10px 10px 3px;
}

.sourcecodeTriggerEnabled {
    font-weight: bold;
}

#chatgitter {
    display: none;
}

#templateConfigsList .config-parent .config-elem {
    display: table;
    width: 100%;
    opacity: 0.8;
}

#templateConfigsList .config-parent .config-elem:hover {
    cursor: default;
    opacity: 1.0;
}

#templateConfigsList .config-parent .config-elem strong {
    display: block;
    float: left;
    font-weight: 600;
    width: 35%;
    word-break: break-all;
}

.config-desc {
    display: block;
    float: right;
    font-weight: 400;
    width: 65%;
}

.config-desc:before {
    content: ': ';
}

@media screen and (max-width: 576px) {
    #templateConfigsList .config-parent .config-elem strong {
        width: 40% !important;
    }

    .config-desc {
        width: 60% !important;
    }
}

.config-desc-inner {
    display: inline-table;
    float: right;
    text-align: justify; /* Ojo con esto */
    width: 98%;
}

.imgfontexample {
    background-color: white;
    padding: 10px;
}

/**
Botón de ejemplo que contiene mostrar/ocultar ejemplo
 */
.preExampleButton {
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    box-shadow: inset -1px -1px 6px rgba(0, 0, 0, 0.13);
    color: white;
    cursor: pointer;
    display: block;
    float: right;
    font-size: 0.8rem;
    font-weight: 500;
    opacity: 0.7;
    padding: 2px 10px;
    position: relative;
    right: 48px;
    top: -39px;
}

.preExampleButton:hover {
    opacity: 1.0;
}

@media screen and (min-width: 64em) {
    .preExampleButton {
        top: -39px !important;
    }
}

@media screen and (max-width: 42em) {
    .preExampleButton {
        top: -38px !important;
    }
}

@media screen and (max-width: 576px) {
    .preExampleButton {
        font-size: 0.5rem;
        top: -31px !important;
    }
}

.codeExampleContainer {
    background-color: #eee;
    border-radius: .3rem;
    box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.3) inset;
    display: none;
    margin-bottom: 8px;
    margin-inline-end: 40px;
    margin-top: 5px;
    padding: 10px 10px;
}

.exampleCollage {
    margin: auto;
    display: block;
    width: 80%;
}

.exampleCollageMid {
    margin: auto;
    display: block;
    width: 60%;
}

.imageShadow {
    box-shadow: 0 0 14px rgb(0 0 0 / 32%);
}

.imageCodeExample {
    display: inline-block;
    left: 50%;
    position: relative;
    transform: translate(-50%);
}

.imageCodeExample-large {
    width: 9cm;
}

@media screen and (max-width: 576px) {
    .imageCodeExample-large {
        width: 6cm;
    }
}

.imageCodeExample-normal {
    width: 7cm;
}

@media screen and (max-width: 576px) {
    .imageCodeExample-normal {
        width: 5cm;
    }
}

.imageCodeExample-tiny {
    width: 5cm;
}

@media screen and (max-width: 576px) {
    .imageCodeExample-tiny {
        width: 4cm;
    }
}

/**
Desactiva la selección de un objeto
 */
.noselect {
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    outline: none;
    user-select: none;
}

/**
Lista de banners en index
 */
.indexbannerlist {
    text-align: center;
}

.indexbannerlist img {
    display: flex;
    height: 1.5rem;
    margin: 0.5rem 2rem;
}

@media screen and (max-width: 576px) {
    .indexbannerlist img {
        height: 1.2rem;
        margin: 0.5rem auto;
    }
}

/**
Formularios
 */
.form-check {
    display: block;
    margin-top: 1rem;
    position: relative;
}

.form-check-label {
    margin-left: 0.5rem;
}