/* @theme structure */

/*
  ============================================
    Created by Paulo Cunha
    version: 1.75
    
    update: 2025.jul.21
    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:
        
        <!-- _class: biblio           -->
        <!-- _class: blockquote       -->
        <!-- _class: cite             -->
        <!-- _class: cite2             -->

        <!-- _class: columns          -->
        <!-- _class: columns3         -->
        <!-- _class: columns-center   -->
        <!-- _class: columns3-center  -->
        
        <!-- _class: cool-list        -->
        <!-- _class: cool-list2       -->
        <!-- _class: table            -->
        <!-- _class: transition       -->
        <!-- _class: transition2       -->
        <!-- _class: titlepage        -->

  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: var(--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: 10px;
  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: 
    
    <!-- _class: titlepage --> 

    # 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: 
    
    <!-- _class: transition --> 

    # 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: 
    
    <!-- _class: transition2 --> 

    # 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: 
    
    <!-- _class: transition3 --> 

    # 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: 
    
    <!-- _class: cite --> 

    Text

*/
section.cite {
  background-color: #9aade2;
}

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;
}

/**------------------- CITE2 -----------------------------*/
/* 
    cite class: slide containg a citation 
    
    Use: 
    
    <!-- _class: cite --> 

    Text

*/
section.cite2 {
  background-color: white !important;
}

section.cite2 p {
  color: rgb(34, 34, 48) !important;
  background-color: rgb(255, 255, 255);
  letter-spacing: 0.1pt;
  font-size: 145%;
  text-align: center;
  line-height: 1.2em;
  font-family: bookerly ,Cochin,Cambria, Times, serif !important;
  /*  font-style: oblique; */
  padding-top: auto;
  padding-bottom: auto;
  padding-left: 100px;
  padding-right: 100px;
}

section.cite2 strong {
  font-style: italic;
  color: #6462f1 !important;
}

/* Omits page number in Title Page Slide */
section.cite2 footer,
section.cite2 header,
section.cite2:after {
  /* hide header, footer and pagination */
  display: none;
}

/**------------------- BIBLIO -----------------------------*/
/* 
    slides containg bibliography
    Use: 
    
    <!-- _class: biblio --> 
    # 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:

  <!-- _class: cool-list -->

  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:

  <!-- _class: cool-list2 -->

  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;
}