body
   {
   background-color: white;
   font-size: larger
   }

p
  {
  text-align: justify;
  }


p:first-letter
  {
  color: #ff0000;
  font-size:x-large
  }


/*
 * Apparently anchor overriding has an order
 * It seems weird to me, but I have to nite to test it over
 *  So, keep the <A part in this order.
 */
a         { text-decoration: none;  }
a:link    { color: #0066CC;   }
a:visited { color: #0066CC; background-color: #DAFF8C;   }
a:hover   { background: #BBDD99;   }
a:active  {   }


/*
 * Generally speaking I do not want border around images.
 */
img
   {
   border: none;
   }

/*
 * All images inside an anchor get aligned to the middle so it is more pleasant
 * and the silly part of the background disappears.
 */
a img
  {
  vertical-align: middle;
  }

/*
 * The idea is that I give visual feedback on images that are within a link
 * so a user knows when it is clickable or not.
 */
a:link img     {  border: 1px solid red;   }
a:visited img  {  border: 1px solid red;   }
a:hover img    {  border: 1px solid green; }




h1,h2,h3
   {
   font-family: cursive;
   font-style: italic;
   color: #0b1d85;
   }

strong
  {
  color: #9900FF
  }

code,pre
  {
  border: 2px dotted #FF6666;
  padding: 0.5em;
  background: #FBFBFB;
  }

/*
 * It is better NOT to put a height so the box resizes to the right length
 * to accomodate the whole content.
 */
div#jump-home
  {
  position: absolute;
  right:  0.1em;
  top: 0.1em;

  width: 6em;
/*  height: 7.9em;
  overflow: visible;
  */

  white-space: nowrap;
  border: 1px solid #3399FF;
  background: #FFF7E6;
  padding-left: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
  }

div.arrabbiato
  {
  border: medium dotted #FF0066;
  padding: 4px;
  }

div.postino
  {
  border: groove #993333;
  padding: 0.5em;
  }

