/*** The new CSS reset - version 1.11.2 (last updated 15.11.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Fix mobile Safari increase font-size on landscape mode */ html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu, summary { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; box-sizing: border-box; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; box-sizing: border-box; } /* Remove details summary webkit styles */ ::-webkit-details-marker { display: none; } body { font-size: 17px; font-family: "General Sans", sans-serif; line-height: 1.6; background-color: blue; color: white; } .miolo { background-color: white; } .container { padding: 10px; margin: 0 auto; width: 920px; padding-bottom: 100px; } @media (max-width: 920px) { .container { width: 100%; } } @media (max-width: 700px) { .container { width: 100%; } } @media (max-width: 540px) { .container { width: 100%; } } a { color: blue; font-weight: 400; cursor: pointer; word-wrap: break-word; } a:link, a:hover, a:visited, a:active { text-decoration: none; } a:hover { color: #9999ff; } a[target=_blank] { overflow-wrap: break-word; word-wrap: break-word; word-break: break-all; hyphens: none; } main { position: relative; } h1, h2, h3, h4 { font-family: "General Sans", sans-serif; font-weight: normal; margin: 0; padding: 35px 0 10px 0; } h1 { font-size: 5em; padding: 0; line-height: 1; } @media (max-width: 540px) { h1 { font-size: 2.5em; line-height: 1.1; } } h2 { font-family: "General Sans", sans-serif; font-weight: 300; font-size: 3.3em; line-height: 1.2; } @media (max-width: 540px) { h2 { font-size: 1.6em; padding-top: 10px; } } h3 { font-size: 1.3em; line-height: 1.2; padding-bottom: 1em; font-weight: bold; } @media (max-width: 540px) { h3 { font-size: 1.4em; } } h4 { font-size: 1.2em; } @media (max-width: 540px) { h4 { font-size: 1.2em; line-height: 1.1; } } p { margin: 0; font-weight: 300; padding-bottom: 20px; font-size: 1.05em; } @media (max-width: 540px) { p { font-size: 1em; line-height: 1.5; } } strong { font-weight: 500; } blockquote { font-size: 0.9em; font-style: italic; font-weight: 300; margin-bottom: 30px; margin-left: 100px; } @media (max-width: 540px) { blockquote { margin-left: 50px; } } ul, ol { font-size: 1.05em; font-weight: 300; margin-left: -20px; } @media (max-width: 540px) { ul, ol { font-size: 0.8em; line-height: 1.7; margin-left: -20px; } } em { font-style: italic; } /* width */ ::-webkit-scrollbar { width: 10px; } /* Track */ ::-webkit-scrollbar-track { background: #f1f1f1; } /* Handle */ ::-webkit-scrollbar-thumb { background: blue; border-radius: 10px; } /* Handle on hover */ ::-webkit-scrollbar-thumb:hover { background: blue; } ::selection { background-color: #f1f1f1; color: blue; } .header_index { background-color: white; background-image: url(../img/fundo.jpg); background-size: 700px; background-position: 70% 60%; background-repeat: no-repeat; width: 100%; height: 100vh; position: relative; } @media (max-width: 1500px) { .header_index { background-size: 500px; background-position: 60% 60%; } } @media (max-width: 920px) { .header_index { background-size: 600px; background-position: 180% 60%; } } @media (max-width: 540px) { .header_index { background-size: 550px; background-position: 100px 20px; } } .titulo { position: absolute; top: 20%; left: 15%; width: 25%; color: blue; } @media (max-width: 1500px) { .titulo { top: 18%; left: 4%; width: 40%; } } @media (max-width: 920px) { .titulo { top: 30%; left: 8%; width: 50%; } } @media (max-width: 540px) { .titulo { top: 40%; left: 4%; width: 65%; } } .titulo h1 { font-family: "Tanker", sans-serif; font-size: 5em; line-height: 1; } @media (max-width: 1500px) { .titulo h1 { font-size: 4.3em; } } @media (max-width: 920px) { .titulo h1 { font-size: 4em; } } @media (max-width: 540px) { .titulo h1 { font-size: 2.5em; } } .titulo h2 { font-size: 5em; font-weight: 300; line-height: 1; padding: 0; } @media (max-width: 1500px) { .titulo h2 { font-size: 4em; } } @media (max-width: 920px) { .titulo h2 { font-size: 3.5em; } } @media (max-width: 540px) { .titulo h2 { font-size: 2em; } } .titulo h3 { font-weight: 400; font-size: 2em; margin-top: 100px; padding: 0px; } @media (max-width: 920px) { .titulo h3 { font-size: 1.7em; margin-top: 300px; } } @media (max-width: 540px) { .titulo h3 { font-size: 1em; margin-top: 200px; } } .titulo h4 { font-size: 1.5em; margin-top: 10px; padding: 0px; } @media (max-width: 920px) { .titulo h4 { font-size: 1.4em; } } @media (max-width: 540px) { .titulo h4 { font-size: 0.8em; } } .botoes_index { position: absolute; top: 45%; right: 5%; display: flex; flex-direction: column; } @media (max-width: 920px) { .botoes_index { top: 2%; left: 2%; right: 2%; flex-direction: row; justify-content: space-between; } } .botoes_index .botao a { font-family: "Tanker", sans-serif; font-size: 3.5em; line-height: 1.1; color: blue; } .botoes_index .botao a:hover { text-decoration: underline; color: blue; } @media (max-width: 1500px) { .botoes_index .botao a { font-size: 3.3em; } } @media (max-width: 920px) { .botoes_index .botao a { font-size: 3em; } } @media (max-width: 540px) { .botoes_index .botao a { font-size: 1.8em; } } .ficha { padding: 200px 0px 200px 0px; } @media (max-width: 920px) { .ficha { padding: 100px 0px 100px 0px; } } @media (max-width: 540px) { .ficha { padding: 30px 0px 0px 0px; } } .credito { column-count: 2; padding: 100px 0px 100px 0px; } @media (max-width: 540px) { .credito { column-count: 1; padding: 30px 0px 30px 0px; } } .credito dl { margin-bottom: 20px; break-inside: avoid; } .credito dl dt { font-weight: 500; padding-bottom: 0.2em; padding-top: 0.7em; page-break-inside: avoid; break-inside: avoid-column; display: table; } .credito dl dt h2 { font-size: 1.5em; padding-top: 0; margin-top: 0px; width: 100%; } @media (max-width: 540px) { .credito dl dt h2 { font-size: 1.2em; } } .credito dl dd { font-weight: 300; margin-left: 0; page-break-inside: avoid; break-inside: avoid-column; display: table; } .ficha-catalografica { width: 100%; margin-top: 20px; margin-bottom: 100px; } .ficha-catalografica img { width: 100%; max-width: 600px; display: block; margin: auto; } .realizacao { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5em; } .realizacao .ciarufg { width: 130px; } footer { border-top: 1px dashed white; } .footercapa { text-align: center; padding: 30px; width: 60%; margin: 0 auto; } .footercapa p { font-weight: 300; color: white; } .footercapa p a { color: white; font-weight: 400; } @media (max-width: 540px) { .footercapa p { font-size: 0.7em; } } @media (max-width: 920px) { .footercapa { width: 80%; } } #area_copyright img { display: block; width: 200px; height: auto; max-width: 100%; margin: 0 auto 2em; border-radius: 0; } #area_copyright p { text-align: center; } .header_sumario { width: 100vw; height: 5%; padding: 15px; position: fixed; display: flex; flex-direction: row; justify-content: space-between; background-color: blue; } @media (max-width: 920px) { .header_sumario { height: 8%; z-index: 9999; } } .header_sumario .botao { font-family: "Tanker", sans-serif; font-size: 3.5em; line-height: 1.1; color: white; } @media (max-width: 920px) { .header_sumario .botao { font-size: 3em; } } @media (max-width: 540px) { .header_sumario .botao { font-size: 2em; } } .header_sumario .botao a { line-height: 1.1; color: white; } .header_sumario .botao a:hover { text-decoration: underline; color: white; } .capitulos { position: absolute; top: 12%; height: 88%; width: 100%; display: flex; flex-direction: row; } @media (max-width: 540px) { .capitulos { flex-direction: column; } } .capitulos .capitulo { height: 100%; width: auto; padding: 0px 40px 0px 30px; border-right: 1px dashed white; display: flex; flex-direction: column; justify-content: space-between; } @media (max-width: 540px) { .capitulos .capitulo { border-bottom: 1px dashed white; border-right: 0px dashed white; } } .capitulos .capitulo a { color: white; } .capitulos .capitulo a h1 { font-size: 2.4em; line-height: 1; font-weight: 300; hyphens: auto; } .capitulos .capitulo a h1:hover { text-decoration: underline; } .capitulos .capitulo h2 { font-family: "Tanker", sans-serif; font-size: 4em; } @media (max-width: 540px) { .capitulos .capitulo h2 { margin-top: 30px; } } .capitulos .capitulo h3 { font-family: "General Sans", sans-serif; font-size: 1.5em; line-height: 1; font-weight: 300; padding-top: 5px; padding-bottom: 0; } .capitulos .capitulo p { font-size: 1em; font-style: italic; margin-top: 20px; } @media (max-width: 540px) { .capitulos .capitulo p { margin-bottom: 30px; } } .header_conteudo { background-color: white; width: 100vw; padding: 15px; position: fixed; display: flex; flex-direction: row; justify-content: space-between; z-index: 99999; } @media (max-width: 1500px) { .header_conteudo { height: 13%; } } @media (max-width: 920px) { .header_conteudo { height: 7%; } } @media (max-width: 540px) { .header_conteudo { height: 6%; } } .header_conteudo .botao { font-family: "Tanker", sans-serif; font-size: 3.5em; line-height: 1.1; color: blue; } @media (max-width: 920px) { .header_conteudo .botao { font-size: 3em; } } @media (max-width: 540px) { .header_conteudo .botao { font-size: 1.3em; } } .header_conteudo .botao a { line-height: 1.1; color: blue; } .header_conteudo .botao a:hover { text-decoration: underline; color: blue; } .header_conteudo .titulo_menu { width: 40%; padding-top: 10px; display: flex; flex-direction: row; } @media (max-width: 920px) { .header_conteudo .titulo_menu { width: 60%; } } @media (max-width: 540px) { .header_conteudo .titulo_menu { width: 90%; padding-top: 0px; } } .header_conteudo .titulo_menu h1 { font-size: 1.9em; font-family: "Tanker", sans-serif; line-height: 1; color: blue; } @media (max-width: 920px) { .header_conteudo .titulo_menu h1 { font-size: 1.3em; } } @media (max-width: 540px) { .header_conteudo .titulo_menu h1 { font-size: 0.65em; margin-top: 2px; } } .header_conteudo .titulo_menu h2 { font-size: 1.7em; font-family: "General Sans", sans-serif; line-height: 1; color: blue; font-weight: 300; padding: 0; } @media (max-width: 920px) { .header_conteudo .titulo_menu h2 { font-size: 1.3em; } } @media (max-width: 540px) { .header_conteudo .titulo_menu h2 { font-size: 0.6em; } } .header_conteudo .titulo_menu .titulos { display: flex; flex-direction: column; } .header_conteudo .titulo_menu .menu { display: flex; flex-direction: column; margin-right: 10px; } @media (max-width: 920px) { .header_conteudo .titulo_menu .menu { flex-direction: row; } } @media (max-width: 540px) { .header_conteudo .titulo_menu .menu { width: 20%; } } .header_conteudo .titulo_menu .menu img { width: 30px; } @media (max-width: 920px) { .header_conteudo .titulo_menu .menu img { width: 45px; margin-left: 8px; } } @media (max-width: 540px) { .header_conteudo .titulo_menu .menu img { width: 50px; margin-left: 5px; } } .header_conteudo .titulo_menu .menu span a img { width: 30px; } @media (max-width: 920px) { .header_conteudo .titulo_menu .menu span a img { width: 45px; margin-left: 8px; } } @media (max-width: 540px) { .header_conteudo .titulo_menu .menu span a img { width: 50px; margin-left: 4px; } } .conteudo { position: relative; color: blue; top: 350px; } @media (max-width: 920px) { .conteudo { top: 250px; } } @media (max-width: 540px) { .conteudo { top: 150px; } } .conteudo h1 { font-family: "Tanker", sans-serif; margin-bottom: 100px; } .conteudo p { font-weight: 300; } .epigrafe { position: relative; width: 50%; left: 50%; } @media (max-width: 540px) { .epigrafe { width: 70%; left: 30%; } } .epigrafe p { font-size: 0.9em; font-weight: 300; line-height: 1.2; text-align: right; margin-bottom: 0px; } @media (max-width: 920px) { .epigrafe p { font-size: 0.8em; margin-bottom: 150px; padding-right: 5px; } } @media (max-width: 540px) { .epigrafe p { font-size: 0.7em; margin-bottom: 0px; } } .pagina { font-size: 0.9em; font-weight: 300; color: blue; border-bottom: 1px dashed blue; width: 100%; display: block; padding-top: 30px; margin: 0 0 30px 0; text-align: right; } .pagina img { width: 0.7em; margin: 0 5px 2px 5px; } @media (max-width: 700px) { .pagina { width: 100%; } } @media (max-width: 540px) { .pagina { width: 100%; font-size: 1.1em; padding-top: 10px; margin-bottom: 20px; } } .quadro { border: 1px solid blue; padding: 20px 20px 0px 20px; margin-bottom: 20px; } button.bt-nota { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-color: blue; color: white; margin: 0 5px; padding-top: 0px; padding-left: 4px; padding-right: 4px; } button.bt-nota:before { content: attr(data-nota); } #notas-rodape { position: fixed; z-index: 2; right: 10%; top: 50%; transform: translateY(-50%); background-color: blue; width: calc(276px - 3em); max-height: calc(100% - 4em); overflow-y: auto; padding: 1.5em; font-size: 0.9em; line-height: 1.4; display: none; } @media (max-width: 920px) { #notas-rodape { right: 26px; } } #notas-rodape p { font-size: 0.95em; padding-bottom: 0; hyphens: none; } #notas-rodape.visivel { display: block; } #notas-rodape button.fechar { position: absolute; top: 18px; right: 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none; margin-bottom: 1em; width: 30px; height: 30px; display: block; background-color: blue; border: none; } #notas-rodape button.fechar img { width: 25px; padding-top: 4px; padding-right: 1px; } #notas-rodape .notas { margin-top: 40px; } #notas-rodape .notas div { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; display: none; text-align: right; } #notas-rodape .notas div.atual { display: block; } .notaprint { display: none; } @font-face { font-family: "Tanker"; src: url("../fonts/Tanker-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; font-style: normal; } @font-face { font-family: "General Sans"; src: url("../fonts/GeneralSans-Variable.woff2") format("woff2 supports variations"), url("../fonts/GeneralSans-Variable.woff2") format("woff2-variations"); font-weight: 100 1000; font-style: normal; } @font-face { font-family: "General Sans"; src: url("../fonts/GeneralSans-VariableItalic.woff2") format("woff2 supports variations"), url("../fonts/GeneralSans-VariableItalic.woff2") format("woff2-variations"); font-weight: 100 1000; font-style: italic; } @media print { .header_conteudo { display: none; } .notaprint { display: inline; } .notaprint h2 { font-size: 2em; } body { color: #000; } p { font-size: 14px; color: #000; } p .bt-nota { background-color: #000; } h1, h2, h2, h3 { color: #000; } blockquote { color: #000; } .container .pagina { color: #000; border-bottom: 1px dotted #000; } .container .pagina a { color: #000; } .container .pagina a img { display: none; } a { color: #000; } .quadro { border: 1px solid #000; } } /*# sourceMappingURL=style.css.map */