@charset "utf-8";
/* CSS Document 

* File: elastic_frame.css
	*
	* Description: 	controlla la dimensione area e si attiva per adattare il layout strutturale
	*				...
	*				su larghezza minima 480px
	*				da larghezza 480px a 640px
	*				con larghezza almeno 640px
	*				con larghezza almeno 670px
	*				da larghezza 640px a 800px
	*				con larghezza minima 800px
	*
	* @version		2.0	2024-07-29
	* @author		Stefano Pascoletti Ph.D.
	* @copyright	Stefano Pascoletti Ph.D.
	* @license		GNU General Public License
	*
	* Note: ...

*/


/* layout per aree con larghezza minima 480px */
@media only screen and (min-width:480px){
	
	/* riquadro intestazione .............................................................. header_panel */
	#header_top_panel{			
		/*height: 80px;
		background:url(../images/logo_uniud_70.png) left top no-repeat;*/			
	}
	
	#site_name{		
		/*margin: 0 -80px 0 0;*/		
	}
	
	#header_middle_panel{	/* visualizza area per photo-gallery*/
		/*visibility: visible;*/
		/*height: 108px;*/
		margin: 0;
		padding: 0;
		/*overflow: hidden;*/
		/*background: url(../../RES/imgs/layout/bground/area_photo108.jpg) left top repeat-x;*/
	}	
	#header_bottom_panel{		
		/*padding-top: 0;					
		background: #ad9f9d; background: #E0AA08;*/
	}
	
	/*#header_middle_panel.hide_area{visibility: hidden; height: 0px;}  nasconde area quando non serve */
	
	/* 	riquadro altezza font 
	posizionato dentro #header_bottom_panel 
	#font_size_header{	
		visibility: visible;
		float:right;
		margin: 0;
		padding: 0;	
	}*/
	
	
	/* riquadro colonna sinistra (dimensioni fisse) ......................................... left_panel */
	/* da questo punto in poi posizionato come colonna sinistra */
	/*#left_panel{		
		visibility: hidden;		(nascondi colonna) 
		float: left;	
		width: 160px;  width: 0px;	(nascondi colonna) 
		min-height: 200px;		
		overflow: hidden;
	}*/	
	
	/* riquadro sopra (visualizza area) */
	/*#left_panel_top{	
		visibility: visible;
		padding: 0 0 0 10px;
		height: 30px; 
		width: 100%;		
	}*/
	
	/* area info */
	/*#left_panel_info{	
		height: 220px; 
		width: 180px;
		padding: 0 0 0 10px;		
	}*/
	/*#left_panel_info.whidt80{	
		height: 80px;			
	}*/
	
	
	/*	riquadro menu delle news 
		(compare quando lo schermo è grande) */
	/*#menu_news{ 	
		visibility: visible;
		height: auto;
		float: left;
		overflow: hidden;
		width: 150px;
		padding:0;
		margin:0;
	}*/
	
	
	/* riquadro centrato (dimensioni elastiche) ........................................... center_panel */
	/* da questo punto in poi gestisce lo spazio per la colonna sinistra NON SERVE */
	#center_panel{ 		
		/*float: left;	*/	
		/*margin-right: -200px;  meno la larghezza (150) della prima colonna fissa */				
	}
	
	/* riquadro sopra i contenuti */
	/*#content_top{				
		float: left;		
	}*/
	/* riquadro contenuti */
	/*#content_panel{			
		float: left;
	}*/
	/* riquadro sotto i contenuti */
	/*#content_bottom{		
		float: left;	
	}*/
			
	/* 	paragrafi del riquadro contenuti 
		imposto una distanza pari alla larghezza della prima colonna fissa 	
	.area_txt{
		margin-right: 200px;  
	}	*/
	/*.area_title{  .area_publish 
		margin-right: 200px;  
	} */
	/*.item_lst1{		
		margin-right: 200px; 		
	}*/
	/*.admin_panel{  div contenente una tabella records 	
		float: left;
		margin-right: 200px; 
	}*/
	
	/* .menu_gallery{	div galleria foto nel riquadro contenuti 
		 float: none;
		margin-right: 200px; imposto una distanza pari alla larghezza della prima colonna fissa			 
	} */
		
	
	/* riquadro piè pagina ................................................................ footer_panel */
	
	/* 	riquadro con i dati istituzionali 
	posizionato dentro #footer_bottom_panel */
	#institutional_data{
		float:left;
		/*margin-top: 6px;
		padding-top:0px;	*/	
	}
	
	/* 	riquadro info legal policy e privacy
		posizionato dentro #footer_bottom_panel */
	#info_data{
		float: right;
		/*margin-top: -8px;*/
	}
	
	/* 	riquadro altezza font 
	posizionato dentro #footer_top_panel 
	#font_size_footer{	
		visibility: hidden;
	}*/
}









/* layout solo per aree con larghezza da 480px a 640px */
@media only screen and (min-width:480px) and (max-width:640px){
	
	/* riquadro principale centrato */
	#main_panel{
		min-width: 480px;
		max-width: 640px;
		/*background: #CFA9AA;*/
	}	
	
}






/* layout solo per aree con almeno 640px di larghezza */
@media only screen and (min-width:640px){
	
	#site_name{
		float:left;					
	}
	/*
	#logo2{	
		visibility: visible;
		float:right;
		margin: 0;
		padding: 0;	
	}
	*/
	
	/* riquadro intestazione .............................................................. header_panel */
	#header_top_panel{			
		/*height: 100px;
		background:url(../images/logo_uniud_70.png) left top no-repeat;*/			
	}
	
	#header_middle_panel{	/* altezza area photo-gallery 		
		height: 128px;		
		background: url(../../RES/imgs/layout/bground/area_photo128.jpg) left top repeat-x;*/
	}	
	
	/* riquadro centrato (dimensioni elastiche) ........................................... center_panel */
	/* da questo punto in poi gestisce lo spazio anche per la colonna destra */
	#center_panel{ 		
		/*margin-right: -350px;  meno la somma della larghezza (200+150) delle due colonne fisse */					
	}
	/* 	paragrafi nei riquadro contenuti ...
	 	imposto una distanza pari alla larghezza (150+150) delle due colonne fisse 
	.area_txt,
	.area_title,
	.area_publish{
		margin-right: 350px;  
	}
	.item_lst1{
		margin-right: 350px;  
	}*/
	/*.admin_panel{  div contenente una tabella records 	
		margin-right: 20px; 	
	}*/
	
	/* riquadro colonna destra (dimensioni fisse) .......................................... right_panel */
	/* ripristina la posizione a destra */	
	#right_panel{				
		 /*float: right;	
		width: 150px;
		min-height: 200px;		
		overflow: hidden;
		position: relative;serve a gestire l'interazione dei link sulle colonne sovrapposte
		z-index: 10;*/
		/*padding-left: 0;	 ripristino per non far saltare la colonna */	
	}
}





/* layout solo per aree con almeno 670px di larghezza */
@media only screen and (min-width:670px){
	
	/* riquadro colonna sinistra (dimensioni fisse) ......................................... left_panel */	
	#left_panel{		
		/*width: 190px;  allargo leggermente la colonna */		
	}
	
	/* riquadro centrato (dimensioni elastiche) ........................................... center_panel */
	/*.area_title{
		float: none;   ripristina affianca 	
	}*/
	
	/* galleria foto nel riquadro contenuti */	
	/*.menu_gallery{	
		margin-right: 150px;  350 imposto una distanza pari alla larghezza (200+150) delle due colonne fisse 
	}*/
	
	/* div sezione FORM pubblicazione contenuti */	
	/*.area_publish{ 			
		margin-right: 350px;  imposto una distanza pari alla larghezza (200+150) delle due colonne fisse 
	}*/
	
}





/* layout solo per aree con larghezza da 640px a 800px */
@media only screen and (min-width:640px) and (max-width:800px){
	
	/* riquadro principale centrato */
	#main_panel{
		min-width: 640px;
		max-width: 800px;		
	}	
	
}





/* layout solo per aree con almeno 800px di larghezza */ 
@media only screen and (min-width:800px){
	
	/* riquadro principale centrato */
	#main_panel{		
		min-width: 800px;
		max-width: 1000px;		
	}
	
	#header_middle_panel{	/* altezza area photo-gallery */		
		/*height: 128px;		 sostituisco altezza grande 192px */	
		/*background: url(../../RES/imgs/layout/bground/area_photo128.jpg) left top repeat-x;	 sostituisco altezza grande area_photo184.jpg */
	}	
	
	
	/* 	paragrafi nei riquadro contenuti ...
	 	imposto una distanza pari alla larghezza (150+150) delle due colonne fisse 
	.area_txt,
	.area_title,
	.area_publish{		max-width: 550px;		margin-right: 0x;  	}
	.item_lst1{		max-width: 550px;		margin-right: 0x;  
	}*/
	
	/*.admin_panel{  div contenente una tabella records 			
	}*/
	
}