.callout-note {
    color: blue !important; 
    border-left-width: 5px !important;
    background-color: #ffdddd !important;
    box-shadow: 5px 5px 10px #888888 !important;
  }


  .figure {
    /* General figure container styles */
    text-align: center; /* Center align figure */
    position: center; /* Enable positioning */

    
}


/* Basic Caption Styling */
.figure-caption {
  font-style: italic;  /* Italicize the caption */
  text-align: center;  /* Center the caption */
  margin-top: 10px;   /* Add some space above the caption */
  font-size: 14px;    /* Adjust font size as needed */
  display: none;
}

/* Optional: Customise Caption Color */
.figure-caption {
  color: #555;       /* Dark gray color for caption */
  font-family: "Helvetica Neue", sans-serif; /* Choose your preferred font */
  background-color: #f8f8f8; /* Light gray background */
  padding: 5px;               /* Add padding */
}

.medium-image {
  width: 75%;  /* Or set a specific width in pixels */
  height: auto; /* Maintain aspect ratio */
}

.small-image {
  width: 50%;  /* Or set a specific width in pixels */
  height: auto; /* Maintain aspect ratio */
}


.smaller-image {
  width: 10%;  
  height: auto;
  display: block;    /* Ensures the image is treated as a block element */
  margin-left: 0;    /* Remove any default left margin */
  text-align: left;  /* Align the image to the left */
  caption-side: bottom;
}


.gallery-image {
  width: 30%; /* Adjust the width percentage as needed */
  margin: 10px;
  /* display: inline-block; /* Allow images to sit next to each other */
  vertical-align: middle; /* Align images to the middle */
  cursor: pointer; /* Change cursor to pointer to indicate clickability */
  float: left;
}

.gallery-image-large {
  width: 75%; /* Adjust the width percentage as needed */
  margin: 10px;
  /* display: inline-block; /* Allow images to sit next to each other */
  vertical-align: middle; /* Align images to the middle */
  cursor: pointer; /* Change cursor to pointer to indicate clickability */
  float: left;
}

ul {
  text-align: left; /* Force left alignment for unordered lists */
}

table {
  border-collapse: collapse; /* Remove gaps between borders */
  width: 100%; /* Adjust to fit the container */
}

th, td {
  border: 1px solid #ddd; /* Add borders */
  padding: 4px; /* Add padding */
  text-align: left; /* Adjust alignment */
  margin:0;
}

th {
  background-color: #f2f2f2; /* Header background color */
}

.gist-preview {
  height: 200px; /* Adjust the height as needed */
  overflow: auto; 
}

.scroll-cypher {
  max-height: 200px; /* Adjust as needed */
  overflow-y: auto;
}