@font-face {
  font-family: "Coneria";
  src: url("../fonts/DemoConeriaScript.eot");
  src: url("../fonts/DemoConeriaScript.eot?#iefix") format("embedded-opentype"),
    url("../fonts/DemoConeriaScript.otf") format("opentype"),
    url("../fonts/DemoConeriaScript.svg") format("svg"),
    url("../fonts/DemoConeriaScript.ttf") format("truetype"),
    url("../fonts/DemoConeriaScript.woff") format("woff"),
    url("../fonts/DemoConeriaScript.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}

body {margin:0; padding:0; border:0; height:100%; width:100%; min-width:320px; background:#f6f3e4; overflow:auto; text-align:center; font-family:'Open Sans', sans-serif; color:#4a4a4a; font-size:15px; font-weight:lighter;}
p, form {margin:0; padding:0;}
input:focus, select:focus, textarea:focus, a:focus {outline:0;}
img {border:none; border:0;}
.clear {clear:both}
#waiting {position:fixed; top:0; left:0; width:100%; height:100%; background:#000000 url(../image/loader.gif) no-repeat center center; z-index:999999999; opacity:.6; filter:alpha(opacity=60); display:none}
#start {position:absolute; top:100%; left:0; width:1px; height:1px; visibility:hidden; background:none; border:none;}
#startPage {position:absolute; top:0; left:0; width:1px; height:1px; background:none; border:none; visibility:hidden}
.bgPage, .bgPageCover {position:fixed; top:0; left:0; width:100%; height:100%; background-color:#ffffff; background-position:center center; background-repeat:no-repeat; background-size:cover; z-index:-10;}
.bgPage {background-image:url(../image/bgPage.jpg)}
.bgPageCover {opacity:0.8;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";filter:alpha(opacity=80);z-index:-9}


/* cookie banner */
#cookie_banner {position:fixed; bottom:10px; right:10px; width:300px; padding:0; background:url(../image/transp.png) repeat; border:2px solid #ffffff; box-shadow:#000000 0px 0px 5px; -webkit-box-shadow:#000000 0px 0px 5px; -moz-box-shadow:#000000 0px 0px 5px; border-radius:5px 5px 5px 5px; -webkit-border-radius:5px 5px 5px 5px; -moz-border-radius:5px 5px 5px 5px; cursor:default; z-index:999999999;}
#cookie_banner p {position:relative; width:280px; margin:10px; font-size:13px; font-weight:lighter; text-align:justify; color:#dddddd;}
#cookie_banner .close {position:relative; margin:0; padding:3px 10px 3px 10px; border-radius:0 0 5px 5px; -webkit-border-radius:0 0 5px 5px; -moz-border-radius:0 0 5px 5px; background-color:#97834f; border-top:dotted 1px #ffffff; font-weight:bold; font-size:16px; text-shadow:#303030 -1px -1px 1px; color:#ffffff; cursor:pointer;}
#cookie_banner a:link, #cookie_banner a:active, #cookie_banner a:visited {fontweight:normal; color:#ffffff; text-decoration:none; border-bottom:solid 1px #97834f;}
#cookie_banner a:hover {color:#ffffff; text-decoration:none; border:none;}

/* toppage */
#toppage {position:fixed; top:0; left:0; width:100%; line-height:30px; background:#323232; color:#eeeeee; font-size:11px; box-shadow:#000000 0px 5px 20px; z-index:1000}
#toppage .right {height:30px; top:0; background:#97834f url(../image/down2.png) no-repeat right center; font-size:15px; letter-spacing:2px; cursor:pointer; z-index:10}
#toppage .right #langHidden {position:absolute; top:30px; width:100%; background:#97834f; display:none; z-index:10}
#toppage .right #langHidden p:hover {background:#505050}
#toppage .left {position:relative}
#toppage .left a:link, #toppage .left a:active, #toppage .left a:visited {color:#eeeeee; text-decoration:none; border-bottom:dotted 1px #97834f}
#toppage .left a:hover {color:#eeeeee; text-decoration:none; border-bottom:solid 1px #97834f}
#toppage .left img {position:relative; height:14px; margin:5px 5px -5px 10px;}
@media screen and (min-width:800px){
   #toppage {height:30px}
   #toppage .right {position:absolute; width:200px; right:10px;}
   #toppage .left {text-align:left}
   #toppage .left #br {display:none}
}
@media screen and (max-width:799px){
   #toppage {height:60px}
   #toppage .right {position:relative; width:100%;}
   #toppage .left {text-align:center}
   #toppage .left #br {display:none}

}
@media screen and (max-width:600px){
   #toppage {height:90px}
   #toppage .left #br {display:block}
}

/* menu */
#deskmenu {position:fixed; top:0; left:0; width:250px; height:100%; background:url(../image/transp2.png) repeat; box-shadow:#000000 5px 0px 20px; text-align:center; color:#ffffff; font-size:20px; line-height:40px; overflow:auto; z-index:500;}
#deskmenu #logo {position:relative; width:200px; margin:0 auto 30px auto;}
#deskmenu #logo img {position:relative; width:100%}
#deskmenu .menuItem {position:relative; width:230px; margin:10px auto 0 auto; border-bottom:dotted 1px #cccccc}
#deskmenu .menuItem:hover {background:#97834f; cursor:pointer; border-bottom:solid 1px #cccccc}
#deskmenuOpen, #deskmenuBack {position:fixed; width:50px; height:50px; left:0; background-color:#97834f; background-repeat:no-repeat; background-position:center center; cursor:pointer; z-index:500}
#deskmenuOpen {background-image:url(../image/forward.png)}
#deskmenuBack {background-image:url(../image/back.png)}

@media screen and (min-width:800px){
   #deskmenu #logo img {margin:50px 0 0 0;}
   #deskmenuOpen, #deskmenuBack {top:30px; display:none}
   #deskmenu {display:block}
}
@media screen and (max-width:799px){
   #deskmenu #logo img {margin:80px 0 0 0}
   #deskmenu {display:none}
   #deskmenuOpen, #deskmenuBack {top:60px; display:block}

}
@media screen and (max-width:600px){
   #deskmenu #logo img {margin:110px 0 0 0;}
   #deskmenuOpen, #deskmenuBack {top:90px}
}

/* booking Tool */
#bookingTool, #openBookingTool {right:0;}
#bookingTool {position:absolute; width:300px}
#openBookingTool {position:fixed; width:220px; z-index:500}
#bookingTool .top {position:relative; width:100%; height:50px; color:#ffffff; font-weight:normal; font-size:16px; line-height:25px; cursor:pointer;}
#bookingTool .top .left, #bookingTool .top .right {position:relative; margin:0; padding:0; width:50%; height:100%;}
#bookingTool .top .left {background:url(../image/transp.png) repeat; float:left}
#bookingTool .top .right {background:url(../image/transp2.png) repeat; float:right}
#bookingTool .bottom {position:relative; width:270px; margin:0; padding:15px; background:url(../image/transp.png) repeat;}
#bookingTool .bottom form {position:relative; width:100%; margin:0; padding:0; background:none; color:#ffffff; text-align:left;}
#bookingTool .bottom input, #bookingTool .bottom select {position:relative; width:100%; height:35px; line-height:35px; border:solid 1px #97834f; background:#ffffff; color:#454545; padding:0 10px 0 10px; font-weight:bold; font-size:18px;}
#bookingTool .bottom input {margin:3px 0 16px 0;}
#bookingTool .bottom select {margin:3px 0 0 0;}
#bookingTool .bottom .submit {background:#97834f; color:#ffffff; letter-spacing:2px; margin:10px auto 10px auto; font-size:15px; font-weight:normal}
#bookingTool .bottom .submit:hover {background:none; border:solid 1px #ffffff; color:#ffffff; cursor:pointer}
#bookingTool .bottom #tableBooking {display:none;}
#bookingTool .bottom #tableBooking table {position:relative; margin:0 auto 0 auto; width:100%; color:#ffffff;}
#bookingTool .bottom #tableBooking td {position:relative; width:33%; text-align:left; font-size:15px; font-style:italic}
#bookingTool .bottom .radio {position:relative; margin:3px 0 16px 0; width:30px; height:30px; border:solid 1px #97834f; background-color:#ffffff; background-position:center center; background-repeat:no-repeat; cursor:pointer}
#openBookingTool {height:50px; line-height:50px; background:url(../image/transp.png) repeat; cursor:pointer; color:#ffffff; font-size:16px; letter-spacing:2px; font-weight:bold; display:none;}
#openbookingTool .left {position:absolute; width:50px; height:100%; top:0; left:0; background:#97834f url(../image/down.png) no-repeat center center}
@media screen and (min-width:800px){
   #bookingTool, #openBookingTool {top:40px}
   #bookingTool {display:block}
   #openBookingTool {display:none}
}
@media screen and (max-width:799px){
   #bookingTool, #openBookingTool {top:70px}
   #bookingTool {display:none}
   #openBookingTool {display:block}
}
@media screen and (max-width:600px){
   #bookingTool, #openBookingTool {top:100px}
}



/* content */
#content {position:relative; width:100%; margin:0; top:100%; padding:0}
#content .sep {position:relative; margin:15px auto 15px auto; width:50%; min-width:250px;}
#content .sep img {position:relative; width:100%; margin:0;}
#content .cnt {position:relative; width:96%; margin:0; padding:50px 2% 50px 2%; font-size:25; font-style:italic; line-height:40px;}
#content .cnt .title {position:relative; margin-bottom:30px; color:#000000; font-family:'coneria', sans-serif; font-size:60px; font-weight:normal; letter-spacing:2px}
#content .cnt .button {position:relative; margin:20px auto 20px auto; width:250px; height:45px; line-height:45px; border:solid 2px #301f15; color:#301f15; font-size:22px;}
#content .cnt .button:hover {color:#ffffff; background:#301f15; cursor:pointer}


/* gallery */
#content .cnt .thumb {position:relative; background-position:center center; background-repeat:no-repeat; background-size:cover; cursor:pointer;}
#content .cnt .thumb:hover {box-shadow:#000000 0px 0px 20px;}


#content .cnt .thumb .cap {position:absolute; width:100%; bottom:0; left:0; background:url(../image/transp.png) repeat; font-size:13px; font-style:normal; color:#ffffff; text-shadow:#000000 2px 2px 2px;}
@media screen and (min-width:900px){
   #content .cnt .thumb {width:23%; margin:20px 1% 20px 1%; float:left;}
}
@media screen and (max-width:899px){
   #content .cnt .thumb {width:31.3%; margin:20px 1% 20px 1%; float:left;}
}
@media screen and (max-width:700px){
   #content .cnt .thumb {width:48%; margin:20px 1% 20px 1%; float:left;}
}
@media screen and (max-width:500px){
   #content .cnt .thumb {width:100%; margin:30px auto 30px auto; float:none;}
}

#bgGallery {position:fixed; width:100%; height:100%; top:0; left:0; background:url(../image/transp.png) repeat; z-index:1000; display:none; cursor:pointer}
.galleryImg {position:fixed; top:50%; left:50%; width:100%; max-width:1200px; z-index:1010; visibility:hidden; cursor:pointer}


/* servizi */
#servizi {position:relative; width:96%; margin:0; padding:50px 2% 50px 2%;}
#servizi .box {position:relative; cursor:pointer}
@media screen and (min-width:930px){
   #servizi .box {width:30%; margin:0px 1.65% 0px 1.65%; float:left}
}
@media screen and (max-width:929px){
   #servizi .box {width:100%; margin:30px auto 0px auto; float:none}
}
#servizi .box .title {position:relative; margin:0 auto 0 auto; font-family:'coneria', sans-serif; font-size:35px; font-weight:normal; text-align:left; letter-spacing:2px}
#servizi .box img {position:relative; width:100%; margin:10px 0 10px 0}
#servizi .box .txt {position:relative; font-size:13px; font-weight:lighter; letter-spacing:2px; line-height:18px; text-align:justify;}


/* eventi & offerte */
#eventi {position:relative; width:96%; margin:0; padding:50px 2% 50px 2%;}
#eventi .box {position:relative; cursor:pointer}
@media screen and (min-width:595px){
   #eventi .box {width:47%; margin:30px 1.5% 30px 1.5%; float:left}
}
@media screen and (max-width:594px){
   #eventi .box {width:100%; margin:30px auto 0px auto; float:none}
}
#eventi .box .title {position:relative; margin:0 auto 0 auto; font-size:35px; font-weight:bold; color:#000000}
#eventi .box .subtitle, #eventi .box .subtitle2  {position:relative; margin:0 auto 0 auto; font-weight:normal; font-style:italic}
#eventi .box .subtitle {font-size:30px}
#eventi .box .subtitle2 {font-size:22px}
#eventi .box img {position:relative; width:100%; margin:10px 0 10px 0}
#eventi .box .txt {position:relative; font-size:13px; font-weight:lighter; letter-spacing:2px; line-height:18px; text-align:justify;}
#eventi .button {position:relative; width:250px; height:35px; line-height:35px; border:solid 1px #301f15; color:#301f15; left:100%; margin:10px 0 0 -250px;}
#eventi .button:hover {background:#301f15; color:#ffffff; cursor:pointer;}






/* escursioni */
#escursioni {position:relative; width:96%; margin:0; padding:50px 2% 50px 2%;}
#escursioni .box {position:relative; cursor:pointer}
@media screen and (min-width:900px){
   #escursioni .box {width:22%; margin:30px 1.5% 30px 1.5%; float:left}
}
@media screen and (max-width:899px){
   #escursioni .box {width:47%; margin:30px 1.5% 20px 1.5%; float:left}
}
@media screen and (max-width:400px){
   #escursioni .box {width:100%; margin:30px auto 0px auto; float:none}
}
#escursioni .box .title {position:absolute; bottom:0; left:0; width:100%; background:url(../image/transp.png) repeat; font-size:20px; color:#ffffff; text-shadow:#000000 1px 1px 1px; font-weight:bold}
#escursioni .box img {position:relative; width:100%; margin:0}
#escursioni .button {position:relative; width:250px; height:35px; line-height:35px; border:solid 1px #301f15; color:#301f15; left:100%; margin:10px 0 0 -250px;}
#escursioni .button:hover {background:#301f15; color:#ffffff; cursor:pointer;}


/* contatti */
#contatti {position:relative; width:96%; margin:0; padding:100px 2% 50px 2%; font-size:18px; letter-spacing:2px; line-height:30px;}
#contatti a:link, #contatti a:active, #contatti a:visited {color:#4a4a4a; text-decoration:none; border-bottom:dotted 1px #b06e39}
#contatti a:hover {color:#4a4a4a; text-decoration:none; border-bottom:solid 1px #b06e39}
#contatti form {position:relative; width:90%; min-width:250px; max-width:500px; padding:10px; border:solid 2px #ffffff; box-shadow:#000000 0px 0px 10px; border-radius:5px; margin:10px auto 10px auto; background:url(../image/transp.png) repeat; text-align:left; color:#ffffff;}
#contatti form .required {color:#ff0000}
#contatti form a:link, #contatti form a:active, #contatti form a:visited {color:#ffffff; text-decoration:none; border-bottom:dotted 1px #b06e39}
#contatti form a:hover {color:#ffffff; text-decoration:none; border-bottom:solid 1px #b06e39}
#contatti form input, #contatti form textarea {position:relative; width:100%; margin:0 0 15px 0; border:solid 1px #b06e39; font-family:'Open Sans', sans-serif; color:#4a4a4a; background:#ffffff;}
#contatti form input {height:30px; line-height:30px; padding:0 5px 0 5px;}
#contatti form textarea {height:150px; line-height:normal; padding:5px; overflow:auto; resize:none;}
#contatti form .submit {margin:15px 0 0 0; cursor:pointer; background:none; color:#ffffff; font-size:18px; letter-spacing:2px; border:solid 1px #ffffff;}
#contatti form .submit:hover {background:#ffffff; color:#4a4a4a;}
#contatti form .error {border:solid 1px #b90000; background:#ffa0a0;}


/* why us */
#whyus {position:relative; width:96%; margin:0; padding:50px 2% 50px 2%;}
#whyus img {position:relative; width:90%; max-width:550px; margin:0 auto 0 auto;}


/* booking */
#contatti .riepilogo {position:relative; width:80%; min-width:250px; padding:10px; border:solid 1px #ffffff; box-shadow:#000000 0px 0px 10px; border-radius:5px; margin:30px auto 30px auto; background:url(../image/transp.png) repeat; text-align:left; color:#ffffff; font-size:13px; text-align:center}


/* policies */
#contatti .title {margin:30px 0 15px 0; color:#000000; font-weight:bold; font-size:22px; text-align:left;}
#contatti .txt {text-align:justify;}



/* footer */
#footer {position:relative; width:96%; margin:0; padding:20px 2% 20px 2%; background:#454545; color:#ffffff; font-size:12px; font-weight:lighter;}
#footer a:link, #footer a:active, #footer a:visited {color:#ffffff; text-decoration:none; border-bottom:dotted 1px #b06e39}
#footer a:hover {color:#ffffff; text-decoration:none; border-bottom:solid 1px #b06e39}
#footer .sharing {position:relative; margin:20px auto 20px auto; width:100%;}
#footer .sharing img {position:relative; display:inline; width:35px; margin:0 5px 0 5px; border-bottom:solid 1px #cccccc; border-right:solid 1px #cccccc; box-shadow:#000000 -1px -1px 1px; border-radius:100%;}
#footer .sharing img:hover {border:none; border-top:solid 1px #cccccc; border-left:solid 1px #cccccc; box-shadow:#000000 1px 1px 1px; border-radius:100%;}
#footer .sharing a:link, #footer .sharing a:active, #footer .sharing a:visited, #footer .sharing a:hover {border:none;}