@charset "utf-8";
/* CSS Document */
html, body {
   background: #FFF url(../img/wood3.jpg);
}

body {
	color:#FFF;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 15px;
	margin:0;
	padding: 20px 0;
	text-align:left;
	height: auto;
}

/*_________________________________________________________________  wrapper  */
div#wrapper {
	margin: 0 auto;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	width: 750px;
	margin-bottom: 20px;
	border: 0px dotted #ffffa5;
	background-color: #F6F6C6;
	color: #000;
	}


#wrapper p:first-letter
{
color:#802525;
font-size: 30px;
font-family: "Times New Roman",serif;
}

a {
	font-weight: normal;
	color: #802525;
	text-decoration: none
}

a:hover {
	color: #333;
	text-decoration: none
}



#header {
	height: 250px;
	background: #F6F6C6 url(../img/titolo_trasp.png) no-repeat;
	color: #000000;
}

#header h1 {
  display: inline;
  letter-spacing: -1px;
  margin-bottom: 0;
  font-family: Georgia, serif;
  font-style: italic;
}

#pflow {
	clear:both;
	display:block;
	height: 400px;
	color: #767467;
	background-color: #FFF;
}

#footer {
	margin: 0px;
	color: #000;
	background-color: #D2D0C1;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
	text-align: center;

}

#logo {
	padding-top:0px;
	height:130px;
}

ul#menu_icon
{
	display: block; /* On passe les liens en éléments de type block pour leur donner des propriétés de taille */
	width: 90px;
	margin:0;
	margin-right:auto;
	margin-left:auto;
	padding: 20px;
	list-style-type: none;
/* Suppression du margin, du padding et des puces du <ul> */
}

ul#menu_icon li
{
	margin: 0;
	padding: 0 ;
/* Suppression du padding du <li> et on définit une marge basse de 5px pour aérer le tout */
}

ul#menu_icon li a
{
	display: block; /* On passe les liens en éléments de type block pour leur donner des propriétés de taille */
	width: 90px;
	height: 90px;
	color: #000;
	text-decoration: none;
	background: url(osabtn90.png) no-repeat 0 0; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */
}

ul#menu_icon li a:hover
{
	background: url(osabtn90.png) no-repeat 0 -90px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
}

/*_________________________________________________________________  headers  */
h1, h2, h3 {
  margin-bottom: 18px;
  font-weight: bold;
}
h1 {
  font-size: 24px;
  line-height: 36px;
}

h1 a {
	font-weight:bold;
	color:#EC22BB;
}

h1 a:hover {
	color:#F82ED2;
}


h2 {
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 18px;
  line-height: 18px;
}
h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: normal;
	font-size: 1em;
	line-height: 18px;
	color: #802525;
}
    /* image replacement */
        .graphic, #prevBtn, #nextBtn, #slider1prev, #slider1next{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
            }
    /* // image replacement */
/* Easy Slider */

	#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:750px;
		height:280px;
		overflow:hidden; 
		
		}	
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		left:-30px;
		top:71px;
		z-index:1000;
		}	
	#nextBtn, #slider1next{ 
		left:696px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(../images/btn_prev.gif) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(../images/btn_next.gif) no-repeat 0 0;	
		}	
		
	/* numeric controls */	

	ol#controls{
		margin:1em 0;
		padding:0;
		height:28px;	
		}
	ol#controls li{
		margin:0 10px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		height:28px;
		line-height:28px;
		}
	ol#controls li a{
		float:left;
		height:28px;
		line-height:28px;
		border:1px solid #ccc;
		background:#a52a2a;
		color:#fff;
		padding:0 10px;
		text-decoration:none;
		}
	ol#controls li.current a{
		background:#636363;
		color:#fff;
		}
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
	
/* // Easy Slider */


#contatti{
width: 200px;
margin-left: 280px;
background-color: #D2D0C1;
}

#form{
width: 400px;
margin-left: 200px;
background-color: #D2D0C1;
font: 12px sans-serif;
}

input.text  {
    font: bold 14px Arial, Helvetica, sans-serif;
    height: 17px;	
    color: #000000;
    background: #CCCCCC;
    border: 1px solid #000000;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: 5px;
    margin-left: 5px;
    width: 300px;
    }


input.button {
    font: bold 14px Arial, Helvetica, sans-serif;
    color: #000000;
    background: #CCCCCC;
    text-align: center;
    padding: 1px;
    width: 40px;
    border: 1px solid #000000;
    margin-top: 2px;
    }


#s3slider {
   width: 422px; /* important to be same as image width */
   height: 317px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 422px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 16px/20px Arial, Helvetica, sans-serif;
   padding: 10px 13px;
   height: 70px;
   width: 374px;
   background-color: #000;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   bottom: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.clear {
   clear: both;
} 

