// 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: #535353; @text-color: #535353; @font-family-sans-serif: 'Lato', sans-serif; @font-size-base: 17px; @font-titoli: 'Pacifico', cursive; @arvo:'Arvo', serif; @icon-font-path: "/source/bootstrap3.2.0/fonts/"; body{font-weight:300} .title-font{ font-family: @font-titoli; } .bold{ font-weight: 700; } .font-reg{ font-weight: 400; } .arvo-font{ font-family: @arvo; } @font-face { font-family: 'icomoon'; src: url('/source/icomoon.eot?ryumc2'); src: url('/source/icomoon.eot?ryumc2#iefix') format('embedded-opentype'), url('/source/icomoon.ttf?ryumc2') format('truetype'), url('/source/icomoon.woff?ryumc2') format('woff'), url('/source/icomoon.svg?ryumc2#icomoon') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } [class^="icon-"], [class*=" icon-"], .select:after { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; display:inline-block; vertical-align:middle; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-pond:before { content: "\e900"; } .icon-beach:before { content: "\e914"; } /* BUTTON */ input[type=email], input[type=image], input[type=number], input[type=password], input[type=text], select, textarea { width: 100%; margin: 0; -webkit-appearance: none; -moz-appearance: none; border: none; -webkit-border-radius: 0; border-radius: 0; display: block; text-indent: 5px; } #pgall input[type=button], #pgall input[type=submit] { width: 100%; text-align: center; cursor: pointer; display: block; -webkit-appearance: none; -moz-appearance: none; border: none; -webkit-border-radius: 0; border-radius: 0; -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:link, a:visited, input[type = "submit"] { -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; } .freccia-none, .pulsante, .slick-next, .slick-prev, .tendina-lingue, .transition_400 { -webkit-transition: all 400ms ease; -moz-transition: all 400ms ease; -ms-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease; } .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="checkbox"], input[type="radio"] { margin: 0; } /* ***************************** */ .table-box { display: table; table-layout: fixed; width:100%; @media (max-width: @screen-sm-max) { display:block; } } .table-cell { display: table-cell; vertical-align: middle; float: none; @media (max-width: @screen-sm-max) { display:block; } } p { margin: 0; } ul { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; } .no-pad { padding: 0; } .blk { max-width: 2000px; margin: 0 auto; width: 100%; @media (min-width: @screen-md-min) { padding: 0 15px; } @media (min-width: @screen-lg-min) { padding: 0 25px; } } .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: 1610px; } .highlighted { background-color: #FF429C; } .space-letter{ letter-spacing:2px } h1, h2.grande { font-size: 47px; line-height: 1; margin: 0; color:#fff; font-weight:700; letter-spacing:15px; @media (max-width: @screen-md-max) { font-size: 40px; letter-spacing:6px; } @media (max-width: @screen-sm-max) { font-size:33px; letter-spacing:5px; } @media (max-width: @screen-xs-max) { font-size: 25px; letter-spacing:2px; } img{ margin:0 10px; @media (max-width: @screen-md-max) { margin:0 7px; } @media (max-width: @screen-sm-max) { margin:0 4px; } @media (max-width: @screen-xs-max) { margin:0 3px; max-width:40px; } } } .cont-h1 { width: 100%; position: absolute; top: 50%; right:0; left:0; margin:auto; z-index:10; text-align:center; @media (max-width: @screen-md-max) { top: 50%; } @media (max-width: @screen-sm-max) { top: 40%; } @media (max-width: @screen-xs-max) { top: 40%; } } h2 { font-size: 75px; line-height: 1; font-family: @font-titoli; @media (max-width: @screen-md-max) { font-size: 55px; } @media (max-width: @screen-sm-max) { font-size: 40px; } @media (max-width: @screen-xs-max) { font-size: 30px; } } .divisore { padding-bottom: 40px; @media (max-width: @screen-xs-max) { padding-bottom: 20px; } } h3 { font-size: 40px; line-height: 43px; font-weight: bold; margin-bottom: 20px; @media (max-width: @screen-sm-max) { font-size: 29px; line-height: 33px; } @media (max-width: @screen-xs-max) { font-size: 26px; line-height: 29px; } } .testo { padding: 0 25px; word-wrap: break-word; line-height: 1.5; @media (max-width: @screen-sm-max) { padding: 5px 10px; text-align: center; } @media (max-width: @screen-xs-max) { padding: 5px 10px; text-align: center; } } .testo-centrale{ padding: 30px 0; word-wrap: break-word; line-height: 1.5; max-width:750px; text-align:center; margin:0 auto; width:100%; @media (max-width: @screen-sm-max) { margin:0 auto; padding: 25px 10px; text-align: center; } @media (max-width: @screen-xs-max) { margin:0 auto; padding: 25px 5px; text-align: center; } } .testo-sx { padding-right: 25px; text-align: left; line-height:1.5; @media (max-width: @screen-sm-max) { padding: 5px 10px; text-align: center; } @media (max-width: @screen-xs-max) { padding: 5px 10px; text-align: center; } } .testo-dx { padding-left: 25px; text-align: left; line-height:1.5; @media (max-width: @screen-sm-max) { padding: 5px 10px; text-align: center; } @media (max-width: @screen-xs-max) { padding: 5px 10px;; text-align: center; } } .space-txt-top{ height:489px; background:#fff; border-right:40px solid #eee; @media (max-width: @screen-md-max) { height:450px; } @media (max-width: @screen-sm-max) { height:auto; padding:25px 5px; text-align:center; border-right:none; } @media (max-width: @screen-xs-max) { height:auto; padding:25px 5px; text-align:center; border-right:none; } } .sfondo-txt-top { background-size: cover; background-repeat: no-repeat; background-position: center top; height: 569px; margin-top: -80px; @media (max-width: @screen-md-max) { height:530px; } } /* testo centrato */ .centrato{ margin:auto; display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; align-items: center; -webkit-align-items: center; -moz-align-items: center; align-content: center; -webkit-align-content: center; justify-content: center; -webkit-justify-content: center; } .centrato .wrap{ max-width:80%; margin:0 auto; width:100%; @media (max-width: @screen-sm-max) { max-width:90%; } @media (max-width: @screen-xs-max) { max-width:95%; } } /* --------------- */ .image-txt-up{padding-bottom:25px;} .img-top-txt{ padding-right:0; margin-top:-80px; @media (max-width: @screen-sm-max) { padding:0; margin-top:0; } @media (max-width: @screen-xs-max) { padding:0; margin-top:0; } } .img-top-right{ padding-right:0; margin-top:50px; @media (max-width: @screen-sm-max) { padding:0; margin-top:10px; } @media (max-width: @screen-xs-max) { padding:0; margin-top:10px; } } .title-page{ font-size: 35px; padding-top:20px; padding-bottom:15px; font-weight:700; color:#00AEE5; @media (max-width: @screen-md-max) { font-size: 30px; } @media (max-width: @screen-sm-max) { font-size: 25px; } @media (max-width: @screen-xs-max) { font-size: 21px; } } ul.elenco-service{ text-align:left; padding-left:20px; @media (max-width: @screen-sm-max) { text-align:center; padding-left:0; list-style-position:inside; } @media (max-width: @screen-xs-max) { text-align:center; padding-left:0; list-style-position:inside; } } .txt-azzurro{color:#00AFE5} .mountain-absol-index{ position:absolute; right:0; bottom:0; } .absol-txt-index { text-align: center; color: #fff; text-shadow: 1px 1px 1px #000; position: absolute; top: 30%; width: 100%; h2{ line-height:normal } } .absol-space-bottom{ text-align: center; color: #fff; text-shadow: 1px 1px 1px #000; position: absolute; bottom: 50px; left:25px; font-size:23px; @media (max-width: @screen-xs-max) { left:auto; width:100%; top:5%; text-align:center; font-size:18px; } } // FORM CONTATTI #ContContatti { color: #000; .form-group { margin: 3px 0; } .modulo_alt { &:extend(.form-control all); height: 45px; background-repeat: no-repeat; box-shadow: none; padding: 0; font-size: 19px; background: #fff; margin: 5px 0; color: #000; border: none; border-radius: 2px; text-indent: 10px; border: 1px solid #fff; option { color: #000; } &.required_module { box-shadow: 0 0 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 { text-align: right; } .privacy-form label { margin: 0; display: inline; } label { display: block; margin: 5px 0; font-size: 18px; color: #000; @media (max-width: @screen-xs-max) { font-size: 15px; } } .sep { padding-bottom: 10px; } textarea { min-height: 130px; } .separatore { margin-bottom: 10px; } select.modulo_alt { background-image: url("/source/arr_down.png"); background-repeat: no-repeat; background-position: 95% 50%; background-position: right 10px bottom 50%; } .privacy-form { @media (max-width: @screen-xs-max) { margin-top: 10px; } label { padding: 0; } } } #testo_privacy, .txtred_alt { font-size: 15px !Important; color: #000; font-weight: normal; } #ContContatti input.datepicker, #ContContatti input[name="arrivo"], #ContContatti input[name="partenza"], #data_arrivo_lastminute, #data_partenza_lastminute { background-color: #fff !important; background-image: url("/source/calendario.png") !important; background-repeat: no-repeat; background-position: 98% 50% !important; cursor: pointer; color: #000; } #ContContatti input[type = "button"].bottone_alt, #pgall .wrapper_form_cont input[type = "submit"] { cursor: pointer; color: #fff; background:#00AFE5 ; padding: 0 10px; height: 50px; width: 100%; line-height: 45px; -webkit-appearance: none; float: right; margin: 20px auto 0; outline: none; font-size: 20px; max-width: 250px; border-radius: 0; @media (max-width: @screen-xs-max) { float: none; max-width: 250px; } } #ContContatti input[type = "button"].bottone_alt:hover, #pgall .wrapper_form_cont input[type = "submit"]:hover { color:#fff!important; background:#444; } #pgall .wrapper_form_cont .privacy_check div { display: inline-block; } #ContContatti #testo_privacy a:link, #ContContatti #testo_privacy a:active, #ContContatti #testo_privacy a:visited{ color:#000!important } // ****************************************************** #booking-app-cnt { background-color: white; padding: 40px 0; margin: 40px 0; .accommodation h2 { margin-top: 20px; } .alert-hint-results { margin-top: 20px; font-size: 1.2em; } .reservation-correct { padding-bottom: 20px; } } .sgs-book-now { margin-top: 20px; color: #666; margin-top: 40px; .title { font-family: @font-titoli; color: #00afe5; font-size: 96px; margin-top: -40px; @media (max-width: @screen-md-max) { text-align: center; font-size: 76px; margin-top: -32px; } @media (max-width: @screen-xs-max) { text-align: left; font-size: 56px; } } label { text-transform: uppercase; font-size: 16px; } input, select { font-size: 28px; text-indent: 0; } select { text-align: center; } .ig input { background-image: url("/source/cal-book.png"); background-repeat: no-repeat; background-position: right center; padding-right: 40px; } .brd { border-left: 1px solid #ddd; text-align: center; @media (max-width: @screen-xs-max) { text-align: left; } } .ig { display: inline-block; text-align: left; margin-bottom: 10px; @media (max-width: @screen-xs-max) { padding-left: 20px; } } .sgs-submit-booking { height: 70px; background-color: #9ab521; color: white; font-size: 16px; font-weight: bold; } } [lang="de"] .ig label { font-size: 12px; } #pgall .sgs-book-now select { background: none; } //box strutture home .box-strutture{ position: relative; height: 550px; background-size: cover; background-repeat: no-repeat; display: block; cursor: pointer; @media(max-width:@screen-xs-max){ height: 390px; } .sfondo{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; z-index: 1; background-repeat: no-repeat; background-size: cover; } &:before{ background: rgba(0,0,0,0.2); transition: all ease 0.5s; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 2; content: ''; opacity: 0.5; } .testo-overlay{ color:#fff; font-size: 22px; opacity: 0; position: absolute; top: 35px; text-align: left; left: 30px; right: 0; animation: transition 5s infinite; z-index: 10; padding: 25px; .ico{ font-size: 60px; margin-bottom: 10px; display: block; } } .link-box{ color:#fff; position: absolute; bottom: 40px; left: 30px; z-index: 10; font-weight: 700; text-shadow: 2px 2px 8px #000; font-size: 20px; img{ display: inline!important; margin-left: 5px!important; } @media(max-width:@screen-sm-max){ font-size: 20px; font-weight: bold; } } &:hover{ &:before{ opacity:1; transition: all ease 0.5s; background: rgba(89,178,0,0.6); background: -moz-linear-gradient(left, rgba(89,178,0,0.6) 0%, rgba(0,89,178,0.6) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(89,178,0,0.6)), color-stop(100%, rgba(0,89,178,0.6))); background: -webkit-linear-gradient(left, rgba(89,178,0,0.6) 0%, rgba(0,89,178,0.6) 100%); background: -o-linear-gradient(left, rgba(89,178,0,0.6) 0%, rgba(0,89,178,0.6) 100%); background: -ms-linear-gradient(left, rgba(89,178,0,0.6) 0%, rgba(0,89,178,0.6) 100%); background: linear-gradient(to right, rgba(89,178,0,0.6) 0%, rgba(0,89,178,0.6) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59b200', endColorstr='#0059b2', GradientType=1 ); } .testo-overlay{ opacity: 1; } } } .slick-slider{ /* Dots */ .slick-dots { position: absolute; bottom: -20px; list-style: none; display: block; padding: 0; width: 100%; z-index: 10; right: 0; width: 100%; left: 0; top: 390px !important; text-align: left; @media (max-width: @screen-sm-max) and (min-width: @screen-sm-min) { bottom: -30px; } @media (max-width: @screen-xs-max) { bottom: -20px; } li { position: relative; display: inline-block; height: 8px !important; width:8px !important; margin: 0 5px; padding: 0; cursor: pointer; border-radius:50%; button { border: 0; background-color: #024F72; display: block; height: 8px !important; width: 8px !important; margin:0 auto; border-radius:50%; padding: 0; outline: none; line-height: 0; font-size: 0; color: transparent; cursor: pointer; &:hover, &:focus { outline: none; background-color: #76A43C; } &:after, &:before { display: none; } } &.slick-active button{ outline: none; background-color: #76A43C; } &:after, &:before { display: none; } } } }