div#classification h2{border: 1px solid #ccc; color: #FFFF00; padding: 4px; margin: 0; background-color: #B14343; text-align:center}
div#classification a{color: #FFFF00}
div#Title{width: 100%}
div#Title h1, div#Title h2{font-size: 70%; color: #7A2022; margin:10px 0 0 0; padding: 0}
div#gardasee div.Hotel, div#information div.Hotel{width: 100%; box-shadow: 0px 2px 2px #999; text-align: center; margin: 0 0 30px 0; background-color:#FFF}
div#gardasee .data li, div#information .data li{ font-weight:normal}
div.Hotel, div.Hotel ul, div.Hotel li{text-align:center}
div.Hotel1{clear:both; width: 100%; height: 130px}
div#gardasee div.Hotel .vic{font: bold 12px Verdana, Geneva, sans-serif, "Times New Roman"; color: #FFF; margin: 0 0 7px 0; padding: 2px 0; background-color:#7A2022}
div.data h2{color: #7A2022; text-align:center; margin: 5px 0 0 0}
.url{font-weight:bold; border-radius: 2px; padding:4px 2px; background-color:#EBEBEB; box-shadow: 0px 2px 2px #999; line-height:40px}
div.map{float: left}
div.map p{font-size: 11px; line-height: 14px; text-align:center}
div.buttons p{padding: 1px 20px 0 0; margin:0 0 11px 0; text-shadow: 1px 1px #999; text-align:center; background-image:url(../hotels/images/button1.jpg); background-repeat:no-repeat; background-position:center; height:18px}
div.buttons a{color:#FFF; font-size: 10px; font-weight:bold; line-height:16px; text-shadow: 1px 1px #999}
div.buttons a:hover{background-color:transparent; color:#FF0}
div.best img{background-color:#F7F7F7}
div.clear{float: none; clear: left}
div#pages2{float:right;	margin: 20px 0}
div#pages1, div#pages2{width: 140px; height: 15px; color: #7A2022; font: 13px bold Verdana, Arial, Helvetica;; text-align:right}
div#pages1 img, div#pages2 img{margin: 0 4px}

div#gardasee div.data ul, div#information div.data ul{margin:0; padding:0; text-align:center}

 @media screen and (min-width: 0px) and (max-width: 329px) {
div#Title{margin: 48px 0 0 0;}

div#gardasee .img img, div#information .img img {width: 85%; max-width: 150px; height:auto; padding: 0; margin: 10px 0}

div#gardasee div.data, div#information div.data{margin: 0; padding: 0 0 5px 0}
div.data h2{font-size: 12px}
div#gardasee .data li, div#information .data li{font-size: 14px; line-height: 18px}
div.data li img{width:80px; height: auto}
div#gardasee .data img, div#information .data img{width: 80%; max-width:150px; height:auto}

div.map{display:none}
div.buttons{display:none}

div.best{width:80%; max-width:156px; margin: 0 auto}
div.best img{width:100%; max-width:156px; height:auto}	
}

 @media screen and (min-width: 330px) and (max-width: 497px){
div#Title{margin: 40px 0 10px 0}	 
	 
div#gardasee .img, div#information .img{float: left; width: 40%}
div#gardasee .img img, div#information .img img {width:100%; height:auto}

div.data{float: right; width: 60%; padding: 0 0 5px 0}
div#gardasee .data li, div#information .data li{font-size: 11px; line-height: 16px}
div#gardasee .data img, div#information .data img{width: 80%; max-width:150px; height:auto}

div#gardasee .map, div#information .map{clear:left; float:left; width: 40%; padding: 0 0 5px 0}
div.map p{margin: 15px 0 5px 0}

div#gardasee .buttons, div#information .buttons{float:right; width: 60%; padding:0 0 10px 0}
div#gardasee .buttons img, div#information .buttons img{padding:10px 0 0 0; margin:0}
}

 @media screen and (min-width: 0px) and (max-width: 497px){

div#menu{ display:none}
div#classification h2{font-size: 12px}
div#classification li{font-size: 16px; height: 22px; padding: 4px 0 0 4px; font-weight:bold; text-shadow: 1px 1px 1px #333333; background-color:rgba(125,125,125,0.30)}
div#classification li.active{background-color:#B14343}

div.Hotel{float: left; width: 100%; margin: 0 0 30px 0; padding-bottom:15px}

div#socialh{width: 98px; height: 30px; margin: 20px 0 0 40px}
div#news3{display:none}
div#newshp{display:none}
}

 @media screen and (min-width: 0px) and (max-width: 665px){
div#pages1{ display:none}
div#news4{display:none}	
div#news5{display:none} 
}

 @media screen and (min-width: 498px) and (max-width: 665px){
div#gardasee div.Hotel{float: left; padding: 0; margin-bottom: 30px}

div#gardasee .img{float: left; width: 40%}
div#information .img{float: left; width: 28%}
div#gardasee .img img, div#information .img img {width:100%; height:auto}
div#gardasee .data{float: right; width: 60%; margin: 0; padding: 0 0 5px 0}
div#information .data{float: left; width: 50%; margin: 0; padding: 0 0 5px 0}
div#gardasee .map{clear:left; float:left; width: 30%; text-align: center; padding: 0 0 5px 0}
div#information .map{float:left; width: 22%; text-align: center; padding: 0 0 5px 0}

div#gardasee .buttons{float:right; width: 70%; padding:0 0 10px 0}
div#information .buttons{ clear:both; width: 100%; padding:0 0 10px 0}
div#gardasee .buttons img, div#information .buttons img{padding:10px 0 0 0}

}

 @media screen and (min-width: 498px) and (max-width: 959px){

div#classification{width: 173px}
div#classification h2{font-size: 12px}
div#classification li{width: 169px; height: 22px; padding: 4px 0 0 4px}

div#Title{margin: 40px 0 10px 0; padding:20px 0 0 0 }

div.data{float: left; width: 240px; margin-top: 5px; padding-bottom: 5px}
div#gardasee .data li, div#information .data li{font-size: 11px; line-height: 16px}
div#gardasee .data img, div#information .data img{width: 80%; max-width:150px; height:auto}

div.map p{margin: 10px 0 5px 0}

div#socialh{width: 98px; height: 30px; margin: 20px 0 0 40px}
div.best{width: 176px; height: 110px; float: left; margin: 5px 0 10px 20px}
div#news3{position: absolute; top: 810px; left: 2px; width: 170px;}
div#newshp{display:none}
}

 @media screen and (min-width: 498px){
div#classification li{background-image:url(../img/sf/tasti.jpg); background-size: 100% 100%; height: 22px; padding: 4px 0 0 4px; text-align:left; font-size: 13px}
div#classification li.active{background-image:url(../img/sf/tasti2.jpg)}
div#classification li:hover{background-image:url(../img/sf/tasti2.jpg)}

	 
}
 @media screen and (min-width: 666px) and (max-width: 959px){
div#gardasee{min-height:750px}

div#menu{ display:none}

div#gardasee .img, div#information .img{float: left; width: 35%}
div#gardasee .img img, div#information .img img {width:100%; height:auto}
div#gardasee div.data, div#information div.data{float: left; width: 43%; margin: 0; padding: 0 0 5px 0}

div#gardasee .map, div#information .map{float:left; width: 22%; padding: 0 0 5px 0}

div#gardasee .buttons, div#information .buttons{ clear:both; width: 100%; padding:0 0 10px 0}
div#gardasee .buttons img, div#information .buttons img{padding:10px 0 0 0; margin:0}

div#pages1{ display:none}
div#news4{position: absolute; top: 825px; left: 2px; width: 170px;}	
div#news5{position: absolute; top: 860px; left: 2px; width: 170px}		

}
 @media screen and (min-width: 960px){

div#menu{display:none}

div#classification{width: 142px}
div#classification h2{font-size: 10px}
div#classification li{width: 138px; height: 22px; padding: 4px 0 0 4px}

div#Title{margin: 15px 0 10px 0; padding:25px 0 0 0 }

div.Hotel{float: left; width: 100%; margin: 0 0 10px 0}

div#gardasee .img, div#information .img{float: left; width: 35%}
div#gardasee .img img, div#information .img img {width:100%; height:auto}

div#gardasee div.data, div#information div.data{float: left; width: 43%; margin: 0; padding: 0 0 5px 0}
div#gardasee .data li, div#information .data li{font-size: 11px; line-height: 16px}
div#gardasee .data img, div#information .data img{width: 80%; max-width:150px; height:auto}

div#gardasee .map, div#information .map{float:left; width: 22%; padding: 0 0 5px 0}

div#gardasee .buttons, div#information .buttons{clear:both; width: 100%; padding:0 0 10px 0}
div#gardasee .buttons img, div#information .buttons img{padding:10px 0 0 0}

div#socialh{width: 98px; height: 30px; margin: 20px 0 0 22px}
div.best{width: 176px; height: 110px; float: left; margin: 15px 0 0 40px}
div#news4{position: absolute; top: 825px; left: 18px; width: 170px}	
div#news5{position: absolute; top: 860px; left: 18px; width: 170px}

div#pages1{margin: 25px 15px 20px 275px}

div#news3{position: absolute; top: 810px; left: 18px; width: 170px;}
div#newshp{position:absolute; top: 1130px; left:9px; width: 1085px; height: 140px}
}