/* == Media queries (breakpoint) ===== */

@media screen and (min-width: 350px) {
body {
	height: 100%;
	background:  #F5F0EC;
	margin:0 auto;
	}
	#titoloA {Display: none;}
	#titoloB {Display: block;}
	#descri {Display: none;}
	#fiera {Display: none;}
	#servizi {Display: none;}
	

#subtitolo {
	background-color: transparent;
	position:absolute;
	text-align: center;
	top:80px; 
	margin-left: 20px;
	margin-right: 20px;
}

	.T1 {
		font: 30px   Verdana, Arial, Helvetica, sans-serif;
		color:   #F1EBE7;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	}
	.T2 {
		font: 16px   Arial, Verdana, Helvetica, sans-serif;
		color:    #F5F771;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	}
	.T3 {
		font: 12px   Arial, Verdana, Helvetica, sans-serif;
		color:    white;
		text-shadow: 1px 1px 1px black;		
	}
	.sm {
	font: 14px   Arial, Verdana, Helvetica, sans-serif;
	color:    #ED4909;
	font-style: italic;
	font-weight: bold;
	text-shadow: 1px 1px 0px black;	
	}
	.barr {
	
	margin-right: 1.90em;
	}
	
	.sep {Display: block;}
	
} 	

@media screen and (max-width: 480px) {
body {
	height: 100%;
	background:  #F5F0EC;
	margin:0 auto;
	}
	#titoloA {Display: none;}
	#titoloB {Display: block;}
	#descri {Display: none;}
	#fiera {Display: none;}
	#servizi {Display: none;}

#subtitolo {
	background-color: transparent;
	position:absolute;
	text-align: center;
	margin-left: 20px;
	margin-right: 20px;
	top:80px; 
} 
	.T1 {
		font: 30px   Verdana, Arial, Helvetica, sans-serif;
		color:  #F1EBE7;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	}
	.T2 {
		font: 16px   Arial, Verdana, Helvetica, sans-serif;
		color:    #F5F771;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;	
	}
	.T3 {
		font: 12px   Arial, Verdana, Helvetica, sans-serif;
		color:    white;
		text-shadow: 1px 1px 1px black;		
	}
	
	.sm {
	font: 13px   Arial, Verdana, Helvetica, sans-serif;
	color:    #ED4909;
	font-style: italic;
	font-weight: bold;
	text-shadow: 1px 1px 0px black;		
	}

	.barr {

	margin-right: 0.90em;
	}
	
	.sep {Display: block;}
} 
 
/* -----------------------------------
IPAD PORTRAIT
------------------------------------ */
@media screen and (min-width: 768px) {
 body {
	height: 100%;
	background: #F5F0EC;
	margin:0 auto;
	}
	#titoloA {Display: block;}
	#titoloB {Display: none;}
	#descri {Display: block;}
	#fiera {Display: block;}
	#servizi {Display: none;}

	.T1 {
		font: 40px   Verdana, Arial, Helvetica, sans-serif;
		color:  #F1EBE7;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	} 
	.T2 {
		font: 22px   Arial, Verdana, Helvetica, sans-serif;
		color:    #F5F771;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	}
	.T3 {
		font: 14px   Arial, Verdana, Helvetica, sans-serif;
		color:    white;
		text-shadow: 1px 1px 1px black;		
	}
	.sm {
	font: 16px   Arial, Verdana, Helvetica, sans-serif;
	color:    #ED4909;
	font-style: italic;
	font-weight: bold;
	text-shadow: 1px 1px 0px black;	
	}
	.barr {

	margin-right: 1.40em;
	}
	
	.sep {Display: block;}
	

}
 
/* -----------------------------------
IPAD LANDSCAPE + NETBOOK
------------------------------------ */
@media screen and (min-width: 1024px) {
 body {
	height: 100%;
    background:  #F5F0EC;
    margin:0 auto;
	}
	#titoloA {Display: block;}
	#titoloB {Display: none;}
	#descri {Display: block;}
	#fiera {Display: block;}
	#servizi {Display: block;}

	.T1 {
		font: 40px   Verdana, Arial, Helvetica, sans-serif;
		color:  #F1EBE7;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	}
	.T2 {
		font: 22px   Arial, Verdana, Helvetica, sans-serif;
		color:    #F5F771;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	}
	.T3 {
		font: 16px   Arial, Verdana, Helvetica, sans-serif;
		color:    white;
		text-shadow: 1px 1px 1px black;		
	}
	.sm {
	font: 16px   Arial, Verdana, Helvetica, sans-serif;
	color:    #ED4909;
	font-style: italic;
	font-weight: bold;
	text-shadow: 1px 1px 0x black;		
	}
	.barr {
	margin-right: 1.40em;
	}
	
	.sep {Display: block;}
	
	.imglog {
	width: 600;
	height:300;
	}

} 
/* -----------------------------------
DESKTOP
------------------------------------ */
@media screen and (min-width: 1200px) {
 body {
    height: 100%;
	background:  #F5F0EC;
    margin:0 auto;
    }
	#titoloA {Display: block;}
	#titoloB {Display: none;}
	#descri {Display: block;}
	#fiera {Display: block;}
	#servizi {Display: block;}
	
	.T1 {
		font: 40px   Verdana, Arial, Helvetica, sans-serif;
		color:  #F1EBE7;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	}
	.T2 {
		font: 24px   Arial, Verdana, Helvetica, sans-serif;
		color:    #F5F771;
		font-style: italic;
		font-weight: bold;
		text-shadow: 3px 3px 3px black;		
	}
	.T3 {
		font: 18px   Arial, Verdana, Helvetica, sans-serif;
		color:    white;
		text-shadow: 1px 1px 1px black;		
	}
	.sm {
	font: 22px   Arial, Verdana, Helvetica, sans-serif;
	color:    #ED4909;
	font-style: italic;
	font-weight: bold;
	text-shadow: 1px 1px 0px black;		
	}
	
	.barr {
	margin-right: 1.40em;
	}
	
	.sep {Display: none;}
	
}
/* -----------------------------------
FINE
------------------------------------ */



#logo {
	width: 100%;
	height: 200px;
	background: #856A55;
	margin:0 auto;
  
}

#fiera {background-color: transparent;}

#descri {
		background-color: transparent;
		position:absolute;
		right:60px; 
		top:150px; 
}

#barra {

   background-image: url(../image/Sf_Bar.jpg); 
   background-repeat: repeat-x;
   text-align: center;
   display: inline-block;
   height:50px;
   width:100%;
   margin:0 auto;
}

.barr {
	display: inline-block;
	text-align: center;
}

#casa {
	display: inline-block;
	text-align: center;
	margin:0 auto;;
}

#contatt {
	display: inline-block;
	text-align: center;
	margin:0 auto;
}
	
.serv {
	display: inline-block;
	width: 320px;
	text-align: center;
	font: 13px   Verdana, Arial, Helvetica, sans-serif;
	color: #856A55;
	font-style: italic;
	text-shadow: 1px 1px 1px black;
	margin:0 auto;
}

.se {
	float:right; 
	margin-right:10px; 
	background-color:transparent; 
	width:160px; 
	margin:0 auto;
}
	
#bottom-Mob{
	background-image: url(../image/Fs_Bar.jpg); 
	background-repeat: repeat-x;
	position:fixed;
	display: inline-block;
	bottom:0px;
	height:40px;
	width:100%;
	z-index:999999;
}



.ico {
	display: inline-block;
	margin-right: 0.25em;
}


.O1 {
	font: 18px   Helvetica, sans-serif,  Arial, Verdana;
	color:    #FB992F;
	font-style: italic;
	font-weight: bold;
	text-shadow: 3px 3px 3px black;		
}

.O1 a:link {
	font: 18px   Helvetica, sans-serif,  Arial, Verdana;
	color:    #FB992F;
	font-style: italic;
	font-weight: bold;
	text-shadow: 3px 3px 3px black;		
	
}

.O1 a:visited {
	font: 18px   Helvetica, sans-serif,  Arial, Verdana;
	color:    #FB992F;
	font-style: italic;
	font-weight: bold;
	text-shadow: 3px 3px 3px black;		
}
.O1 a:hover {
	font: 18px   Helvetica, sans-serif,  Arial, Verdana;
	color:    #FB992F;
	font-style: italic;
	font-weight: bold;
	text-shadow: 3px 3px 3px black;		
}
.O1 a:active {
	font: 18px   Helvetica, sans-serif,  Arial, Verdana;
	color:    #FB992F;
	font-style: italic;
	font-weight: bold;
	text-shadow: 3px 3px 3px black;		
}

.m {
	font: 14px   Helvetica, sans-serif,  Arial, Verdana;
	color:    white;
	font-style: italic;
	text-shadow: 3px 3px 3px black;		
}

.barr a:link {
	font: 14px   Helvetica, sans-serif,  Arial, Verdana;
	color:    white;
	font-style: italic;
	text-shadow: 3px 3px 3px black;		
}

.barr a:visited {
	font: 14px   Helvetica, sans-serif,  Arial, Verdana;
	color:    white;
	font-style: italic;
	text-shadow: 3px 3px 3px black;		
}
.barr a:hover {
	font: 14px   Helvetica, sans-serif,  Arial, Verdana;
	color:    white;
	font-style: italic;
	text-shadow: 3px 3px 3px black;		
}
.barr a:active {
	font: 14px   Helvetica, sans-serif,  Arial, Verdana;
	color:    white;
	font-style: italic;
	text-shadow: 3px 3px 3px black;		
}

a:link {
	font-family:  Arial,Verdana, Sans-Seri, Helvetica;
	font-size: 16px;
	color: white;
	text-shadow: 3px 3px 3px black;	
	text-decoration: none;	
}

a:visited {
	font-family:  Arial, Verdana, Sans-Seri, Helvetica;
	font-size: 16px;
	color: white;
	text-shadow: 3px 3px 3px black;
	text-decoration: none;	
}
a:hover {
	font-family:  Arial,Verdana, Sans-Seri, Helvetica;
	font-size: 16px;
	color: white;
	text-shadow: 3px 3px 3px black;	
	text-decoration: none;
}
a:active {
	font-family:  Arial, Verdana, Sans-Seri, Helvetica;
	font-size: 16px;
	color: white;
	text-shadow: 3px 3px 3px black;	
	text-decoration: none;	
}