@media only screen and (max-width : 800px) {

body {
font-size:12px;
}

#container, #header, #logo, #wrapper, #content, #footer, #counter {
overflow:hidden; 
width:98%;
}

img.right {
display: none;
}

#logo h1 {
font-size:1.6em;
}

#info {
font-size:1.1em;
line-height:1.8em;
}

p.motto {
text-align: center;
font-size:11px;
}

#content {
margin:0;
}

#content h1 {
font-size:1.5em;
}

#content h2 {
font-size:1.4em;
}

#content h3 {
font-size:1.2em;
} 

#content ul {
margin-left:20px;
}

#content ul li {
padding:10px 5px 5px 15px;
}

table {
width : 98% !important;
margin: 20px 0 0 5px;
padding : 0;
}

th{
display: none;
}

td {
font-size: .9em;
}

#footer {
padding:25px 0 0 0;
}

#details, #copyright {
display: none;
}

#contact {
width:95%;
margin:0;
text-align: center;
}

#counter p {
display: none;
}

}

@media only screen and (max-width : 650px) {

body {
background: #369 url(../images/italia-voyages.gif) top right no-repeat;
}

#wrapper #top {
display: none;
}

#menu, #menu li  {
width:90%;
font-size: 1.1em;
}

.imgl, .imgr {
display: none;
}

}

@media only screen and (min-width : 650px) and (max-width : 850px) {

body {
background: #369 url(../images/italia-voyages.gif) top no-repeat;
}

#wrapper #top {
float:left;
width:70%;
}

#wrapper #top div {
display:block;
float:left;
font-size:250px;
}


#wrapper #top h2 {
font-size:1.5em;
text-align: left;
}

#wrapper #top p {
font-size:.95em;
text-align: left;
line-height:1.8em;
margin:50px 10px 0 0;
}

#menu, #menu ul  {
float:left;
width:25%;
}

#menu li  {
text-align: left;
font-size: 0.8em;
}

info {
display: inline;
float: left;
width: 50%;
padding: 0 !important;
}

.imgl, .imgr {
max-width: 25%; height: auto; 
}

}