@charset "UTF-8";
/* CSS Document */


/******************/
/* SPECIAL FONTS */
/******************/

/* Montserrat */
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 300; font-display: swap; src: url(fonts/montserrat_ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 300; font-display: swap; src: url(fonts/montserrat.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 300; font-display: swap; src: url(fonts/montserrat_italic_ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 300; font-display: swap; src: url(fonts/montserrat_italic.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 700; font-display: swap; src: url(fonts/montserrat_bold_ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/montserrat_bold.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 700; font-display: swap; src: url(fonts/montserrat_bold_italic_ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 700; font-display: swap; src: url(fonts/montserrat_bold_italic.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/montserrat_400_ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: swap;
src: url(fonts/montserrat_400.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Quattrocento */
@font-face { font-family: 'Quattrocento'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/Quattrocento_ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Quattrocento'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/Quattrocento.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Quattrocento'; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/QuattrocentoBold_ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Quattrocento'; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/QuattrocentoBold.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/******************/
/* STILI GENERALI */
/******************/

/* elementi standard */
* { box-sizing:border-box; }
b, strong { font-weight:bold; }
i, em { font-style:italic; }
a { text-decoration:none; color:#aa8867; }
	a:hover { text-decoration:underline; }
ol li { list-style-type:decimal; }
.cursor { cursor:pointer; }

/* posizionamenti */		
.clear { clear:both; }
.left { float: left; }
.right { float: right; }
.aligncenter { text-align:center; }
.alignright { text-align:right; }
.alignleft { text-align:left; }
.alignmiddle { align-items:center; }
.border_zero { border:0 !important; }

/* spaziature */
.vspaced { padding-top:70px; padding-bottom:70px; }
.hspaced { padding-left:10%; padding-right:10%; }
.topspaced { padding-top:70px; }
.bottomspaced { padding-bottom:70px; }

/* colori */
.bggold { background:#7b6653; color:#fff; }
	.bggold h3 { color:#e5e0dd;}
.bggrey{ background:#e1ddda; }
.bglight { background: #e5e0dd; }
.bgsilk { background:rgba(256, 256, 256, 0.9); }
	.bgsilk h3 { color:#999; }

/* display */
.mobile { display:none; }
.desktop { display:block; }

/* colonne */
.flexcontainer { display:flex; justify-content:space-between; flex-flow:row wrap; }
.cols { display:flex; justify-content:space-between; flex-flow:row wrap }
	.two>* { width:50%; }
	.three>* { width:30%; }
		.three .main { width:62%; }
	.four>* { width:22%; }
	.center { justify-content:center; }

/* loading */
.preload body * { display:none; }
  .preload body #loading { display:block; }
    .preload body #loading img { display:inline; }
#loading { position:fixed; top:0; left:0; right:0; bottom:0; width:100%; z-index:1000; background:#7b6653; text-align:center; }
	#loading img { width:100px; height:100px; margin-top:20%; clear:both;  }
	#loading img.logo { width:400px; height:auto; margin-top:20%;  }



/******************************/
/*    STILI PER IL LAYOUT    */
/****************************/

body, html { margin:0; padding:0; font-family: 'Montserrat', sans-serif; color:#666; }
header, main, footer { padding: 0; }

/* generic headers */
h2 { font-size:32px; font-weight:normal; font-family: 'Quattrocento', serif; margin:0; text-transform:uppercase; }
h3 { opacity:1; font-size:18px; font-weight:normal; color:#aaa; margin:5px 0 30px 0; font-style:italic; line-height: 1.6em; }

/* HEADER */
header { position:fixed; width:100%; z-index:10;}
	header .mainbar { display:flex; justify-content:space-between; align-items: center;  padding: 0 5%;  width:100%; top:0; right:0; background-color:#fff; }
		header h1 { margin:10px 0 0 0; padding:0;  }
			header h1 img { height:50px; }
		header .toolbar { display:none; }
			header nav #menuIcon { display:none; }
			header nav ul li { display:inline-block; }
			header nav ul li.desktop { display:inline-block; }
				header nav ul li a { display: block; text-transform:uppercase; color:#666; font-size:12px; padding: 0 20px; letter-spacing:0.1em; }
					header nav ul li a:last-of-type { padding-right:0; }
				header nav ul li a img { height:15px; }
					header nav ul li a img:hover { opacity:0.5; }
	header .stripenews { width:100%; background:#000; text-align:center; color:#fff; }
		header .stripenews h2 { margin:0; font-size:12px; font-weight: normal; padding:10px 5%; font-family: 'Montserrat', sans-serif; }
		header .stripenews a { font-weight: bold; }
		header .stripenews br { display:none; }
		header .stripenews button.close { position:absolute; bottom:5px; right:5px; background:#000; border:0; }
			header .stripenews .close img { height:15px;}

/* MAIN */
main { clear:both; }
	main p, main ul li { font-size:18px; line-height:1.6em; }

/*img styles*/
img.social { filter: invert(0.30); }
main .pic img { height:100%; width:100%; object-fit:cover; }
main .cover { position:relative; text-align:center; overflow:hidden; text-align:center; width:100%; }
	main .cover img { object-fit:cover; width:100%; }
main .cols img { width:100%; }
main .cellar { background-image: url("../img/home/cantina.webp"); background-size: cover; background-position: left center; }
main .tastings { background-image: url("../img/degustazioni/tastings.webp"); background-size: cover; background-position: left top; }
main img.icon { width:12px!important; margin-right:3px; }

/*sections styles*/
main .opening { height:100vh; overflow:hidden; text-align: center;  }
	main .opening img { height:100%; width:100%; object-fit:cover; }
	main .opening .go { position:absolute; z-index:2; top: 60%; left: 50%; transform: translate(-50%, -60%); }
		main .opening .go a { padding:25px 50px; border:2px solid #fff; }

main .intro { border-top:3px solid #fff; text-align:center;  overflow:hidden; }
	main .intro .bgfleurs { padding:100px 30%; background-color:#7b6653; background-image: url(../img/deco.svg), url(../img/deco.svg); background-position: left center, center right; background-repeat: no-repeat; background-size: 300px; margin:0 -150px; }

main .text { display:flex; align-items: center; justify-content: center; }
	main .text .wrapper { width:80%; }
		main .text .wrapper h2 { margin:0; }
		main .text .wrapper article { margin:15px 0; }
			main .text .wrapper article h2 { font-size:14px; font-weight:bold; margin-bottom:5px; }
			main .text .wrapper article p { margin:0; }

main .wines { align-content: center; }
	main .wines article { margin:0 0 20px 0; padding: 0; width:200px; }
		main .wines article:hover { opacity:0.6; }
		main .wines.list article img { width:220px; }
		main .wines article h2 { font-size:18px; margin:0 0 15px 0; }
		main .wines article h3 { font-size:13px; margin-top:0; background:#f0f0f0; color:#333; padding:20px; font-weight:bold;  font-style: normal; background: #f0f0f0 url(../img/icons/more.svg) bottom right no-repeat; background-size:25px; }
		main .wines article p { font-size:13px; color:#000; font-weight:400; }
		main .wines article a { font-size:13px; }
		main .wines article img.bio { width:35px; float:left; margin:5px 5px 5px 0; }
	main .wines.detail h3 { margin-top:-40px; }
	main .wines.detail img.bottle { width:150px; }

main .cols.images img { width:100%; }

main .rooms { margin-top:30px; }
	main .rooms.two>* { width:47%; }
	main .rooms article { text-align:left; }
	main .rooms article .pic { margin-bottom:30px; position:relative; }
		main .rooms article .pic .more { position:absolute; top:15px; right:15px; z-index:2; height:30px; width:30px; }
	main .rooms article h3 { margin-bottom:20px; }
	main .rooms article .button { margin-top:20px; width:100%; text-align:center; }

main p.description { margin:0 20%; }
main .sendinblue iframe { width:540px; height:700px;  }
 
main .box { padding:2%; background:#f0f0f0; margin:40px 0; }
	main .box p { margin:0; font-size:14px; }
		

/* FOOTER */
footer { overflow:visible; clear:both; font-size:14px; text-align:center; font-size:12px; color:#fff; }
	footer a { color:#fff; }
	footer .footnav { background:#8b7968; }
		footer .footnav ul { padding:0; margin:0; }
			footer .footnav ul li { display:inline; }
				footer .footnav ul li a { text-transform: uppercase; font-size:16px; display:inline-block; margin:0 20px; }
		footer .wrapper { background-color: #7b6653; background-image: url(../img/deco.svg); background-repeat:no-repeat; background-position: center 150px; background-size: 400px; overflow:hidden;  }
			footer .newsletter { text-align:left;}
				footer .newsletter h2 { font-size:32px; font-weight:normal; margin:0; text-transform:uppercase; }
				footer .newsletter h3 { opacity:1; font-size:18px; font-weight:normal; color:#e5e0dd; margin:5px 0 30px 0; font-style:italic; }
				footer a.button { padding:15px 50px; background:#000; border:2px solid #fff; display:inline-block; color:#fff; margin:0 0 30px 0; }
					footer a.button:hover { background: #fff; color:#333; }
				footer .colophon, footer .colophon h2 { font-size:12px; font-weight:normal; line-height:1.6em; text-align:right; font-family: 'Montserrat', sans-serif; }
					footer h2 a:hover { text-decoration: none; opacity:0.7; }
					footer h2 img { width:80%; opacity:0.4; }
	footer .contributi { background-color: #7b6653; }
		footer .contributi .boxed { padding:20px; border:1px dotted #fff; line-height:1.4em; opacity:0.7; }


/* gallery */
div.cssbox { display: inline-block; }
	span.cssbox_full { z-index: 999999; position: fixed; height: 100%; width: 100%; background-color: rgba(0,0,0,0.8); top: 0; left: 0; opacity: 0; pointer-events: none; cursor: default; transition: opacity 0.5s linear; }
		span.cssbox_full img { position: fixed; margin: 0; padding: 0; max-height: 90%; max-width: 90%; top: 50%; left: 50%; margin-right: -50%; transform: translate(-50%, -50%); box-shadow: 0 0 20px black; object-fit:scale-down; }
	a.cssbox_close, a.cssbox_prev, a.cssbox_next { z-index: 999999; position: fixed; text-decoration: none; visibility: hidden; color: white; font-size: 36px; }
		a.cssbox_close { top: 1%; right: 1% }
			a.cssbox_close::after { content: '\00d7'; }
		a.cssbox_prev, a.cssbox_next { top: 50%; transform: translate(0%, -50%); }
			a.cssbox_prev { left: 5%; }
			a.cssbox_next { right: 5%; } 
	a:target ~ a.cssbox_close, a:target ~ a.cssbox_prev, a:target ~ a.cssbox_next { visibility: visible; }
	a:target > img.cssbox_thumb + span.cssbox_full { visibility: visible; opacity: 1; pointer-events: initial; }

/* forms */
form { padding:30px; }
	form>* { margin:10px 0; font-size: 1em; border-radius:5px; font-family: 'Montserrat', sans-serif;}
	form h3 { color:#666; margin:-15px 0 20px 0; }
	form p { width:100%; font-size:14px; }
	form p.note { font-size:12px; }
	form section { margin-bottom:30px; }
		form section h2 { margin:0 0 20px 0; }

main form label { padding:0 20px 20px 0; }
main form select { padding:3%; width:100%; border: 1px solid #ddd; background: #fafafa; color:#888; margin-bottom:20px; }
main form input[type=checkbox] {vertical-align:middle; margin-right:10px;}
main form input[type=text], main form input[type=password], body .content form input[type=password], main  form input[type=email], main  form input[type=file],  main  form input[type=date], main  form textarea { background: #fafafa; border: 1px solid #ddd; color: #888; padding:5%; width:100%; margin-bottom:20px; font-size:16px; font-style:italic; font-family: 'Montserrat', sans-serif; }
  main form input[type=text]:focus, main form input[type=password]:focus, main form input[type=email]:focus, main form textarea:focus {color:#373737;}
main form input[type=submit],main form input[type=button], .button {display:inline-block; background-color:#7b6653; padding:25px 50px; color:#fff; font-size:16px; margin-top:0px; border:0; min-width:150px; text-align:center; margin:0 auto; cursor: pointer; font-family: 'Montserrat', sans-serif; white-space: normal; letter-spacing:0.2em; }
  main form input[type=button]:hover, .button:hover{background-color:#666; text-decoration:none; }
main .button.secondary { opacity:0.6; width:280px; border-radius:0; }

main .captchabox { text-align:left; padding:20px; border: 1px solid #ccc; margin:30px 0; }
	main .captchabox p { padding:0; margin:0; }
	main .captcha { margin-top:30px; }
		main .captcha img { width:110px; }
		main .captcha input[type=text] { text-align:center;float:right;width:150px; }
.spam_code { width: 180px !important; }
.spam_text { width: 180px !important; text-align: center !important; }

main .feedback { padding:20px; margin-bottom:30px; }
	main .feedback h2 { text-transform:uppercase; font-size:20px; font-weight:bold; margin:0px 0 10px 0; color:#49463f; font-family: 'Montserrat', sans-serif; }
	main  .feedback p { margin-bottom:0; }
	main  .feedback a { display:block; margin-top: 10px; text-decoration: underline; } 
	main .error{ background-color:#f7d4d7; border:2px dashed #C00; color:#C00; }
		main  .error h2 { color:#C00; }
		main  .error a { color:#C00; }
	main  .sent{ background-color:#e3f3d5; border:2px dashed #6ba639; color:#6ba639; margin-bottom:40px; }
		main .sent h2 { color:#6ba639; }
		main .sent .cols img { width:150px; filter: grayscale(); }
		main .sent a  { margin-top:0; color:#6ba639; }

/* New calendar */
.ifr { width: 100%; height: 320px; border:0; }
.years { display:flex; align-items: center; margin:20px 0; justify-content:space-between; }
	.years form { padding:0; }
	.years img { height:30px; }
table.calendar { width:100%; font-size: 12px; }
	table.calendar td { padding: 5px; width:14.2%; color:#000; text-align:center; }
		table.calendar td.greycell{ background-color:#f0f0f0; }
		table.calendar td.whitecell{ background-color:#fff; }
		table.calendar td.redcell { background-color:#c97471; color:#fff; }
		table.calendar td.greencell { background-color:#879a6c; color:#fff; }



/* calendario Booking */

.datepicker form {  }
	.year { text-align: center; }
	.month { width:100%; border-style: none; background-color: #ccc5c0; text-align: center; }
		.yearnavigation { font-size: 12px; }
			.yearname { text-align: center; font-size: 18px; font-weight: bold; }
			.monthname { text-align: center; font-size: 13px; font-weight: bold; border-style: solid; border-width:0px; background-color: #e5e0dd; }
		.monthnavigation  img { width:30px; height:30px; }
		.datepicker { background-color: #e5e0dd; }
			.datepickerform { margin: 0px; padding:0; }
				.monthpicker, .yearpicker { font-size: 11px; background-color: #fff; border:0; border-radius: 0; padding:5px; }
				.pickerbutton { border:0; font-size: 11px; font-weight:bold; border-width: 1px; color:#fff; background-color: #7b6653; padding:5px 10px; border-radius: 0; }
		.dayname { text-align: center; font-size: 12px; font-weight: bold; border-style: none; border-width:1px; color: #667171; }
		.month tr td {text-align: center; font-size: 11px; font-weight: bold; color: #666; height:20px; width:20px;}
			.nomonthday { color: #aaaaaa; }
			.monthday { background-color: #fff; }
			.today { background-color: #889f51; color:#fff!important;}
			.sunday, .saturday { background-color: #f0f0f0; }
			.event { background-color:#d36f6e !important; color:#673333!important; } 

.dates article { margin-bottom:20px; }
	.dates  h3 { margin-top:0; padding-top:0; }
	.dates input { width:auto!important; }
	.dates  label { display:inline-block; width:110px; }

/* prenotazione */
.prezzo_riepilogo { width: 100%; text-align: center; padding: 15px; color: #FFF; font-weight: bold; background-color: #889f51; }
.error_days { width: 100%; text-align: center; padding: 15px; color: #FFF; font-weight: bold; background-color: #c55757; }


/****************************/
/* STILI PER I MAXI SCHERMI */
/****************************/

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



/****************************/
/*    STILI PER I TABLET    */
/****************************/

@media only screen and (max-width: 1024px) {
.desktop { display:none; }
.mobile { display:block; }

header nav { display:flex; flex-flow:row-reverse nowrap; align-items:center; }
	header nav>a { padding:0 10px; } 
	header nav img { height:30px; opacity:0.5; margin:0 5%; display:block; }	
	header nav #menuIcon {  cursor:pointer; display:block; color:#fff; }
		header nav #menuIcon img { height:50px; }
		header nav ul { position:absolute; top: 40px; right:3%; display:none; z-index:100; }
			header.tiny nav ul { top:36px; }
			header nav ul li { display:block; width:100%; z-index:100; }
				header nav ul li a { background:#fff; color:#333; text-align:center; border-bottom:1px solid #aa8867; border-left:15px solid #aa8867; padding:20px 30px; }
				header nav ul li a:last-of-type { padding-right:30px; }
			header nav ul li.desktop { display:none; }
	main .scroll a { display:none; }
header .toolbar { display:block; position:fixed; bottom:15px; right:15px; }
	header .toolbar a { display:inline-block; margin:0 10px; }
	header .toolbar img { height: 30px; }
main .text .wrapper { padding-top:50px; padding-bottom:50px; }
main form input[type=submit], main form input[type=button], .button { width:100%; padding-left:15px; padding-right:15px; }
}

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

.vspaced { padding-top:50px; padding-bottom:50px; }
.hspaced { padding-left: 5%; padding-right: 5%;	}
.topspaced { padding-top:50px; }
.bottomspaced { padding-bottom:50px; }
	main .cover h1 img { height: 250px; }
	main .cover h2 { font-size:24px; }
.two>*, .four>* { width:50%; }
	main .cols h2 { font-size:24px; margin-left:5%; }
	main .cols h3 { font-size:16px; }
main .intro .bgfleurs { padding:70px 35%; background-color:#7b6653; background-image: url(../img/deco.svg), url(../img/deco.svg); background-position: left top, right bottom; background-repeat: no-repeat; background-size: 200px; margin:0 -100px; }
	footer .footnav ul li a { margin:0 5px; }

}

	
/******************************/
/*    STILI PER SMARTPHONE    */
/******************************/

@media only screen and (max-width: 560px) 
{
#loading img.logo { width:200px; height:auto; margin-top:20%;  }
header .stripenews br { display:block; }
	header .toolbar img.shaded { filter: drop-shadow(2px 2px 3px #999);}
main .cols { flex-flow: row wrap; }
	.cols>*, main .three .main { width:100%; text-align:center; }
main .four>* { width:48%; }
main .intro h2 { padding:0 5%; }
.alignleft, .alignright { text-align:center; }
main .wines.list article {  padding: 0; width:47%; margin:0; }
	main .wines.list article img { object-fit:cover; width:150px; }
main .rooms article { margin-bottom: 80px; }
	main .rooms article:last-of-type { margin-bottom:30px; }
span.cssbox_full, .cssbox_close, .cssbox_next, .cssbox_prev { display:none; }
footer .footnav { display:none; }
footer .wrapper { padding:50px 5%; background-color: #7b6653; background-image: url(../img/deco.svg); background-repeat:no-repeat; background-position: left 480px; background-size: 200px; overflow:hidden; }
	footer .wrapper>*, footer .wrapper .colophon h2 { text-align:center; }
		footer .wrapper .newsletter { margin-bottom:50px; }
	footer .socials { margin:30px 0 20px; }
		footer .socials img { height:30px; }		
}

@media only screen and (max-width: 300px) {
	header h1 img { height:40px; }
	header nav #menuIcon img { height:40px; }
	header .stripenews h2 { font-size:12px; }
}

 }