@import url(https://fonts.googleapis.com/css?family=Dosis:400,600);

/* *********
RESET CSS
********* */
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, font, 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, legend, label,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    /*vertical-align: baseline; HO DOVUTO TOGLIERLO PER ALLINEARE MIDDLE LE IMMAGINI NELLE TABELLE*/ 
    background: transparent;
}
body {
    /*line-height: 0;*/
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
:focus {
    outline: 0;
}
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}
p {
	line-stacking: 4em;
}
/* FINE DEL RESET */














@media all{
	#clear_left {
		clear:left;
	}
	#clear_right {
		clear:right;
	}
	.clear_left {
		clear:left;
	}
	.clear_right {
		clear:right;
	}
	.clear_both{
		clear: both;
	}
	html{
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
	}
	body{
		/*line-height: 1em;*/ /*se lo tolgo si allina meglio tutto sotto alle immagini */
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-size: 17px;
		font-family: 'Dosis', sans-serif;
		background:#fafafa;
		width:100%;
		color:#252525;
		overflow-x: hidden;
	}
	img{
		border:0;
		max-width:100%;
		max-height: 100%;
	}

	.fullWidth{width:100%;}
	.fullWidth img{width:100%;}
	
	.hbox50left{float: left;}
	.hbox50right{float: right; }
	
    /*.fontweight200{font-weight: 200;}*/ /* Extra Light */
    /*.fontweight300{font-weight: 300;}*/ /* Light */
	.fontweight400{font-weight: 400;} /* Normal */
    /*.fontweight500{font-weight: 500;}*/ /* Medium */
	.fontweight600{font-weight: 600;} /* Semi Bold */
    /*.fontweight700{font-weight: 700;}*/ /* Bold */
    /*.fontweight900{font-weight: 900;}*/ /* Ultra Bold */
	
	h2{
		padding: 0;
		margin: 0 0 10px 0;
		font-size: 26px;
        font-weight: 600;
        color: #252525;
		line-height: 1.1em;
	}
	


	
    .color412204{color:#252525;}
	.color412204 a, .color412204 a:link{ color:#252525; text-decoration:none;}
	.color412204 a:hover, .color412204 a:focus, .color412204 a:active{color: #252525;}
    
    .color043e23{color:#252525;}
	.color043e23 a, .color043e23 a:link{ color:#252525; text-decoration:none;}
	.color043e23 a:hover, .color043e23 a:focus, .color043e23 a:active{color: #252525;}
	
	.colorexplico{color:#24a1a3;}
	.colorexplico a, .colorexplico a:link{ color:#24a1a3; text-decoration:none;}
	.colorexplico a:hover, .colorexplico a:focus, .colorexplico a:active{color: #24a1a3;}
	

    
    
    
	.container{
        font-weight: 400;
		max-width:968px;
		width:100%;
		margin:0 auto;
		line-height: 1em;
		/*background-color: #369;*/
	}
    .testounico{
		line-height: 1.5em;
		margin: 30px 0;
	}
    /* FASCIA MENU*/
    .logo{
        float: left;
        width: 210px;
        padding: 10px 0;
    }
    .linguasocial{
        float: left;
        width: 758px;
        padding: 10px 0 40px 0;
        text-align: right;
    }
    .menu{
        float: left;
        width: 758px;
        padding: 0 0 0 0;
    }
	.menu #grup-menu{
		text-align: right;
	}
		ul#link {
			list-style: none;
		}
		ul#link li {
			margin:0;
			padding:0;
			display:inline-block;
			position: relative;
		}
		ul#link li a {
			text-decoration:none;
			margin:0 0 0 0;
			padding: 0px 10px 20px 10px;
			font-size: 20px;
			color:#043e23;
            border-right: solid 1px #98c2b2;
		}
            ul#link li:last-child a {
                padding: 0px 0 20px 10px;
                border-right: none;
            }
		ul#link li a:hover {
			color:#f00;
		}
		ul#link ul {
			margin:18px 0 0 0;
			padding:0;
			display:inline-block;
			list-style: none;
			display: none; 
			position: absolute;
			top: 18px;
			left: 0;
			z-index:9999;
			background-color: #17629f;
			text-align: left;
		}
		ul#link li:hover > ul {
			display: block;
			visibility: visible; /* da tenere per evitare che scompaia il "li" con il solo display*/
			border-left: solid 30px #17629f;
			border-right: solid 30px #17629f;
			border-top: solid 15px #17629f;
			border-bottom: solid 15px #17629f;
		}
		ul#link ul li {
			float: none;
			display: block;
			border: 0;
			border-bottom: solid 1px #ffd540;
		}
		ul#link ul li:last-child{
			border-bottom: none;
		}
		ul#link ul a {
			padding:15px 0;
			width: auto;
			display: block;
			white-space: nowrap;
			float: none;
			text-transform: none;
			font-size: 22px;
		}
		ul#link ul a:hover{
			/*background-color: #00305f;*/
			color:#ffd540;
		}
		.show-menu{
			cursor: pointer;
			text-decoration:none;
			color:#fff;
			background:#1a181b;
			text-align:center;
			padding:10px 0;
			display:none;
			/*font-weight: 200;*/
			font-size: 20px;
		}
		#grup-menu input[type=checkbox]{
			display:none;
			-webkit-appearance:none;
		}
		#grup-menu input[type=checkbox]:checked ~ #link{
			display: block;
		}
		
    /* FINE FASCIA MENU */

    
    /* IMMAGINONA HOME */
    .immaginonahome{
        width: 100%;
        height: 520px;
        background-image: url(/res/img/rotate/01.jpg);
        background-position: 50% 0;
        background-repeat: no-repeat;
        /*background-color: #159;*/
    }
    /* FINE IMMAGINONA HOME */
    /* FASCIA PRENOTA */
    .fasciaperonta{
        background-color: #d8e9fa;
        text-align: center;
        padding: 32px 0;
		font-size: 14px;
    }
	input[type=text],
	input[type=password],
	input[type=email],
	input[type=tel],
	textarea,
	select{
		font-family: 'Dosis', sans-serif;
		font-size: 15px;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border: 1px solid #cccccc;
	}
	/*.mmm{
		margin:10px 10px 10px 0;
		padding: 10px;
		width:200px;
	}*/
	.InputCheckin{
		margin:5px 2px;
		padding: 6px;
		width:85px;
	}
	.InputOspiti{
		margin:5px 2px;
		padding: 6px;
		width:70px;
	}
	.InputCheckinGrandi{
		margin:5px 2px;
		padding: 6px;
		width:125px;
	}
	
	.pulsante{
		max-width:320px;
		width:100%;
		margin:0 auto;
		padding: 10px 20px;
		background-color: #09a7cc;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		text-align: center;
		line-height: .9em;
	}
    .pulsante{text-decoration: none; color:#fff;font-family: 'Dosis', sans-serif; font-size: 30px;}
	.pulsante a, .pulsante a:link{ color:#fff; text-decoration:none;}
	.pulsante a:hover, .pulsante a:focus, .pulsante a:active{color: #fff;}
	.pulsante .socntodel{font-size: 18px;}
    /* FINE FASCIA PRENOTA */
    
    /* FASCIA TITOLO */
    .fasciatitolo{
        text-align: center;
        background-color: #7d6c34;
        padding: 22px 0;
        font-size: 28px;
        font-weight: 600;
		color: #fff;
    }
    /* FINE FASCIA TITOLO */
	
    /* BOX */
    .box50{width: 50%;}
    .paddinginternobox{
        line-height: 1.5em;
        padding: 30px;
    }
    /* FINE BOX*/
	
    /* GALLERY */
	.gallery{
		padding: 10px 0 0 0;
	}
	.gallery .foto{
		position: relative;
		float: left;
		width: 316px;
		margin: 0 10px 10px 0;
		padding: 0;
		
	}
	.gallery .foto:nth-child(3n+3){
		margin: 0 0 10px 0;
		/*border-bottom: solid 5px #159;*/
	}
	.zoomhover{
		text-decoration: none;
		position:absolute;
		display:block;
		top:0;
		bottom:0;
		left:0;
		right:0;
		color: #fff;
		overflow: hidden;
		background-image: url(/res/img/zoom.png);
		background-position: 50% -80px;
		background-repeat: no-repeat;
	}
	.zoomhover:hover{
		color: #fff;
		display: block;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease; 
		transition: all 0.3s ease;
		background-color:rgba(36, 41, 49, 0.95);
		background-position: 50% 50%;
	}
	.zoomphoto{
		padding: 0 0 10px 0;
		display: none;
	}
	

.zoomphoto_rem {
	padding: 0 0 10px 0;
	display: none;
	/*text-align: center;*/
	-webkit-transform: scale(0);
			transform: scale(0);
	opacity: 0;
	-webkit-transition: opacity .3s ease-in-out, -webkit-transform .3s ease-in-out;
	transition: opacity .3s ease-in-out, -webkit-transform .3s ease-in-out;
	transition: transform .3s ease-in-out, opacity .3s ease-in-out;
	transition: transform .3s ease-in-out, opacity .3s ease-in-out, -webkit-transform .3s ease-in-out;
}
.zoomphoto.active {
  display: block;
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: 1;
}
.zoomphoto.active.good {
  -webkit-animation: anim .3s ease-in-out;
          animation: anim .3s ease-in-out;
}
	/* FINE GALLERY */
    
/* FASCIA BOTTOM */
	.fasciabottom{
        /*position: relative;*/
        width: 100%;
        padding: 20px 0;
        margin: 0 0 0 0;
        line-height: 1.3em;
		font-size: 16px;
		text-align: center;
		background-color: #dadada;
	}
	/*.containerbottom{
		position:absolute;
		top:0;
		bottom:0;
		left:50%;
		margin-left: -484px;
		background-color: #fff;
	}*/
	/*.bottomdati{
        padding: 20px 0;
        margin: 0 0 0 0;
        line-height: 1.3em;
		font-size: 16px;
		text-align: center;
		background-color: #dadada;
	}*/
	.sottobottom{
		width: 100%;
		padding: 20px 0 30px 0;
		font-size: 14px;
	}
	.bbsx{
		float: left;
		width: 70%;
		line-height: 1.1em;
	}
	.bbdx{
		float: left;
		width: 30%;
		text-align: right;
		line-height: 1.1em;
	}
/* FINE FASCIA BOTTOM */



/*  SLIDE  */
	/* G A L L E R Y   H O M E */
	#sfondo{
		width:100%;
		position: relative;
		/*position: absolute;*/
		/*z-index: 1;*/
		/*top: 95px;*/
	}
	#gallery {
		max-width: 100%;
		height: 520px;
	}

		.slideimg {
			width: 100%;
			max-width: inherit;
			height: 100%;
			background:  no-repeat;
			background-position: 50% 0;
			margin: 0;
		}
		.slide {
			opacity: 0; 
			filter:alpha(opacity=0);
			position: absolute;
			top: 0;
			left: inherit;
		}
		.showMe {
			opacity: 1;
			filter:alpha(opacity=100);
		}
	/* F I N E   G A L L E R Y   H O M E */
	/* F R E C C E */
	#frecce{
		display: block;
		top: 310px;
		position: absolute;
		z-index:9;
		width:100%;
		padding:0;
		margin:0;
	}
	#containerfercce{
		min-width: 300px;
		max-width: 1250px;
		margin: 0 auto;
		padding: 0 0 0 0;
		text-align: left;
		line-height: 1em;
	}
	/* F I N E   F R E C C E */
/*  FINE SLIDE  */
    
	
	.loghi{
		padding: 20px 0 0 0;
	}
}





























@media all and (max-width: 1020px){
	body{font-size: 16px;}
	.container{max-width:698px;}
	h2{
		font-size: 22px;
	}
    /* FASCIA MENU */
    .logo{
        width: 190px;
        padding: 20px 0;
    }
    .linguasocial{
        width: 508px;
        padding: 10px 0 26px 0;
    }
    .menu{
        width: 508px;
    }
		ul#link li a {
			padding: 0px 9px 18px 9px;
			font-size: 18px;
		}
		ul#link li:last-child a {
			padding: 0px 0 18px 9px;
		}

	
    /* FINE FASCIA MENU */
	
    .paddinginternobox{
        line-height: 1.1em;
        padding: 15px;
    }
	
	
/* GALLERY */
	/*.gallery{padding: 10px 0 0 0;}*/
	.gallery .foto{
		width: 226px;
		/*margin: 0 10px 10px 0;
		padding: 0;*/
	}
	.gallery .foto:nth-child(3n+3){
		/*margin: 0 0 10px 0;*/
	}
/* FINE GALLERY */
	
	
/* FASCIA BOTTOM */
	/*.containerbottom{
		margin-left: -350px;
	}*/
	/*.bottomdati{
		width: 320px;
        padding: 15px;
	}*/

	.bbsx{
		float: left;
		width: 70%;
		line-height: 1.1em;
	}
	.bbdx{
		float: left;
		width: 30%;
		text-align: right;
		line-height: 1.1em;
	}
/* FINE FASCIA BOTTOM */

}























@media all and (max-width: 760px){
	body{font-size: 18px;}
	.container{max-width:460px;}
	.hbox50right{float: left;}
    /* FASCIA MENU */
    .logo{
        width: 180px;
    }
    .linguasocial{
        width: 280px;
        padding: 10px 0 0 0;
    }
    .menu{
        width: 100%;
        padding: 10px 0 22px 0;
    }
		ul#link li a {
			padding: 0px 8px 16px 8px;
			font-size: 17px;
		}
		ul#link li:last-child a {
			padding: 0px 0 16px 8px;
		}
    /* FINE FASCIA MENU */
    /* BOX */
    .box50{width: 100%;}
    .paddinginternobox{
        /*line-height: 1.3em;*/
        padding: 20px 0;
    }
    /* FINE BOX*/
	
	
/* GALLERY */
	/*.gallery{padding: 10px 0 0 0;}*/
	.gallery .foto{
		width: 146px;
		/*margin: 0 10px 10px 0;
		padding: 0;*/
	}
	.gallery .foto:nth-child(3n+3){
		/*margin: 0 0 10px 0;*/
	}
/* FINE GALLERY */

/* FASCIA BOTTOM */
	/*.containerbottom{
		position:relative;
		top: auto;
		bottom: auto;
		left:0;
		margin-left:0;
		background-color: transparent;
		max-width:460px;
		width:100%;
		margin:0 auto;
	}*/
	/*.bottomdati{
		width: 100%;
		margin: 20px 0 0 0;
		padding: 0;
		text-align: center;
	}*/
	.sottobottom{
		width: 100%;
		padding: 20px 0 20px 0;
		font-size: 12px;
	}
	.bbsx{
		float: none;
		width: 100%;
		text-align: center;
	}
	.bbdx{
		float: none;
		width: 100%;
		text-align: center;
		padding: 10px 0 0 0;
	}
/* FINE FASCIA BOTTOM */
}
























@media all and (max-width: 520px){
	body{font-size: 16px;}
	.container{max-width:320px;}


/*  SLIDE  */
	/* G A L L E R Y   H O M E */

	#gallery {
		/*max-width: 100%*/
		height: 200px;
	}
		.slideimg {
			/*width: 100%;
			max-width: inherit;
			height: 100%;
			background:  no-repeat;*/
			/*background-position: 50% 0;*/
			background-size: cover;
		}

	/* F I N E   G A L L E R Y   H O M E */
	/* F R E C C E */
	#frecce{
		/*display: block;*/
		top: 350px;
		/*position: absolute;
		z-index:9;
		width:100%;
		padding:0;
		margin:0;*/
	}

	/* F I N E   F R E C C E */

    /* FASCIA MENU */
    .logo{
        width: 100%;
        text-align: center;
        padding: 5px 0;
    }
    .linguasocial{
        width: 100%;
        padding: 5px 0;
        text-align: center;
    }
    .menu{
        line-height: 1em;
        width: 100%;
        padding: 10px 0 0 0;
    }
		.show-menu{
			display:block;
			visibility: visible;
			background-color: #00305f;
			border-bottom: solid 1px #fff;
		}
		ul#link {
			display:none;
			list-style: none;
		}
		ul#link li {
			margin:0;
			padding:0 0;
			float:none;
			display: block;
			position: relative;
			text-align: center;
			background-color: #00305f;
			border-bottom: solid 1px #fff;
		}
		ul#link li a {
			color:#fff;
			border-bottom: none;
			border-right: none;
            padding:10px 0;
			font-size: 18px;
			display: block;
			white-space: nowrap;
			float: none;
			text-transform: none;
		}
            ul#link li:last-child a {
                padding:10px 0;
            }
		ul#link li a:hover {
			color:#fff;
			border-bottom: none;
			background-color: #009ee1;
			border-bottom: none;
			/*background-color: #034a72;*/
		}
		ul#link ul {
			margin:0 0 0 0;
			padding:0;
			display:inline-block;
			list-style: none;
			display: none;
			position: relative;
			top: 0;
			left: 0;
			z-index:9999;
			background-image: none;
		}		
		ul#link li:hover > ul {
			display: block;
			visibility: visible; /* da tenere per evitare che scompaia il "li" con il solo display*/
			border: none;
			
			
		}
		ul#link ul li {
			/*background-color: #009ee1;*/
			/*-webkit-border-radius: 0px;
			-moz-border-radius: 0px;
			border-radius: 0px;*/
			background-color: #17629f;
		}
		ul#link ul a {
			padding:10px 10px; 
			text-transform: none;
		}
		ul#link ul a:hover {
			background-color: #009ee1;
			color:#fff
		}
		ul#link ul ul {
			top: 0;
			left: 0;
			margin: 0;
		}
    /* FINE FASCIA MENU */
	
/* GALLERY */
	.gallery .foto{
		width: 100%;
		margin: 0 0 10px 0;
	}
	.zoomhover{ display:none;}
	.zoomhover:hover{display: none;}
/* FINE GALLERY */
	
	.immaginonahome{
		display: none;
	}

    
}















@media all and (max-width: 380px){
	body{font-size: 14px;}
	.container{
		max-width:92%;
		padding: 0 4%;
	}

}






@-webkit-keyframes anim {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes anim {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
