@font-face {
  font-family: 'Garamond';
  src: url('../assets/font/EB_Garamond/EBGaramond-VariableFont_wght.ttf');
  
}
@font-face {
  font-family: 'Libre';
    src: url('../assets/font/Libre_Bodoni/LibreBodoni-VariableFont_wght.ttf');
    
  }
  @font-face {
    font-family: 'Instrument';
    src: url('../assets/font/instrument_sarif/InstrumentSerif-Regular.ttf');
    
  }
      .font1 {
          font-family: 'Garamond', serif;
      }
      .font2 {
          font-family: 'Libre', serif;
      }
      .font3 {
          font-family: 'Instrument', serif;
      }
/* ---------------------------------------------------- */



body{
     background-color: white;
     margin: 12%;

    } 

    /* this is a simple underline for the middle of the text for the title */
    .underline-middle { 
  border-bottom: 3px solid rgb(0, 0, 0);
  border-image: linear-gradient(to right, transparent 20%, #000000 50%, transparent 80%) 100% 1;
}

/* typical underline for the headings  */
.underline{
    border-bottom: 1px solid rgb(0, 0, 0);
    border-image: linear-gradient(to right, #000000 50%, transparent 100%) 100% 1;
}


.split{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
  width: 100%;
}

.indent{
    text-indent: 2em;
}
.indent2{
    text-indent: 3em;
}
.box{
    border: 1px solid black;
    padding: 10px;
    height: 25vh;
}
.photon_stuff{
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.button {
  background-color: white; 
  border: 2px solid black;
  color: black;
  padding: 10px 24px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
} 
.button:hover {
  background-color: black; 
  color: white;
}