/* @theme structure */ /* ============================================ Created by Paulo Cunha version: 1.75 update: 06.mai.2024 update: 23.jun.2023 update: 12.mai.2022 update: 30.dez.2021 ============================================ You may use freely (MIT license) provided due credits are granted to the authors. CLASSES: Credits: https://catalin.red/css3-ordered-list-styles/ for cool-list anda cool-list2. */ /***************** COMMON STRUCTURE **********************/ h1 { color: var(--h1-color); border-bottom: 1px solid var(--border-color); } section p { margin-top: 0.5em; margin-bottom: 0.25em; line-height: 1.3em; font-size: 32px; } section li { margin-top: 0.5em; margin-bottom: 0.25em; line-height: 1.2em; font-size: 105%; color: val(--list-item-color); } section li:hover { /* margin-top: 1em; */ /* margin-bottom: 1em; */ /* font-size: 150% !important; */ /* font-weight: 600 !important; */ /* color: #000000 !important; */ /* border: 1px solid rgb(8, 8, 8); */ background-color: rgb(250, 233, 2); color: black !important; background-color: rgb(208, 253, 6); border-end-start-radius: 10pt; border-start-end-radius: 10pt; border-end-end-radius: 10pt; border-start-start-radius: 10pt; } /* Definition for emphasis */ section em { color: var(--italic-color); background: var(--italic-background-color); font-style: normal; font-weight: bold; font-family: sans-serif; padding-top: 6px; padding-left: 6px; padding-right: 6px; padding-bottom: 6px; } /* Definition for bold text */ section strong { color: var(--bold-color); padding-left: 5px; padding-right: 5px; font-weight: 600; } section figcaption{ font-size: 80%; padding-top: 16px; /* text-align: center; */ } /* May append some string to page number */ /* Uses format "page-number / total pages" */ section::after { color: rgb(51, 59, 77); font-size: 0.8em; content: ' ' attr(data-marpit-pagination) '/' attr(data-marpit-pagination-total) ' '; } .small { font-size: 24px; } /**------------------- TABLE -----------------------------*/ /* Tables are always centered. Credits: Juan Vera del Campo Locus: https://github.com/Juanvvc */ section table { margin-top: 40px; /* width: auto; (24.01.2025 paulo.cunha) */ border: 0; font-size: 24px; margin-right: auto !important; margin-left: auto !important; } section table th { background-color: var(--table-header-color); color: var(--table-header-font-color); border: 1; border-top: var(--table-border-top) solid 2px; } section table td { border: 0; } section table tr:nth-child(2) { background-color: #c4c6c6; } section table tr:last-child { border-bottom: var(--table-border-bottom) solid 1px; } tr:nth-child(even) { background-color: var(--table-nth-child-color) !important; } tr:hover { color: var(--table-hover-color) !important; background-color: var(--table-hover-background-color) !important; font-weight: bold !important; } /**------------------- BLOCK QUOTE -----------------------------*/ /* Block quote: used for footnote substitution. Use as the last element of a slide. */ section blockquote { color: rgb(66, 66, 66); font-size: 20px; border-top: 0.1em dashed var(--extra-back-color); margin-top: auto; } section blockquote p { font-size: 1.12em !important; letter-spacing: -0.5px !important; } section blockquote strong { color: var(--blockquote-strong); font-weight: bold; font-size: 1.11em !important; letter-spacing: -0.5px !important; } /**------------------- COLUMNS -----------------------------*/ /* Adds two-columns class */ .columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; /* justify-content: center !important; */ } .columns p { margin-top: 0.5em; margin-bottom: 0.25em; line-height: 1.16em; font-size: 30px; } .columns ol, ul { margin-top: 0.15em; margin-bottom: 0.25em; line-height: 1.73em !important; font-size: 26px; color: var(); } /**------------------- COLUMNS CENTER ---------------------*/ /* /* Adds two-columns with centered contens class */ .columns-center { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; justify-items: center; justify-content: center; align-items: center; } /**------------------- THREE-COLUMNS -----------------------------*/ /* Adds three-columns class */ .columns3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; /* justify-content: center !important; */ } /**------------------- THREE-COLUMNS-CENTER ---------------------*/ /* Adds three-columns with centered contens class */ .columns3-center { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; justify-items: center; justify-content: center; align-items: center; } /**------------------- TITLEPAGE -----------------------------*/ /* Title Page Class: first slide in a deck. Use: # TTILE ## SUBTITLE ### AUTHOR #### DATE ##### INSTITUTION */ section.titlepage { background-color: var(--background-color); } /* Titlepage informations */ section.titlepage .title { font-size: var(--title-size); font-weight: var(--title-font-weight); color: var(--title-color); border-bottom: 1px solid var(--border-color); line-height: 1.2; padding-bottom: 15px; } section.titlepage .subtitle { font-size: var(--subtitle-size); font-weight: var(--subtitle-font-weight); line-height: 1.2; color: var(--subtitle-color); padding-top: 10px; padding-bottom: 120px; letter-spacing: var(--letter-spacing); } section.titlepage .author { font-size: var(--author-size); } section.titlepage .date { font-size: var(--date-size); } section.titlepage .organization { font-size: var(--institute-size); } section.titlepage .author, section.titlepage .date, section.titlepage .organization { font-weight: 400; text-align: right; color: var(--titlepage-color); line-height: 1.25; } section.titlepage h3, section.titlepage h4, section.titlepage h5 { font-weight: 400; text-align: right; color: var(--titlepage-color); line-height: 0.45; letter-spacing: var(--letter-spacing); } section.titlepage h1 { font-size: var(--title-size) !important; font-weight: var(--title-font-weight) !important; text-align: left; color: var(--title-color) !important; border-bottom: 1px solid var(--border-color) !important; line-height: 1.25; /* padding-right: 20%; */ } section.titlepage h2 { font-size: var(--subtitle-size); font-weight: var(--subtitle-font-weight); text-align: left; color: var(--subtitle-color) !important; letter-spacing: var(--letter-spacing); line-height: 1.2; margin-top: -0.2em; padding-bottom: 95px; } section.titlepage h3 { font-size: var(--author-size); } section.titlepage h4 { font-size: var(--date-size); } section.titlepage h5 { font-size: var(--institute-size); } /* Omits page number in Title Page Slide */ section.titlepage footer, section.titlepage header, section.titlepage:after { /* hide header, footer and pagination */ display: none; } /**------------------- TRANSITION -----------------------------*/ /* transition class: first slide in a section. Use h1 as header. Use: # Header */ section.transition { background-color: var(--transitionpage-color); text-align: center !important; font-weight: bold; color: white; padding-top: auto; padding-buttom: auto; } section.transition h1, section.transition h2, section.transition p, section.transition a { color: rgb(243, 229, 212); font-size: 200%; border-bottom: none; } section.transition footer, section.transition header, section.transition:after { /* hide header, footer and pagination */ display: none; } /**------------------- TRANSITION2 -----------------------------*/ /* transition2 class: first slide in a section. Use h1 as header. Use: # Header */ section.transition2 { background-color: rgb(137, 173, 207); text-align: center !important; font-weight: bold !important; color: rgb(255, 255, 255); padding-top: auto; padding-buttom: auto; } section.transition2 h1, section.transition2 h2, section.transition2 p, section.transition2 a { color: rgb(217, 235, 247); font-size: 200%; border-bottom: none; } section.transition2 em { background-color: rgb(60, 255, 0) !important; } section.transition2 footer, section.transition2 header, section.transition2:after { /* hide header, footer and pagination */ display: none; } /**------------------- TRANSITION3 -----------------------------*/ /* transition2 class: first slide in a section. Use h1 as header. Use: # Header */ section.transition3 { background-color: rgb(66, 69, 71); text-align: center !important; font-weight: bold !important; color: rgb(255, 255, 255); padding-top: auto; padding-buttom: auto; } section.transition3 h1, section.transition3 h2, section.transition3 p, section.transition3 a { color: rgb(244, 247, 217); font-size: 200%; border-bottom: none; } section.transition3 em { background-color: rgb(60, 255, 0) !important; } section.transition3 strong { color: rgb(71, 83, 90); } section.transition3 footer, section.transition3 header, section.transition3:after { /* hide header, footer and pagination */ display: none; } /**------------------- CITE -----------------------------*/ /* cite class: slide containg a citation Use: Text */ section.cite { background-color: var(--background-color); } section.cite p { color: black; background-color: ; letter-spacing: var(--letter-spacing); font-size: 150%; text-align: center; line-height: 1.2em; font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; /* font-style: oblique; */ padding-top: auto; padding-bottom: auto; padding-left: 100px; padding-right: 100px; } section.cite strong { color: var(--strong-color); } /* Omits page number in Title Page Slide */ section.cite footer, section.cite header, section.cite:after { /* hide header, footer and pagination */ display: none; } /**------------------- BIBLIO -----------------------------*/ /* slides containg bibliography Use: # References 1. Item one 2. Item two */ section.biblio { background-color: var(--biblio-background-color); } section.biblio p { color: var(--text-color); font-size: 80%; font-weight: 300; padding-left: 5px; } section.biblio h1 { font-size: 35px; color: var(--text-color); border-bottom: 1px solid var(--border-color); } section.biblio strong { color: var(--bold-color); } section.biblio a { font-size: 31px; font-weight: bold; color: var(--bold-color); } section.biblio li { color: var(--text-color); } section.biblio footer, section.biblio header, section.biblio:after { /* hide header, footer and pagination */ display: none; } /**------------------- COOL-LIST -----------------------------**/ /* Credits: https://catalin.red/css3-ordered-list-styles/ Use: 1. *Item One* 1. *Item two* 1. *Item two.one* 1. *Item two.two* 1. *Item two.three* 1. *Item Three* */ section.cool-list ol { counter-reset: li; /* Initiate a counter */ list-style: none; /* Remove default numbering */ padding: 0; /*text-shadow: 0 1px 0 rgba(255,255,255,.5);*/ } section.cool-list li { margin-bottom: 0.1em !important; margin-top: 0.1em !important; } section.cool-list ol>li>em, section.cool-list>ol>li>a { position: relative; display: block; padding: 0.4em 0.4em 0.4em 2em; margin: 0.5em 0; background: #ddd; color: #444; text-decoration: none; border-radius: 0.3em; transition: all 0.3s ease-out; font-style: normal; } section.cool-list ol>li>em:before, section.cool-list>ol>li>a:before { content: counter(li); counter-increment: li; position: absolute; left: -1.3em; top: 50%; margin-top: -1.3em; background: var(--cool-list-color); height: 2em; width: 2em; line-height: 2em; border: 0.3em solid #fff; text-align: center; font-weight: normal; border-radius: 2em; transition: all 0.3s ease-out; color: white; } section.cool-list>ol>li>em:hover, section.cool-list>ol>li>a:hover { background: #eee; font-weight: bolder; } /* Rotating effect */ /* section.cool-list ol > li > em:hover:before,section.cool-list ol > li > a:hover:before{ transform: rotate(360deg); }*/ /* Lists inside lists */ section.cool-list>ol ol { margin: 0 0 0 2em; /* Add some left margin for inner lists */ font-size: 75%; counter-reset: li2; /* Initiate a counter */ } section.cool-list>ol ol>li>em:before, section.cool-list>ol ol>li>a:before { content: counter(li2); counter-increment: li2; } section.cool-list>ol>li>ul { list-style-type: disc; margin: 0 0 0 1em; font-size: 75%; } section.cool-list>ol ol>li>em { background: #efefef; } /******************* cool-list2 *****************************/ /* Credits: https://catalin.red/css3-ordered-list-styles/ Use: 1. *Item One* 1. *Item two* 1. *Item two.one* 1. *Item two.two* 1. *Item two.three* 1. *Item Three* */ section.cool-list2 ol { counter-reset: li; /* Initiate a counter */ list-style: none; /* Remove default numbering */ padding: 0; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); } section.cool-list2 ol ol { margin: 0 0 0 2em; /* Add some left margin for inner lists */ } section.cool-list2 ol li em { position: relative; display: block; padding: 0.4em 0.4em 0.4em 0.8em; margin: 0.5em 0 0.5em 2.5em; background: #ddd; color: #444; text-decoration: none; transition: all 0.3s ease-out; font-style: normal; } section.cool-list2 ol li em:hover { background: #eee; font-weight: bolder; } section.cool-list2 ol li em:before { content: counter(li); counter-increment: li; position: absolute; left: -2.5em; top: 50%; margin-top: -1em; /* background: #fa8072; */ background: var(--lighter-color); height: 2em; width: 2em; line-height: 2em; text-align: center; font-weight: bold; } section.cool-list2 ol li em:after { position: absolute; content: ''; border: 0.5em solid transparent; left: -1em; top: 50%; margin-top: -0.5em; transition: all 0.3s ease-out; } section.cool-list2 ol li em:hover:after { left: -0.5em; /* border-left-color: #fa8072; */ border-left-color: var(--lighter-color); } /* Lists inside lists */ section.cool-list2 ol ol { margin: 0 0 0 2em; /* Add some left margin for inner lists */ font-size: 75%; counter-reset: li2; /* Initiate a counter */ } section.cool-list2 ol ol>li>em:before, section.cool-list2 ol ol>li>a:before { content: counter(li2); counter-increment: li2; background: lightgray; } section.cool-list2 ol ul { list-style-type: disc; margin: 0 0 0 1em; font-size: 75%; } section.cool-list2 ol ol em { background: #efefef; } /**------------------- POSITIONING - new 08.04.2025 -----------------------------*/ .topleft { position: absolute; top: 38px; left: 26px; } .topright { position: absolute; top: 38px; right: 26px; } .bottomleft { position: absolute; bottom: 38px; left: 26px; } .bottomright { position: absolute; bottom: 38px; right: 26px; } .centered { position: absolute; left: 0px; right: 0pt; top: 50%; width: 100%; text-align: center; } .center { text-align: center; } .right { text-align: right; }