Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <link href='//fonts.googleapis.com/css?family=Cinzel Decorative' rel='stylesheet'>
<link href='//fonts.googleapis.com/css?family=Quicksand' rel='stylesheet'>
<body background="https://s-media-cache-ak0.pinimg.com/originals/7a/5e/a3/7a5ea3a45a66da42b481411e8503e1ab.jpg">
<style>
  
  .shadow {
    box-shadow: 20px 20px 20px black;
  }
  
  .text-shadow {
    text-shadow:2px 2px 2px black;
  }
  
  .border {
    border-color: #FFEBCD;
    border-width: 5px;
    border-style: double;
    border-radius: 20px;
  }
  
  .cinzel {
    font-family: 'Cinzel Decorative';
    font-size: 48px;
  }
  
  .quicksand {
    font-family: 'Quicksand';
    font-size: 14px;
  }
  
  .even-image {
    height: 390px;
  }
  
  .deep-red {
    background-color: #7f0000;
  }
  
  .whitey {
    color: white;
  }
  
  .h1-margin {
    padding-top: 10px;
  }
  
  .picture-margin {
    padding-top: 20px;
  }
  
  .h5-margin {
    padding-bottom: 10px;
  }  
  
  .side-margin {
    margin-left:  50px;
    margin-right: 50px;
  }
  
  .top-margin {
    margin-top: 20px;
  }
  
  .big-space {
    margin-top: 50px;
  }
  
  .bottom-margin {
    margin-bottom: -40px;
  }
</style>

<div class="container-fluid" >
  <div class="container deep-red border top-margin shadow">
  <h1 class="text-primary text-center h1-margin side-margin cinzel bottom-margin"><b><u>Saint Isadore of Seville</u></b></h1>
  <h5 class="text-center whitey h5-margin cinzel" ><font size="3">Patron Saint of the Internet and Computer Users</h5>
  </div>
<div class="row picture-margin"> 
  <div class="col-sm-3 col-sm-offset-3 picture-margin"> 
    <img class="img-responsive even-image border shadow" src="http://www.catholic.org/files/images/saints/58.jpg" alt="Picture of Saint Isadore"> 
  </div> 
  <div class="col-sm-3 picture-margin"> 
    <img class="img-responsive border shadow" src="https://3.bp.blogspot.com/_GzQnzaF4k-o/RsYFMWT5TFI/AAAAAAAADBw/1YZpSPfCz4s/s640/506px-Isidoro_de_Sevilla_%2528Jos%25C3%25A9_Alcoverro%2529_02.jpg" alt="Isadore Statue"> 
  </div> 
  </div> 
  <div class="well side-margin top-margin quicksand border shadow big-space">
  <h4><p>Isidore was literally born into a family of saints in sixth century Spain. Two of his brothers, Leander and Fulgentius, and one of his sisters, Florentina, are revered as saints in Spain. It was also a family of leaders and strong minds with Leander and Fulgentius serving as bishops and Florentina as abbess.</p>

<p>This didn't make life easier for Isidore. To the contrary, Leander may have been holy in many ways, but his treatment of his little brother shocked many even at the time. Leander, who was much older than Isidore, took over Isidore's education and his pedagogical theory involved force and punishment. We know from Isidore's later accomplishments that he was intelligent and hard-working so it is hard to understand why Leander thought abuse would work instead of patience.</p>

<p>One day, the young boy couldn't take any more. Frustrated by his inability to learn as fast as his brother wanted and hurt by his brother's treatment, Isidore ran away. But though he could escape his brother's hand and words, he couldn't escape his own feeling of failure and rejection. When he finally let the outside world catch his attention, he noticed water dripping on the rock near where he sat. The drops of water that fell repeatedly carried no force and seemed to have no effect on the solid stone. And yet he saw that over time, the water drops had worn holes in the rock.</p>

<p>Isidore realized that if he kept working at his studies, his seemingly small efforts would eventually pay off in great learning. He also may have hoped that his efforts would also wear down the rock of his brother's heart.</p>

<p>When he returned home, however, his brother in exasperation confined him to a cell (probably in a monastery) to complete his studies, not believing that he wouldn't run away again.</p>

<p>Either there must have been a loving side to this relationship or Isidore was remarkably forgiving even for a saint, because later he would work side by side with his brother and after Leander's death, Isidore would complete many of the projects he began including a missal and breviary.</p>

<p>In a time where it's fashionable to blame the past for our present and future problems, Isidore was able to separate the abusive way he was taught from the joy of learning. He didn't run from learning after he left his brother but embraced education and made it his life's work. Isidore rose above his past to become known as the greatest teacher in Spain.</p>

<p>His love of learning made him promote the establishment of a seminary in every diocese of Spain. He didn't limit his own studies and didn't want others to as well. In a unique move, he made sure that all branches of knowledge including the arts and medicine were taught in the seminaries.</p>

<p>His encyclopedia of knowledge, the Etymologies, was a popular textbook for nine centuries. He also wrote books on grammar, astronomy, geography, history, and biography as well as theology. When the Arabs brought study of Aristotle back to Europe, this was nothing new to Spain because Isidore's open mind had already reintroduced the philosopher to students there.</p>

<p>As bishop of Seville for 37 years, succeeding Leander, he set a model for representative government in Europe. Under his direction, and perhaps remembering the tyrannies of his brother, he rejected autocratic decision- making and organized synods to discuss government of the Spanish Church.</p>

<p>Still trying to wear away rock with water, he helped convert the barbarian Visigoths from Arianism to Christianity.</p>

<p>He lived until almost 80. As he was dying his house was filled with crowds of poor he was giving aid and alms to. One of his last acts was to give all his possessions to the poor.</p>

<p>When he died in 636, this Doctor of the Church had done more than his brother had ever hoped; the light of his learning caught fire in Spanish minds and held back the Dark Ages of barbarism from Spain. But even greater than his outstanding mind must have been the genius of his heart that allowed him to see beyond rejection and discouragement to joy and possibility.</p></h4>
    
    <h2><b><center>For more information on this and other Saints, visit  <a href="http://www.catholic.org/saints/" target="_blank">Catholic.org</a>.</center></b></h2>
    <h6><center>Source: <b>St. Isidore of Seville - Saints & Angels</b>, Catholic Online - http://www.catholic.org/saints/saint.php?saint_id=58</center></h6>
</div>
    <h6><p align="right" class="text-primary text-shadow">Coded by <b>Gabriel Gonzalez</b></p></h6>
  </div>
  
 



              
            
!

CSS

              
                
              
            
!

JS

              
                
              
            
!
999px

Console