@charset "utf-8";
/* CSS Document */

html {}

body {background-color: #BBDEBB;
      font-family: Verdana;
      font-size: 0.5em;
      margin: 0;
      padding: 0;}

.green {color: #BBDEBB;}
.small {font-size: 1em; font-style: mormal; color: #BBDEBB;}
	  
#container {width: 848px;
	    height: 320px;
	    margin: 68px auto 0 auto;
	    position: relative;}
			
#left {background: url(images/left.jpg) 0 0;
       width: 270px;
       height: 320px;
       float: left;}
	   
#left img {top: 95px;
           left: 18px;
	   position: absolute;}
		   
#small_left {background: url(images/short_left.jpg) 0 0;
             width: 270px;
	     height: 39px;
	     float: left;
		 overflow: hidden;}
			 
#small_left img {top: 1px;
                 left: 18px;
		 position: absolute;
		 overflow: hidden;}
		   
#right {background-color: #969696;
        width: 578px;
        height: 320px;
	float: left;}
		
#small_right {background-color: #969696;
              width: 578px;
	      height: 39px;
	      float: left;}
		  
#small_right a {font-family: Verdana;
          font-size: 9px;
          font-weight: bold;
          color: #CCC;
	  margin: 0;
	  padding: 0;
	  top: 22px;
	  left: 260px;
	  position: absolute;}
	  
#small_right a:hover {color: #FFF;}
		  
#menu {width: 210px;
       height: 14px;
       margin: 0;
       padding: 0;
       top: 24px;
       left: 638px;
       position: absolute;}
	   
#menu ul {margin: 0;
          padding: 0;}

#menu li {font-family: Verdana;
          font-size: 9px;
          font-weight: bold;
          color: #FFF;
	  margin: 0;
	  padding: 0 8px 0 0;
	  display: inline;}
		  
#menu li a {font-family: Verdana;
            font-size: 9px;
	    font-weight: bold;
	    color: #FFF;
	    text-decoration: none;
	    margin: 0;
	    padding: 0;
	    display: inline;}
			
#menu li a:hover {color: #BBDEBB;}


#movie {width: 578px;
        height: 280px;
	top: 40px;
	left: 270px;
	position: absolute;}
		
#project {background: url(images/carta.png) repeat 10px 10px #969696;
          border: 20px solid #969696;
          width: 808px;
          height: 400px;
		  margin: 0;
		  padding: 0;
	  top: 49px;
	  left: 0;
	  position: absolute;
	  overflow: hidden;
	  z-index: 0;}
	  
#project h1 {background-color: #969696;
	     width: 250px;
	     font-family: Verdana;
             font-size: 14px;
	     font-weight: bold;
	     color: #BBDEBB;
	     text-align: center;
	     margin: 0 auto;
	     padding: 2px 0 4px 0;}
		 
#display {background-color: #969696;
          border: 5px solid #969696;
       	  width: 764px;
	   	  height: 324px;
	   	  margin: 0;
		  padding: 0;
		  top: 50px;
	   	  left: 17px;
	   	  position: absolute;}
		 
#left_display {background-color: #969696;
               border: 5px solid #969696;
       		   width: 360px;
	   		   height: 324px;
	   		   margin: 0;
			   padding: 0;
			   top: 50px;
	   		   left: 17px;
	   		   position: absolute;
			   z-index: 0;}
			   
#text {width: 360px;
	   height: 324px;
	   margin: 0;
	   padding: 0;
	   overflow: hidden;}
	   
#text h2 {font-family: Verdana;
             font-size: 1.5em;
	     font-weight: bold;
	     color: #FFF;
		 margin: 0;
		 padding: 0 0 8px 0;}
		 
#text h3 {font-family: Verdana;
             font-size: 1.3em;
	     font-weight: bold;
	     color: #FFF;
		 margin: 0;
		 padding: 2px 0 4px 0;}
		 
#text p {font-family: Verdana;
             font-size: 1.2em;
	     font-weight: normal;
	     color: #CCC; 
		 margin: 0;
		 padding: 0;}
		 
#text a {font-family: Verdana;
         font-size: 1.1em;
	     font-weight: bold;
	     color: #BBDEBB;
		 text-decoration: none;
		 margin: 0;
		 padding: 0;
		 display: inline;
		 z-index: 0;}
		 
#text a:hover {color: #FFF; text-indent: 0;}

#text a span.img_1, #text a span.img_2, #text a span.img_3,
#text a span.img_4, #text a span.img_5, #text a span.img_6,
#text a span.img_7, #text a span.img_8, #text a span.img_9,
#text a span.img_10, #text a span.img_11, #text a span.img_12,
#text a span.img_13, #text a span.img_14, #text a span.img_15,
#text a span.img_16, #text a span.img_17, #text a span.img_18,
#text a span.img_19, #text a span.img_20, #text a span.img_21,
#text a span.img_22, #text a span.img_23, #text a span.img_24,
#text a span.img_25, #text a span.img_26, #text a span.img_27, 
#text a span.img_28, #text a span.img_29, #text a span.img_30,
#text a span.img_31, #text a span.img_32, #text a span.img_33,
#text a span.img_34, #text a span.img_35, #text a span.img_36,
#text a span.img_37, #text a span.img_38, #text a span.img_39,
#text a span.img_40, #text a span.img_41, #text a span.img_42,
#text a span.img_43 {display: none;}

#text a:hover span {width: 360px;
					height: 270px;
					font-family: Verdana;
                    font-size: 1em;
	                font-weight: bold;
	                color: #FFF;
      		        margin: 0;
		            padding: 300px 0 0 4px;
					top: 0;
					left: 404px;
					position: absolute;
					display: block;
					z-index: 50;}
					
#text a:hover span.img_1 {background: url(images/scenografia_teatrale_1.jpg) no-repeat 0 0;}
#text a:hover span.img_2 {background: url(images/scenografia_teatrale_2.jpg) no-repeat 0 0;}			
#text a:hover span.img_3 {background: url(images/scenografia_teatrale_3.jpg) no-repeat 0 0;}
#text a:hover span.img_4 {background: url(images/scenografia_teatrale_4.jpg) no-repeat 0 0;}
#text a:hover span.img_5 {background: url(images/scenografia_cinematografica_4.jpg) no-repeat 0 0;}
#text a:hover span.img_6 {background: url(images/scenografia_cinematografica_1.jpg) no-repeat 0 0;}
#text a:hover span.img_7 {background: url(images/scenografia_cinematografica_2.jpg) no-repeat 0 0;}
#text a:hover span.img_8 {background: url(images/scenografia_animazione_1.jpg) no-repeat 0 0;}
#text a:hover span.img_9 {background: url(images/scenografia_animazione_4.jpg) no-repeat 0 0;}
#text a:hover span.img_10 {background: url(images/immagine_realizzazione_1.jpg) no-repeat 0 0;}
#text a:hover span.img_11 {background: url(images/immagine_realizzazione_3.jpg) no-repeat 0 0;}
#text a:hover span.img_12 {background: url(images/tecnica_sperimentale_3.jpg) no-repeat 0 0;}
#text a:hover span.img_13 {background: url(images/tecnica_sperimentale_33.jpg) no-repeat 0 0;}
#text a:hover span.img_14 {background: url(images/tecnica_sperimentale_32.jpg) no-repeat 0 0;}
#text a:hover span.img_15 {background: url(images/tecnica_sperimentale_34.jpg) no-repeat 0 0;}
#text a:hover span.img_16 {background: url(images/tecnica_sperimentale_35.jpg) no-repeat 0 0;}
#text a:hover span.img_17 {background: url(images/la_casa_il_bozzetto.jpg) no-repeat 0 0;}
#text a:hover span.img_18 {background: url(images/la_casa_immagine_dal_film.jpg) no-repeat 0 0;}
#text a:hover span.img_19 {background: url(images/immagine_restituzione_campo.jpg) no-repeat 0 0;}
#text a:hover span.img_20 {background: url(images/il_campo.jpg) no-repeat 0 0;}
#text a:hover span.img_21 {background: url(images/il_controcampo.jpg) no-repeat 0 0;}
#text a:hover span.img_22 {background: url(images/bozzetto_corridoio_campo.jpg) no-repeat 0 0;}
#text a:hover span.img_23 {background: url(images/corridoio_campo.jpg) no-repeat 0 0;}
#text a:hover span.img_24 {background: url(images/immagine_restituzione_controcampo.jpg) no-repeat 0 0;}
#text a:hover span.img_25 {background: url(images/il_campo_e_il_controcampo.jpg) no-repeat 0 0;}
#text a:hover span.img_26 {background: url(images/pianta_e_sezioni.jpg) no-repeat 0 0;}
#text a:hover span.img_27 {background: url(images/assonometria_cavaliera.jpg) no-repeat 0 0;}
#text a:hover span.img_28 {background: url(images/vista_v1.jpg) no-repeat 0 0;}
#text a:hover span.img_29 {background: url(images/vista_v2.jpg) no-repeat 0 0;}
#text a:hover span.img_30 {background: url(images/ingresso_e_la_scala.jpg) no-repeat 0 0;}
#text a:hover span.img_31 {background: url(images/la_prospettiva_inversa.jpg) no-repeat 0 0;}
#text a:hover span.img_32 {background: url(images/lo_spazio_coerente.jpg) no-repeat 0 0;}
#text a:hover span.img_33 {background: url(images/sezione_prospettica.jpg) no-repeat 0 0;}
#text a:hover span.img_34 {background: url(images/vlcsnap-146420.jpg) no-repeat 0 0;}
#text a:hover span.img_35 {background: url(images/vlcsnap-139716.jpg) no-repeat 0 0;}
#text a:hover span.img_36 {background: url(images/pianta_modello_1.jpg) no-repeat 0 0;}
#text a:hover span.img_38 {background: url(images/vista_dal_basso.jpg) no-repeat 0 0;}
#text a:hover span.img_39 {background: url(images/pianta_modello_2.jpg) no-repeat 0 0;}
#text a:hover span.img_41 {background: url(images/vista_connessione_1.jpg) no-repeat 0 0;}
#text a:hover span.img_42 {background: url(images/vlcsnap-149565.jpg) no-repeat 0 0;}
#text a:hover span.img_43 {background: url(images/vista_connessione_2.jpg) no-repeat 0 0;}

#text ul {width: 100%;
          height: auto;
		  list-style: none;
		  margin: 0;
		  padding: 0;
		  overflow: hidden;
		  float: left;}
		  
#text li {display: inline;}

#text li.one a, #text li.two a,
#text li.three a, #text li.four a,
#text li.five a, #text li.six a,
#text li.seven a, #text li.eight a,
#text li.nine a, #text li.ten a
            {border: 1px solid #BBDEBB;
             width: 66px;
			 height: 50px;
			 float: left;}

#text li.one a {background: url(images/vista_1_small_bw.jpg) no-repeat 0 0;
                margin: 0 5px 5px 0;}
#text li.two a {background: url(images/vista_2_small_bw.jpg) no-repeat 0 0;
                margin: 0 5px 5px 0;}
#text li.three a {background: url(images/vista_3_small_bw.jpg) no-repeat 0 0;
                  margin: 0 5px 5px 0;}
#text li.four a {background: url(images/vista_4_small_bw.jpg) no-repeat 0 0;
                 margin: 0 5px 5px 0;}
#text li.five a {background: url(images/vista_5_small_bw.jpg) no-repeat 0 0;
                 margin: 0 0 5px 0;}
#text li.six a {background: url(images/la_scala_small_bw.jpg) no-repeat 0 0;
                margin: 0 5px 0 0;}
#text li.seven a {background: url(images/corridoio_il_campo_small_bw.jpg) no-repeat 0 0;
	              margin: 0 5px 0 0;}
#text li.eight a {background: url(images/corridoio_il_controcampo_small_bw.jpg) no-repeat 0 0;
	              margin: 0 5px 0 0;}
#text li.nine a {background: url(images/corridoio_porte_camere_da_letto_small_bw.jpg) no-repeat 0 0;
	             margin: 0 5px 0 0;}
#text li.ten a {background: url(images/corridoio_porta_di_accesso_alla_torre_small_bw.jpg) no-repeat 0 0;
	            margin: 0;}

			 
#text li.one a:hover, #text li.two a:hover,
#text li.three a:hover, #text li.four a:hover,
#text li.five a:hover, #text li.six a:hover,
#text li.seven a:hover, #text li.eight a:hover,
#text li.nine a:hover, #text li.ten a:hover
                  {border: 1px solid #FFF;
             	   text-indent: 0;}
				   
#text li.one a:hover {background: url(images/vista_1_small.jpg) no-repeat 0 0;}
#text li.two a:hover {background: url(images/vista_2_small.jpg) no-repeat 0 0;}
#text li.three a:hover {background: url(images/vista_3_small.jpg) no-repeat 0 0;}
#text li.four a:hover {background: url(images/vista_4_small.jpg) no-repeat 0 0;}
#text li.five a:hover {background: url(images/vista_5_small.jpg) no-repeat 0 0;}
#text li.six a:hover {background: url(images/la_scala_small.jpg) no-repeat 0 0;}
#text li.seven a:hover {background: url(images/corridoio_il_campo_small.jpg) no-repeat 0 0;}
#text li.eight a:hover {background: url(images/corridoio_il_controcampo_small.jpg) no-repeat 0 0;}
#text li.nine a:hover {background: url(images/corridoio_porte_camere_da_letto_small.jpg) no-repeat 0 0;}
#text li.ten a:hover {background: url(images/corridoio_porta_di_accesso_alla_torre_small.jpg) no-repeat 0 0;}

#text li.one a span, #text li.two a span, 
#text li.three a span, #text li.four a span, 
#text li.five a span, #text li.six a span, 
#text li.seven a span, #text li.eight a span, 
#text li.nine a span, #text li.ten a span {display: none;}

#text li a:hover span {width: 360px;
					   height: 270px;
					   font-family: Verdana;
                       font-size: 1.2em;
	                   font-weight: bold;
	                   color: #FFF;
      		           margin: 0;
		               padding: 300px 0 0 4px;
					   top: 0;
					   left: 404px;
					   position: absolute;
					   display: block;
					   z-index: 50;}
					   
#text li.one a:hover span {background: url(images/ingresso_vista_1.jpg) no-repeat 0 0;}
#text li.two a:hover span {background: url(images/ingresso_vista_2.jpg) no-repeat 0 0;}
#text li.three a:hover span {background: url(images/ingresso_vista_3.jpg) no-repeat 0 0;}
#text li.four a:hover span {background: url(images/ingresso_vista_4.jpg) no-repeat 0 0;}
#text li.five a:hover span {background: url(images/ingresso_vista_5.jpg) no-repeat 0 0;}
#text li.six a:hover span {background: url(images/la_scala.jpg) no-repeat 0 0;}
#text li.seven a:hover span {background: url(images/corridoio_il_campo.jpg) no-repeat 0 0;}
#text li.eight a:hover span {background: url(images/corridoio_il_controcampo.jpg) no-repeat 0 0;}
#text li.nine a:hover span {background: url(images/corridoio_porte_camere_da_letto.jpg) no-repeat 0 0;}
#text li.ten a:hover span {background: url(images/corridoio_porta_di_accesso_alla_torre.jpg) no-repeat 0 0;}

#right_display {background: url(images/display.gif) repeat-x 0 0;
          	    width: 370px;
		  		height: 334px;
		  		margin: 0;
				padding: 0;
				top: 50px;
		  		left: 421px;
		  		position: absolute;
		 		display: block;
		  		z-index: -1;}
				
#left_bio {background-color: #969696;
           border: 5px solid #969696;
   		   width: 360px;
	   	   height: 324px;
	   	   margin: 0;
		   padding: 0;
		   top: 50px;
	   	   left: 17px;
	   	   position: absolute;
		   z-index: -1;}
				
#right_bio {background: url(images/display.gif) repeat-x 0 0;
          	width: 370px;
		  	height: 334px;
		  	margin: 0;
			padding: 0;
			top: 50px;
		  	left: 421px;
		  	position: absolute;
		 	display: block;
		  	z-index: -1;}				
				
#right_bio h2 {font-family: Verdana;
               font-size: 1.5em;
	     	   font-weight: bold;
	     	   color: #BBDEBB;
			   text-align: center;
		 	   margin: 0;
		 	   padding: 5px 5px 8px 5px;}
				   
#right_bio a {font-family: Verdana;
         	  font-size: 1.1em;
	     	  font-weight: bold;
	     	  color: #FFF;
			  text-decoration: none;
			  margin: 0;
			  padding: 5px;
			  display: inline;
		 	  z-index: 0;}
				  
#right_bio a:hover {color: #BBDEBB; text-indent: 0;}

#right_bio a span, #right_bio a span.bottom {display: none;}

#right_bio a:hover span {background-color: #969696;
	                     width: 360px;
						 height: 270px;
						 font-family: Verdana;
                    	 font-size: 1.1em;
	               		 font-weight: normal;
	               		 color: #CCC;
      		       		 margin: 0;
		           		 padding: 0;
						 top: 5px;
						 left: -399px;
						 position: absolute;
						 display: block;
						 z-index: 50;}
						 
#right_bio a:hover span.bottom {background: none;
	                            font-family: Verdana;
                    			font-size: 0.9em;
	                			font-weight: normal;
	                			color: #FFF;
      		       				margin: 0;
		            			padding: 4px;
								top: 290px;
								left: 398px;
								position: absolute;
								overflow: hidden;
								z-index: 50;}

#credits a {width: 12px;
            height: 280px;
	    font-family: Verdana;
	    font-size: 12px;
	    font-weight: normal;
	    line-height: 18px;
	    color: #969696;
	    text-align: center;
	    text-decoration: none;
	    top: 48px;
	    left: 852px;
	    position: absolute;}
			
#credits a:hover {color: #BBB;}
			
			

			

		  

