html,body{margin: 0 auto;text-align: center; color:#333; font-family: Verdana, Geneva, sans-serif, "Times New Roman"}
	
#sfondo{position:fixed; top:0; left:0; width:100%; height:100%; z-index:1}	

	
h1,h2,h3,h4,h5,h6,li{text-align:left; padding:0; color:#fff}
p{text-align:justify; margin: 10px 0 5px 0; padding:7px}
#content p{background-color: rgba(255,255,255,0.70)}
div, img, ul{margin:0; padding:0; list-style:none}

div#container{position:absolute; width:100%; margin:0 auto; z-index:2}

div#header{height: 510px; width: 100%}
div#header img{padding:5px 5px 0 0}
div#header h1{color:#FFF; text-shadow: 1px 1px #333; margin: 0}
div#header .rid{padding-top: 2px}
div#header a{ color:#FFF}
div#header{text-align:right}

div#gardasee, div#information{text-align:left; background-color: rgba(0,0,0,0.45)}
div#gardasee .img2{width:100%; height:auto}
div#gardasee p .cen-1{text-align:center}
div#gardasee .img3, div#information .img3{width:100%; height:auto}
div#gardasee a, div#information a{color: #7A2022}
#gardasee ul, #information ul{
	margin:0 0 20px 0;
	padding:0;
	list-style:none;
	text-align:left;
	background-color: rgba(255,255,255,0.70);
}
#gardasee ul li, #information ul li{margin:0 0 0 5px; font-weight:bold; color:#333}


div#navigation{position: absolute; left:0px; top:0px; width: 100%; background-color: rgba(50,84,126,0.45); z-index: 1000; padding:35px 0 25px 0; text-decoration: none;
  font-family: "lato-regular", Helvetica, Arial, sans-serif;
  letter-spacing: 1px;
}
ul#nav div.mega{position: absolute;top: -9999px; right:0; padding:5px 0 5px 5px}
ul#nav li:hover div.mega,ul#nav li div.mega.open{top: 30px; left:-1px; z-index: 1040; font-size: 80%; width: 11.5em;}


a:link {text-decoration: none; color: #0125CD}
a:hover {text-decoration: none; color: #990000}
a:visited {text-decoration: none; color: #0125CD}

div#footer{float:none; clear:both; padding: 5px 0; background-color: rgba(50,84,126,0.90); text-align:left}
div#footer a{color:#fff; font-weight: bold; text-decoration: underline; padding: 4px 10px; line-height: 30px}
div#footer p{color: #fff}
.Stile1{color: #fff}

div#footer-cont{float:left}
#social{clear:left}
#social img{width: 98px; height:30px}
div#map, #bike{width: 100%; margin: 0 0 10px 0}
#booking, .map, .mapf, #offer, #book-best{display:none}

div#tab-g{width:100%; overflow:auto}
.table{width: 100%; font-family:Verdana, Geneva, sans-serif, "Times New Roman"; border: 1px solid #CCC; text-align:left; background-color: rgba(255,255,255,0.70)}

.verde{background-color:#0C3; border: 1px solid #000; text-align:left}
.table3, .table3 img, #img-sp-1{width: 100%; height:auto; margin: 0; padding:0}

div#gardasee div.textimage, div#information div.textimage{clear:left; width: 100%; min-height: 100px; margin:10px 0 13px 0; padding: 3px 0 10px 0; box-shadow: 0px 2px 2px #999}
div#gardasee div.textimage img, div#information div.textimage img{float: left; margin: 0 5px; background-color:#FFF}
div#gardasee div.textimage h3, div#information div.textimage h3{margin:0 0 5px 0; padding: 5px 0 0 0; color:#FFF}
div#gardasee div.textimage h3 a, div#information div.textimage h3 a{color:#FFF}
div#gardasee div.textimage p, div#information div.textimage p{margin:10px 5px 0 5px}

div#gardasee div.textimage1, div#information div.textimage1{background-color: rgba(255,255,255,0.70); padding:5px 5px 15px 5px}

div#gardasee .spot, div#information .spot{margin: 10px 0 10px 0; width: 100%; text-align:center; padding: 3px 0 10px 0; background-color: rgba(255,255,255,0.70)}
div#gardasee .spot img, div#information .spot img{float: left; margin: 0 2px 20px 2px}
div#gardasee .spot p, div#information .spot p{font-size:12px; margin: 0 3px; color:#039; text-align:center}
div#gardasee .spot h3, div#information .spot h3{margin:5px 5px 0 5px; color:#FFF; text-align:center}
div#gardasee .spot h3 a, div#information .spot h3 a{color:#FFF}
div#gardasee .spot a:hover, div#information .spot a:hover{color:#FC3}
div#gardasee .spot h5, div#information .spot h5{margin:5px 5px 0 5px; text-align:center}
div#gardasee .spot h5 a, div#information .spot h5 a{color:#FFF}

div#gardasee button.spot, div#information button.spot{cursor:pointer}

div.surf{margin: 0 0 5px 10px; color: #3054FE}
div.surf p{margin: 0}
.clearer1{float:none; clear:both; width:100%}
.clear-h20{float:none; clear:both; width:100%; height:20px}

div#lang{position:absolute; left: 0px; top: 0px; background-color: rgba(255,255,255,0.90); text-align:right; z-index:1030; -moz-border-radius: 0 0 2px 0; -webkit-border-radius: 0 0 2px 0; border-radius: 0 0 2px 0;}

div#booking{ position:absolute; left:50%; top: 170px; width:644px; z-index:100; text-align:center; background-color:rgba(0,0,0,0.20); padding:10px 30px 15px 30px}
div#booking h1{padding: 0; margin:10px 0 20px 0; text-align:center}
div#booking h2{padding: 0; margin:0 0 7px 2px}
.search, .search-t, #paese, #paese2, #search-b{text-align:center; font-size:16px; padding: 7px 0; margin:0 2px; letter-spacing:2px; font-size:16px; border:none; cursor:pointer}
.search{width:150px; color:#039; height:24px}
#paese, #paese2{width:155px; height:38px; color:#039}
.search-t{background-color:#FF7800; color:#FFF; width:155px; height:38px; font-weight:bold}
.search-b{width:155px; height:38px; color:#039; font-size:16px; margin:15px 0 0 0}
.search-b2{width:152px; height:22px; color:#039; font-size:16px; margin:15px 0 0 0}
.search-ps{width:5px; height:22px; visibility:hidden}
.search-m{width:400px; height:100px; color:#039; font-size:16px; margin:15px 0 15px 0}
div#booking b{color:#FFF}
div#booking .dati{ width: 403px; text-align:right}
#bamb1{display:none}

#offer{position:absolute; left:50%; width:640px; top: 310px; z-index:100; text-align:center; background-color: rgba(255,255,255,0.70); padding:20px 30px 10px 30px}
#offer-bok{ display:none}
#offer h3{font-size:16px; color:#039; margin:0}
.bot-of{float:left; background-color:#0C3; color:#FFF; font-size:16px; font-family:Arial, Helvetica, sans-serif; font-weight:bold; letter-spacing:2px; padding:0; cursor:pointer; border:none}
.bot-ar{float:left; background-color:#0C3; color:#FFF; font-size:16px; cursor:pointer}

#book-best{position:absolute; left:50%; top: 210px; margin-left: 353px}
#book-best img{ width:250px; height:auto}
 @media screen and (min-width: 0px) and (max-width: 1220px){
#book-best{ display:none}
}

#info-r{position:absolute; left:50%; top: 335px; margin-left: 100px; z-index: 101}
#info-r img{ width:217px; height:auto}

 @media screen and (min-width: 720px){
div#booking, #offer{margin-left: -353px}
#offer h3{float:left; width:295px; padding:10px}
.bot-of{width:152px; height: 40px; margin:0 0 0 10px}

}
 @media screen and (min-width: 418px) and (max-width: 719px){
div#booking{width:340px; margin-left: -200px}
.search{width:155px; padding: 7px 0; margin:10px 2px 5px 2px}
#paese{padding: 7px 0; margin:5px 3px 10px 1px}
#paese2{width:320px; padding: 7px 0; margin:5px 3px 10px 1px}
.search-m{width:334px}
div#booking .dati{ width: 300px; text-align:right}

#offer{top: 370px; width:260px; margin-left: -70px; padding:10px 0 10px 10px}
#offer h3{width:240px; padding:4px; text-align:center}
.bot-of{width:122px; height: 30px; margin:7px 5px 0 0}
#info-r{ display:none}
}
 @media screen and (min-width: 0px) and (max-width: 417px){
div#booking{width:310px; padding:5px; margin-left: -160px}
.search{width:145px; margin:10px 2px 5px 2px}
#paese, #paese2{margin:5px 0; width:300px}
.search-t{margin:5px 0;width:300px}
.search-m{width:300px}
div#booking .dati{width: 100%; text-align:right}

#offer{top: 385px; width:170px; margin-left: -20px; padding:10px 0 10px 10px}
#offer h3{width:150px; padding:4px; text-align:center}
.bot-of{width:157px; height: 30px; margin:7px 5px 0 0}
#info-r{ display:none}
}


.red{text-shadow: 1px 1px #EE451C; border-radius: 2px; box-shadow: 0px 2px 4px #ccc; margin-left: 5px}
.red-v{color:#FF6}
.red-t{color:#fff; border-radius: 1px;	box-shadow: 0px 2px 4px #999; padding: 3px; background-color: rgba(255,0,0,0.60)}
	
div#zoom{height: 36px; width: 100%; background-image:url(../resources/images/zoom.jpg); background-size:100% 100%; margin: 0; text-align:left}
div#zoom img{margin: 0 10px 0 0}
div#zoom p{font: 10px Verdana, Geneva, sans-serif; line-height: 17px; margin: 1px 5px 0 0}
div#zoom a{color:#464E41}

.f-meteo{width:100%; max-width:310px; height:240px}
.hotels-g{ font-size: 120%; text-shadow: 1px 1px #EE451C; border-radius: 2px; box-shadow: 0px 2px 4px #ccc; padding: 2px 5px}

div#information .sport li, #gardasee .sport li{font-weight:normal; margin: 5px 0 0 15px; list-style:square}

div#information ul.sport, #gardasee ul.sport{margin: 0; padding:0}

div#top{position: absolute;	left: 0px; top: 420px; z-index:100; background-color: rgba(50,84,126,0.70); -moz-border-radius: 0 3px 3px 0;
  -webkit-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;}
div#top h4{float:left; text-align:center; width: 80px; font-size:12px; color:#FFF; padding: 4px; margin:0 }
div#top h4 a{color:#FFF}
#top img{padding: 4px; margin:0; border:0; width:40px; height:auto}
.top{font-size:26px}

div#photo1{display:none}

#news{position: absolute; top: 510px; left: 0; padding: 10px 10px 0 10px; background-color: rgba(50,84,126,0.40); -moz-border-radius: 0 3px 3px 0;
  -webkit-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0}
#spons{position: absolute; top: 510px; left: 0; width:184px; background-color: rgba(50,84,126,0.40)}
.spons{ margin-bottom:15px; box-shadow: 1px 2px 4px #fff; width:180px}   
div#news7{position: absolute; top: 910px; left: 18px; width: 170px}
div#news iframe{ width: 170px; height: 1250px; left: 0;}
.news{margin-bottom: 15px}
.news img{box-shadow: 1px 2px 4px #fff}

div#gardasee-s, div#information-s{float:left; width: 250px; text-align:left; margin-right:10px}
div#gardasee-d{float:left; width: 250px; text-align:left}
div#information-d{float:left; width: 250px; text-align:left}
div#gardasee-s h4 a, div#information-s h4 a, div#gardasee-d h4 a, div#information-d h4 a{color:#FFF}


.table5{ color:#FFF}

#map-wat, #map-mont, #map-ground{width:100%; height:auto}
#information .sport h4 a{ color:#FFF}
#information .sport img{ background-color:#FFF; padding:5px}

 @media screen and (min-width: 0px) and (max-width: 369px){
div#gardasee a, div#information a{line-height:25px}	 
div#header .rid{font-size:10px}
div#header img{width:140px; height:27px}
#esc-f{ width:100%; height:auto}
#ort{display:none}
.table{font-size: 14px; margin: 10px 0}

div#gardasee div.textimage7 img{width:100%; height:auto}
}

 @media screen and (min-width: 0px) and (max-width: 959px){
h1,h2,h3,h4,h5,h6{margin: 20px 0 10px 0}
h1{font-size:16px}
h2{font-size:15px}
h3,h4,h5,h6{font-size:14px}
p{font-size: 14px; line-height: 18px}
#gardasee ul li, #information ul li{font-size:14px; line-height:22px}

}

 @media screen and (min-width: 370px) and (max-width: 497px){
	 
div#header h1{font-size:15px}
div#header img{width:160px; height:30px}
div#menu img{width: 40px; height: 40px}
div#gardasee div.textimage7 img{float:left; margin: 0 10px 0 0}
div#form{margin: 30px auto;	height:750px; width:100%}	
.table5 tr{height:30px}		
.table5, .table5-d, .table5-dg, .table5 select{font-size: 13px}
}

 @media screen and (min-width: 0px) and (max-width: 497px){

div#header h1{text-align:right; padding:5px 5px 0 0 }
div#content{margin: 0 5px}

div#map, #bike{height: 600px}
div#information .giu{text-align:left}
div.surf p{line-height:14px}

div#news, #spons{position:relative; top:0; width:100%; padding: 10px 0; background-color:transparent}
div#news7{display:none}
.spons{float:left; margin:0 10px 10px 0; text-align:left}
.news{float:left; width:48%; margin: 10px 1%; text-align:left}
.news img{width: 100%; height:auto; max-width:168px}


div#seg{
	margin-top:40px;
	padding:2px;
	}

div#seg h5 {
	margin: 4px;
	background-color:#FFF;
	font-size:14px
}

div#seg p {
	margin: 0 4px;
	padding:2px;
	background-color:#FFF;
	font-size:10px;
	text-align:left;
	line-height: 15px

}

}

 @media screen and (min-width: 498px) and (max-width: 679px){
div#gardasee{min-height:830px}
div#information{background-color:#FCFCFA; padding:10px}
#information-r1{margin:0 15px 0 173px}
div#gardasee div.textimage7{margin:10px 0 160px 0}
div#gardasee div.textimage7 img{width: 100%; height:auto; margin:20px 0}

}

 @media screen and (min-width: 498px) and (max-width: 959px){

div#header h1{font-size:15px; text-align:right; padding:15px 10px 0 0}
div#header img{width:170px; height:32px}

div#content{margin: 0px 10px 0 200px; padding-bottom:16px;}
div#gardasee, div#garda-l, div#information{min-height: 560px }
div#gardasee, div#information{width: 96%; padding: 15px 1%; margin: 0 1%}
div#garda-l{max-width: 600px}

div#map, #bike{height: 800px}

div#news7{display:none}

#h300{height:300px}
}

 @media screen and (min-width: 960px){
h1,h2,h3,h4,h5,h6{margin: 20px 0 10px 0}
h1{font-size:16px}
h2{font-size:15px}
h3,h4,h5,h6{font-size:14px}
p{font-size: 12px; line-height: 16px}

div#header h1{font-size:18px; padding:15px 0 0 0}
div#header img{width:205px; height:40px}

div#content{margin: 0 10px 0 200px; padding-bottom:16px; min-height:808px}
div#gardasee, div#garda-l, div#information{min-height: 560px }
div#gardasee, div#information{ float:left; width: 46%; padding: 15px 1%; margin: 0 1%}
div#garda-l{width: 80%; padding:0 15px; max-width:600px}
#gardasee ul li, #information ul li{font-size:11px; line-height:22px}

div#map, #bike{height: 700px}

div#gardasee .meteo{font-size:14px; color: #7A2022; margin-bottom: 50px; color:#FFF}
div#gardasee div.textimage1 img{float: left; margin: 60px 0 2px 0; border: 0}
div#gardasee div.textimage1{ margin-bottom: 80px}
div#gardasee div.comp p{margin: 0 35px 20px 15px}
.scam li{margin: 0 0 10px 0}
.hotels, .info{font: 10px Verdana, Times New Roman, Arial; margin: 0; left: 0; list-style:none; padding: 0}				
.hotels li, .info li{margin: 2px 15px;	line-height: 12px}

.clearer100{float:none; clear:both; width:100%; height:100px}
div#information .sport li, #gardasee .sport li{line-height:15px}
div.surf p{font-size:11px}	
}	

 @media screen and (min-width: 370px){
div#header .rid{ font-size:13px}
.table{font-size: 11px; margin: 25px 0 25px 0}
}

 @media screen and (min-width: 498px){
.Stile1{font-size:12px}
div#information .giu{ margin: 0 15px 0 15px}
div#information .giu h3{float: left; margin: 25px 0 2px 0; border: 0}
div#information .giu img{float: left; margin: 25px 0 2px 30px; border: 0}
div.surf p{line-height:17px}
div#seg{
	position: absolute;
	left: 2px;
	top: 135px;
	padding:2px;
	height: 180px;
	width:160px;
	background-image:url(../img/sf/06.jpg);
	background-size: 100%
}

div#seg h5 {
	margin: 4px;
	background-color:#FFF;
	font-size:14px
}

div#seg p {
	margin: 0 4px;
	padding:2px;
	background-color:#FFF;
	font-size:10px;
	text-align:left;
	line-height: 15px

}
}

 @media screen and (min-width: 0px) and (max-width: 959px){


div#information{clear:both}
}

 @media screen and (min-width: 680px){
div#gardasee div.textimage7 img{float:left; margin: 0 10px 0 0}
}


.table5, .table5-d, .table5-dg{width:100%; font-family: Verdana, Geneva, sans-serif, "Times New Roman"; font-weight:bold; text-align:left}
.table5 select {min-width:50px; font-family: Verdana, Geneva, sans-serif, "Times New Roman"}
 @media screen and (min-width: 0px) and (max-width: 369px){
div#form{margin: 15px 0 0 0; height:500px; width:100%}	
.table5 tr{height:10px}		
.table5, .table5-d, .table5-dg, .table5 select{font-size: 14px}
}
 @media screen and (min-width: 498px){
div#form{margin: 30px 1%;	height:750px; width:98%; }
.table5 tr{height:30px}		
.table5, .table5-d, .table5-dg, .table5 select{font-size: 14px}	
}

ul.MenuBarHorizontal
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	cursor: default;
	width: auto;
}

ul.MenuBarHorizontal li
{
	margin: 0 3.0em 0 0;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	position: relative;
	text-align: left;
	cursor: pointer;
	width: 6em;
	float: left;
}

ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
{
	left: auto;
}

ul.MenuBarHorizontal ul li
{
	width: 11.5em;
	margin: 0;
	background-color: rgba(59,98,130,0.90)
}

ul.MenuBarHorizontal ul ul
{
	position: absolute;
	margin: -5% 0 0 95%;
}

ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
{
	left: auto;
	top: 0;
}


ul.MenuBarHorizontal ul
{
	border: 1px solid #CCC;
}

ul.MenuBarHorizontal a
{
	display: block;
	cursor: pointer;
	padding: 0.5em 0.75em;
	color: #FFF;
	text-decoration: none;
}

ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{
	color: #FFF;
}

ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{
	color: #FFF;
}

ul.MenuBarHorizontal a.MenuBarItemSubmenu
{
	background-image: url(SpryMenuBarDown.gif);
	background-repeat: no-repeat;
	background-position: 95% 50%;
}

ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
{
	background-image: url(SpryMenuBarRight.gif);
	background-repeat: no-repeat;
	background-position: 95% 50%;
}

ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
{
	background-image: url(SpryMenuBarDownHover.gif);
	background-repeat: no-repeat;
	background-position: 95% 50%;
}

ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
{
	background-image: url(SpryMenuBarRightHover.gif);
	background-repeat: no-repeat;
	background-position: 95% 50%;
}
#ad-1{ margin-top: 25px; width:100%; height:150px}

 @media screen and (min-width: 0px) and (max-width: 497px){
#ad-1{height:100px}	 
}	 