:root {
    --cor01: #080706;
    --cor02: #BC0D75;
    --cor03: #A8333D;
    --cor04: #2C6E67;
    --cor05: #895E41;
    --cor06: #1CAA97;
    --cor07: #B0B464;
    --cor08: #7DC3A8;
    --cor09: #D1AD49;
    --cor10: #84CCCC;
    --cor11: #F7C1CE;
    --cor12: #FBEBC3;
    --cor13: #FAF8F5;
}

body {
    background-color: var(--cor11);
    font-family: courier;
    cursor: url("/imgs/cursor.png"), default;
}

.validation {
    display: none;
}

.subtitle {
    width: 50%;
    text-align: initial;
}

table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}

#title {
    margin: auto;
    width: 45em;
    overflow: hidden
}

#content {
    margin: auto;
    width: 82%;
    background-color: var(--cor09);
    padding: 2em;
    border: solid 1px var(--cor01);
    margin-bottom: 1em;
    border-radius: 25px;
    flex: 1;
    margin: 0;
    max-width: none;
    position: relative;
    background-image: url("/imgs/twinkle-twinkle.png");
}


h1 { font-size: 3em; font-weight: bold; }
h2 { font-size: 1.8em; font-weight: bold; color: var(--cor02); }
h3 { font-size: 1.5em; font-weight: bold; color: var(--cor04);}
h4 { font-size: 1em; font-weight: bold; color: var(--cor03);}
h5 { font-weight: bold; color: var(--cor06);}
h6 { font-weight: bold; }

h2:before {content: "☛ "}
h3:before {content: "☛☛ "}
h4:before {content: "☛☛☛ "}
h5:before {content: "☛☛☛☛ "}
h6:before {content: "☛☛☛☛☛ "}

h2:after {content: " ☚ "}
h3:after {content: " ☚☚ "}
h4:after {content: " ☚☚☚ "}
h5:after {content: " ☚☚☚☚ "}
h6:after {content: " ☚☚☚☚☚ "}

a {
    color: var(--cor13);
    text-decoration: underline;
    padding: 10px;
    padding-top: 5px;
    padding-bottom: 2px;
    background-color: var(--cor03);
    border-top: 3px solid var(--cor02);
    border-left: 3px solid var(--cor02);
    border-bottom: 3px solid var(--cor11);
    border-right: 3px solid var(--cor11);
}

a:hover {
    color: var(--cor01);
    background-color: var(--cor10);
    text-decoration: underline dotted;
}

dd { margin-left: 2ex; }
dt { margin-left: 0ex; margin-top: 1em; margin-bottom: 1em; }
p { margin-left: 0px;}

pre { margin-top: 1em; margin-bottom: 1em; background-color: white;}
pre.code, pre.example, pre.src {border: 2px dashed black;}
p.footnote { margin-left: 6ex; text-indent: -6ex; }

.src             { font-size: small; position: relative; overflow: visible; }
.src:before      { position: absolute; top: -15px; background: #ffffff; padding: 1px; border: 1px solid #000000; font-size: small; }
.src-sh:before   { content: 'sh'; }
.src-bash:before { content: 'sh'; }
.src-gams:before { content: 'GAMS'; }
.src-jacaranda:before { content: 'Jacaranda'; }
.src-octave:before { content: 'Octave'; }
.src-perl:before { content: 'Perl'; }
.src-R:before    { content: 'R'; }
.src-sql:before  { content: 'SQL'; }

#postamble p {
    margin: 0px;
}

.tag {
    float: right;
    background-color: white;
    color: #BEBEBE;
}

.tag span:before {
    content: ":";
}

.tag:after {
    content: ":";
}


#esconder {
    display: none;
}


.esconde {
    display: none;
}




#formiga {
    position: absolute;
    top: 0;
    left: 0;
    width: 1.5vw;
    rotate: 0deg;
    display: none;
    cursor: pointer;
}

#postamble {
    text-align: center;
    /* display: none; */
}

#heading_gif_gatinho {
    display: none;
}

#container_gif_gatinho {
    text-align: center;
}

li:has(> a) {
    margin-bottom: 15px;
}


.navbar {
    border: 2px solid black;
    width: fit-content;
    border-radius: 25px;
    height: fit-content;
    margin-top: 16%;
}

.main-container {
    display: flex;
    gap: 1rem;            /* Espaço entre as colunas */
    max-width: 70%;      /* Mesmo limite do conteúdo original */
    margin: 0 auto;       /* Centraliza o conjunto na página */
    padding: 0 1rem;      /* Opcional: um respiro nas laterais */
}


.navbar div h3::before {
    content: "";
}

.navbar div h3::after {
    content: "";
}


.navbar div h3 {
    margin-bottom: 0px;
    margin-left: 6%;
}


.navbar div div ul li::marker {
  content: "♥ ";
  font-size: 1.2em;
}


.navbar div div ul li a {
    color: var(--cor01);
    background-color: unset;
    border: none;
}


.navbar div div ul li:has(> a) {
    margin-bottom: 0px;
}

#frieren {
    position: absolute;
    bottom: 0;                   /* base da imagem = base do content */
    right: 0;                    /* encosta na borda interna direita */
    width: 200px;
    margin: 0;                   /* zera margin-top e as negativas antigas */
}
.MathJax {
    font-size: 1.5em !important;
}
.MathJax_ref {
    font-size: initial !important;
}

/* refs paras equações  */
mjx-container mjx-math a:has(.MathJax_ref) {
    font-size: 0.8em !important;
    background-color: unset !important;
    border: unset;
    margin: unset;
    padding: unset;
    color: var(--cor02);
}

mjx-container {
    border: 4px solid transparent;
}

/* neon */
/* .matematica_bonita { */
/*     border: 3px solid #fff; */
/*     animation: neon-pulse 1.5s infinite alternate; */
/* } */
/* @keyframes neon-pulse { */
/*     from { box-shadow: 0 0 5px #fff, 0 0 10px #0ff; } */
/*     to { box-shadow: 0 0 10px #fff, 0 0 20px #0ff, 0 0 30px #f0f; } */
/* } */
.matematica_bonita {
    border: 4px solid transparent;
    border-image: radial-gradient(circlevar(--cor13) 20%var(--cor02) 40%var(--cor10) 60%var(--cor13) 100%) 1;
    box-shadow: 0 0 10px var(--cor02), 0 0 20px var(--cor08);
    border-radius: 15px;
}


#outline-container-selos_badges p {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 50%;
    text-align: center;
    flex-wrap: wrap;
    gap: 8px;
    column-count: 5;
    left: 25%;
    position: relative;
    right: auto;
}