// Core variables and mixins
@import "/bootstrap3.2.0/less/variables.less";
@import "/bootstrap3.2.0/less/mixins.less";

// Reset and dependencies
@import "/bootstrap3.2.0/less/normalize.less";
@import "/bootstrap3.2.0/less/print.less";
@import "/bootstrap3.2.0/less/glyphicons.less";

// Core CSS
@import "/bootstrap3.2.0/less/scaffolding.less";
@import "/bootstrap3.2.0/less/type.less";
@import "/bootstrap3.2.0/less/code.less";
@import "/bootstrap3.2.0/less/grid.less";
@import "/bootstrap3.2.0/less/tables.less";
@import "/bootstrap3.2.0/less/forms.less";
@import "/bootstrap3.2.0/less/buttons.less";

// Components
@import "/bootstrap3.2.0/less/component-animations.less";
//@import "/bootstrap3.2.0/less/dropdowns.less";
@import "/bootstrap3.2.0/less/button-groups.less";
@import "/bootstrap3.2.0/less/input-groups.less";
//@import "/bootstrap3.2.0/less/navs.less";
//@import "/bootstrap3.2.0/less/navbar.less";
//@import "/bootstrap3.2.0/less/breadcrumbs.less";
@import "/bootstrap3.2.0/less/pagination.less";
@import "/bootstrap3.2.0/less/pager.less";
@import "/bootstrap3.2.0/less/labels.less";
//@import "/bootstrap3.2.0/less/badges.less";
//@import "/bootstrap3.2.0/less/jumbotron.less";
//@import "/bootstrap3.2.0/less/thumbnails.less";
//@import "/bootstrap3.2.0/less/alerts.less";
//@import "/bootstrap3.2.0/less/progress-bars.less";
@import "/bootstrap3.2.0/less/media.less";
//@import "/bootstrap3.2.0/less/list-group.less";
//@import "/bootstrap3.2.0/less/panels.less";
@import "/bootstrap3.2.0/less/responsive-embed.less";
//@import "/bootstrap3.2.0/less/wells.less";
@import "/bootstrap3.2.0/less/close.less";

// Components w/ JavaScript
@import "/bootstrap3.2.0/less/modals.less";
@import "/bootstrap3.2.0/less/tooltip.less";
@import "/bootstrap3.2.0/less/popovers.less";
@import "/bootstrap3.2.0/less/carousel.less";

// Utility classes
@import "/bootstrap3.2.0/less/utilities.less";
@import "/bootstrap3.2.0/less/responsive-utilities.less";

@body-bg: #fff;
@link-color: #444;
@text-color: #444;
@font-family-sans-serif: "Nanum Gothic";
@font-size-base: 16px;
@color-form: #333;
@blu: #1d335f;

@corsivo: "Marcellus";

@corsivo-2: "Mr Dafoe";

.corsivo {
	font-family: "Marcellus";
}

.corsivo-2 {
	font-family: "Mr Dafoe";
}

.blu {
	color: @blu;
}

.ui-widget {
	font-family: @font-family-sans-serif !important;
}

/***************** slider top in css **********************/

//Qui inserisci il numero totale di foto che devono girare (deve corrispondere al numero di div che hai inserito)
@numFoto: 5;

//tempo di ritardo foto, ogni
@delayFoto: 4;
@duration_cross_fading: 2;
@total_animation: (@delayFoto + @duration_cross_fading) * @numFoto;

@totalDuration: unit((@numFoto * @delayFoto), s);

@step1: 0%;
@step2: (@delayFoto / @duration_cross_fading) * 100%;
@step3: ((@delayFoto + @duration_cross_fading) / @total_animation) * 100%;
@step4: 100%- ((@duration_cross_fading / @total_animation) * 100%);
@step5: 100%;

@keyframes slider-top {
	@{step1} {
		opacity: 1;
	}
	@{step2} {
		opacity: 1;
	}
	@{step3} {
		opacity: 0;
	}
	@{step4} {
		opacity: 0;
	}
	@{step5} {
		opacity: 1;
	}
}

//le foto da utilizzare nello slider devono chiamarsi index-numero.jpg
.setslider(@items, @delay) {
	.loopingClass(0); // Start loop

	.loopingClass(@index) when (@index <= @items) {
		&:nth-child(@{index}) {
			animation-delay: unit((@index * @delay), s);
			background-image: url("/source/index-@{index}.jpg");
			z-index: @numFoto - @index;
		}

		.loopingClass(@index + 1); // Increment loop
	}
}

.slider-top {
	height: 100%;
	position: absolute;
	left: 0;
	right: 0;

	div {
		-webkit-animation-name: slider-top;
		-webkit-animation-timing-function: ease-in-out;
		-webkit-animation-iteration-count: infinite;
		-webkit-animation-duration: @totalDuration;
		-moz-animation-name: slider-top;
		-moz-animation-timing-function: ease-in-out;
		-moz-animation-iteration-count: infinite;
		-moz-animation-duration: @totalDuration;
		-o-animation-name: slider-top;
		-o-animation-timing-function: ease-in-out;
		-o-animation-iteration-count: infinite;
		-o-animation-duration: @totalDuration;
		animation-name: slider-top;
		animation-timing-function: ease-in-out;
		animation-iteration-count: infinite;
		animation-duration: @totalDuration;
		background-position: center top;
		background-repeat: no-repeat;
		background-size: cover;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;

		.setslider(@numFoto,@delayFoto);
	}
}

/*******************************************************/

/* BUTTON */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="image"],
textarea,
select {
	width: 100%;
	margin: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	border: none;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	display: block;
	text-indent: 5px;
}

#pgall input[type="submit"],
#pgall input[type="button"] {
	width: 100%;
	text-align: center;
	cursor: pointer;
	display: block;
	-webkit-appearance: none;
	-moz-appearance: none;
	border: none;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}

a,
a:active,
a:focus,
a:visited,
a:link,
input[type="submit"],
img,
.transition_400,
.freccia-none,
h2,
.h2,
.slick-prev,
.slick-next,
.pulsante,
.tendina-lingue,
.txt {
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
	outline: none;
}

.transition_600 {
	-webkit-transition: all 600ms ease;
	-moz-transition: all 600ms ease;
	-ms-transition: all 600ms ease;
	-o-transition: all 600ms ease;
	transition: all 600ms ease;
}

.slick-slide {
	outline: none;
}

label {
	font-weight: normal;
	margin: 0;
}

input[type="radio"],
input[type="checkbox"] {
	margin: 0;
}

/* ***************************** */

/* centrare div in verticale */

.table-box {
	display: table;
	table-layout: fixed;
	height: 100%;

	@media (max-width: @screen-xs-max) {
		display: block;
	}
}

.table-cell {
	display: table-cell;
	vertical-align: middle;
	float: none;

	@media (max-width: @screen-xs-max) {
		display: block;
	}
}

/************************************/

p {
	margin: 0;
}

ul {
	margin: 0px;
}
.h1,
.h2,
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0px;
	padding: 0px;
}

.no-pad {
	padding: 0;
}

.blk {
	max-width: 2000px;
	margin: 0 auto;
	width: 100%;

	@media (min-width: @screen-md-min) {
		padding: 0 10px;
	}

	@media (min-width: @screen-lg-min) {
		padding: 0 35px;
	}
}

.flex {
	@media (min-width: @screen-sm-min) {
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		align-items: center;
		-webkit-align-items: center;
		-moz-align-items: center;
		align-content: center;
		justify-content: center;
		-webkit-justify-content: center;
		-webkit-align-content: center;
	}
}

.container,
.container-fluid {
	max-width: 100%;
	-webkit-transition: all 600ms ease;
	-moz-transition: all 600ms ease;
	-ms-transition: all 600ms ease;
	-o-transition: all 600ms ease;
	transition: all 600ms ease;
}

.container-fluid {
	max-width: 1430px;
}

.h1,
.h2.grande,
h1,
h2.grande {
	font-size: 42px;
	line-height: 44px;
	color: #1d335f;

	.highlight {
		top: auto;
		bottom: 0;
	}

	@media (max-width: @screen-md-max) {
	}

	@media (max-width: @screen-sm-max) {
		text-align: center;
		font-size: 38px;
		line-height: 40px;
	}

	@media (max-width: @screen-xs-max) {
		font-size: 28px;
		line-height: 30px;
	}
}

.h2,
h2 {
	font-size: 40px;
	line-height: 45px;
	color: #000;

	@media (max-width: @screen-md-max) {
		font-size: 35px;
		line-height: 40px;
	}

	@media (max-width: @screen-sm-max) {
		text-align: center;
	}

	@media (max-width: @screen-xs-max) {
		font-size: 25px;
		line-height: 28px;
	}
}

h3 {
	font-size: 35px;
	line-height: 37px;
	font-weight: normal;

	@media (max-width: @screen-sm-max) {
		font-size: 30px;
		line-height: 31px;
	}

	@media (max-width: @screen-xs-max) {
		font-size: 28px;
		line-height: 29px;
	}
}

h4 {
	font-size: 28px;
	line-height: 29px;
	margin-bottom: 15px;
	font-weight: bold;
}

.divisore {
	padding-bottom: 60px;

	@media (max-width: @screen-md-max) {
		padding-bottom: 40px;
	}

	@media (max-width: @screen-sm-max) {
	}

	@media (max-width: @screen-xs-max) {
		padding-bottom: 20px;
	}
}

.colonna-negativa {
	margin-left: -8.3333333%;

	@media (max-width: @screen-sm-max) {
		margin-left: 0;
	}
}

.img-sx {
	margin-top: 30px;

	@media (max-width: @screen-sm-max) {
		margin-top: 0;
	}
}

.img-dx {
	margin-bottom: 120px;

	@media (max-width: @screen-md-max) {
		margin-bottom: 60px;
	}

	@media (max-width: @screen-sm-max) {
		margin-bottom: 40px;
	}
}

.testo {
	padding: 50px 0px;
	word-wrap: break-word;

	@media (max-width: @screen-md-max) {
		padding: 30px 10px;
	}

	@media (max-width: @screen-sm-max) {
	}

	@media (max-width: @screen-xs-max) {
		padding: 20px 10px;
	}
	.h1,
	h1 {
		margin-bottom: 30px;
	}
}

.testo-sx {
	padding-right: 30px;

	@media (max-width: @screen-sm-max) {
		padding-right: 10px;
	}

	@media (max-width: @screen-xs-max) {
		padding-right: 10px;
		text-align: center;
	}
}

.testo-dx {
	padding-left: 30px;

	@media (max-width: @screen-sm-max) {
		padding-left: 10px;
	}

	@media (max-width: @screen-xs-max) {
		padding-left: 10px;
		text-align: center;
	}
}

.col-3-negativa {
	margin-left: -25%;

	@media (max-width: @screen-sm-max) {
		margin-left: -16.66666%;
	}
}

.greyscale {
	-webkit-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	filter: gray;
	filter: grayscale(100%);
	-webkit-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;

	&:hover {
		-webkit-filter: grayscale(0%);
		-ms-filter: grayscale(0%);
		filter: grayscale(0%);
		background-color: #f8f5ef;
	}
}

.close {
	opacity: 1;
	outline: none;

	&:hover,
	&:focus {
		color: #4a4a4a;
		opacity: 1;
	}
}

.modal-open {
	padding: 0 !important;
	overflow: auto;
}

.link-mobi {
	color: #fff !important;
	font-size: 13px;
	letter-spacing: 1px;
	padding-top: 9px;
	line-height: normal;
	padding-bottom: 1px;
	height: 100%;
	text-transform: uppercase;
	display: block;
	font-weight: bold;

	span[class^="icon-"] {
		margin: 0 auto;
		margin-bottom: 4px;
		display: block;
		font-size: 30px;
	}

	img {
		margin: 0 auto;
		margin-bottom: 11px;
		display: block;
	}

	a {
		color: #fff !important;
	}
}

.result_inscr_newsl_min {
	color: #fff;
}

.arrows {
	margin-top: 60px;
	text-align: right;
	padding: 0 10px;

	@media (max-width: @screen-sm-max) {
		text-align: center;
		margin-bottom: 15px;
	}

	.max-wdt {
		width: 100%;
		max-width: 210px;
		margin: 0 auto;
	}

	img {
		display: inline-block;
		margin: 0 8px;
		margin-top: 25px;
		cursor: pointer;

		@media (max-width: @screen-xs-max) {
			margin-top: 15px;
			max-width: 40px;
		}
	}

	hr {
		border-top: #009ddc 8px solid;
		width: 100%;
		max-width: 300px;
		margin: 0 auto;
		margin-top: 75px;

		@media (max-width: @screen-sm-max) {
			margin-top: 25px;
		}

		@media (max-width: @screen-xs-max) {
			margin-top: 15px;
		}
	}
}

.box-camere {
	margin: 5px 0;

	.txt-camere {
		background-repeat: repeat-x;
		background-position: top left;
		background-image: url("/source/sf-box-camere.png");
		background-color: #eee;
		position: relative;
		font-size: 16px;
		color: #444;
		padding: 0 15px;
		padding-bottom: 30px;

		h3 {
			margin: 20px 0;
			font-size: 27px;
			line-height: 29px;

			@media (max-width: @screen-xs-max) {
				font-size: 24px;
				line-height: 26px;
			}
		}

		.esagono {
			display: block;
			margin: 0 auto;
		}

		.link {
			background-color: #1d3461;
			line-height: 50px;
			text-align: center;
			width: 100%;
			max-width: 85px;
			margin: 0 auto;
			position: absolute;
			bottom: 0;
			right: 0;
			display: block;
			left: 0;

			@media (max-width: @screen-xs-max) {
				position: relative;
				bottom: auto;
				right: auto;
				left: auto;
				margin-top: 25px;
			}
		}
	}
}

.slider-plus,
.slider-plus-home {
	text-align: center;
	color: #444;
	font-size: 15px;

	.cont-img {
		border: #829cbc 1px solid;
		border-radius: 50%;
		width: 100%;
		max-width: 80px;
		margin: 15px auto;

		span {
			color: #1d3461;
			display: block;
			line-height: 80px;
			font-size: 35px;
		}
	}

	.slick-dots {
		text-align: center;
		bottom: -20px;
	}
}

.testo-grigio {
	padding: 65px 25px;
	background-color: #eee;
	padding-left: 55px;

	@media (max-width: @screen-sm-max) {
		padding: 30px 15px;
		padding-left: 55px;
	}

	@media (max-width: @screen-xs-max) {
		padding: 25px 15px;
		padding-left: 15px;
		text-align: center;
	}

	.esagono {
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		left: -5px;

		@media (max-width: @screen-xs-max) {
			display: none;
		}
	}

	&.sx {
		padding-right: 55px;
		padding-left: 25px;

		@media (max-width: @screen-sm-max) {
			padding-left: 15px;
		}

		@media (max-width: @screen-xs-max) {
			padding-right: 15px;
		}

		.esagono {
			left: auto;
			right: -5px;
		}
	}

	h3 {
		margin-bottom: 20px;
	}
}

.frase-top {
	.corsivo {
		font-size: 45px;
		display: block;

		@media (max-width: @screen-xs-max) {
			font-size: 30px;
		}
	}

	color: #fff;
	font-size: 65px;
	line-height: 55px;
	padding-right: 65px;
	text-align: right;
	background-position: center right;
	background-repeat: no-repeat;
	background-image: url("/source/esagono-vert-sx.png");
	position: absolute;
	bottom: 85px;
	right: 0;
	z-index: 5;

	@media (max-width: @screen-xs-max) {
		font-size: 38px;
		line-height: 40px;
		bottom: 50px;
		text-shadow: 1px 1px 1px #333;
	}
}

// FORM CONTATTI

#ContContatti {
	.form-group {
		margin: 0;
		padding: 2px 0;
	}

	.modulo_alt {
		&:extend(.form-control all);
		height: 50px;
		background-repeat: no-repeat;
		box-shadow: none;
		padding: 0;
		font-size: 15px;
		margin: 4px 0;
		color: #333;
		border: none;
		text-indent: 10px;
		background-color: #fff;

		&#textarea_alt {
			min-height: 317px;
			padding-top: 10px;
			background-position: 12px 12px;

			@media (max-width: @screen-sm-max) {
				min-height: 100px;
			}
		}

		&::-webkit-input-placeholder {
			/* Chrome/Opera/Safari */
			color: #878787;
		}

		&::-moz-placeholder {
			/* Firefox 19+ */
			color: #878787;
		}

		&:-ms-input-placeholder {
			/* IE 10+ */
			color: #878787;
		}

		&:-moz-placeholder {
			/* Firefox 18- */
			color: #878787;
		}

		&.required_module {
			box-shadow: 0px 0px 6px red;
		}
	}

	.modulo_alt[readonly],
	.modulo_file {
		background-image: url("/ATScripts/form/img/attach.png");
		background-repeat: no-repeat;
		background-position: 5px center;
		cursor: pointer;
		text-indent: 25px;
		background-color: #fff;
	}

	.bottone_alt {
		&:extend(.btn all);
		.button-variant(#fff; #000; #000);
		&:extend(.btn-block all);

		@media (max-width: @screen-sm-max) {
			float: none;
			margin: 10px auto;
		}
	}

	.privacy-form label {
		margin: 0;
		display: inline;
	}

	label {
		display: block;
		margin: 5px 0;
		font-size: 15px;
		color: @color-form;
		text-align: left;
	}

	.sep {
		padding-bottom: 10px;
	}

	.separatore {
		margin-bottom: 10px;
	}

	select.modulo_alt {
		background-image: url(/source/arr_down.png);
		background-repeat: no-repeat;
		background-position: 98% 50%;
		background-position: right 10px bottom 50%;
		color: @color-form;
	}

	.privacy-form {
		@media (max-width: @screen-xs-max) {
			margin-top: 10px;
		}

		label {
			padding: 0;
		}
	}
}

#testo_privacy,
.txtred_alt {
	font-size: 12px !important;
	color: @color-form;
	font-weight: normal;
	text-transform: initial;

	a {
		color: @color-form;
	}

	@media (max-width: @screen-md-max) {
		font-size: 12px !important;
	}
}

#ContContatti input.datepicker,
#data_partenza_lastminute,
#data_arrivo_lastminute,
#ContContatti input[name="arrivo"],
#ContContatti input[name="partenza"] {
	background-color: #fff !important;
	background-image: url("/source/calendario.png") !important;
	background-repeat: no-repeat;
	background-position: 98% 50% !important;
	background-position: right 10px bottom 50%;
	cursor: pointer;
	color: @color-form;
}

#ContContatti .cont-pulsante {
	position: absolute;
	right: 0px;
	left: 0px;
	bottom: 0;
}

#ContContatti input[type="button"].bottone_alt,
#pgall .wrapper_form_cont input[type="submit"] {
	cursor: pointer;
	color: #fff;
	background-color: #1d3461;
	padding: 0px 10px;
	height: 60px;
	width: 100%;
	line-height: 55px;
	-webkit-appearance: none;
	text-transform: uppercase;
	margin: 0 auto;
	margin-top: 20px;
	outline: none;
	font-size: 17px;
	max-width: 230px;
	float: right;

	@media (max-width: @screen-xs-max) {
		float: none;
	}
}

#ContContatti input[type="button"].bottone_alt:hover,
#pgall .wrapper_form_cont input[type="submit"]:hover {
	background-color: #829cbc;
	color: #fff;
}

#pgall .wrapper_form_cont .privacy_check div {
	display: inline-block;
}

.booking {
	i {
		font-size: 25px;
		padding-left: 10px;
	}
	h3 {
		color: #fff;
		line-height: 28px;
		font-size: 26px;
		margin-bottom: 30px;
	}
}

.form-booking {
	input[type="date"] {
		text-align: left;
		background-repeat: no-repeat;
		background-position: 98% 50%;
		position: relative;
		background-color: transparent;
		border: 0 none;
		appearance: none;
		color: #fff;
		text-align: right;
		width: 100%;
	}

	input[type="date"]::-webkit-calendar-picker-indicator {
		background: transparent;
		bottom: 0;
		color: transparent;
		cursor: pointer;
		height: auto;
		left: 0;
		position: absolute;
		right: 0;
		top: 0;
		width: auto;
	}

	@-moz-document url-prefix() {
		input[type="date"] {
			background: transparent !important;
		}
	}

	input[type="date"]::-webkit-date-and-time-value {
		margin-top: 0px;
		text-align: left;
		width: 100%;
	}
}