
    /* Fullscreen image slides */
    .full-image {
      background-size: cover;
      background-position: center;
      height: 100vh;
    }

    /* Custom canvas block */
    .canvas-container {
      width: 100%;
      height: 500px;
      background: #111;
      margin: 40px auto;
      border: 2px solid #333;
    }

    .reveal .vts-fullscreen {
        margin: 0px;
    }


/* .reveal section */
    
.reveal section.flex {
      display: flex !important; /* Make slide a flex container */
      flex-direction: column;
      height: 100% !important; /* Full height of slide */
      width: 100% !important;
      padding: 20px; /* Optional: adjust padding */
      box-sizing: border-box;
}    


.reveal section.left {
  justify-content: flex-start;
  text-align: left;
  padding: 1em 2em;
}

.reveal section.center {
  justify-content: center;
  text-align: center;
  padding: 1em 2em;
}

        
.reveal .slides section.relpos { position: relative; }

/* banner */
.reveal .slides section.relpos .banner {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 10%;
  width: 90%;
  box-sizing: border-box;
  padding: 15px 40px 20px 40px;
  color: black;
  background: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,.7));
  border-radius: 16px;
}    

.reveal .banner p {
    
  text-align: left;
}


/* text sizes */

.reveal {
  font-size: 60px !important; /* your preferred base size */
}

.reveal p.title {
    
  font-weight: bold;
  font-size: 1.2em;
  
}

.hanging {
  text-indent: -2em;  /* Adjust size: -1em, -40px, etc. */
  padding-left: 2em;
}

    
/* Custom styles for code blocks */
/*.reveal pre {
  width:    100%; 
  max-height: 100vh; 
  margin: 20px auto; 
  font-size: 0.5em; 
  line-height: 1.2em; 
  background: #2b2b2b;
  border-radius: 8px;
  box-shadow: none;
}

.reveal pre code {
  padding: 20px; 
  white-space: pre-wrap; 
  font-family: 'Consolas', 'Monaco', monospace;
  max-height: 800px;
}*/    

.reveal pre {
  font-size: 0.5em; 
  line-height: 1.2em; 
}

.reveal pre code {
  max-height: 700px;
}

.reveal .cartdiv {
  width: 100%; /* 80% of container's width */
  height: 100%; /* 80% of container's height */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* Center by offsetting half the element's size */
}


/* whitewashed image */
.reveal .whitewashed {
    background: linear-gradient(
        rgba(255, 255, 255, 0.3), 
        rgba(255, 255, 255, 0.3)
    ), url('your-background.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
}
    
