body {
	margin:2;
	//background-color: #FBFCFB;
	background-image: url("../images/bck001.jpg");
	overflow-y: scroll;
}

hr {
    display: block;
    position: relative;
    padding: 0;
    margin: 1px auto;
    height: 0;
    width: 95%;
    max-height: 0;
    line-height: 0;
    clear: both;
    border: none;
    border-top: 1px solid #202020;
    border-bottom: 1px solid #aaaaaa;
}

div
{
  color:           #B20000;
  text-align:      justify;
  font-family:     Geneva, Tahoma, Arial;
  font-size:       11pt;
  word-spacing:    -2px;
}

.destra
{
  color:           #B20000;
  text-align:      right;
  font-family:     Geneva, Tahoma, Arial;
  font-size:       11pt;
  word-spacing:    -2px;
}

.centro
{
  /* color: 					 #A9A9A9;  
  color:           #000000; */ 
  color:   #330099;
  text-align:      center;
  font-family:     Geneva, Tahoma, Arial;
  font-size:       40pt;
  font-weight:     normal;
  word-spacing:    +20px;
}

.circular-image {
  border-radius: 8px;
  height: 42px;
  width: 42x; 
}

#Principale
{
  text-align: center;
  margin: 0 auto;
  border: 0;
  border-color: transparent;
  width: 100%; 
} 

ul.menulist {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  //background-color: #FBFCFB;
	background-image: url("../images/bck001.jpg");
  font-family: Geneva, Tahoma, Arial;
  font-weight: normal;
}

ul.menulist li {float: left;}

ul.menulist li a {
  display: inline-block;
  color: #B20000;
  text-align: center;
  padding: 18px 22px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 17px;
}



/* Submenus (<ul> tags) are hidden */
.menulist ul {
 position: relative;
 display: none;
 easingOpen:	swing;
 padding-left: 8px;
}


.menulist li {
 margin: 0;
 padding: 0;
 list-style-type: none;
 width: 13%;
}

/* Links inside the menu */
.menulist a {
 display: block;
 padding: 1px 1px 1px 1px;
 color: #FBFCFB;
 text-decoration: none;
 font-type: tahoma, geneva, arial;
 margin: 0;
}

.menulist ul A:active, .menulist ul A:visited, .menulist ul A:link, .menulist ul a:hover, .menulist ul a.highlighted, .menulist ul a.highlighted:hover, .menulist ul a:focus {
    FONT-SIZE: 8pt;
    FONT-STYLE: italic;
    background-color: #E7B2B2;	
}


/*
 Lit items: hover/focus = the current item. 'highlighted' = parent items to visible menus.
 Here, active items are given a border, and a padding tweak to 'elevate' the text within.
 Feel free to use background-image:url(file.gif) instead of background-color:#nnn here...
*/
.menulist a:hover, .menulist a.highlighted, .menulist a.highlighted:hover, .menulist a:focus {
 color: #B20000;
 background-color: #E7B2B2;	
}


/*
 If you want per-item background images in your menu items, here's how to do it.
 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
 2) Copy and paste these next lines for each link you want to have an image:
    .menulist a#xyz {
      background-image: url(out.gif);
    }
    .menulist a#xyz:hover, .menulist a.highlighted#xyz, .menulist a:focus {
     background-image: url(over.gif);
    }
*/


/* 'subind' submenu indicators, which are automatically prepended to 'A' tag contents. */
.menulist a .subind {
 float: right;
}

/*
 HACKS: IE/Win:
 A small height on <li> and <a> tags and floating prevents gaps in menu.
 * html affects <=IE6 and *:first-child+html affects IE7.
 You may want to move these to browser-specific style sheets.
\*/

* html .menulist li {
 float: left;
 height: 1%;
}
* html .menulist a {
 height: 1%;
}
/* End Hacks */



	

ul.menulist li.icon {display: none;}

@media screen and (max-width:680px) {
  ul.menulist li:not(:first-child) {display: none;}
  ul.menulist li.icon {
    float: right;
    display: inline-block;
    width: 24%;
  }
  
  width: 100%; 
}

@media screen and (max-width:680px) {
  ul.menulist.responsive {position: relative;}
  ul.menulist.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  ul.menulist.responsive li {
    float: none;
    display: inline;
  }
  ul.menulist.responsive li a {
    display: block;
    text-align: left;
  }
  
  
  img {
    /* nothing ----------- */
    width: auto;
    height: auto;
  }

  #Principale
  {
    width:100%;
    border-collapse: collapse;
    margin: 0 auto;
  } 
  
  .centro
  {
    /* color: 					 #A9A9A9; 
    color:           #000000; */  
    color:   #330099;
    text-align:      center;
    font-family:     Geneva, Tahoma, Arial;
    font-size:       14pt;
    font-weight:     normal;
    word-spacing:    +2px;
  }
}