html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
 
body {
background-color: #f9f6ec;
font-family: Helvetica, Arial, Verdana, sans-serif;
line-height: 1;
color: #212121;
font-size:0.875em; /* 14px / 16px */
overflow-x: hidden;
}

sup {font-size: 0.6em;vertical-align: top;}

/** Links  **/
a img {margin: 0;padding: 0;border: 0;}

a {color: #7b001b;text-decoration: underline;}
a:link, a:visited {color: #7b001b;}
a:hover, a:active {color: #666666;}

/*** Select ***/
select {border:1px solid #b3b3b3;height:24px;color:#333;}

input.field, textarea {color:#333;border: 1px solid #bdbdbd;padding:4px;}

.right {float: right;}

.imageLeft {float:left;margin:0 20px 20px 0;padding: 6px;border:1px solid #D7D5BB;background-color: #F9F6EC;}

div#cleardiv{clear:both;height: 1px;font-size:1px;margin:0;padding:0;}

/** Headers **/
h1 {margin-top: 12px;
line-height: 1.2;
margin-bottom: 14px;
font-size: 2em; /* 28px / 14px */
font-family: Helvetica, Arial, Verdana, sans-serif;
color: #7b001b;
}
h2 {
margin-top: 12px;
line-height: 1.2;
margin-bottom: 10px;
font-size: 1.857em; /* 26px / 14px */
font-family: Georgia, Trebuchet MS, Times New Roman, Times, serif;
color: #7b001b;
}
h3 {
line-height: 1.2;
margin-top: 8px;
margin-bottom: 12px;
font-size: 1.714em; /* 24px / 14px */
font-family: Helvetica, Arial, Verdana, sans-serif;
color: #7b001b;
}
h4 {
line-height: 1.2;
margin-top: 6px;
margin-bottom: 10px;
font-size: 1.714em; /* 22px / 14px */
font-family: Georgia, Trebuchet MS, Times New Roman, Times, serif;
color: #7b001b;
}

h5 {
line-height: 1.2;
margin-bottom:8px;
font-size: 1.1571em; /* 16px / 14px */
font-family: Helvetica, Arial, Verdana, sans-serif;
}
h6 {
line-height: 1;
margin-bottom: 6px;
font-size: 0.857em; /* 12px / 14px */
font-family: Helvetica, Arial, Verdana, sans-serif;
font-weight: bold;
}

table {width: 100%;margin:0 auto;border-collapse: collapse;background-color: #f9f6ec;font-size:0.875em; /* 14px / 16px */}
th {background-color: #eadfcc;border: 1px solid #eadfcc;padding: 4px 7px;text-align:left;color:#725526;font-weight: bold;vertical-align: top;}
td {margin: 0;padding: 2px 7px;border: 1px solid #eadfcc;vertical-align: top;}
td.first {background-color: #fffef9;}

p {
padding:2px 0;
margin:4px 0;
}

strong {font-weight: bold;}

em {font-style: italic;}

center {text-align: center;}

ol, ul {margin: 0 0 5px 0;padding: 0 0 0 25px;}

li {margin: 3px 0;}

hr {height: 1px;margin:10px 0;background-color:#d7d5bb;border:none;}

dl dt {font-weight: bold;padding: 6px 0 4px 0;}
dl dd {margin:0;padding:5px 0;}

/*=========================================
	Main Styles
=========================================*/

/* Header */
#boxHeader {
background: url(../c_grafica/magisvino/bkg.jpg) repeat-x center top #CFD683;
float: left;
width:100%;
min-height:190px;
}

.header {
width: 1000px;
margin: 0 auto;
}

.header #follow {z-index: 1000;position: absolute;margin:10px 10px 0 0;right:0;}

.logo {float:left;margin-top: 20px;}

.imgHead {float:left;}

/* Menù */
#boxMenu {
float: left;
padding: 0;
width: 100%;
background: #570f33;
min-height: 30px;
line-height: 30px;
} 

.menu {
width: 1000px;
margin: 0 auto;
}


/* Tendina Menù */
#nav {
	margin: 0;
	padding: 0;
}

#nav li.current a {background:#7C4560;color: #ffff66;}

#nav li {
	float: left;
	color:#ffffff;
	width: auto;
	margin:0 1%;
	text-align: center;
	text-decoration: none;
	padding:0;
	position: relative;
	list-style: none;
	z-index:2000;
}

#nav li.lang {margin:0;border-right:1px solid #7d3e5d;float:right;}
#nav li.lang:hover > a {background: none;} 

/* main level link */
#nav a {
	display: block;
	color: #ffffff;font-size: 15px;margin:0;padding: 5px;text-decoration: none;
	 /* Add the transition properties! */
    -webkit-transition-property: background-color, color;
    -webkit-transition-duration: 600ms;
    /* you can control the acceleration curve here */
    -webkit-transition-timing-function: ease-in-out;
    font-weight: normal;	
	
}

#nav a.rss {padding: 8px;}

/* main level link hover */
#nav li:hover > a {
	background:#7C4560;
	color: #ffff66;
	
}

/* sub levels link hover */
#nav ul li:hover a, #nav li:hover li a {
	background: none;
	border: none;
	color: #ffffff;
	padding: 6px 10px;

}

#nav ul a:hover {
	background:#97617c !important;
	color: #ffff66 !important;
}

/* level 2 list */
#nav ul {
	background: #7C4560; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#7C4560', endColorstr='#570f33'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#7C4560), to(#570f33)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #7C4560,  #570f33); /* for firefox 3.6+ */
	display: none;
	margin: 0;
	padding: 0; 
	width: 310px;
	position: absolute;
	left: 0;
	box-shadow: 0 2px 4px 0 #5e4e35;-webkit-box-shadow: 0 2px 4px 0 #5e4e35;-moz-box-shadow: 0 2px 4px 0 #5e4e35;
}
/* dropdown */
#nav li:hover > ul {
	display: block;
}
#nav ul li {
	float: none;
	margin: 0;
	padding: 0;
	border-bottom:1px solid #4e0b2d;
	text-align: left;
	line-height: 1.3;
}
#nav ul a {
	font-weight: normal;
	
}

/* clearfix */
#nav:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
#nav {
	display: inline-block;
}
html[xmlns] #nav {
	display: block;
}
* html #nav {
	height: 1%;
}



/* boxSito + Container */
#boxSito {
float:left;
width:100%;
padding:10px 0 0 0;
background: url(../c_grafica/magisvino/bkg_boxSito.png) repeat-x left top;
}

.container {
width: 1000px;
margin:0 auto;
line-height: 1.6;
background: url(../c_grafica/magisvino/bkg_container.png) no-repeat right bottom;
min-height: 900px;
}

/* menuLeft */
#menuLeft {float:left;width:31%;}
#menuLeft h1 {margin-top:0;}
#menuLeft ul {color: #887556;padding:0 0 0 0;line-height: 1.3;}
#menuLeft ul li {margin: 8px 0;}
#menuLeft ul li a {font-weight: bold;text-decoration: none;}
#menuLeft ul li a.selected {text-decoration: underline;}
#menuLeft .citazione {width:86%;margin: 10px 0 20px 0;padding:44px 4% 0 4%;background: url(../c_grafica/magisvino/bkg_cit2.gif) no-repeat center top #570f33;}
#menuLeft .citazione img {width:260px;height:auto;display: block;margin:0 auto;}

#content {margin-left: 32%;border-left:1px solid #d7d5bb;padding:0 2%;}

.presentazione {
float: left;
width: 56%;
color:#7b001b;
margin: 5px 2% 5px 0;
line-height:1.4;
font-size: 1.285em; /*18px / 14px */
}

a.btnHome {float:right;padding: 0 0 0 2px;margin:16px 0 0 0;font-size:1em;display:block;color:#fff;text-decoration:none;font-weight:bold;text-align:center;width:226px;height:41px;line-height:40px;background: url(../c_grafica/magisvino/btn.png) no-repeat center top transparent;text-shadow: 0 -1px 0 #475c05;}

a.btnHome:hover {color: #2d3b00;text-shadow: 0 1px 0 #cce043;}

input.btn, a.btn {background:#570F33;padding: 5px 10px;font-size:13px;font-weight: bold;color:#fff;text-align: center;border-radius: 6px;-moz-border-radius: 6px;-webkit-border-radius: 6px;border: none;cursor: pointer;text-decoration: none;}
input.btn:hover, a.btn:hover {background: #7c4560;color:#ffff66;}

.citazione {
background: url(../c_grafica/magisvino/bkg_cit.png) no-repeat center top #570f33;
float: left;
width: 36%;
margin: 5px 0 5px 2%;
padding: 44px 2% 0 2%;
color:#ffffff;
line-height: 1.4;
box-shadow: 0 2px 4px 0 #9b8b72;-webkit-box-shadow: 0 2px 4px 0 #9b8b72;-moz-box-shadow: 0 2px 4px 0 #9b8b72;
}

.citazione img {width:342px;height:auto;display:block;background-color: #b8b095;padding:3px;margin: 0 auto;}
.citazione a img:hover  {background-color: #E6DBC9;}
.citazione a {color:#ffffff;font-weight: normal;font-style: normal;}
.citazione a:hover {color:#ffff66;}
.citazione p.azienda {font-weight: bold;text-align: right;font-style: italic;}

/* table Filtro */
table.filtro {width:360px;margin:20px auto;padding:0;border:2px solid #d7d5bb;}
table.filtro td {border:none;padding:4px 2px;vertical-align: middle;text-align: center;}
table.filtro td h4 {text-align: center;margin:0;}
table.filtro td.first {width:100px;background:none;text-align: right;}
table.filtro td input.field {width:222px;}
table.filtro td select {width:230px;}

/* table Elenco */
table.elenco {background: none;margin: 10px 0;border-top:1px dotted #d7d5bb;}
table.elenco td {border:none;padding:4px 18px;}
table.elenco td.foto {width:160px;padding:0;margin:0;}
table.elenco td.foto img {margin-top:10px;height:auto;padding:3px;background:#D7D5BB;cursor: pointer;}
table.elenco td.foto img:hover {background:#7c455f;}

/* table Contatti */
table.contatti {width:560px;margin:4px auto;padding:0;border:2px solid #d7d5bb;}
table.contatti td {border:none;padding:6px;vertical-align: middle;text-align: left;}
table.contatti td.first {width:40%;background:none;text-align: right;}
table.contatti td input.field, table.contatti td textarea {width:90%;}
table.contatti td textarea {height:140px;}
table.contatti td input.btn {display:block;margin:10px auto;}

p.paginazione {text-align: center;color:#570F33;font-size: 0.9em;color:#757354;}
p.paginazione span {font-weight: bold;}
p.paginazione a {text-decoration: none;}
p.paginazione a:hover {text-decoration: underline;}

div#mapContainer {width:650px;height:650px;}
#menuLeft #mapContainer {width:300px;height:350px;}

p.blocco {min-height: 170px;}

/* News Carousel */
.news {width: 55%;float:left;height:330px;overflow: hidden;border:2px solid #7b001b;background-color: #fff;line-height:1.3;padding:5px 1%;margin: 5px 2% 20px 0;}
.news h3 {margin-left:26px;}
.news ul {height: 260px;margin: 0;padding: 0;list-style: none;overflow: hidden;}
.news ul li {width: 494px;height: 250px;margin: 0;padding: 5px;list-style: none;display: block;float: left;}
.news ul li h4 a {text-decoration: none;}
.news ul li h4 a:hover {text-decoration: underline;}
.news ul li h5 {margin-bottom: 16px;}
.news ul li img {width: 215px;height:auto;float:right;margin: 0 6px 16px 16px;}

.video{
float: left;
height:300px;
text-align: center;
width: 38%;
padding: 30px 0;
margin: 5px 1% 20px 1%;
}

/* Footer */
#footer {
width:100%;
background: url(../c_grafica/magisvino/bkg_footer.gif) repeat-x left top #570f33;
margin:20px 0 0 0;
padding:0 0 30px 0;
float: left;
}

p.contatti {width:1000px;padding:104px 0 0 0;margin:0 auto;color:#f8f7e4;text-align: left;background: url(../c_grafica/magisvino/tappo.png) no-repeat right top;}
p.contatti a {color:#f8f7e4;text-decoration: none;}
p.contatti a:hover {color:#ffff66;text-decoration: underline;}
p.contatti img {vertical-align:middle;margin:0 8px;}
p.il {float:left;font-size:0.9em;width:96%;line-height:1.4;text-align: center;padding: 2%;}


/*=========================================
	Media Queries
=========================================*/

/* This is stage 2, when the main container becomes smaller. */

@media screen and (max-width: 1000px) { /* 1000px = header and container width */

.logo {float:none;margin: 0 auto;display: block;}

.header {width:100%;text-align: center;}

.imgHead {float:none;border:4px solid #ffffff;margin:1% auto;box-shadow: 0 2px 3px 0 #666666;-webkit-box-shadow: 0 2px 3px 0 #666666;-moz-box-shadow: 0 2px 3px 0 #666666;}

.menu {width:96%;}

.menu #nav li:hover > ul {display: none;}

.container {width:96%;}

.citazione img {padding:1px;}

.citazione img, .video object {width:98%;}

.news {height:auto;border:1px solid #7b001b;}

.news ul, .news ul li {height:auto;}

.news ul li img {float:none;display:block;margin: 0 auto;}

p.contatti {width:96%;}

div#mapContainer {width:650px;height:650px;}

img {max-width: 100%;height:auto;} /* Fluid images */

embed, object, video {max-width: 100%;} /* Fluid Video */

}

/* Stage 3, when the layout becomes fluid, and the size of the browser. */

@media screen and (max-width: 710px) { /* 710px = top image width */

html {-webkit-text-size-adjust: none;} /* Prevent font scaling in landscape */

.header {width:98%;}

.header #follow {position: relative;margin: 4px 0 0 0;}

.imgHead {width:94%;}

p.contatti {width:96%;text-align: center;}

p.contatti img {display: block;border:0;padding:0;margin:0 auto;}

div#mapContainer {display:none;}
#menuLeft #mapContainer {display:none;}

table.contatti {width:100%;}

}

/* Here, all the elements are the same size for Mobile users: 480 pixels held in landscape mode. */

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

.header {width:98%;}

.imgHead {width:98%;}

.menu #nav li {width:100%;margin:0;border-bottom:1px solid #763d59;}

.menu #nav li.lang {border:none;width:40px;float:right;}

.menu #nav li:hover > ul {display: none;}

.container {width:90%;margin:0 5%;}

a.btnHome {float: none;margin:0 auto;}

#menuLeft {border:none;width:100%;}

#menuLeft .citazione {width: 93%;}

#content {margin:0;border:none;}

table.filtro {width: 100%;}

table.elenco td.foto {width:25%;}

.presentazione {width:100%;margin-right:0;}

.citazione {width:96%;margin-left:0;margin-bottom: 10px;}

.citazione img {padding:1px;background-color: none;}

.news {width:284px;height:auto;border:1px solid #7b001b;margin: 0 0 2px 0;padding: 0 2px;}

.news ul, .news ul li {width:228px;height:auto;}

.news ul li img {float:none;display:block;margin: 0 auto;}

.video {width:98%;padding:0;}

p.contatti {width:98%;text-align: center;background: none;}
p.contatti img {margin: 20px auto;}

div#mapContainer {display:none;}
#menuLeft #mapContainer {display:none;}

img.imageLeft {float:none;display: block;margin: 0 auto;}

p.right {float: none;}

}