info.php

<div class="container" style="max-width: 650px;">
  <div class="main">
    <div class="grid">
    <div>
      <button class="delete-button" onclick="document.getElementById('modal-info').style.display='none'" style="position:relative;float:right;margin-top: 20px;margin-right:20px;"></button>
    </div>

    <div class="sign-up-form" style="border:0px;margin-bottom:2rem;max-height: 500px;overflow-y: auto;">
        <div class="form-row"">
            <label style="font-weight:bold;margin:auto;">The Extraordinary Machines of Jazari</label><br>
        </div>

            <div class="form-row" style="margin:0 10px;line-height: 1.8;text-align: justify;">
                Al-Jazari (1136-1206) was a polymath: a scholar, inventor, mechanical engineer, artisan, artist and mathematician from the Artuqid Dynasty of Jazira in Mesopotamia. He is best known for writing <b>The Book of Knowledge of Ingenious Mechanical Devices</b> in 1206, where he described 50 mechanical devices, along with instructions on how to construct them. He is credited with the invention of the elephant clock (see illustration below). He has been described as the "father of robotics" and modern day engineering (Source: <a href="https://en.wikipedia.org/wiki/Ismail_al-Jazari">Wikipedia</a>).<br><br>A digital version of the book can be found online <a href="https://marcell.memoryoftheworld.org/Ibn%20al-Razzaz%20al-Jazari/The%20Book%20of%20Knowledge%20of%20Ingenious%20Mechanical%20Devices%20(2668)/The%20Book%20of%20Knowledge%20of%20Ingenious%20Mechani%20-%20Ibn%20al-Razzaz%20al-Jazari.pdf">here</a>, but there seem to be errors either in translation or digitalization.
            </div> 
        
            <div class="form-row" style="margin:auto;display:flex;">
                <img src="frontend/images/ElephantClock_Wikipedia.png" width="300" style="margin:auto;"></img>
            </div> 

            <div class="form-row" style="margin-left:10px; line-height: 1.8;font-display: block;text-align: justify;">
                The background image used on this website is from the poster for "The Extraordinary Machines of Jazari" exhibition by the <a href="https://www.cezerimuzesi.com/en">Cezeri Museum</a> in Istanbul.
            </div>    
        
            <div class="form-row" style="margin-left:10px">
                <iframe width="490" height="275" src="https://www.youtube.com/embed/5yGbU73r3j0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
            </div>
       
    </div>
  </div>   
</div>

</div>