/*D:/aa/siti/aaa_ollytour.it/root/componenti/slider/slider.css*/ /* -------------------------------------------------------------------------------- */ /* ! * read me */ /* -------------------------------------------------------------------------------- */ /* * Questo file di stile contiene solamente la minima stilizzazione * possibile del componente. * */ /* -------------------------------------------------------------------------------- */ /* ! Carousel */ /* -------------------------------------------------------------------------------- */ .carousel-inner .filtro{ position: absolute; top: 0; left: 0; background: #000; opacity: 0.4; width: 100%; height: 100%; z-index: 1;} .carousel .carousel-caption{ z-index: 2; background: #000000a3;} .carousel .carousel-inner .carousel-item{ background-size: cover; background-position: center center; height: 550px; object-fit: cover;} /* ! ___display-max-md */ @media (max-width: 767.98px) { .carousel .carousel-inner .carousel-item { height: 450px;} } /* ! ___display-max-sm */ @media (max-width: 575.98px) { .carousel .carousel-inner .carousel-item { height: 300px;} } /* ! -- compatibilità */ .PageSection01 .carousel .carousel-inner .carousel-item{ height: 430px;} @media (max-width: 1023px) { .PageSection01 .carousel .carousel-inner .carousel-item{ height: 260px;} } /*D:/aa/siti/aaa_ollytour.it/root/componenti/engine/engine.css*/ /* -------------------------------------------------------------------------------- */ /* ! * read me */ /* -------------------------------------------------------------------------------- */ /* * Questo file di stile contiene solamente la minima stilizzazione * possibile del componente. * */ /* -------------------------------------------------------------------------------- */ /* ! MOTORE DI RICERCA */ /* -------------------------------------------------------------------------------- */ .motoreDiRicerca span.icon{ display: block; height: fit-content!important;} /* ! - guest button */ .motoreDiRicerca .input-group-guest{display: flex; flex-direction: row; flex-wrap: nowrap;} .motoreDiRicerca .input-group-guest .btn.ospiti{background-color:#fff; color: #000;} /* ! - date picker */ 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;} input[type="date"]::-webkit-datetime-edit{font-size: 0.85rem;} input[type="date"]::-webkit-datetime-edit-fields-wrapper { background: transparent;} input[type="date"]::-webkit-datetime-edit-text { color: black; padding: 0 0.3em;} input[type="date"]::-webkit-datetime-edit-month-field { color: black;} input[type="date"]::-webkit-datetime-edit-month-field:focus { color: #fff;} input[type="date"]::-webkit-datetime-edit-day-field { color: black;} input[type="date"]::-webkit-datetime-edit-day-field:focus { color: #fff;} input[type="date"]::-webkit-datetime-edit-year-field { color: black;} input[type="date"]::-webkit-datetime-edit-year-field:focus { color: #fff;} input[type="date"]::-webkit-inner-spin-button { display: none;} input[type="date"]::-webkit-calendar-picker-indicator {position: absolute; top: 0; left: 0; height: 50px;} /* ! - range picker */ input[type=range] { -webkit-appearance: none; margin: 18px 0; width: 100%; margin-top: 5px; margin-bottom: 0px; border: none;} input[type=range]:focus { outline: none;} input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 8.4px; cursor: pointer; background: #fff; border-radius: 1.3px; border: 0.2px solid #010101;} input[type=range]::-webkit-slider-thumb { border: 1px solid #000000; height: 36px; width: 16px; background: #ffffff; cursor: pointer; -webkit-appearance: none; margin-top: -14px;} input[type=range]::-moz-range-thumb { border: 1px solid #000000; height: 36px; width: 16px; border-radius: 3px; background: #ffffff; cursor: pointer;} /* ! ___display-max--lg */ @media (max-width: 991.98px) { #Home .motoreDiRicerca div[class^='col-'] { margin-bottom: 1.25rem;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { #Home .motoreDiRicerca div[class^='col-'] { margin-bottom: 1rem;} #Home .motoreDiRicerca div.colonna-prezzo{ margin-bottom: 2rem;} #Home .motoreDiRicerca ul.listaOpzioniRicerca { top: -38px;} #Home .motoreDiRicerca ul.listaOpzioniRicerca li.nav-item { margin-right: 2px;} #Home .motoreDiRicerca ul.listaOpzioniRicerca .nav-item a { padding: 6px 8px 6px 8px;} } /* ! - range prezzo */ .motoreDiRicerca .tooltip { opacity: 1;} .motoreDiRicerca .tooltip .tooltip-inner{ color: #000!important;} .motoreDiRicerca .tooltip-main { display: none;} .motoreDiRicerca .tooltip-min { width: 60px;} .motoreDiRicerca .tooltip-min .tooltip-inner{ position: absolute; left: -20px; top: -20px; font-size: 0.85rem;} .motoreDiRicerca .tooltip-max { width: 60px;} .motoreDiRicerca .tooltip-max .tooltip-inner{ position: absolute; right: -17px; top: -20px; font-size: 0.85rem;} .motoreDiRicerca .tooltip:hover:before, .motoreDiRicerca .tooltip:hover:after{ display: none;} /* ! -- slider */ .motoreDiRicerca .slider-horizontal { position: relative;} .motoreDiRicerca .slider-wrapper{ display: flex; align-items: center;} .motoreDiRicerca .slider-selection { background: #e9ecef !important; border: 1px solid #ced4da;} .motoreDiRicerca .slider-success .slider-selection { background-color: #5cb85c !important;} .motoreDiRicerca .slider-primary .slider-selection { background-color: #428bca !important;} .motoreDiRicerca .slider-info .slider-selection { background-color: #5bc0de !important;} .motoreDiRicerca .slider-warning .slider-selection { background-color: #f0ad4e !important;} .motoreDiRicerca .slider-danger .slider-selection { background-color: #d9534f !important;} .motoreDiRicerca .slider.slider-horizontal { width: 100% !important; height: 20px;} .motoreDiRicerca .slider-handle { background-color: #fff; /*background-image: none !important;*/ -webkit-box-shadow: 1px 1px 5px -2px rgb(0 0 0 / 75%) !important; -moz-box-shadow: 1px 1px 5px -2px rgba(0, 0, 0, 0.75) !important; box-shadow: 1px 1px 5px -2px rgb(0 0 0 / 75%) !important;} .motoreDiRicerca .slider-strips .slider-selection { background-image: repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(255, 252, 252, 0.08) 5px, rgba(252, 252, 252, 0.08) 10px) !important; background-image: -ms-repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(255, 252, 252, 0.08) 5px, rgba(252, 252, 252, 0.08) 10px) !important; background-image: -o-repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(255, 252, 252, 0.08) 5px, rgba(252, 252, 252, 0.08) 10px) !important; background-image: -webkit-repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(255, 252, 252, 0.08) 5px, rgba(252, 252, 252, 0.08) 10px) !important;} .motoreDiRicerca .tooltip-inner { max-width: 200px; padding: 3px 8px; color: #bdbdbd !important; text-align: center; background-color: transparent !important; border-radius: 4px;} .motoreDiRicerca .tooltip.top .tooltip-arrow { display: none !important;} .motoreDiRicerca .slider .tooltip.top { margin-top: -25px !important;} .motoreDiRicerca .well { background: transparent !important; border: none !important; box-shadow: none !important; width: 100% !important; padding: 0;} .motoreDiRicerca .slider-ghost .slider-track { height: 5px !important;} .motoreDiRicerca .slider-ghost .slider-handle { top: -2px !important; border: 5px solid #f77500;} .motoreDiRicerca .slider-success.slider-ghost .slider-handle { border-color: #5cb85c;} .motoreDiRicerca .slider-primary.slider-ghost .slider-handle { border-color: #428bca;} .motoreDiRicerca .slider-info.slider-ghost .slider-handle { border-color: #5bc0de;} .motoreDiRicerca .slider-warning.slider-ghost .slider-handle { border-color: #f0ad4e;} .motoreDiRicerca .slider-danger.slider-ghost .slider-handle { border-color: #d9534f;} .motoreDiRicerca .slider { display: inline-block; vertical-align: middle; position: relative;} .motoreDiRicerca .slider.slider-horizontal { width: 210px; height: 20px} .motoreDiRicerca .slider.slider-horizontal .slider-track { height: 10px; width: 100%; margin-top: -5px; top: 50%; left: 0} .motoreDiRicerca .slider.slider-horizontal .slider-selection, .motoreDiRicerca .slider.slider-horizontal .slider-track-low, .motoreDiRicerca .slider.slider-horizontal .slider-track-high { height: 100%; top: 0; bottom: 0} .motoreDiRicerca .slider.slider-horizontal .slider-tick, .motoreDiRicerca .slider.slider-horizontal .slider-handle { margin-left: -10px} .motoreDiRicerca .slider.slider-horizontal .slider-tick.triangle, .motoreDiRicerca .slider.slider-horizontal .slider-handle.triangle { position: relative; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); border-width: 0 10px 10px 10px; width: 0; height: 0; border-bottom-color: #2e6da4; margin-top: 0;} .motoreDiRicerca .slider.slider-horizontal .slider-tick-container { white-space: nowrap; position: absolute; top: 0; left: 0; width: 100%;} .motoreDiRicerca .slider.slider-horizontal .slider-tick-label-container { white-space: nowrap; margin-top: 20px;} .motoreDiRicerca .slider.slider-horizontal .slider-tick-label-container .slider-tick-label { padding-top: 4px; display: inline-block; text-align: center;} .motoreDiRicerca .slider.slider-horizontal.slider-rtl .slider-track { left: initial; right: 0} .motoreDiRicerca .slider.slider-horizontal.slider-rtl .slider-tick, .motoreDiRicerca .slider.slider-horizontal.slider-rtl .slider-handle { margin-left: initial; margin-right: -10px;} .motoreDiRicerca .slider.slider-horizontal.slider-rtl .slider-tick-container { left: initial; right: 0;} .motoreDiRicerca .slider.slider-horizontal.slider-rtl .tooltip { -ms-transform: translateX(50%); transform: translateX(50%);} .motoreDiRicerca .slider.slider-vertical { height: 210px; width: 20px;} .motoreDiRicerca .slider.slider-vertical .slider-track { width: 10px; height: 100%; left: 25%; top: 0;} .motoreDiRicerca .slider.slider-vertical .slider-selection { width: 100%; left: 0; top: 0; bottom: 0;} .motoreDiRicerca .slider.slider-vertical .slider-track-low, .motoreDiRicerca .slider.slider-vertical .slider-track-high { width: 100%; left: 0; right: 0;} .motoreDiRicerca .slider.slider-vertical .slider-tick, .motoreDiRicerca .slider.slider-vertical .slider-handle { margin-top: -10px;} .motoreDiRicerca .slider.slider-vertical .slider-tick.triangle, .motoreDiRicerca .slider.slider-vertical .slider-handle.triangle { border-width: 10px 0 10px 10px; width: 1px; height: 1px; border-left-color: #2e6da4; border-right-color: #2e6da4; margin-left: 0; margin-right: 0;} .motoreDiRicerca .slider.slider-vertical .slider-tick-label-container { white-space: nowrap;} .motoreDiRicerca .slider.slider-vertical .slider-tick-label-container .slider-tick-label { padding-left: 4px;} .motoreDiRicerca .slider.slider-vertical .tooltip { -ms-transform: translateY(-50%); transform: translateY(-50%)} .motoreDiRicerca .slider.slider-vertical.slider-rtl .slider-track { left: initial; right: 25%} .motoreDiRicerca .slider.slider-vertical.slider-rtl .slider-selection { left: initial; right: 0} .motoreDiRicerca .slider.slider-vertical.slider-rtl .slider-tick.triangle, .motoreDiRicerca .slider.slider-vertical.slider-rtl .slider-handle.triangle { border-width: 10px 10px 10px 0} .motoreDiRicerca .slider.slider-vertical.slider-rtl .slider-tick-label-container .slider-tick-label { padding-left: initial; padding-right: 4px} .motoreDiRicerca .slider.slider-disabled .slider-handle { background-image: -webkit-linear-gradient(top, #dfdfdf 0, #bebebe 100%); background-image: -o-linear-gradient(top, #dfdfdf 0, #bebebe 100%); background-image: linear-gradient(to bottom, #dfdfdf 0, #bebebe 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdfdfdf', endColorstr='#ffbebebe', GradientType=0)} .motoreDiRicerca .slider.slider-disabled .slider-track { background-image: -webkit-linear-gradient(top, #e5e5e5 0, #e9e9e9 100%); background-image: -o-linear-gradient(top, #e5e5e5 0, #e9e9e9 100%); background-image: linear-gradient(to bottom, #e5e5e5 0, #e9e9e9 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe5e5e5', endColorstr='#ffe9e9e9', GradientType=0); cursor: not-allowed} .motoreDiRicerca .slider input { display: none} .motoreDiRicerca .slider .tooltip-inner { white-space: nowrap; max-width: none} .motoreDiRicerca .slider .hide { display: none} .motoreDiRicerca .slider-track { position: absolute; cursor: pointer; background-image: -webkit-linear-gradient(top, #f5f5f5 0, #f9f9f9 100%); background-image: -o-linear-gradient(top, #f5f5f5 0, #f9f9f9 100%); background-image: linear-gradient(to bottom, #f5f5f5 0, #f9f9f9 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#fff9f9f9', GradientType=0); -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); border-radius: 4px} .motoreDiRicerca .slider-selection { position: absolute;} .motoreDiRicerca .slider-track-low, .motoreDiRicerca .slider-track-high { position: absolute; background: transparent; border-radius: 4px} .motoreDiRicerca .slider-handle { position: absolute; top: 0; width: 20px; height: 20px;} .motoreDiRicerca .slider-handle.round { border-radius: 50%} .motoreDiRicerca .slider-handle.triangle { background: transparent none} .motoreDiRicerca .slider-handle.custom { background: transparent none} .motoreDiRicerca .slider-handle.custom::before { line-height: 20px; font-size: 20px; content: '\2605'; color: #726204} .motoreDiRicerca .slider-tick { position: absolute; width: 20px; height: 20px; background-image: -webkit-linear-gradient(top, #f9f9f9 0, #f5f5f5 100%); background-image: -o-linear-gradient(top, #f9f9f9 0, #f5f5f5 100%); background-image: linear-gradient(to bottom, #f9f9f9 0, #f5f5f5 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff9f9f9', endColorstr='#fff5f5f5', GradientType=0); -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; filter: none; opacity: .8; border: 0 solid transparent} .motoreDiRicerca .slider-tick.round { border-radius: 50%} .motoreDiRicerca .slider-tick.triangle { background: transparent none} .motoreDiRicerca .slider-tick.custom { background: transparent none} .motoreDiRicerca .slider-tick.custom::before { line-height: 20px; font-size: 20px; content: '\2605'; color: #726204} .motoreDiRicerca .slider-tick.in-selection { background-image: -webkit-linear-gradient(top, #8ac1ef 0, #82b3de 100%); background-image: -o-linear-gradient(top, #8ac1ef 0, #82b3de 100%); background-image: linear-gradient(to bottom, #8ac1ef 0, #82b3de 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8ac1ef', endColorstr='#ff82b3de', GradientType=0); opacity: 1} /* -------------------------------------------------------------------------------- */ /* ! Struttura e stile di base */ /* -------------------------------------------------------------------------------- */ #Home .motoreDiRicerca { position: relative; display: flex; flex-direction: row; justify-content: space-between; } #Home .motoreDiRicerca > div{ height: 50px;} #Home .motoreDiRicerca > div > span, #Home .motoreDiRicerca > div > .form-floating, #Home .motoreDiRicerca > div > .form-floating > input{ height: inherit;} #Home .motoreDiRicerca select.form-select, #Tore .motoreDiRicerca select.form-select, #Crue .motoreDiRicerca select.form-select, #Stru .motoreDiRicerca select.form-select{padding-right: 25px;} .motoreDiRicerca .input-group .form-select:hover, .motoreDiRicerca .input-group.input-group-checkInOut .form-floating:hover input.form-control { cursor: pointer;} .motoreDiRicerca button.ospiti{flex: 1 1 auto; border: 1px solid #ced4da;} .motoreDiRicerca button.ospiti .room-number, .motoreDiRicerca button.ospiti .guest-number{padding: 5px 2px;} .motoreDiRicerca .input-group-text{ width: 34px; padding: 0; align-items: center; justify-content: center;} .motoreDiRicerca img.icon{ width: 20px; height: 20px;} .motoreDiRicerca .btn.search:hover{background: #000; color: #fff; border: 1px solid #000;} /* ! - labels */ .input-group-rangeGiorni label, .input-group-rangePriceDaA label, .input-group-rangePrezzo label{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;} /* ! - buttons filter */ .buttons-filter{ display: flex; flex-direction: row; flex-wrap: wrap; padding-left: 1rem;} .button-filter{ display: inline-block; padding: 5px 10px; background: #dbc3c3; border-radius: 5px; margin-right: 10px;} .button-filter .btn-close{ height: 10px; width: 10px; background-size: cover; margin-left: 5px;} /* ! ___display-max-xxl */ @media (max-width: 1399.98px) { .motoreDiRicerca .input-group select{padding: 5px 8px 5px 3px;} .motoreDiRicerca button.ospiti{display: flex; align-items: center;} } /* ! ___display-max-md */ @media (max-width: 767.98px) { .motoreDiRicerca button.ospiti{width: 100%; display: flex; align-items: center; padding-left: 15px;} .motoreDiRicerca button.ospiti .room-label{margin-right: 10px;} } /* ! ___display-max-xl */ @media (max-width: 1199.98px) { .motoreDiRicerca{padding: 10px; margin-bottom: 50px;} .motoreDiRicerca > div.input-group-rangePrezzo{margin-bottom: 0;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .motoreDiRicerca{margin-bottom: 20px;} } /* ! ___display-min-xxl */ @media (min-width: 1400px) { /* .motoreDiRicerca button.ospiti{padding: 5px 5px 5px 10px;} */ } /* ! ___display-min-xl */ @media (min-width: 1200px) { .motoreDiRicerca > div{height: 42px;} .motoreDiRicerca .input-group > span, .motoreDiRicerca .input-group > div{height: inherit;} .motoreDiRicerca .input-group span, .motoreDiRicerca .input-group select, .motoreDiRicerca .input-group button:not(.search){padding: 5px 8px 5px 3px;} .motoreDiRicerca .input-group span.input-group-text{padding: 10px 5px;} .motoreDiRicerca .input-group span.input-group-text img.icon{width: 20px;} .motoreDiRicerca .input-group-checkInOut {gap: 0px!important;margin-bottom: 60px; display: grid; grid-template-columns: [first] 32px; grid-template-rows: [first] 42px; margin-top: 15px; position: relative;} .motoreDiRicerca .input-group-checkInOut span:first-child{height: 92px;} } /* ! - Engi & Dest */ #Engi .motoreDiRicerca > div, #Dest .motoreDiRicerca > div{ width: 100%; height: 50px; margin-bottom: 10px;} #Engi .motoreDiRicerca > div.input-group-rangePrezzo, #Dest .motoreDiRicerca > div.input-group-rangePrezzo{ padding-left: 12px; padding-right: 12px;} #Engi .motoreDiRicerca .input-group.input-group-destinazioni, #Dest .motoreDiRicerca .input-group.input-group-destinazioni{height: auto;} #Engi .motoreDiRicerca .input-group.input-group-destinazioni .input-group-text, #Dest .motoreDiRicerca .input-group.input-group-destinazioni .input-group-text{height: auto;} #Engi .motoreDiRicerca .input-group.input-group-porti, #Dest .motoreDiRicerca .input-group.input-group-porti{height: auto;} #Engi .motoreDiRicerca .input-group.input-group-porti .input-group-text, #Dest .motoreDiRicerca .input-group.input-group-porti .input-group-text{height: auto;} #Engi .motoreDiRicerca .input-group.input-group-mesi, #Dest .motoreDiRicerca .input-group.input-group-mesi{height: auto;} #Engi .motoreDiRicerca .input-group.input-group-mesi .input-group-text, #Dest .motoreDiRicerca .input-group.input-group-mesi .input-group-text{height: auto;} #Engi .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Dest .motoreDiRicerca .input-group.input-group-rangePriceDaA{height: auto;} #Engi .motoreDiRicerca .input-group.input-group-rangePriceDaA .input-group-text, #Dest .motoreDiRicerca .input-group.input-group-rangePriceDaA .input-group-text{height: auto;} #Home .motoreDiRicerca .input-group.input-group-destinazioni select, #Stru .motoreDiRicerca .input-group.input-group-destinazioni select, #Tore .motoreDiRicerca .input-group.input-group-destinazioni select, #Crue .motoreDiRicerca .input-group.input-group-destinazioni select, #Dest .motoreDiRicerca .input-group.input-group-destinazioni select, #Engi .motoreDiRicerca .input-group.input-group-destinazioni select{padding: 5px 35px 5px 10px; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1;} #Home .motoreDiRicerca .input-group.input-group-porti select, #Stru .motoreDiRicerca .input-group.input-group-porti select, #Tore .motoreDiRicerca .input-group.input-group-porti select, #Crue .motoreDiRicerca .input-group.input-group-porti select, #Dest .motoreDiRicerca .input-group.input-group-porti select, #Engi .motoreDiRicerca .input-group.input-group-porti select{padding: 5px 35px 5px 10px; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1;} #Home .motoreDiRicerca .input-group.input-group-mesi select, #Stru .motoreDiRicerca .input-group.input-group-mesi select, #Tore .motoreDiRicerca .input-group.input-group-mesi select, #Crue .motoreDiRicerca .input-group.input-group-mesi select, #Dest .motoreDiRicerca .input-group.input-group-mesi select, #Engi .motoreDiRicerca .input-group.input-group-mesi select{padding: 5px 35px 5px 10px; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1;} #Home .motoreDiRicerca .input-group.input-group-rangePriceDaA input, #Stru .motoreDiRicerca .input-group.input-group-rangePriceDaA input, #Tore .motoreDiRicerca .input-group.input-group-rangePriceDaA input, #Crue .motoreDiRicerca .input-group.input-group-rangePriceDaA input, #Dest .motoreDiRicerca .input-group.input-group-rangePriceDaA input, #Engi .motoreDiRicerca .input-group.input-group-rangePriceDaA input{border: 1px solid var(--color-title); margin-left: -1px; height: 40px; margin-top: -2px;} #Home .motoreDiRicerca .input-group.input-group-tipologie select, #Stru .motoreDiRicerca .input-group.input-group-tipologie select, #Tore .motoreDiRicerca .input-group.input-group-tipologie select, #Crue .motoreDiRicerca .input-group.input-group-tipologie select, #Dest .motoreDiRicerca .input-group.input-group-tipologie select, #Engi .motoreDiRicerca .input-group.input-group-tipologie select{padding: 5px 35px 5px 10px; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1;} #Engi .motoreDiRicerca .input-group.input-group-tipologie, #Dest .motoreDiRicerca .input-group.input-group-tipologie{height: auto;} #Engi .motoreDiRicerca .input-group.input-group-tipologie .input-group-text, #Dest .motoreDiRicerca .input-group.input-group-tipologie .input-group-text{height: auto;} #Dest .motoreDiRicerca .input-group.input-group-tipologie select{white-space: break-spaces;} #Engi .motoreDiRicerca .input-group.input-group-tipologie select{white-space: break-spaces;} #Home .motoreDiRicerca .input-group.input-group-strutture .form-floating input, #Dest .motoreDiRicerca .input-group.input-group-strutture .form-floating input{ padding: 1.5rem 0.5rem 0.7rem 0.5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} #Engi .motoreDiRicerca .input-group.input-group-strutture .form-floating input{ padding: 1.5rem 0.5rem 0.7rem 0.5rem; white-space: break-spaces;} #Home .motoreDiRicerca .input-group.input-group-strutture div.form-floating label[for="floatingStruttura"], #Engi .motoreDiRicerca .input-group.input-group-strutture div.form-floating label[for="floatingStruttura"], #Stru .motoreDiRicerca .input-group.input-group-strutture div.form-floating label[for="floatingStruttura"], #Tore .motoreDiRicerca .input-group.input-group-strutture div.form-floating label[for="floatingStruttura"], #Crue .motoreDiRicerca .input-group.input-group-strutture div.form-floating label[for="floatingStruttura"], #Dest .motoreDiRicerca .input-group.input-group-strutture div.form-floating label[for="floatingStruttura"]{padding: 0.75rem 0.75rem 0.75rem 0.4rem;} #Engi .motoreDiRicerca > div > div.form-floating input.FindStru, #Dest .motoreDiRicerca > div > div.form-floating input.FindStru, #Engi .motoreDiRicerca > div > div.form-floating input.FindCheckIn, #Dest .motoreDiRicerca > div > div.form-floating input.FindCheckIn, #Engi .motoreDiRicerca > div > div.form-floating input.FindCheckOut, #Dest .motoreDiRicerca > div > div.form-floating input.FindCheckOut{ height: 100%;} #Home .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckIn"], #Home .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckOut"], #Stru .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckIn"], #Stru .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckOut"], #Tore .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckOut"], #Crue .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckOut"], #Engi .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckIn"], #Engi .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckOut"], #Dest .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckIn"], #Dest .motoreDiRicerca > div.input-group-checkInOut > div.form-floating label[for="floatingCheckOut"]{ padding: 0.75rem 0.75rem 0.75rem 0.6rem;} #Engi .motoreDiRicerca button #Dest .motoreDiRicerca button{ width: 100%; height: 50px;} #Engi .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1) input, #Dest .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1) input{border-radius: 0px 5px 5px 0;} #Engi .motoreDiRicerca img.icon, #Dest .motoreDiRicerca img.icon{width: 22px;} #Engi .motoreDiRicerca .input-group > span, .motoreDiRicerca .input-group > div, #Dest .motoreDiRicerca .input-group > span, .motoreDiRicerca .input-group > div{height: 50px;} /* #Engi .motoreDiRicerca .input-group-checkInOut, #Dest .motoreDiRicerca .input-group-checkInOut {grid-template-columns: [first] 33px;} */ #Engi .motoreDiRicerca .input-group-checkInOut, #Dest .motoreDiRicerca .input-group-checkInOut{display: grid; height: auto; grid-template-columns: [first] 34px;gap: 7px;} #Engi .motoreDiRicerca .input-group-checkInOut span:first-child, #Dest .motoreDiRicerca .input-group-checkInOut span:first-child{ grid-column: 1; grid-row: 1/span 2;height: auto;} #Engi .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1), #Dest .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1){ grid-column: 2 / span 2; grid-row: 1;} #Engi .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2), #Dest .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2){ grid-column: 2 / span 2; grid-row: 2;} #Engi .motoreDiRicerca button.ospiti, #Dest .motoreDiRicerca button.ospiti{ display: flex; align-items: center; justify-content: flex-start; flex-wrap: nowrap;} #Engi .motoreDiRicerca .form-floating>label, #Dest .motoreDiRicerca .form-floating>label { opacity: .45; top: -3px; left: 0px;} #Engi .motoreDiRicerca .btn.search, #Dest .motoreDiRicerca .btn.search{ width: 100%;} /* ! ___display-min-xl */ @media (min-width: 1200px) { #Engi .motoreDiRicerca .input-group-checkInOut, #Dest .motoreDiRicerca .input-group-checkInOut{display: grid; height: auto; grid-template-columns: [first] 34px;gap: 7px;} #Engi .motoreDiRicerca .input-group-checkInOut span:first-child, #Dest .motoreDiRicerca .input-group-checkInOut span:first-child{ grid-column: 1; grid-row: 1/span 2;height: auto;} #Engi .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1), #Dest .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1){ grid-column: 2 / span 2; grid-row: 1;} #Engi .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2), #Dest .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2){ grid-column: 2 / span 2; grid-row: 2;} #Engi .motoreDiRicerca .input-group-checkInOut .form-floating{margin-left: 6px; margin-right: -6px;} #Dest .motoreDiRicerca .input-group-checkInOut .form-floating{margin-left: 6px; margin-right: -6px;} #Engi .motoreDiRicerca .input-group-checkInOut .input-group-text, #Dest .motoreDiRicerca .input-group-checkInOut .input-group-text{ grid-column: 1; grid-row: 1/2;} #Engi .motoreDiRicerca .input-group-checkInOut .form-floating, #Dest .motoreDiRicerca .input-group-checkInOut .form-floating{/*width: 100%;*/ width: calc(100% - 6px);} } /* ! ___display-max-xl */ @media (max-width: 1199.98px) { #Engi .motoreDiRicerca, #Dest .motoreDiRicerca {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;} #Engi .motoreDiRicerca > div, #Dest .motoreDiRicerca > div{ height: 50px;} #Engi .motoreDiRicerca > div > span, #Dest .motoreDiRicerca > div > span, #Engi .motoreDiRicerca > div > .form-floating, #Dest .motoreDiRicerca > div > .form-floating, #Engi .motoreDiRicerca > div > .form-floating > input, #Dest .motoreDiRicerca > div > .form-floating > input{ height: inherit;} /* ! -- sizing */ #Engi .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Dest .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo{padding: 0px 23px;width: 150px;} #Engi .motoreDiRicerca .btn.search, #Dest .motoreDiRicerca .btn.search{width: 64px; height: 50px; padding: 5px;} #Engi .motoreDiRicerca .input-group.input-group-strutture .form-floating input, #Dest .motoreDiRicerca .input-group.input-group-strutture .form-floating input{height: 100%;} #Engi .motoreDiRicerca select.form-select, #Dest .motoreDiRicerca select.form-select{padding-right: 28px;background-size: 10px 10px;} #Engi .motoreDiRicerca .input-group.input-group-strutture .form-floating input.form-control, #Dest .motoreDiRicerca .input-group.input-group-strutture .form-floating input.form-control, #Engi .motoreDiRicerca .input-group.input-group-checkInOut .form-floating input.form-control, #Dest .motoreDiRicerca .input-group.input-group-checkInOut .form-floating input.form-control{background: #fff;} #Engi .motoreDiRicerca, #Dest .motoreDiRicerca{height: auto; top: -35px;} #Engi .motoreDiRicerca > div, #Dest .motoreDiRicerca > div{margin-bottom: 10px;} } /* ! ___display-max-lg */ @media (max-width: 991.98px) { #Engi .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Dest .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo{ width: 100%;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { #Engi .motoreDiRicerca, #Dest .motoreDiRicerca{top: -170px;} #Engi .motoreDiRicerca .input-group.input-group-destinazioni, #Dest .motoreDiRicerca .input-group.input-group-destinazioni{width: 100%;} #Engi .motoreDiRicerca .input-group.input-group-porti, #Dest .motoreDiRicerca .input-group.input-group-porti{width: 100%;} #Engi .motoreDiRicerca .input-group.input-group-mesi, #Dest .motoreDiRicerca .input-group.input-group-mesi{width: 100%;} #Engi .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Dest .motoreDiRicerca .input-group.input-group-rangePriceDaA{width: 100%;} #Engi .motoreDiRicerca .input-group.input-group-tipologie, #Dest .motoreDiRicerca .input-group.input-group-tipologie{width: 100%;} #Engi .motoreDiRicerca .input-group.input-group-strutture, #Dest .motoreDiRicerca .input-group.input-group-strutture{width: 100%;} #Engi .motoreDiRicerca .input-group.input-group-checkInOut, #Dest .motoreDiRicerca .input-group.input-group-checkInOut{width: 100%;} #Engi .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Dest .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo{padding: 0 10px; margin-left: 15px; /*width: 45%;*/} #Engi .motoreDiRicerca .btn.search, #Dest .motoreDiRicerca .btn.search { width: 25%;} } /* ! - Engi & Stru & Tore & Crue */ #Home .motoreDiRicerca, #Tore .motoreDiRicerca, #Crue .motoreDiRicerca, #Stru .motoreDiRicerca { position: relative; display: flex; flex-direction: row; justify-content: space-between; } #Home .motoreDiRicerca > div, #Tore .motoreDiRicerca > div, #Crue .motoreDiRicerca > div, #Stru .motoreDiRicerca > div{ height: 50px;} #Home .motoreDiRicerca > div > span, #Stru .motoreDiRicerca > div > span, #Tore .motoreDiRicerca > div > span, #Crue .motoreDiRicerca > div > span, #Home .motoreDiRicerca > div > .form-floating, #Stru .motoreDiRicerca > div > .form-floating, #Tore .motoreDiRicerca > div > .form-floating, #Crue .motoreDiRicerca > div > .form-floating, #Home .motoreDiRicerca > div > .form-floating > input, #Stru .motoreDiRicerca > div > .form-floating > input{ height: inherit; width: auto;} #Home .motoreDiRicerca, #Tore .motoreDiRicerca, #Crue .motoreDiRicerca, #Stru .motoreDiRicerca{display: flex; flex-wrap: nowrap;} #Home .motoreDiRicerca > div, #Tore .motoreDiRicerca > div, #Crue .motoreDiRicerca > div, #Stru .motoreDiRicerca > div{margin-bottom: 0;} #Home .motoreDiRicerca .input-group-checkInOut, #Tore .motoreDiRicerca .input-group-checkInOut, #Crue .motoreDiRicerca .input-group-checkInOut, #Stru .motoreDiRicerca .input-group-checkInOut{margin: 0;} #Engi .motoreDiRicerca .input-group-checkInOut, #Dest .motoreDiRicerca .input-group-checkInOut{margin-top: 0;} #Home .motoreDiRicerca > div.input-group-rangePrezzo, #Crue .motoreDiRicerca > div.input-group-rangePrezzo, #Tore .motoreDiRicerca > div.input-group-rangePrezzo, #Stru .motoreDiRicerca > div.input-group-rangePrezzo{margin: 0;} #Home .motoreDiRicerca div.input-group-rangePrezzo .tooltip-inner, #Tore .motoreDiRicerca div.input-group-rangePrezzo .tooltip-inner, #Crue .motoreDiRicerca div.input-group-rangePrezzo .tooltip-inner, #Stru .motoreDiRicerca div.input-group-rangePrezzo .tooltip-inner{color: #000!important;} #Home .motoreDiRicerca .input-group.input-group-destinazioni, #Tore .motoreDiRicerca .input-group.input-group-destinazioni, #Crue .motoreDiRicerca .input-group.input-group-destinazioni, #Stru .motoreDiRicerca .input-group.input-group-destinazioni{width: 175px;} #Home .motoreDiRicerca .input-group.input-group-porti, #Tore .motoreDiRicerca .input-group.input-group-porti, #Crue .motoreDiRicerca .input-group.input-group-porti, #Stru .motoreDiRicerca .input-group.input-group-porti{width: 175px;} #Home .motoreDiRicerca .input-group.input-group-mesi, #Tore .motoreDiRicerca .input-group.input-group-mesi, #Crue .motoreDiRicerca .input-group.input-group-mesi, #Stru .motoreDiRicerca .input-group.input-group-mesi{width: 175px;} #Home .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Tore .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Crue .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Stru .motoreDiRicerca .input-group.input-group-rangePriceDaA{width: 175px;} #Home .motoreDiRicerca .input-group.input-group-tipologie, #Tore .motoreDiRicerca .input-group.input-group-tipologie, #Crue .motoreDiRicerca .input-group.input-group-tipologie, #Stru .motoreDiRicerca .input-group.input-group-tipologie{width: 150px;} #Home .motoreDiRicerca .input-group.input-group-strutture, #Tore .motoreDiRicerca .input-group.input-group-strutture, #Crue .motoreDiRicerca .input-group.input-group-strutture, #Stru .motoreDiRicerca .input-group.input-group-strutture{width: 135px;} #Home .motoreDiRicerca .input-group.input-group-guest, #Tore .motoreDiRicerca .input-group.input-group-guest, #Crue .motoreDiRicerca .input-group.input-group-guest, #Stru .motoreDiRicerca .input-group.input-group-guest{width: 200px;} .motoreDiRicerca .input-group.input-group-checkInOut, .motoreDiRicerca .input-group.input-group-checkInOut, .motoreDiRicerca .input-group.input-group-checkInOut, .motoreDiRicerca .input-group.input-group-checkInOut{display: grid; width: 260px;} #Home .motoreDiRicerca .input-group-checkInOut span:first-child, #Tore .motoreDiRicerca .input-group-checkInOut span:first-child, #Crue .motoreDiRicerca .input-group-checkInOut span:first-child, #Stru .motoreDiRicerca .input-group-checkInOut span:first-child{ grid-column: 1; grid-row: 1;} #Home .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1), #Tore .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1), #Crue .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1), #Stru .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1){ grid-column: 2; grid-row: 1; width: auto;} #Home .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2), #Tore .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2), #Crue .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2), #Stru .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2){ grid-column: 3; grid-row: 1; width: auto;} #Home .motoreDiRicerca .input-group-checkInOut.date-range-picker .date-input, #Tore .motoreDiRicerca .input-group-checkInOut.date-range-picker .date-input, #Crue .motoreDiRicerca .input-group-checkInOut.date-range-picker .date-input, #Stru .motoreDiRicerca .input-group-checkInOut.date-range-picker .date-input{ width: 100%;} #Home .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Tore .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Crue .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Stru .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo{padding: 0px 10px; width: 130px;} #Home .motoreDiRicerca .btn.search, #Tore .motoreDiRicerca .btn.search, #Crue .motoreDiRicerca .btn.search, #Stru .motoreDiRicerca .btn.search{width: 65px;} #Home .motoreDiRicerca .FindType, #Tore .motoreDiRicerca .FindType, #Crue .motoreDiRicerca .FindType, #Stru .motoreDiRicerca .FindType{min-width: 100px;} /* ! ___display-max-md */ @media (max-width: 767.98px) { #Home .motoreDiRicerca, #Tore .motoreDiRicerca, #Crue .motoreDiRicerca, #Stru .motoreDiRicerca{display: flex; flex-wrap: wrap; gap: 15px;} #Home .motoreDiRicerca .input-group.input-group-destinazioni, #Tore .motoreDiRicerca .input-group.input-group-destinazioni, #Crue .motoreDiRicerca .input-group.input-group-destinazioni, #Stru .motoreDiRicerca .input-group.input-group-destinazioni{width: 100%;} #Home .motoreDiRicerca .input-group.input-group-porti, #Tore .motoreDiRicerca .input-group.input-group-porti, #Crue .motoreDiRicerca .input-group.input-group-porti, #Stru .motoreDiRicerca .input-group.input-group-porti{width: 100%;} #Home .motoreDiRicerca .input-group.input-group-mesi, #Tore .motoreDiRicerca .input-group.input-group-mesi, #Crue .motoreDiRicerca .input-group.input-group-mesi, #Stru .motoreDiRicerca .input-group.input-group-mesi{width: 100%;} #Home .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Tore .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Crue .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Stru .motoreDiRicerca .input-group.input-group-rangePriceDaA{width: 100%;} #Home .motoreDiRicerca .input-group.input-group-tipologie, #Tore .motoreDiRicerca .input-group.input-group-tipologie, #Crue .motoreDiRicerca .input-group.input-group-tipologie, #Stru .motoreDiRicerca .input-group.input-group-tipologie{width: 100%;} #Home .motoreDiRicerca .input-group.input-group-strutture, #Tore .motoreDiRicerca .input-group.input-group-strutture, #Crue .motoreDiRicerca .input-group.input-group-strutture, #Stru .motoreDiRicerca .input-group.input-group-strutture{width: 100%;} #Home .motoreDiRicerca .input-group.input-group-guest, #Tore .motoreDiRicerca .input-group.input-group-guest, #Crue .motoreDiRicerca .input-group.input-group-guest, #Stru .motoreDiRicerca .input-group.input-group-guest{width: 100%;} #Home .motoreDiRicerca .input-group.input-group-checkInOut, #Tore .motoreDiRicerca .input-group.input-group-checkInOut, #Crue .motoreDiRicerca .input-group.input-group-checkInOut, #Stru .motoreDiRicerca .input-group.input-group-checkInOut{width: 100%; grid-template-columns: 35px 46% 46.5%;} #Home .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Tore .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Crue .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Stru .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo{width: 100%;} #Home .motoreDiRicerca .btn.search, #Tore .motoreDiRicerca .btn.search, #Crue .motoreDiRicerca .btn.search, #Stru .motoreDiRicerca .btn.search{width: 100%; padding: 5px;} #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label, #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .guest-label{padding-left: 5px;} #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label{padding-right: 10px;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-strutture .form-floating input.form-control, #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-checkInOut .form-floating input.form-control { padding-right: 5px; } #Home .motoreDiRicerca .input-group.input-group-checkInOut, #Tore .motoreDiRicerca .input-group.input-group-checkInOut, #Crue .motoreDiRicerca .input-group.input-group-checkInOut, #Stru .motoreDiRicerca .input-group.input-group-checkInOut{width: 100%; grid-template-columns: 35px 46% 45.5%;} } /* ! ___display-min-md */ @media (min-width: 768px) { #Home .motoreDiRicerca, #Tore .motoreDiRicerca, #Crue .motoreDiRicerca, #Stru .motoreDiRicerca{display: flex; flex-wrap: wrap; gap: 15px;} #Home .motoreDiRicerca .btn.search, #Tore .motoreDiRicerca .btn.search, #Crue .motoreDiRicerca .btn.search, #Stru .motoreDiRicerca .btn.search{width: 100%; padding: 5px;} #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label, #Stru .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label, #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .guest-label, #Stru .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .guest-label{padding-left: 5px;} #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label, #Stru .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label{padding-right: 10px;} } /* ! ___display-min-lg */ @media (min-width: 992px) { #Home .motoreDiRicerca, #Tore .motoreDiRicerca, #Crue .motoreDiRicerca, #Stru .motoreDiRicerca{display: flex; flex-wrap: wrap; gap: 15px;} #Home .motoreDiRicerca .btn.search, #Tore .motoreDiRicerca .btn.search, #Crue .motoreDiRicerca .btn.search, #Stru .motoreDiRicerca .btn.search{width: 60px; padding: 5px;} #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label, #Stru .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label, #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .guest-label, #Stru .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .guest-label{padding-left: 1px;} #Home .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label, #Stru .SECTION_motore .motoreDiRicerca .input-group.input-group-guest .room-label{padding-right: 5px;} } /* ! ___display-min-xl */ @media (min-width: 1200px) { #Home .motoreDiRicerca, #Tore .motoreDiRicerca, #Crue .motoreDiRicerca, #Stru .motoreDiRicerca{flex-wrap: nowrap;gap: 10px; padding: 10px;} #Home .motoreDiRicerca .input-group.input-group-destinazioni, #Tore .motoreDiRicerca .input-group.input-group-destinazioni, #Crue .motoreDiRicerca .input-group.input-group-destinazioni, #Stru .motoreDiRicerca .input-group.input-group-destinazioni{width: 250px;} #Home .motoreDiRicerca .input-group.input-group-porti, #Tore .motoreDiRicerca .input-group.input-group-porti, #Crue .motoreDiRicerca .input-group.input-group-porti, #Stru .motoreDiRicerca .input-group.input-group-porti{width: 250px;} #Home .motoreDiRicerca .input-group.input-group-mesi, #Tore .motoreDiRicerca .input-group.input-group-mesi, #Crue .motoreDiRicerca .input-group.input-group-mesi, #Stru .motoreDiRicerca .input-group.input-group-mesi{width: 200px;} #Home .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Tore .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Crue .motoreDiRicerca .input-group.input-group-rangePriceDaA, #Stru .motoreDiRicerca .input-group.input-group-rangePriceDaA{width: 200px;} #Home .motoreDiRicerca .input-group.input-group-tipologie, #Tore .motoreDiRicerca .input-group.input-group-tipologie, #Crue .motoreDiRicerca .input-group.input-group-tipologie, #Stru .motoreDiRicerca .input-group.input-group-tipologie{width: 155px;} #Home .motoreDiRicerca .input-group.input-group-strutture, #Tore .motoreDiRicerca .input-group.input-group-strutture, #Crue .motoreDiRicerca .input-group.input-group-strutture, #Stru .motoreDiRicerca .input-group.input-group-strutture{width: 150px;} #Home .motoreDiRicerca .input-group.input-group-guest, #Tore .motoreDiRicerca .input-group.input-group-guest, #Crue .motoreDiRicerca .input-group.input-group-guest, #Stru .motoreDiRicerca .input-group.input-group-guest{width: 195px;} #Home .motoreDiRicerca .input-group.input-group-checkInOut, #Tore .motoreDiRicerca .input-group.input-group-checkInOut, #Crue .motoreDiRicerca .input-group.input-group-checkInOut, #Stru .motoreDiRicerca .input-group.input-group-checkInOut{width: 260px;} #Home .motoreDiRicerca .input-group.input-group-radioDate, #Tore .motoreDiRicerca .input-group.input-group-radioDate, #Crue .motoreDiRicerca .input-group.input-group-radioDate, #Stru .motoreDiRicerca .input-group.input-group-radioDate{width: 310px;} #Home .motoreDiRicerca .input-group.input-group-dates, #Tore .motoreDiRicerca .input-group.input-group-dates, #Crue .motoreDiRicerca .input-group.input-group-dates, #Stru .motoreDiRicerca .input-group.input-group-dates{width: auto;} #Home .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Tore .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Crue .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Stru .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo{width: 105px;} #Home .motoreDiRicerca .btn.search, #Tore .motoreDiRicerca .btn.search, #Crue .motoreDiRicerca .btn.search, #Stru .motoreDiRicerca .btn.search{width: 60px; padding: 5px;} } /* ! ___display-min-xxl */ @media (min-width: 1400px) { #Home .motoreDiRicerca, #Tore .motoreDiRicerca, #Crue .motoreDiRicerca, #Stru .motoreDiRicerca{padding: 20px;} } /* ! - Engi */ #Engi .motoreDiRicerca .form-floating>.form-control:not(:placeholder-shown)~label[for="floatingCheckIn"], #Engi .motoreDiRicerca .form-floating>.form-control:not(:placeholder-shown)~label[for="floatingCheckOut"]{padding: 10px 10px;} #Dest .motoreDiRicerca .form-floating>.form-control:not(:placeholder-shown)~label[for="floatingCheckIn"], #Dest .motoreDiRicerca .form-floating>.form-control:not(:placeholder-shown)~label[for="floatingCheckOut"]{padding: 10px 10px;} #Engi .motoreDiRicerca > div > div.form-floating input.FindCheckOut, #Engi .motoreDiRicerca > div > div.form-floating input.FindCheckIn { padding: 20px 5px 10px 14px;} #Dest .motoreDiRicerca > div > div.form-floating input.FindCheckOut, #Dest .motoreDiRicerca > div > div.form-floating input.FindCheckIn { padding: 20px 5px 10px 14px;} #Home #ListaAmenities { display: none; } #Stru #ListaAmenities { display: none; } #ListaAmenities { padding: 10px 5px;} #ListaAmenities .input-group.input-group-check-amenity { padding-top: 10px; } #ListaAmenities button.btn.btn-checkAmne { width: 160px; text-align: left; background-color: white; color: black; border: 1px solid #ced4da; border-top-right-radius: 0.375rem; border-bottom-right-radius: 0.375rem; } #Dest #ListaAmenities button.btn.btn-checkAmne { width: 140px; } /* -------------------------------------------------------------------------------- */ /* ! MOTORE DI RICERCA 02 - tabs */ /* -------------------------------------------------------------------------------- */ /* ! - general */ .motoreDiRicerca.motoreDiRicerca02{ flex-direction: column!important; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; gap: 5px;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list{ display: flex; flex-direction: row; gap: 5px; border: 1px solid transparent;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list .input-group-text{ display: none;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list .input-group button:not(.btn--active){ border: 1px solid transparent;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list .input-group button.btn--active{ border: 1px solid #000;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list .input-group button span{ padding: 5px;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list .input-group{ width: fit-content;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters{ display: flex; padding: 10px; flex-direction: row; flex-wrap: nowrap; gap: 10px; background: #ffffffbf; backdrop-filter: blur(40px); -webkit-backdrop-filter: blur(40px); box-shadow: 1px 30px 30px -23px #00000038; height: fit-content!important; width: fit-content; border: 1px solid transparent;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .btn.search{height: 50px; width: 55px!important;} .motoreDiRicerca .input-group .find-euro__from, .motoreDiRicerca .input-group .find-euro__to{ width: auto; } .motoreDiRicerca .input-group .find-euro__from input, .motoreDiRicerca .input-group .find-euro__to input{ width: fit-content; max-width: 43px; padding: 0;} #Engi .motoreDiRicerca .input-group .find-euro__from input, #Engi .motoreDiRicerca .input-group .find-euro__to input, #Dest .motoreDiRicerca .input-group .find-euro__from input, #Dest .motoreDiRicerca .input-group .find-euro__to input{ width: fit-content; max-width: 56px;} #Stru .motoreDiRicerca .input-group .find-euro__from input, #Stru .motoreDiRicerca .input-group .find-euro__to input{ width: fit-content; max-width: 72px;} .motoreDiRicerca .input-group .find-euro__from .icon, .motoreDiRicerca .input-group .find-euro__to .icon{ color: #000; opacity: 0.5; font-size: 15px; } #Engi .motoreDiRicerca .input-group .find-euro__from .icon, #Dest .motoreDiRicerca .input-group .find-euro__from .icon { margin-left: -5px; margin-right: 15px;} #Engi .motoreDiRicerca .input-group .find-euro__to .icon, #Dest .motoreDiRicerca .input-group .find-euro__to .icon { margin-left: -5px;} /* ! - input-group default */ .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-guest button.ospiti{padding: 5px;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group span.input-group-text{width: 35px;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePriceDaA span.input-group-text{width: 50px; background-color: transparent;} .motoreDiRicerca .travel-types-list__filters .input-group-rangePriceDaA{ display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-checkInOut{width: fit-content; height: 50px;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-checkInOut .input-group-text{height: 50px;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-checkInOut .form-floating .form-control{ display: block; padding-top: 22px; padding-bottom: 0; height: 100%; border: none;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-checkInOut .form-floating label{ padding: 0.5rem 0.65rem;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-guest .room-number{display: none;} /* Stru checked */ .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-destinazioni{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-tipologie{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-strutture{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-guest{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-checkInOut{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-rangePrezzo{display: inline-flex;} /* .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-rangePriceDaA{display: inline-flex;} */ /* TOUR checked */ .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-destinazioni{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-tipologie{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-strutture{display: none;} /*.motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-guest{display: none;}*/ .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-checkInOut{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-rangePrezzo{display: inline-flex;} /* .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-rangePriceDaA{display: inline-flex;} */ .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-mesi{display: none;} /* CRUE checked */ .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-destinazioni{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-porti{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-mesi{display: inline-flex;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-tipologie{display: none;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-strutture{display: none;} /*.motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-guest{display: none;}*/ .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-checkInOut{display: none;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-rangePrezzo{display: inline-flex;} /* .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--crue .input-group-rangePriceDaA{display: inline-flex;} */ .motoreDiRicerca.motoreDiRicerca02 .input-group-porti { display: none; } .motoreDiRicerca.motoreDiRicerca02 .input-group-mesi { display: none; } /* ! ___display-max-xl */ @media (max-width: 1199.98px) { .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-checkInOut, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-checkInOut{ display: grid; grid-template-columns: [col-first] 35px [col-second] 135px; grid-template-rows: [row-first] 40px [row-second] 40px; } .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-checkInOut .input-group-text{ grid-column-start: col-first; grid-row: 1 / span 2; } .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-checkInOut .form-floating:nth-child(2){ grid-column-start: 2; grid-row: 1;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-checkInOut .form-floating:nth-child(3){ grid-column-start: 2; grid-row: 2; } .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo, #Stru .motoreDiRicerca .slider-wrapper.input-group-rangePrezzo { width: 125px; } .motoreDiRicerca .input-group.input-group-guest, #Stru .motoreDiRicerca .input-group.input-group-guest { width: 185px;} } /* ! ___display-max-lg */ @media (max-width: 991.98px) { .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters{ flex-wrap: wrap; } .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePrezzo, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters button, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .FindCheckOut, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .FindCheckIn{ height: 50px!important;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-destinazioni, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-porti, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-mesi, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePriceDaA, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-tipologie, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-guest, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePrezzo{width: calc(33% - 10px);} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-checkInOut{width: calc(66% - 10px);} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters button.search{width: 100%;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--stru .input-group-checkInOut, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters.filters--tour .input-group-checkInOut{ display: flex; } } /* ! ___display-max-md */ @media (max-width: 767.98px) { .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters{ box-shadow: 1px 5px 40px 0px #00000038;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-destinazioni, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-porti, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-mesi, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePriceDaA, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-tipologie, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-guest, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePrezzo{width: calc(50% - 10px);} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-checkInOut{width: calc(100% - 10px);} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters button.search{width: 100%;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-destinazioni{order: 1} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-porti{order: 1} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-mesi{order: 1} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-tipologie{order: 2;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-strutture{order: 3;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-guest{order: 3;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePrezzo{order: 4;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePriceDaA{order: 4;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-checkInOut{order: 5;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters button.search{order: 6;} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .btn.search{width: 100%!important;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-destinazioni, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-porti, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-mesi, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePriceDaA, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-tipologie{width: calc(100% - 10px);} .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-guest, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-rangePrezzo, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .input-group-checkInOut, .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters button.search{width: calc(100% - 10px);} } /*D:/aa/siti/aaa_ollytour.it/root/css/h2oviaggi/engi.css*/ /* -------------------------------------------------------------------------------- */ /* ! General */ /* -------------------------------------------------------------------------------- */ #Engi main { margin-top: 160px; } #Engi .titolo-ricerca{ font-size: 2rem; color: #fff; display: none;} body#Engi::before { content: ''; filter: blur(0); background: url(/image/hero-1.jpg) no-repeat bottom center fixed !important; background-size: cover !important;} body:not(#Home) main{ background: none;} /* ! ___display-max-lg */ @media (max-width: 991.98px) { #Engi main { margin-top: 0; padding-top: 100px;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { #Engi .SECTION_hero{height: 30vh;margin: 11px;margin-bottom: 25px;border-radius: calc(var(--card-border-radius) + var(--card-padding));} #Engi .titolo-ricerca{ font-size: 1.75rem; } } /* -------------------------------------------------------------------------------- */ /* ! Cover */ /* -------------------------------------------------------------------------------- */ .cover{ background: none!important; height: 35vh; margin: 50px;} .cover .container{ height: 100%;} .cover .container .row{ height: 100%; align-items: center;} .cover__title{ color: #fff; height: fit-content; text-align: center; font-size: 100px;} /* ! ___display-max-xl */ @media (max-width: 1199.98px) { .cover__title{ font-size: 4.5rem;} } /* ! ___display-max-lg */ @media (max-width: 991.98px) { .cover { height: auto; margin: 25px 0 50px 0;} .cover__title{ font-size: 3.5rem;} } /* ! ___display-max-md */ @media (max-width: 767.98px) { .cover__title{ font-size: 3rem;} } /* -------------------------------------------------------------------------------- */ /* ! engi&solutions */ /* -------------------------------------------------------------------------------- */ .engiAndSolutions .container{ backdrop-filter: blur(50px); background: #d4dbe25e; padding: 50px; border-radius: 50px; border: none; box-shadow: -1px -1px 0px 0px #ffffffb3, 3px 0px 5px 0px #655d7021, 1px 1px 0px 0px #ffffff42; box-shadow: -1px -1px 10px 0px #0000000a, inset 1px 1px 4px 0px #ffffffb3, 3px 0px 5px 0px #655d7021, 1px 1px 0px 0px #ffffff42;} /* ! - col engi */ #Engi .motoreDiRicerca .btn.search, #Dest .motoreDiRicerca .btn.search { margin-top: 25px; height: 54px; width: 100%; border: none; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 12px 20px 0px #fff; background: #ffffff5c;} #Engi .motoreDiRicerca .btn.search:hover, #Dest .motoreDiRicerca .btn.search:hover{ border: none; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 0px 10px 0px #ffffffb0 !important; background: #ffffff00 !important;} .input-group-check-stru, .input-group-check-tour{ display: flex; flex-direction: row; flex-wrap: nowrap; position: relative;} .input-group-check-stru button, .input-group-check-tour button, .input-group-check-crue button, .input-group-check-vetr button { border: none; color: #fff; position: absolute!important; left: 0; top: 0; width: 100%; height: 100%; border-radius: 20px!important; box-shadow: -1px -1px 0px 0px #fff, 1px 1px 0px 0px #ffffffa8, 2px -2px 5px 0px #00000017, -2px 2px 5px 0px #02020217, inset 0px 0px 10px 0px #0a03241c;} .input-group-check-stru button:hover, .input-group-check-tour button:hover , .input-group-check-cure button:hover {/*border: 1px solid #ced4da;*/ border: none!important; background: transparent !important;} .input-group-check-stru button span, .input-group-check-tour button span , .input-group-check-crue button span, .input-group-check-vetr button span { font-weight: 300;} #Engi .motoreDiRicerca select, #Engi .motoreDiRicerca input { border-radius: 10px !important; margin-top: 0;} .motoreDiRicerca .tooltip .tooltip-inner { color: #ffffff !important;} /* ! - sols */ /* ! ___display-max-lg */ @media (max-width: 991.98px) { .engiAndSolutions .buttons-filter{ margin-bottom: 25px;} .engiAndSolutions .ColEngiFiltSols{margin-top: 50px;} } /* ! ___display-max-md */ @media (max-width: 767.98px) { .engiAndSolutions .container{padding: 25px; max-width: 100%;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .ColEngiFiltSols{ margin-top: 200px;} } /* -------------------------------------------------------------------------------- */ /* ! Card */ /* -------------------------------------------------------------------------------- */ /* ! - all cards */ #Engi .card{background: #ffffff57; height: fit-content;margin-bottom: 25px;border-radius: var(--var-borderRadius-3); /*box-shadow: 0px 10px 25px -18px #00000052;*/ box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 0px 30px 0px #0a03241c;} #Engi .card .card-body{ display: grid; grid-template-columns: calc(30% - 10px) calc(51% - 10px) calc(19% - 10px); grid-template-rows: /*28px 34px 34px auto*/ 28px 44px 17px 20px 77px; height: 235px; gap: 5px 15px;} #Engi .card .card-body .carousel{ grid-column: 1 / span 1; grid-row: 1 / span 5;} #Engi .card .carousel .carousel-item{border-radius: 12px; overflow: hidden;} #Engi .card .carousel .carousel-inner .carousel-item { height: 195px;} #Engi .card .card-body .card__title-2{ font-family: 'poppins', sans-serif;} #Engi .card .card-body .card__title-1{ grid-column: 2 / span 1; grid-row: 2; font-size: 1.25rem; line-height: 1.25rem; font-family: 'poppins', sans-serif; font-weight: 500; -webkit-line-clamp: 2; -webkit-box-orient: vertical;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; min-height: 40px; max-height: 44px; margin-bottom: 0;} #Engi .card .card-body .card__desc-2{ grid-column: 2 / span 1; grid-row: 4; font-size: 16px; font-weight: 300; opacity: 0.4; margin-bottom: 0;} #Engi .card .card-body .card__text{ grid-column: 2 / span 1; grid-row: 5; margin-bottom: 0px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; min-height: 74px; max-height: 74px; margin-right: 25px; font-family: 'poppins', sans-serif; font-weight: 300;} #Engi .card .card-body .card__price{grid-column: 3; grid-row: 1;} #Engi .card .card-body .card__price__label{margin-right: 10px;} #Engi .card .card-body .card__price__value{ font-weight: 600;} #Engi .card .card-body .card__basedesc__value{ opacity: 0.45; font-style: italic; line-height: 18px; font-size: 0.85rem; display: block;} #Engi .card .card-body .card__basedesc{grid-column: 3; grid-row: 2;} #Engi .card .card-body .card__link{ grid-column: 3; grid-row: 5; width: 100%; height: fit-content; margin-top: auto; margin-bottom: 5px; padding: 15px 10px;border: none; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 12px 20px 0px #fff; background: #ffffff5c;} #Engi .card .card-body .card__link:hover{ box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 0px 10px 0px #ffffffb0 !important; background: #ffffff00 !important;} #Engi .card:last-child{ margin-bottom: 0;} /* ! - card-STRU */ #Engi .card[sorg="STRU"] .card-body .card__stars{ grid-column: 2 / span 1; grid-row: 1;} #Engi .card[sorg="STRU"] .card-body .card__stars .icon{font-size: 20px; margin-bottom: 0;} #Engi .card[sorg="STRU"] .card-body .card__title-2{ /*display: none;*/ grid-row: 3; grid-column: 2; font-size: 16px; margin-bottom: 0;} #Engi .card[sorg="STRU"] .card-body::after { content: 'Hotel'; position: absolute; top: -10px; left: -10px; background: #ffffff82; color: #003d66; font-family: 'poppins', sans-serif; padding: 15px; border-radius: 25px; box-shadow: 0px 0px 10px 0px #00000030; transform: rotate(-5deg); backdrop-filter: blur(5px); -webkit-backdrop-filter:blur(5px)} /* ! - card-TORE */ #Engi .card[sorg="TORE"] { background: #003d6624;} #Engi .card[sorg="TORE"] .card-body .card__stars{ display: none;} #Engi .card[sorg="TORE"] .card-body .card__title-2{ display: none;} #Engi .card[sorg="TORE"] .card-body .card__title-1{ grid-column: 2 / span 1; grid-row: 1 / span 2;} #Engi .card[sorg="TORE"] .card-body .card__desc-2{ grid-column: 2 / span 1; grid-row: 3;} #Engi .card[sorg="TORE"] .card-body .card__text{ grid-column: 2 / span 1; grid-row: 4; /*max-height: 99px; -webkit-line-clamp: 4;*/} #Engi .card .card-body-header .card__title-1{margin-bottom: 0;} #Engi .card .card-body-header .card__localita{font-size: 1.15rem;font-weight: 300;opacity: 0.75;margin-bottom: 0.5rem;} #Engi .card .card-body-text .card__text-1{margin-bottom: 0px;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;min-height: 60px; max-height: 67px;margin-right: 25px;} #Engi .card .card-body-text .card__prezzo{top: 25px;right: 25px;background: #fff;border-radius: var(--var-borderRadius-1);padding: 5px 10px;} #Engi .card .card-body-text .card__prezzo__prezzo{font-weight: 600;} #Engi .card[sorg="TORE"] .card-body::after{ content: 'Tour'; position: absolute; top: -5px; left: -5px; background: #003d66; color: #fff; font-family: 'poppins', sans-serif; padding: 15px; border-radius: 25px; transform: rotate(-5deg);} /* ! - card-crue */ #Engi .card[sorg="CRUE"] .card-body::after{ content: 'Crociera'; position: absolute; top: -5px; left: -5px; background: #ffffffd6; border: 3px solid #dcff00; color: #003d66; font-family: 'poppins', sans-serif; padding: 15px; border-radius: 25px; transform: rotate(-5deg);} /* ! ___display-max-xxl */ @media (max-width: 1399.98px) { #Engi .card .card-body { grid-template-columns: calc(30% - 10px) calc(52% - 10px) calc(18% - 10px); } } /* ! ___display-max-xl */ @media (max-width: 1199.98px) { /* #Engi .card .card-body{ grid-template-rows: 26px 56px 27px auto; } */ #Engi .card .card-body .card-link{padding: 0.75rem 1rem;} } /* ! ___display-max-lg */ @media (max-width: 991.98px) { .col-risultati{display: flex;flex-direction: row;flex-wrap: wrap;gap: 10px 10px;} .col-risultati > p{width: 100%;} ul.card__stars svg{ width: 20px; height: 20px; } #Engi .card .card-body{grid-template-columns: calc(30% - 10px) calc(47% - 10px) calc(23% - 10px);} } /* ! ___display-max-md */ @media (max-width: 767.98px) { #Engi .card .card-body { grid-template-columns: calc(26% - 10px) calc(50% - 10px) calc(24% - 10px); } #Engi .card{width: 100%;} #Engi .card .card-body .card__title-1{min-height: 50px; max-height: 50px; line-height: 25px;} #Engi .card .card-body .card__desc-2{/*display: none;*/ font-size: 1rem;} /* #Engi .card .card-body { grid-template-rows: 25px 56px 24px auto;} */ #Engi .card .card-body .card__stars svg { width: 16px; height: 16px;} #Engi .card[sorg="TORE"] .card-body .card__title-1{-webkit-line-clamp: 3; min-height: 70px; max-height: 70px;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { #Engi .card .card-body { height: auto; gap: 5px 15px; grid-template-columns: calc(35% - 10px) calc(50% - 10px) calc(15% - 10px); grid-template-rows: 28px 44px 17px 20px 77px 50px; } #Engi .card .card-body .carousel { grid-column: 1 / span 1; grid-row: 1 / span 6; } #Engi .card .card-body .carousel .carousel-inner{ height: 100%;} #Engi .card .card-body .carousel .carousel-inner .carousel-item{height: 100%;} #Engi .card .card-body .card__stars svg { width: 16px; height: 16px; margin-right: 0px; margin-bottom: 0;} #Engi .card .card-body .card__title-2{font-size: 0.85rem; font-weight: 300;} #Engi .card .card-body .card__title-1{ font-size: 1.15rem; line-height: 20px; min-height: 20px; max-height: 61px; margin-bottom: 0;} #Engi .card .card-body .card__desc-2{ margin-bottom: 0; } #Engi .card:not(sorg="STRU") .card-body .card__text { line-height: 19px; max-height: 59px; font-size: 0.95rem; margin-right: 0; grid-column: 2 / span 2; grid-row: 2 / span 2;} #Engi .card .card-body .card__link { margin-bottom: 0; grid-column: 2 / span 2;} #Engi .card .card-body .card__price { position: relative; z-index: 9; font-style: italic; line-height: 18px; font-size: 0.85rem; display: block;} #Engi .card .card-body .card__price__label { margin-right: 5px; } /* #Engi .card[sorg="STRU"] .card-body {grid-template-columns: calc(35% - 10px) calc(40% - 10px) calc(25% - 10px)} #Engi .card[sorg="STRU"] .card-body .card__title-1, #Engi .card[sorg="STRU"] .card-body .card__title-2, #Engi .card[sorg="STRU"] .card-body .card__text, #Engi .card[sorg="STRU"] .card-body .card__desc-2, #Engi .card[sorg="STRU"] .card-body .card__text{ grid-column: 2 / span 2;} #Engi .card[sorg="STRU"] .card-body .card__link {grid-row: 6;} #Engi .card[sorg="STRU"] .card-body .card__text{margin-right: 0;} #Engi .card[sorg="STRU"] .card-body .card__price{padding-top: 5px;} */ #Engi .card[sorg="STRU"] .card-body {grid-template-columns: 100%; grid-template-rows: 30px 100px 20px 20px 20px 70px 56px;} #Engi .card[sorg="STRU"] .card-body::after { content: 'Resort'; grid-column: 1; grid-row: 1; width: fit-content; margin-left: -5px; margin-top: -5px; backdrop-filter: blur(5px); /*background: #ffffffd6; border: 3px solid #dcff00; color: #003d66;*/ font-family: 'poppins', sans-serif; padding: 14px 15px; border-radius: 25px; transform: rotate(-5deg);} #Engi .card[sorg="STRU"] .card-body .carousel { grid-column: 1 / span 1; grid-row: 1 / span 2; } #Engi .card[sorg="STRU"] .card-body .card__title-1, #Engi .card[sorg="STRU"] .card-body .card__title-2, #Engi .card[sorg="STRU"] .card-body .card__text, #Engi .card[sorg="STRU"] .card-body .card__desc-2, #Engi .card[sorg="STRU"] .card-body .card__text{ grid-column: 1 / span 1;} #Engi .card[sorg="STRU"] .card-body .card__title-1{grid-row: 3;} #Engi .card[sorg="STRU"] .card-body .card__title-2{ margin-bottom: 0; grid-row: 4;} #Engi .card[sorg="STRU"] .card-body .card__stars { grid-column: 1 / span 1; grid-row: 2; margin-top: auto; margin-bottom: 0; margin-left: 5px;} #Engi .card[sorg="STRU"] .card-body .card__desc-2{ grid-row: 5;} #Engi .card[sorg="STRU"] .card-body .card__link {grid-row: 7; grid-column: 1;} #Engi .card[sorg="STRU"] .card-body .card__text{margin-right: 0; grid-row: 6;} #Engi .card[sorg="STRU"] .card-body .card__price{ grid-column: 1; grid-row: 1; margin-left: auto; background: #ffffff99; backdrop-filter: blur(5px); -webkit-backdrop-filter:blur(5px); padding: 2px 8px; border-radius: 8px; margin-top: 5px; margin-right: 5px;} /* #Engi .card[sorg="TORE"] .card-body { grid-template-rows: 20px 69px 62px 18px 17px 52px; grid-template-columns: calc(40% - 5px) calc(60% - 0px); height: auto; } #Engi .card[sorg="TORE"] .card-body .card__stars { display: none; } #Engi .card[sorg="TORE"] .card-body .card__title-2{ display: block; grid-column: 2 / span 2; grid-row: 1; margin-bottom: 0;} #Engi .card[sorg="TORE"] .card-body .card__title-1 { grid-column: 2 / span 2; grid-row: 2; margin-bottom: 0; min-height: 60px; max-height: 60px;} #Engi .card[sorg="TORE"] .card-body .card__desc-2 {display: none;} #Engi .card[sorg="TORE"] .card-body .card__text { grid-column: 2 / span 1; grid-row: 3; max-height: 60px; -webkit-line-clamp: 3;} #Engi .card[sorg="TORE"] .card-body .card__price{grid-column: 2; grid-row: 4;} #Engi .card[sorg="TORE"] .card-body .card__basedesc{ grid-column: 2; grid-row: 5; margin-right: 10px;} #Engi .card[sorg="TORE"] .card-body .card__basedesc__value { font-size: 0.75rem;} #Engi .card[sorg="TORE"] .card-body .card__link { grid-column: 2; grid-row: 6; width: calc(100% - 8px); } */ #Engi .card[sorg="TORE"] .card-body {grid-template-columns: 100%; grid-template-rows: 30px 100px 40px 70px 56px;} #Engi .card[sorg="TORE"] .card-body::after { content: 'Tour'; grid-column: 1; grid-row: 1; width: fit-content; margin-left: -5px; margin-top: -5px; backdrop-filter: blur(5px); /*background: #ffffffd6; border: 3px solid #dcff00; color: #003d66;*/ font-family: 'poppins', sans-serif; padding: 14px 15px; border-radius: 25px; transform: rotate(-5deg);} #Engi .card[sorg="TORE"] .card-body .carousel { grid-column: 1 / span 1; grid-row: 1 / span 2; } #Engi .card[sorg="TORE"] .card-body .card__title-2{ margin-bottom: 0;} #Engi .card[sorg="TORE"] .card-body .card__title-1{grid-row: 3;} #Engi .card[sorg="TORE"] .card-body .card__title-1, #Engi .card[sorg="TORE"] .card-body .card__title-2, #Engi .card[sorg="TORE"] .card-body .card__text, #Engi .card[sorg="TORE"] .card-body .card__desc-2, #Engi .card[sorg="TORE"] .card-body .card__text{ grid-column: 1 / span 1;} #Engi .card[sorg="TORE"] .card-body .card__link {grid-row: 5; grid-column: 1;} #Engi .card[sorg="TORE"] .card-body .card__text{margin-right: 0;} #Engi .card[sorg="TORE"] .card-body .card__price{ grid-column: 1; grid-row: 1; margin-left: auto; background: #ffffff99; padding: 2px 8px; border-radius: 8px; margin-top: 5px; margin-right: 5px;} #Engi .card[sorg="CRUE"] .card-body {grid-template-columns: 100%; grid-template-rows: 30px 100px 20px 50px 70px 56px;} #Engi .card[sorg="CRUE"] .card-body::after { content: 'Crociera'; grid-column: 1; grid-row: 1; width: fit-content; margin-left: -5px; margin-top: -5px; backdrop-filter: blur(5px); background: #ffffffd6; border: 3px solid #dcff00; color: #003d66; font-family: 'poppins', sans-serif; padding: 14px 15px; border-radius: 25px; transform: rotate(-5deg);} #Engi .card[sorg="CRUE"] .card-body .carousel { grid-column: 1 / span 1; grid-row: 1 / span 2; } #Engi .card[sorg="CRUE"] .card-body .card__title-2{ margin-bottom: 0;} #Engi .card[sorg="CRUE"] .card-body .card__title-1, #Engi .card[sorg="CRUE"] .card-body .card__title-2, #Engi .card[sorg="CRUE"] .card-body .card__text, #Engi .card[sorg="CRUE"] .card-body .card__desc-2, #Engi .card[sorg="CRUE"] .card-body .card__text{ grid-column: 1 / span 1;} #Engi .card[sorg="CRUE"] .card-body .card__link {grid-row: 6; grid-column: 1;} #Engi .card[sorg="CRUE"] .card-body .card__text{margin-right: 0;} #Engi .card[sorg="CRUE"] .card-body .card__price{ grid-column: 1; grid-row: 1; margin-left: auto; background: #ffffff99; padding: 2px 8px; border-radius: 8px; margin-top: 5px; margin-right: 5px;} } /* -------------------------------------------------------------------------------- */ /* ! Motore */ /* -------------------------------------------------------------------------------- */ .motoreDiRicerca .input-group .input-group-text{ height: 50px !important; width: 50px !important; background: transparent; border: none;} .motoreDiRicerca .input-group .input-group-text .icon{ padding: 0;} #Crue .motoreDiRicerca, #Stru .motoreDiRicerca { gap: 0px; } #Home .motoreDiRicerca .input-group select, #Stru .motoreDiRicerca .input-group select, #Tore .motoreDiRicerca .input-group select, #Crue .motoreDiRicerca .input-group select, #Dest .motoreDiRicerca .input-group select, #Engi .motoreDiRicerca .input-group select, #Home .motoreDiRicerca .input-group.input-group-tipologie select, #Stru .motoreDiRicerca .input-group.input-group-tipologie select, #Tore .motoreDiRicerca .input-group.input-group-tipologie select, #Crue .motoreDiRicerca .input-group.input-group-tipologie select, #Dest .motoreDiRicerca .input-group.input-group-tipologie select, #Engi .motoreDiRicerca .input-group.input-group-tipologie select, #Engi .motoreDiRicerca > div > div.form-floating input.FindStru, #Dest .motoreDiRicerca > div > div.form-floating input.FindStru, #Engi .motoreDiRicerca > div > div.form-floating input.FindCheckIn, #Dest .motoreDiRicerca > div > div.form-floating input.FindCheckIn, #Engi .motoreDiRicerca > div > div.form-floating input.FindCheckOut, #Dest .motoreDiRicerca > div > div.form-floating input.FindCheckOut{ border: none; background: #006a903d!important; backdrop-filter: blur(50px)!important; border-radius: 20px!important; color: #fff!important; position: absolute; width: 100%; height: 100%; padding-left: 55px!important; box-shadow: -1px -1px 0px 0px #fff, 1px 1px 0px 0px #ffffffa8, 2px -2px 5px 0px #00000017, -2px 2px 5px 0px #02020217, inset 0px 0px 10px 0px #0a03241c; transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} #Crue .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .btn.search { height: auto; width: fit-content !important;} #Crue .motoreDiRicerca.motoreDiRicerca02 .travel-types-list__filters .btn.search:hover{ border: none;} .motoreDiRicerca .input-group-guest{ border: none; background: #006a903d !important; backdrop-filter: blur(50px) !important; border-radius: 20px !important; color: #fff !important; box-shadow: -1px -1px 0px 0px #fff, 1px 1px 0px 0px #ffffffa8, 2px -2px 5px 0px #00000017, -2px 2px 5px 0px #02020217, inset 0px 0px 10px 0px #0a03241c; transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} .motoreDiRicerca .input-group-guest .btn.ospiti{ background-color: transparent; box-shadow: none; color: #fff; font-weight: 400; border: none;} .motoreDiRicerca .input-group-guest .btn.ospiti:hover{ box-shadow: none!important;} .motoreDiRicerca .input-group-guest .btn.ospiti span{ font-size: 16px;} .input-group-rangePriceDaA{ border: none; background: #006a903d !important; backdrop-filter: blur(50px) !important; border-radius: 20px !important; color: #fff !important; height: 100%; box-shadow: -1px -1px 0px 0px #fff, 1px 1px 0px 0px #ffffffa8, 2px -2px 5px 0px #00000017, -2px 2px 5px 0px #02020217, inset 0px 0px 10px 0px #0a03241c; transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} .input-group-rangePriceDaA .find-euro__from, .input-group-rangePriceDaA .find-euro__to{ display: flex; align-items: center; flex-direction: row; flex-wrap: nowrap;} .motoreDiRicerca .input-group .find-euro__from .icon, .motoreDiRicerca .input-group .find-euro__to .icon { padding: 0;} .motoreDiRicerca .input-group.input-group-rangePriceDaA input{margin-left: 5px!important; background: #ffffff47;} #Engi .motoreDiRicerca .input-group-checkInOut, #Dest .motoreDiRicerca .input-group-checkInOut { grid-template-columns: [first] 50px; grid-template-rows: 52px 52px; gap: 0px !important; border-radius: 20px; box-shadow: -1px -1px 0px 0px #fff, 1px 1px 0px 0px #ffffffa8, 2px -2px 5px 0px #00000017, -2px 2px 5px 0px #02020217, inset 0px 0px 10px 0px #0a03241c;} #Engi .motoreDiRicerca > div > div.form-floating input.FindCheckIn, #Engi .motoreDiRicerca > div > div.form-floating input.FindCheckOut{ box-shadow: none!important;} .col-engine{ height: fit-content;} .col-engine input:hover, .col-engine select:hover{ box-shadow: -1px -1px 0px 0px #fff, 1px 1px 0px 0px #ffffffa8, 2px -2px 5px 0px #00000017, -2px 2px 5px 0px #02020217, inset 0px 0px 10px 0px #0a032430!important;} .motoreDiRicerca .slider-track { background-image: none; border-radius: 4px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#fff9f9f9', GradientType=0); -webkit-box-shadow: -1px -1px 0px 0px #fff, 1px 1px 0px 0px #ffffffa8, 2px -2px 5px 0px #00000017, -2px 2px 5px 0px #02020217, inset 0px 0px 10px 0px #0a03241c; box-shadow: -1px -1px 0px 0px #fff, 1px 1px 0px 0px #ffffffa8, 2px -2px 5px 0px #00000017, -2px 2px 5px 0px #02020217, inset 0px 0px 10px 0px #0a03241c;} .motoreDiRicerca .slider-selection { background: #e9ecef47 !important; box-shadow: 1px 4px 7px 0px #ffffff30, 2px -3px 7px 0px #ffffff, -2px -3px 9px 0px #02020200, inset 15px 3px 10px 0px #ffffffb0;} .motoreDiRicerca .slider-handle { background-color: #ffffff; -webkit-box-shadow: 1px 1px 5px -2px rgb(0 0 0 / 75%) !important; -moz-box-shadow: 1px 1px 5px -2px rgba(0, 0, 0, 0.75) !important; box-shadow: 0px 0px 0px 2px #fff, 0px 0px 0px 0px #ffffffa8, 0px 0px 5px 0px #00000017, 0px 0px 5px 0px #02020217, inset 0px 0px 10px 0px #0a032442 !important;} #Engi .motoreDiRicerca .form-floating>label, #Dest .motoreDiRicerca .form-floating>label{ color: #fff;} #Engi .motoreDiRicerca input[type="date"]::-webkit-datetime-edit { filter: invert(1); } #Engi .motoreDiRicerca .input-group-checkInOut .form-floating { margin-left: 0px; margin-right: 0px; } #Engi .motoreDiRicerca .input-group-checkInOut .form-floating, #Dest .motoreDiRicerca .input-group-checkInOut .form-floating { width: 100%; } #Engi .motoreDiRicerca .input-group-text, #Dest .motoreDiRicerca .input-group-text{ border-radius: 20px!important; margin-right: 10px;} #Engi .motoreDiRicerca select, #Engi .motoreDiRicerca input{ border-radius: 10px!important;} #Engi .motoreDiRicerca .form-floating>.form-control:not(:placeholder-shown)~label[for="floatingCheckIn"], #Engi .motoreDiRicerca .form-floating>.form-control:not(:placeholder-shown)~label[for="floatingCheckOut"]{padding: 12px; margin-left: 42px; opacity: 0.65;} .button-filter { display: inline-block; padding: 5px 10px; background: #ffffffc7; border-radius: 13px; margin-right: 10px;} /* ! - travel-types-list */ #Crue .motoreDiRicerca.motoreDiRicerca02 .travel-types-list{ align-items: flex-end;} #Crue .input-group-check-stru, #Crue .input-group-check-tour{ display: none;} .travel-types-list .input-group .input-group-text{ display: block; width: fit-content;} .travel-types-list .input-group .input-group-text input{} .travel-types-list .input-group button{ width: fit-content; background: #a9c6d1;} .travel-types-list .input-group button:hover{ background: #a9c6d1;} .travel-types-list .input-group button span{ display: block; width: fit-content;} /* ! ___display-min-xl */ @media (min-width: 1200px) { #Engi .col-engine { position: sticky; } #Engi .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1), #Dest .motoreDiRicerca .input-group-checkInOut div:nth-of-type(1) { grid-column: 1 / span 3; grid-row: 1; } #Engi .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2), #Dest .motoreDiRicerca .input-group-checkInOut div:nth-of-type(2) { grid-column: 1 / span 3; grid-row: 2; } } /* ! ___display-max-xl */ @media (max-width: 1199.98px) { #Engi .col-engine { position: relative; top: 0;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .col-engine{ height: max-content;} } /*D:/aa/siti/aaa_ollytour.it/root/css/h2oviaggi/comm.css*/ /* -------------------------------------------------------------------------------- */ /* ! Global */ /* -------------------------------------------------------------------------------- */ :root{ /* ! - palette colors */ --color-green: #1ACD5F; --color-yellow: #c3eb45; --color-button--hover: #d7ff5636; --var-color-1: #d7ff56; /* Green */ --var-color-2: #3B4445; /* Cape Cod */ --var-color-3: #A12754; /* Hibiscus */ --var-color-4: #DDDDE0; /* Iron */ --var-color-5: #003D66; /* Blue */ /* ! - other */ --var-img-space-1:20px; --var-borderRadius-1:10px; --var-borderRadius-2:15px; --var-borderRadius-3:25px; --var-marginBottom-section:50px; --bs-body-bg: #EAF4F5; } /* ! - stars */ :root{ /* FILL: riempimento delle icone { '0': vuote; '1': piene } */ --icon-fill: 0; /* WEIGHT: peso delle icone {'100', '200', '300', '400', '500', '600', '700', '800', '900'} */ --icon-wght: 400; /* GRADE: enfasi delle icone - consigliato '0' {'-25', '0', '200'}*/ --icon-GRAD: 0; /* OPTICAL SIZE: all'aumentare dell'icona, i suoi bordi non si inspessiscono { '20', '24', '40', '48' } */ --icon-opsz: 24; } .icon { font-size: 1rem; font-variation-settings: 'FILL' var(--icon-fill), 'wght' var(--icon-wght), 'GRAD' var(--icon-GRAD), 'opsz' var(--icon-opsz);} .outlined .icon { font-family: 'Material Symbols Outlined';} .rounded .icon { font-family: 'Material Symbols Rounded';} .sharp .icon { font-family: 'Material Symbols Sharp';} .icon{ color: #fff; filter: drop-shadow(0 0 0px black); font-size: 1.5rem;} @media (max-width: 991px) { .navbar .dropdown.show {position: static;} } /* -------------------------------------------------------------------------------- */ /* ! General */ /* -------------------------------------------------------------------------------- */ body:not(#Home){ position: relative; overflow-x: hidden;} body:not(#Home)::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; filter: blur(50px)!important; z-index: -1;} .PageDataDiv{ margin-top: 0px;} .galleria01 .galleriaButtonModal img{transform: scale(1); transition: all 0.3s cubic-bezier(.215, .61, .355, 1);} .galleria01 .galleriaButtonModal img:hover{transform: scale(1);} img{ object-fit: cover;} /* ! - Buttons */ button.btn, a.btn, a.button{border: none; color: #000;border-radius: var(--var-borderRadius-2);font-weight: 600;transition: all 0.25s cubic-bezier(.215, .61, .355, 1);width: fit-content;padding: 0.75rem 1.75rem;text-decoration: none; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 12px 20px 0px #fff; background: #ffffff5c;} button.btn:hover, a.btn:hover, a.button:hover{color: #000; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 0px 10px 0px #ffffffb0 !important; background: #ffffff4a !important;} /* ! - stars */ .card__stars svg {width: 20px; height: 20px; fill: #fac02f;} /* ! - social */ ul.nav-list-social{display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: center;} ul.nav-list-social li{margin-right: 10px;margin-left: 10px;} ul.nav-list-social li .icon-social { width: 25px; height: 25px; object-fit: contain; } /* ! - typopgraphy */ p, a, button, .btn, input, select{ font-family: 'poppins', sans-serif;} h1, h2, h3, h4, h5, h6{ font-family: 'eurostile', sans-serif;} h2{ font-size: 80px;} /* ! - modal */ .modal-content{border-radius: var(--var-borderRadius-3);} /* -------------------------------------------------------------------------------- */ /* ! Fonts */ /* -------------------------------------------------------------------------------- */ /* ! -- Poppins */ @font-face { font-family: 'poppins'; src: url('/fonts/h2oviaggi_fonts/poppins-extralight-webfont.woff2') format('woff2'), url('/fonts/h2oviaggi_fonts/poppins-extralight-webfont.woff') format('woff'); font-weight: 200; font-style: normal; } @font-face { font-family: 'poppins'; src: url('/fonts/h2oviaggi_fonts/poppins-light-webfont.woff2') format('woff2'), url('/fonts/h2oviaggi_fonts/poppins-light-webfont.woff') format('woff'); font-weight: 300; font-style: normal; } @font-face { font-family: 'poppins'; src: url('/fonts/h2oviaggi_fonts/poppins-medium-webfont.woff2') format('woff2'), url('/fonts/h2oviaggi_fonts/poppins-medium-webfont.woff') format('woff'); font-weight: 500; font-style: normal; } @font-face { font-family: 'poppins'; src: url('/fonts/h2oviaggi_fonts/poppins-regular-webfont.woff2') format('woff2'), url('/fonts/h2oviaggi_fonts/poppins-regular-webfont.woff') format('woff'); font-weight: 400; font-style: normal; } @font-face { font-family: 'poppins'; src: url('/fonts/h2oviaggi_fonts/poppins-semibold-webfont.woff2') format('woff2'), url('/fonts/h2oviaggi_fonts/poppins-semibold-webfont.woff') format('woff'); font-weight: 600; font-style: normal; } @font-face { font-family: 'poppins'; src: url('/fonts/h2oviaggi_fonts/poppins-bold-webfont.woff2') format('woff2'), url('/fonts/h2oviaggi_fonts/poppins-bold-webfont.woff') format('woff'); font-weight: 700; font-style: normal; } /* ! Eurostile */ @font-face { font-family: 'eurostile'; src: url('/fonts/h2oviaggi_fonts/EurostileRegular.woff2') format('woff2'), url('/fonts/h2oviaggi_fonts/EurostileRegular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } /* -------------------------------------------------------------------------------- */ /* ! Footer */ /* -------------------------------------------------------------------------------- */ footer{ position: relative; margin-top: -5px; height: 1700px; background: #00061B; overflow-y: hidden; width: 100%; overflow-x: hidden;} body:not(#Home) footer { position: relative; margin-top: -5px; height: 1370px; background: none; overflow-y: hidden; width: 100%; overflow-x: hidden;} body:not(#Home) footer .section__backgrounds .background-water { background: linear-gradient(#00061b00 0%, #00EBFD 30% 100%); max-height: 90%; bottom: 0; width: 100%; } /* ! - section__contents */ footer .section__contents{ position: absolute; bottom: 270px; left: 50%; transform: translateX(-50%); z-index: 3; width: 90%; max-width: 1200px; object-fit: contain; background: #cfe1ee94; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 32px; padding: 37px 25px 25px 25px; height: fit-content; color: #fff;} footer .section__contents h3{ font-family: 'poppins', sans-serif; font-size: 18px; font-weight: 700;} footer .section__contents a{ color: #fff;} footer .section__contents a:hover{ color: #fff;} footer .section__contents a:hover img{ filter: invert(1);} footer .section__contents .container .col-logo{ position: absolute; bottom: 250px; left: 50px; z-index: 3;} footer .section__contents .container .col-logo img{ width: 350px; object-fit: contain; height: 200px; left: 30%; position: relative; filter: invert(1);} footer .section__contents .container .col-destinazioni div{ display: flex; flex-direction: row; flex-wrap: wrap; gap: 5px 15px; margin-bottom: 30px;} footer .section__contents .container .col-info{ position: absolute; bottom: -200px; display: flex; flex-wrap: wrap; flex-direction: column; color: #fff;} footer .section__contents .container .col-link-utili ul{ list-style-type: none; padding: 0;} footer .section__contents .container .col-link-utili ul li{ margin-bottom: 5px;} footer .section__contents .container .col-rights-social{ display: flex; justify-content: space-between; align-items: center; flex-wrap: nowrap; margin-top: 25px;} footer .section__contents .container .col-rights-social p{ margin-bottom: 0;} footer ul.nav-list-social li .icon-social { filter: invert(1); } /* ! section__info */ footer .section__info{ position: absolute; bottom: 150px; left: 50%; transform: translateX(-50%); z-index: 3; width: 80%; object-fit: contain; height: fit-content; color: #fff;} footer .section__info .col-info{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;} footer .section__info p{ font-weight: 600; width: fit-content; margin-bottom: 10px; text-shadow: 0px 0px 10px #000;} /* ! - section__backgrounds */ footer .section__backgrounds .container{ max-width: 100%; width: 100%; padding: 0;} footer .section__backgrounds .container .row{ margin: 0; padding: 0;} footer .section__backgrounds .container .col-backgrounds{ padding: 0; overflow-x: hidden;} footer .section__backgrounds .background-water{ position: absolute; bottom: -70%; transform: translateX(-50%); left: 50%; z-index: 1; width: 200%; aspect-ratio: 1 / 1; background: radial-gradient(circle, #00EBFD 0%, #00061B 71%);} footer .section__backgrounds .background-reef{ position: absolute; bottom: 0; z-index: 2; width: 100%; background: url("/image/background-footer.png") no-repeat center center fixed; background-size: cover; aspect-ratio: 1 / 0.7;} footer .section__backgrounds .logo-wrapper{ position: absolute; bottom: 640px; z-index: 5; width: 60%; height: fit-content; left: 50%; transform: translateX(-50%); filter: invert(1);} footer .section__backgrounds .logo-wrapper .background-logo{ filter: drop-shadow(0px 5px 5px #ffffff87);} /* ! ___display-min-xxl */ @media (min-width: 1700px) { footer .section__backgrounds .background-water{ background: linear-gradient(#00061B 0%, #00EBFD 80%); max-height: 90%; bottom: 0; width: 100%; } } /* ! ___display-min-xxl */ @media (min-width: 1400px) { #Home footer .section__backgrounds .background-water { bottom: -90%;} } /* ! ___display-min-xxxl */ @media (min-width: 1600px) { #Home footer .section__backgrounds .background-water { bottom: -100%;} } /* ! ___display-max-lg */ @media (max-width: 991.98px) { footer { height: 1200px;} footer .section__backgrounds .logo-wrapper { position: absolute; top: 260px; bottom: unset;} footer .section__backgrounds .background-reef{background-attachment: scroll!important;} body:not(#Home) footer .section__info p{ text-shadow: none;} } /* ! ___display-max-md */ @media (max-width: 767.98px) { footer .section__backgrounds .logo-wrapper{top: 270px; width: 70%;} footer .section__contents { position: relative; top: 450px; left: 50%; transform: translateX(-50%); width: 90%;} footer .section__info{ position: absolute; bottom: 70px; left: 50%; transform: translateX(-50%); width: 100%;} body:not(#Home) footer .section__contents a{ color: #000;} body:not(#Home) footer h3, body:not(#Home) footer p{color: #000; text-shadow: none;} body#Home footer h3, body#Home footer p{color: #fff; text-shadow: none;} body:not(#Home) footer ul.nav-list-social li .icon-social { filter: invert(0);} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { footer { height: 1000px; padding-top: 100px;} #Crue footer { height: 1100px;} footer .section__backgrounds .logo-wrapper { top: 80px; width: 80%;} footer .section__info { position: relative; top: 520px; left: 50%; transform: translateX(-50%); width: 100%; } footer .section__contents { top: 110px; padding: 25px 10px 15px 10px;} footer .section__info { top: 130px;} footer .section__contents a { padding: 0;} footer ul.nav-list-social li { margin-right: 5px; margin-left: 5px;} } /* -------------------------------------------------------------------------------- */ /* ! banner Cookie */ /* -------------------------------------------------------------------------------- */ .DivCook00{ position: fixed; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); z-index: 99999; background: #ffffff3d; backdrop-filter: blur(25px); width: 100%; height: 100%;} .DivCook01{ width: 500px; background: #ffffff3d; backdrop-filter: blur(25px); padding: 25px; border-radius: 50px; border: 2px solid #fff; position: relative; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); z-index: 99999;} .DivCookHeader01{ font-size: 18px; font-weight: 700;} .DivCookPbs01{ display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: center; align-items: center; gap: 25px; margin-top: 25px;} .DivCookPb00.DivCookPbNo00 .DivCookPb01.DivCookPbNo01{ text-decoration: underline;} .DivCookPb00.DivCookPbNo00 .DivCookPb01.DivCookPbNo01:hover{ cursor: pointer;} .DivCookPb00.DivCookPbOk00 .DivCookPb01.DivCookPbOk01{ border: none !important; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 5px 15px 0px #fff; background: #6cd4315c; color: #000; margin-right: 10px; border-radius: var(--var-borderRadius-2); font-weight: 600; transition: all 0.25s cubic-bezier(.215, .61, .355, 1); width: fit-content; padding: 0.75rem 1.75rem; text-decoration: none; transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} .DivCookPb00.DivCookPbOk00 .DivCookPb01.DivCookPbOk01:hover{ cursor: pointer; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 0px 5px 0px #fff;} /* ! ___display-max--sm */ @media (max-width: 575.98px) { .DivCook01{ max-width: 90%; width: 100%; padding: 25px; } } /* -------------------------------------------------------------------------------- */ /* ! Gallery modal */ /* -------------------------------------------------------------------------------- */ /* ! Carousel */ .modal-content{ background: transparent; border: none;} .modal .modal-header{ border-bottom: transparent;} .modal.fade.show { backdrop-filter: blur(10px);} .modal .carousel .carousel-inner{border-radius: 25px;} .modal .carousel .carousel-inner .carousel-item img{ height: 100%; width: 100%; max-height: 600px;} .modal .modal-header { filter: invert(1);} .carousel-control-next-icon, .carousel-control-prev-icon { opacity: 1; filter: invert(1);} .modal .carousel .carousel-control-next, .modal .carousel .carousel-control-prev{background: #ffffff; border-radius: 15px;} .carousel button.carousel-control-prev{ top: 50%; transform: translateY(-50%); left: 25px; background: #fff; width: 50px !important; height: 50px !important; border-radius: 18px; color: transparent;} .carousel button.carousel-control-next{ top: 50%; transform: translateY(-50%); right: 25px; background: #fff; width: 50px !important; height: 50px !important; border-radius: 18px; color: transparent;} /* ! ___display-min-sm */ @media (min-width: 576px) { .modal-dialog { max-width: 500px;} .modal .carousel .carousel-inner, .modal .carousel .carousel-inner .carousel-item { height: 500px; width: 500px; } } /* ! ___display-min-md */ @media (min-width: 768px) { .modal-dialog { max-width: 650px;} .modal-body{ width: 650px; } .modal .carousel, .modal .carousel .carousel-inner, .modal .carousel .carousel-inner .carousel-item { height: 100%; width: 100%; } .modal .carousel{ position: relative;} .modal .carousel .carousel-control-next{ position: absolute; right: -80px; width: 50px; height: 50px; top: 50%; transform: translateY(-50%); } .modal .carousel .carousel-control-prev{ position: absolute; left: -80px; width: 50px; height: 50px; top: 50%; transform: translateY(-50%); } } /* ! ___display-max-md */ @media (max-width: 767.98px) { .carousel button.carousel-control-prev { left: 15px; width: 40px !important; height: 40px !important; border-radius: 13px;} .carousel button.carousel-control-next { right: 15px; width: 40px !important; height: 40px !important; border-radius: 13px;} .carousel .carousel-control-next-icon, .carousel .carousel-control-prev-icon{width: 30px; height: 30px;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .carousel .carousel-indicators [data-bs-target]{height: 5px; border-radius: 10px; border: none;} .carousel-control-next:focus, .carousel-control-next:hover, .carousel-control-prev:focus, .carousel-control-prev:hover{opacity: 1;} } /* -------------------------------------------------------------------------------- */ /* ! Cards */ /* -------------------------------------------------------------------------------- */ /* ! - all cards */ body:not(#Engi) .card, body:not(#Engi) .card .card-body{border-radius: 55px;} body:not(#Engi) .card.struttura .card-body .card__title-1, body:not(#Engi) .card.crociera .card-body .card__title-1, body:not(#Engi) .card.tour .card-body .card__title-1, body:not(#Engi) .card.veterina .card-body .card__title-1, body#Crue .card .card-body-header-title .card__title-2, body#Stru .card .card-body-header-title .card__title-1{ position: absolute; z-index: 1; margin-bottom: 0; background: #ffffff63; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); padding: 10px 15px; border-radius: 25px; font-size: 20px; bottom: 30px; left: 30px; width: calc(100% - 60px); -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; min-height: 40px; max-height: 62px; font-weight: 600;} body:not(#Engi) .card.struttura .card-body .card__title-2, body:not(#Engi) .card.crociera .card-body .card__title-2, body:not(#Engi) .card.veterina .card-body .card__title-2, body:not(#Engi) .card.tour .card-body .card__title-2{ position: absolute; bottom: 107px; margin-bottom: 0; left: 30px; width: fit-content; background: #ffffff63; backdrop-filter: blur(5px); -webkit-backdrop-filter:blur(5px); border-radius: 20px; padding: 8px 15px 5px 12px; z-index: 1; font-family: 'poppins', sans-serif; font-weight: 400; font-size: 15px; text-transform: capitalize; box-shadow: 0px 20px 15px 0px #00000021;} body:not(#Engi) .card.struttura .card-body .card__title-2 .icon, body:not(#Engi) .card.crociera .card-body .card__title-2 .icon, body:not(#Engi) .card.veterina .card-body .card__title-2 .icon, body:not(#Engi) .card.tour .card-body .card__title-2 .icon{ color: black; font-size: 22px;} body:not(#Engi) .card .card-body:after{position: absolute; top: 25px; right: 25px; padding: 0px 8px; background: #ffffff63; border: 1px solid #ffffffc7; color: #000; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); border-radius: 55px; font-family: 'Material Symbols Outlined'; font-size: 30px; text-transform: lowercase; font-weight: 300;} body:not(#Engi) .card .card-body a.card__link.btn{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent; color: transparent; border: none; box-shadow: none; z-index: 2;} body:not(#Engi) .card .card-body a.card__link.btn:hover{ background: transparent!important; border: none; color: transparent!important; box-shadow: none!important;} body#Home .card.struttura, body#Home .card.crociera, body#Home .card.tour{width: 100%!important;} /* ! - struttura */ body:not(#Engi) .card.struttura{ height: 450px; overflow: hidden; background: transparent;} body:not(#Engi) .card.struttura .card-body{ position: relative; width: 100%; height: 100%; overflow: hidden;} body:not(#Engi) .card.struttura .card-body .carousel { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1); transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} /* body:not(#Engi) .card.struttura .card-body:hover .carousel{ transform: scale(1.1);} */ body:not(#Engi) .card.struttura .card-body .carousel .carousel-inner, body:not(#Engi) .card.struttura .card-body .carousel .carousel-inner .carousel-item{ width: 100%; height: 100%;} body:not(#Engi) .card.struttura .card-body .card__stars{ list-style-type: none; display: flex; flex-direction: row; gap: 0; position: absolute; bottom: 107px; right: 30px; border-radius: 25px; padding: 4px 10px 2px 10px !important; background: #ffffff63; backdrop-filter: blur(5px); -webkit-backdrop-filter:blur(5px); margin-bottom: 0;} body:not(#Engi) .card.struttura .card-body ul.stars-inline .icon { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 2px; padding: 0px; font-size: 18px;} body:not(#Engi) .card.struttura .card-body .card__stars .icon-star__number{ font-family: 'poppins', sans-serif; color: #000; font-size: 15px; font-weight: 300;} body:not(#Engi) .card.struttura .card-body:after{ content: 'home_work' } /* ! - crociera */ body:not(#Engi) .card.crociera{ height: 450px; overflow: hidden; background: transparent;} body:not(#Engi) .card.crociera .card-body{ position: relative; width: 100%; height: 100%; overflow: hidden;} body:not(#Engi) .card.crociera .card-body .carousel { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1); transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} /* body:not(#Engi) .card.crociera .card-body:hover .carousel{ transform: scale(1.1);} */ body:not(#Engi) .card.crociera .card-body .carousel .carousel-inner, body:not(#Engi) .card.crociera .card-body .carousel .carousel-inner .carousel-item{ width: 100%; height: 100%;} body:not(#Engi) .card.crociera .card-body .card__stars{ list-style-type: none; display: flex; flex-direction: row; gap: 0 2px; position: absolute; bottom: 100px; right: 15px; background: #ffffffbf; backdrop-filter: blur(5px); border-radius: 12px; padding: 0px 5px !important;} body:not(#Engi) .card.crociera .card-body ul.stars-inline .icon { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 0px; padding: 0 5px; font-size: 20px;} body:not(#Engi) .card.crociera .card-body .card__stars .icon-star__number{ font-family: 'poppins', sans-serif; color: #000; font-size: 16px; font-weight: 300;} body:not(#Engi) .card.crociera .card-body:after{ content: 'sailing' } /* ! - tour */ body:not(#Engi) .card.tour{ height: 450px; overflow: hidden; background: transparent;} body:not(#Engi) .card.tour .card-body{ position: relative; width: 100%; height: 100%; overflow: hidden;} body:not(#Engi) .card.tour .card-body .carousel { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1); transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} /* body:not(#Engi) .card.tour .card-body:hover .carousel{ transform: scale(1.1);} */ body:not(#Engi) .card.tour .card-body .carousel .carousel-inner, body:not(#Engi) .card.tour .card-body .carousel .carousel-inner .carousel-item{ width: 100%; height: 100%;} body:not(#Engi) .card.tour .card-body .card__stars{ list-style-type: none; display: flex; flex-direction: row; gap: 0 2px; position: absolute; bottom: 100px; right: 15px; background: #ffffffbf; backdrop-filter: blur(5px); border-radius: 12px; padding: 0px 5px !important;} body:not(#Engi) .card.tour .card-body ul.stars-inline .icon { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 0px; padding: 0 5px; font-size: 20px;} body:not(#Engi) .card.tour .card-body .card__stars .icon-star__number{ font-family: 'poppins', sans-serif; color: #000; font-size: 16px; font-weight: 300;} body:not(#Engi) .card.tour .card-body:after{ content: 'route' } /* ! - veterina */ body:not(#Engi) .card.veterina{ height: 450px; overflow: hidden; background: transparent;} body:not(#Engi) .card.veterina .card-body{ position: relative; width: 100%; height: 100%; overflow: hidden;} body:not(#Engi) .card.veterina .card-body .carousel { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1); transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} body:not(#Engi) .card.veterina .card-body .carousel .carousel-inner, body:not(#Engi) .card.veterina .card-body .carousel .carousel-inner .carousel-item{ width: 100%; height: 100%;} body:not(#Engi) .card.veterina .card-body .card__stars{ list-style-type: none; display: flex; flex-direction: row; gap: 0; position: absolute; bottom: 85px; right: 15px; border-radius: 25px; padding: 4px 10px 2px 10px !important; background: #ffffff63; backdrop-filter: blur(5px); -webkit-backdrop-filter:blur(5px); margin-bottom: 0;} body:not(#Engi) .card.veterina .card-body ul.stars-inline .icon { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 2px; padding: 0px; font-size: 18px;} body:not(#Engi) .card.veterina .card-body .card__stars .icon-star__number{ font-family: 'poppins', sans-serif; color: #000; font-size: 15px; font-weight: 300;} /* body:not(#Engi) .card.veterina .card-body:after{ content: 'sell'; border: 2px solid #fff; color: #ffffff; background: #fcb400b3;} */ body:not(#Engi) .card.veterina .card__price{ position: absolute; top: 30px; left: 30px; z-index: 2; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: flex-start; gap: 0px; border-radius: 25px; padding: 5px 10px; background: #00000063; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); border: 2px solid #fff; color: #ffffff; background: #fcb400b3;} body:not(#Engi) .card.veterina .card__price__value{ font-size: 1.15rem; font-weight: 600; line-height: 1.15rem; font-weight: 300;} body:not(#Engi) .card.veterina .card__price__label{ line-height: 1.15rem; font-weight: 300;} /* ! - NavTabDestCardTitle */ body#Dest .card.NavTabDestCardTitle{ aspect-ratio: 1 / 1.5; border-radius: 55px; overflow: hidden; width: 300px; /*padding: 5px; background: linear-gradient(155deg, #e4e3bd, #e9db14);*/ background: #fff;} body#Dest .card.NavTabDestCardTitle .card-body{ position: relative; width: 100%; height: 100%; border-radius: 52px; overflow: hidden;} body#Dest .card.NavTabDestCardTitle .card-body .carousel { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1); transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} /* body#Dest .card.NavTabDestCardTitle .card-body:hover .carousel{ transform: scale(1.1);} */ body#Dest .card.NavTabDestCardTitle .card-body .carousel .carousel-inner, body#Dest .card.NavTabDestCardTitle .card-body .carousel .carousel-inner .carousel-item{ width: 100%; height: 100%;} body#Dest .card.NavTabDestCardTitle .card-body .card__stars{ list-style-type: none; display: flex; flex-direction: row; gap: 0; position: absolute; bottom: 85px; right: 15px; border-radius: 25px; padding: 4px 10px 2px 10px !important; background: #ffffff3d; backdrop-filter: blur(5px); -webkit-backdrop-filter:blur(5px); margin-bottom: 0;} body#Dest .card.NavTabDestCardTitle .card-body ul.stars-inline .icon { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 2px; padding: 0px; font-size: 18px;} body#Dest .card.NavTabDestCardTitle .card-body .card__stars .icon-star__number{ font-family: 'poppins', sans-serif; color: #000; font-size: 15px; font-weight: 300;} body#Dest .card.NavTabDestCardTitle .card-body:after{ content: 'home_work' } /* ! - #Crue */ body#Crue .card{ aspect-ratio: 1 / 1; border-radius: 55px; overflow: hidden; /*width: 300px;*/ padding: 5px; background: transparent;} body#Crue .card .card-body{ position: relative; width: 100%; height: 100%; border-radius: 52px; overflow: hidden;} body#Crue .card .card-body-header{ position: absolute; z-index: 1; bottom: 0; left: 0; width: 100%;} body#Crue .card .card-body-header-title{ width: 100%;} body#Crue .card .card-body-header-title .card__title-1{display: none;} body#Crue .card .card-body-header-title .card__title-2{ bottom: 30px; width: max-content; left: 30px; transform: translateX(0px);} body#Crue .card .card-body-header-text{display: none;} body#Crue .card .card-body .carousel { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1); transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} body#Crue .card .card-body .carousel .carousel-inner, body#Crue .card .card-body .carousel .carousel-inner .carousel-item{ width: 100%; height: 100%;} body#Crue .card .card-body .card__stars{ list-style-type: none; display: flex; flex-direction: row; gap: 0; position: absolute; bottom: 85px; right: 15px; border-radius: 25px; padding: 4px 10px 2px 10px !important; background: #ffffff3d; backdrop-filter: blur(5px); -webkit-backdrop-filter:blur(5px); margin-bottom: 0;} body#Crue .card .card-body ul.stars-inline .icon { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 2px; padding: 0px; font-size: 18px;} body#Crue .card .card-body .card__stars .icon-star__number{ font-family: 'poppins', sans-serif; color: #000; font-size: 15px; font-weight: 300;} /* ! - #Stru */ body#Stru .card { border-radius: 55px; overflow: hidden; width: 300px; height: fit-content; padding: 5px; background: #fff;} body#Stru .card .card-body{ position: relative; width: 100%; height: fit-content; border-radius: 52px; overflow: hidden; padding: 0px;} body#Stru .card .card-body .carousel { position: relative; top: 0; left: 0; width: 100%; height: 250px; transform: scale(1); transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} body#Stru .card .card-body:hover .carousel{ transform: scale(1);} body#Stru .card .card-body .carousel .carousel-inner, body#Stru .card .card-body .carousel .carousel-inner .carousel-item{ width: 100%; height: 100%;} body#Stru .card .card-body .card__stars{ list-style-type: none; display: flex; flex-direction: row; gap: 0; position: absolute; bottom: 85px; right: 15px; border-radius: 25px; padding: 4px 10px 2px 10px !important; background: #ffffff3d; backdrop-filter: blur(5px); -webkit-backdrop-filter:blur(5px); margin-bottom: 0;} body#Stru .card .card-body ul.stars-inline .icon { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 2px; padding: 0px; font-size: 18px;} body#Stru .card .card-body .card__stars .icon-star__number{ font-family: 'poppins', sans-serif; color: #000; font-size: 15px; font-weight: 300;} body#Stru .card .card-body:after{ content: 'home_work' } body#Stru .card .card-body .card__text{ -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; min-height: 40px; max-height: 83px; padding: 10px 20px; position: relative; top: 0px;} body#Stru .card .card-body-header-title .card__title-1 { bottom: 100px!important;} /* ! - #Dest */ body#Dest .card.struttura{aspect-ratio: unset; max-width: 300px; width: 100%;} body#Dest .card.tour{aspect-ratio: unset; max-width: 300px; width: 100%;} body#Dest .card.crociera { aspect-ratio: unset; max-width: 300px; width: 100%;} /* ! ___display-min-lg */ @media (min-width: 992px) { body:not(#Engi) .card .card-body:hover .carousel{ transform: scale(1.1);} } /* ! ___display-max-md */ @media (max-width: 767.98px) { body:not(#Engi) .card.crociera{ width: 100%; } } /* ! ___display-max--sm */ @media (max-width: 575.98px) { body:not(#Engi) .card, body:not(#Engi) .card .card-body { border-radius: 45px;} body:not(#Engi) .card .card-body:after{top: 20px; right: 20px;} body:not(#Engi) .card.struttura .card-body .card__title-1, body:not(#Engi) .card.crociera .card-body .card__title-1, body:not(#Engi) .card.tour .card-body .card__title-1, body:not(#Engi) .card.veterina .card-body .card__title-1, body#Crue .card .card-body-header-title .card__title-2, body#Stru .card .card-body-header-title .card__title-1 {border-radius: 25px; bottom: 20px; left: 20px; width: calc(100% - 40px);} body:not(#Engi) .card.struttura .card-body .card__title-2, body:not(#Engi) .card.crociera .card-body .card__title-2, body:not(#Engi) .card.veterina .card-body .card__title-2, body:not(#Engi) .card.tour .card-body .card__title-2 {left: 20px;} body:not(#Engi) .card.struttura .card-body .card__stars {right: 20px;} body:not(#Engi) .card.veterina .card__price { top: 20px; left: 20px;} body:not(#Engi) .card.veterina .card__price__label { font-size: 0.9rem;} } /* -------------------------------------------------------------------------------- */ /* ! Form PREVENTIVO */ /* -------------------------------------------------------------------------------- */ :root{ --var-borderRadius-3: 25px; } button[data-bs-target="#preventivoModal"]{ backdrop-filter: blur(15px); background: #ffffff78;} .modal#preventivoModal .modal-content{background: #eaeaf2;} .modal#preventivoModal .modal-header{ position: relative; filter: invert(0); margin-bottom: 0px;} .modal#preventivoModal .modal-header .btn-close{ position: absolute; top: 25px; right: 25px;} .modal#preventivoModal .modal-header .modal-title{ font-size: 1.75rem;} .modal#preventivoModal .modal-body .summary-subtitle{ font-size: 1.25rem; font-weight: 200;} .modal#preventivoModal .modal-body .img-icon{ filter: brightness(0);} .modal#preventivoModal .modal-body input:not([type="checkbox"]){ border-radius: var(--var-borderRadius-2);} .modal#preventivoModal .modal-body select{ border-radius: var(--var-borderRadius-2); height: calc(3.5rem + 2px);} .modal#preventivoModal .modal-body .form-floating label{ text-align: left;} .modal#preventivoModal .modal-body ul.setup-panel li.active a .list-group-item-heading{ padding: 2px 0px 0px 1px;} .modal#preventivoModal .modal-body .col-button-send .btn:disabled{ background: transparent; color: #000; border: 1px solid #000; opacity: 0.5; cursor: not-allowed;} .modal#preventivoModal .modal-body .col-button-send .btn{ opacity: 1;} .modal#preventivoModal .modal-body .form-2 .room { border: 1px solid #ccc; padding: 15px; margin-bottom: 10px; border-radius: calc(var(--var-borderRadius-2) + 15px); position: relative;} .modal#preventivoModal .modal-body .form-2 .room h3 { margin: 0 0 10px 0;} .modal#preventivoModal .modal-body .form-2 .remove-room { position: absolute; top: 15px; right: 15px; background: #ff0f0f; color: white; border: none; cursor: pointer; border-radius: var(--var-borderRadius-2); width: 45px; height: 45px;} .modal#preventivoModal .modal-body .form-2 .remove-room:hover { background: #cb0c0c;} .modal#preventivoModal .modal-body .form-2 label { display: block; margin-top: 10px; padding-left: 6px; margin-bottom: -5px;} .modal#preventivoModal .modal-body .form-2 input { width: 100%; padding: 5px; margin-top: 5px; border: 2px solid #d5d5d5;} .modal#preventivoModal .modal-body .form-2 .add-room { border: 2px solid #067706; color: #fff; padding: 10px; cursor: pointer; display: block; width: 100%; margin-top: 15px; margin-bottom: 15px; border-radius: calc(var(--var-borderRadius-2) + 15px);} .modal#preventivoModal .modal-body .form-2 .add-room:hover { background: #067706; color: #fff;} .modal#preventivoModal .modal-body .form-2 .age-container { margin-top: 10px; display: flex; flex-direction: row; flex-wrap: wrap; gap: 2.2%;} .modal#preventivoModal .modal-body .form-2 .age-container__kid{ width: 18%;} .modal#preventivoModal .modal-body .room { border: 1px solid #ccc; padding: 15px; margin-bottom: 10px; border-radius: 5px; position: relative; } .modal#preventivoModal .modal-body .room h3 { margin: 0 0 10px 0; } .modal#preventivoModal .modal-body .remove-room { position: absolute; top: 10px; right: 10px; background: red; color: white; border: none; padding: 5px; cursor: pointer; border-radius: 3px;} .modal#preventivoModal .modal-body .remove-room:hover { background: darkred; } .modal#preventivoModal .modal-body .age-container { margin-top: 10px;} .modal#preventivoModal .modal-body .add-room, .show-data { background: green; color: white; border: none; padding: 10px; cursor: pointer; display: block; width: 100%; margin-top: 15px; border-radius: 5px;} .modal#preventivoModal .modal-body .add-room:hover, .show-data:hover { background: darkgreen; } .modal#preventivoModal .modal-body .show-data { background: blue; } .modal#preventivoModal .modal-body .show-data:hover { background: darkblue; } .modal#preventivoModal .modal-body #reservation-summary { display: none; } .modal#preventivoModal .modal-body .reservation-summary__room__title{margin-bottom: 10px;} #summary__step-1, #summary__step-2, #summary__step-3, #summary__step-4{ margin-top: 20px; margin-bottom: 20px; padding: 10px; border: 1px solid #ccc; border-radius: 5px; background: #f1f1f1;} .modal#preventivoModal .modal-body .text-bold{ font-weight: bold; } .modal#preventivoModal .modal-body .img-icon { width: 18px; height: 18px; } .modal#preventivoModal .modal-body .col-button-next { display: flex; justify-content: flex-end; } .modal#preventivoModal .modal-body .col-button-send { display: flex; justify-content: center; } .modal#preventivoModal .modal-body .col-button-next button, .modal#preventivoModal .modal-body .col-button-send button { display: flex; align-items: center; gap: 15px; } .modal#preventivoModal .modal-body ul.setup-panel { display: flex; justify-content: space-between; margin: 10px 20px; } .modal#preventivoModal .modal-body ul.setup-panel li a { text-decoration: none; display: flex; flex-direction: column; align-items: center; } .modal#preventivoModal .modal-body ul.setup-panel li.disabled a { cursor: not-allowed; opacity: 0.5;} .modal#preventivoModal .modal-body ul.setup-panel li.disabled a .list-group-item-heading { background: transparent; } .modal#preventivoModal .modal-body ul.setup-panel li.disabled a { cursor: not-allowed; opacity: 0.5; } .modal#preventivoModal .modal-body ul.setup-panel li.active a .list-group-item-heading { background: #2e2ec5; color: #fff; } .modal#preventivoModal .modal-body ul.setup-panel li a .list-group-item-heading { border: 2px solid #2e2ec5; font-size: 1.25rem; display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 100%; } .modal#preventivoModal .modal-body table thead th:first-child { width: 180px; } .modal#preventivoModal .modal-body form.container { background: #eaeaf2; } .modal#preventivoModal .modal-body form.container .setup-content { padding: 20px 10px; } .modal#preventivoModal .modal-body form.container #form__step-1 div[class^="col-"] { display: flex; gap: 15px; } .modal#preventivoModal .modal-body form.container #form__step-1 div[class^="col-"] .form-floating{ flex: 1 1 50%; } .modal#preventivoModal .modal-body .kids-table { background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; } .modal#preventivoModal .modal-body .kids-table .add-button, .modal#preventivoModal .modal-body .kids-table .delete-button { margin-left: 10px; margin-bottom: 10px; } .modal#preventivoModal .modal-body .form__field { display: flex; flex-direction: row; gap: 25px; align-items: center; } .modal#preventivoModal .modal-body .form__field__question {} .modal#preventivoModal .modal-body .form__field__answers {} .modal#preventivoModal .modal-body .form__title { font-size: 1.25rem; } /* SUMMARY */ .modal#preventivoModal .modal-body #summary__step-1, #summary__step-2, #summary__step-3, #summary__step-4{ display: flex; flex-direction: column; margin-bottom: 20px; } .modal#preventivoModal .modal-body .summary__step-1__element, .summary__step-2__element, .summary__step-3__element, .summary__step-4__element{ display: flex; flex-direction: row; gap: 10px; } /* ! - SECTION_scroll */ .SECTION_scroll { position: fixed; right: -260px; bottom: 15px; z-index: 99; transition: all 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55);} .SECTION_scroll.visible { right: 0; pointer-events: auto;} .SECTION_scroll .btn:focus{background: #ffffff78; color: #000; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 12px 20px 0px #fff;} /* ! ___display-max-md */ @media (max-width: 767.98px) { .modal#preventivoModal .modal-body ul.nav-pills li{ width: 30%; } .modal#preventivoModal .modal-body ul.nav-pills li .list-group-item-text{text-align: center; line-height: 1rem; font-size: 0.85rem;margin-bottom: 0;} .modal#preventivoModal .modal-body ul.setup-panel li a{ border: 1px solid #ccc; border-radius: 15px; padding: 5px; height: 100%; justify-content: center; } .modal#preventivoModal .modal-body ul.setup-panel li a .list-group-item-heading{ width: 30px; height: 30px; font-size: 1rem; margin-bottom: 5px; } .modal#preventivoModal .modal-body ul.setup-panel { display: flex; margin: 10px 20px; flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 5px; } form.container #form__step-1 div[class^="col-"] { display: flex; gap: 15px; flex-direction: column; } .modal#preventivoModal .modal-body .form-2 .age-container { gap: 4%; } .modal#preventivoModal .modal-body .form-2 .age-container__kid { width: 48%;} .summary__step-1__element, .summary__step-2__element, .summary__step-3__element, .summary__step-4__element { display: flex; flex-direction: column; gap: 0px; margin-bottom: 10px;} } /* -------------------------------------------------------------------------------- */ /* ! Pages */ /* -------------------------------------------------------------------------------- */ /* ! - Cook (cookie), Priv (privacy), Cond (condizioni di vendita) */ #Cook main.PageDataDiv, #Priv main.PageDataDiv, #Cond main.PageDataDiv{ padding: 0px 30px; word-wrap: break-word; max-width: 750px; margin: 150px auto; color: black;} #Cook .text-big { text-align: center; width: 100%; display: block; font-size: 2rem;} /* ! -- menu */ #Cook header.navbar02 nav ul li .nav-link, #Priv header.navbar02 nav ul li .nav-link, #Cond header.navbar02 nav ul li .nav-link { color: #000;} #Cook header.navbar02 nav a.navbar-brand .logo, #Priv header.navbar02 nav a.navbar-brand .logo, #Cond header.navbar02 nav a.navbar-brand .logo { filter: invert(0);} /* ! ___display-max-md */ @media (max-width: 767.98px) { #Cook main.PageDataDiv, #Priv main.PageDataDiv, #Cond main.PageDataDiv{margin: 110px auto;} } /* -------------------------------------------------------------------------------- */ /* ! Confirm Send Modal */ /* -------------------------------------------------------------------------------- */ .jconfirm{ background: #22355657; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } .jconfirm .container{ height: 100%; } .jconfirm .container .row { height: 100%; align-items: center; justify-content: center; } .jconfirm.jconfirm-supervan .jconfirm-box { margin-top: 0!important; background-color: #ffffff91; border: 2px solid #fff; border-radius: 25px; padding: 40px 25px; } .jconfirm.jconfirm-supervan .jconfirm-box div.title-c, .jconfirm.jconfirm-supervan .jconfirm-box div.content-pane, .jconfirm.jconfirm-supervan .jconfirm-box div.content{ color: #000!important; } .jconfirm .jconfirm-box .buttons { padding-bottom: 0px; color: #000; } .jconfirm.jconfirm-supervan .jconfirm-box .buttons button{ background: unset; border-radius: 15px; color: #000; } /* ! ___display-max-md */ @media (max-width: 767.98px) { .jconfirm .jconfirm-box div.title-c .title{ line-height: 1.5rem; font-size: 1.5rem; font-weight: 500; } } /*D:/aa/siti/aaa_ollytour.it/root/css/h2oviaggi/menu.css*/ /* -------------------------------------------------------------------------------- */ /* ! Navbar02 */ /* -------------------------------------------------------------------------------- */ /* ! - general */ header.navbar02{ background: transparent;} header.navbar02 nav{ padding: 10px 0px 10px 20px; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-radius: 35px; box-shadow: -1px -1px 10px 0px #0000000a, inset 1px 1px 4px 0px #ffffffb3, 3px 0px 5px 0px #655d7021, 1px 1px 0px 0px #ffffff42; background: #ffffff5c;} header.navbar02 nav a.navbar-brand{margin-right: 50px; transition: all 0.25s cubic-bezier(.215, .61, .355, 1); filter: invert(0);} header.navbar02 nav a.navbar-brand:hover{ filter: invert(0);} #Home header.navbar02 nav a.navbar-brand:hover{ filter: invert(1);} header.navbar02 nav a.navbar-brand .logo{width: 85px; height: 64px; background-size: contain !important; background-repeat: no-repeat !important; margin-top: -18px; left: 0px; position: absolute; filter: invert(0);} #Home header.navbar02 nav a.navbar-brand .logo{ filter: invert(1);} header.navbar02 nav ul li .nav-link{color: #000; font-size: 18px; text-transform: uppercase;} #Home header.navbar02 nav ul li .nav-link{color: #fff;} header.navbar02 nav ul li .nav-link:hover{ color: #000000 !important; text-shadow: 0px 0px 15px #ffffff;} #Home header.navbar02 nav ul li .nav-link:hover{color: #000;} header.navbar02 nav a.btn{border: none !important; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 12px 20px 0px #fff; background: #ffffff5c; color: #000; margin-right: 10px;} header.navbar02 nav a.btn:hover{box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 0px 10px 0px #ffffffb0 !important; background: #ffffff00 !important;} header.navbar02 .navbar-collapse__contenuto-a-destra{display: flex; flex-direction: row; align-items: center;} header.navbar02 form{margin-bottom: 0;} .dropdown-item.active, .dropdown-item:active{ color: #000; font-weight: 500;} /* ! ___display-min-lg */ @media (min-width: 992px) { header.navbar02 nav ul.navbar-nav{margin-left: 50px;} } /* ! ___display-max-xl */ @media (max-width: 1199.98px) { header .container { max-width: 970px; } } /* ! ___display-max-lg */ @media (max-width: 991.98px) { header.navbar02 nav ul li .nav-link{color: #000;} } /* ! - dropdown */ header.navbar02 .dropdown-submenu>.dropdown-menu { -webkit-border-radius: 0 6px 6px 6px; -moz-border-radius: 0 6px 6px; border-radius: 0 6px 6px 6px;} header.navbar02 .dropdown-submenu>a:after { border-color: transparent; border-style: solid; border-width: 5px 0 5px 5px; border-left-color: #ccc; margin-top: 5px; margin-right: -10px;} header.navbar02 .dropdown-submenu:hover>a:after { border-left-color: #fff;} header.navbar02 .dropdown-submenu.pull-left>.dropdown-menu {-webkit-border-radius: 6px 0 6px 6px; -moz-border-radius: 6px 0 6px 6px; border-radius: 6px 0 6px 6px;} header.navbar02 .navbar-expand-lg .navbar-nav .dropdown-menu{ border: none; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-radius: 20px; box-shadow: -1px -1px 10px 0px #0000000a, inset 1px 1px 4px 0px #ffffffb3, 3px 0px 5px 0px #655d7021, 1px 1px 0px 0px #ffffff42; } header.navbar02 .navbar-expand-lg .navbar-nav .dropdown-menu a.dropdown-item{background: transparent; color: #000 !important; text-transform: capitalize;} /* ! - Login */ #loginModal{ backdrop-filter: blur(40px); -webkit-backdrop-filter: blur(40px);} #loginModal .modal-content{ backdrop-filter: blur(40px); -webkit-backdrop-filter: blur(40px); background: var(--var-color-4);} #loginModal .modal-content .modal-body .form-floating .form-control{border-radius: var(--var-borderRadius-2); border: 2px solid white; background: #0000001a; color: #fff;} #loginModal .modal-content .modal-body .btn{ border: 2px solid white; background: var(--var-color-2); color: #fff;} header.navbar02 button.button__account { border: none !important; box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 12px 20px 0px #fff; background: #ffffff5c; transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} header.navbar02 button.button__account:hover{box-shadow: -1px -1px 0px 1px #fff, 1px 1px 0px 1px #ffffffa8, 2px -2px 5px 1px #00000017, -2px 2px 5px 1px #02020217, inset 0px 0px 10px 0px #ffffffb0 !important; background: #ffffff00 !important;} header.navbar02 button.button__account img{ position: relative; left: 0; top: 0; width: 20px; height: 25px;} /* ! - azione allo scroll */ header.navbar02.navbar--sild{top: 20px;} #Home header.navbar02:not(.navbar--sild), #Engi header.navbar02:not(.navbar--sild), #Team header.navbar02:not(.navbar--sild){top: 25px;} header.navbar02:not(.navbar--sild){top: 20px;} /* ! ___display-max-lg */ @media (max-width: 991.98px) { header.navbar02 .navbar-toggler{ border: 1px solid #868686;} #Home header.navbar02:not(.navbar--sild), #Engi header.navbar02:not(.navbar--sild), #Team header.navbar02:not(.navbar--sild){top: 20px;} header.navbar02 nav .container-fluid .collapse ul, header.navbar02 nav .container-fluid .collapsing ul{background: #ffffff6b; border-radius: 35px; } header.navbar02 nav .container-fluid .collapse ul .dropdown-menu.dd-lv1{ background: #ffffff33; } header.navbar02 nav .container-fluid .collapse ul .dropdown-menu.dd-lv1 .dd-lv2{ background: #ffffff8f; } header.navbar02 nav { padding: 12px 0px 12px 3px; border-radius: 27px; } header.navbar02 .navbar-toggler { border-radius: 13px; } } /* ! ___display-max--sm */ @media (max-width: 575.98px) { header.navbar02 { width: 90%; } header.navbar02 nav .navbar-collapse__contenuto-a-destra { margin-top: 15px; margin-bottom: 4px; } header.navbar02 nav .container-fluid .collapse ul, header.navbar02 nav .container-fluid .collapsing ul{margin-top: 15px; border-radius: 15px;} header.navbar02 nav ul li .nav-link { color: #000000!important; padding: 5px 0px;} header.navbar02 nav .container-fluid .collapse ul .dropdown-menu.dd-lv1 { background: transparent; margin: 0; padding: 7px 15px !important; } header.navbar02 nav .container-fluid .collapse ul .dropdown-menu.dd-lv1 .dd-lv2 { margin-top: 5px; margin-bottom: 10px; background: #ffffffde; box-shadow: none; padding: 5px 15px !important; } } /*D:/aa/siti/aaa_ollytour.it/root/css/h2oviaggi/home.css*/ /* -------------------------------------------------------------------------------- */ /* ! Global */ /* -------------------------------------------------------------------------------- */ body{background: #080706;} .cta-to-content { position: absolute; bottom: 310px; right: 0; align-items: center; display: flex; justify-content: center; z-index: 10; width: 350px; transform: scale(1); transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} .cta-to-content:hover { transform: scale(1.1); cursor: pointer; } .cta-to-content p{ font-size: 20px; margin-bottom: 0; font-weight: 300; color: #fff; text-shadow: 0px 0px 10px #0000005e;} .cta-to-content p span{ font-weight: 600; font-size: 25px; } .cta-to-content__scroll{ position: relative; margin-left: 20px; } .hero .cta-to-content__scroll{filter: invert(1) brightness(1);} .cta-to-content__scroll__spinner { animation: rotator 3s linear infinite;} .cta-to-content__scroll__spinner-arrow { animation: vertical-translate 3s ease-out infinite; position: absolute; margin-top: -12px; left: 19px;} @keyframes rotator { 0% { transform: rotate(0deg); } 100% { transform: rotate(250deg); } } .cta-to-content__scroll__spinner__path { stroke-dasharray: 245; stroke-dashoffset: 0; transform-origin: center; stroke: #000000; animation: dash 3s linear infinite;} @keyframes dash { 0% { stroke-dashoffset: 245; } 70% { stroke-dashoffset: 61.25; transform: rotate(205deg); } 100% { stroke-dashoffset: 245; transform: rotate(540deg); } } @keyframes vertical-translate { 0% { opacity: 0; top: -20%; } 25% { opacity: 1; top: 50%; } 75% { opacity: 1; top: 50%; } 100% { opacity: 0; top: 120%; } } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .cta-to-content p { font-size: 18px; line-height: 22px;} .cta-to-content p span { font-weight: 700; font-size: 20px;} } /* ! ___display-min-xl */ @media (min-width: 1200px) { .cta-to-content { right: 100px; } } /* ! - swiper */ .swiper-wrapper{ padding-bottom: 70px;} .container-swiper .swiper-button-next, .container-swiper .swiper-button-prev { display: none; margin-top: -45px; background: #999796; padding: 25px; box-shadow: 0px 0px 25px -5px #00000070; border-radius: 15px; color: #16a9c1;} .container-swiper .swiper-button-next:after, .container-swiper .swiper-button-prev:after { font-size: 20px; font-weight: bold;} .swiper-pagination{ position: absolute; background: #77a1cf21; border-radius: 999px; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); padding: 16px; width: max-content!important; left: 50% !important; transform: translate(-50%); font-size: 0; bottom: 0px !important;} .swiper-pagination-bullet{background: #007affba; width: 10px; height: 10px;} /* -------------------------------------------------------------------------------- */ /* ! section HERO */ /* -------------------------------------------------------------------------------- */ .hero { z-index: 1; width: 100%; height: 1120px; background: transparent!important; /*background: url("/image/hero-1.jpg") no-repeat bottom center fixed !important;*/ display: flex; justify-content: center; position: relative;} .hero .row { height: 100%;} .hero .row .col-main { display: flex; justify-content: center; /*position: relative;*/} .hero__logo { width: 750px; height: 222px; top: 15%; position: relative; z-index: 1; filter: invert(1);} .hero__palm-trees { position: absolute; z-index: 2; bottom: 251px; left: 50%; transform: translateX(-55.6%); width: 992px;} .hero__cta { padding: 10px 20px; color: #000000; border-radius: 25px; border: 2px solid #fff; background: rgba(255, 255, 255, 0.27); backdrop-filter: blur(10px); width: auto; height: fit-content; position: absolute; bottom: 250px; z-index: 10; font-size: 20px;} .hero__cta:hover { cursor: pointer;} .hero__background{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;} /* ! ___display-min-3xxl */ @media (min-width: 1930px) { .hero { background-size: cover !important; background-position: -3px bottom !important; width: 100.3%; } .hero__palm-trees{ display: none;} } /* ! ___display-max-lg */ @media (max-width: 991.98px) { .hero__palm-trees{display: none;} .hero__logo { width: 85%; height: fit-content; object-fit: contain; /*top: 10%;*/ top: 340px;} .hero { height: 105vh; background-attachment: scroll !important;} .cta-to-content{ left: 50%;transform: translateX(-50%);width: max-content;height: fit-content;padding: 10px 25px !important;background: #fcb400b3;border-radius: 45px;backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(5px);} .cta-to-content:hover { transform: translateX(-50%) scale(1);} } /* ! ___display-max-md */ @media (max-width: 767.98px) { .hero__logo{top: 30%;} .Section:not(.hero) .cta-to-content{ display: none; } .cta-to-content{ left: 50%; bottom: 50px !important; transform: translateX(-50%); width: max-content;} .cta-to-content:hover { transform: translateX(-50%) scale(1.1);} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .hero { height: 80vh; padding-top: 0; background-size: cover !important; width: -webkit-fill-available; overflow: hidden; } .hero__logo { width: 90%; top: 40%;} .hero__background { position: absolute; top: 0; left: 0px; width: 108%; height: 100%;} } /* -------------------------------------------------------------------------------- */ /* ! section REEF */ /* -------------------------------------------------------------------------------- */ .reef { z-index: 0; width: 100%; height: 1105px; position: relative; /*background: url(/image/reef.jpg) no-repeat center center fixed;*/ margin-top: -238px; background-size: cover;} .reef .container { padding: 0; } .reef__background{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;} /* ! ___display-min-xxl */ @media (min-width: 1930px) { .reef { height: 1177px; } } /* ! ___display-max-lg */ @media (max-width: 991.98px) { .reef{background-attachment: scroll!important;} } /* ! ___display-max-md */ @media (max-width: 767.98px) { .reef{ margin-top: -75px; background-position: 0px 0px; background-size: cover; height: 450px; } } /* -------------------------------------------------------------------------------- */ /* ! section TYPE-TRAVEL */ /* -------------------------------------------------------------------------------- */ .type-travel { z-index: 1; width: 100%; height: 2042px; background: url("/image/under_reef.jpg") no-repeat center center fixed; margin-top: -80px; position: relative;} .type-travel__title{font-size: 80px; color: #fff; position: relative; text-align: center; z-index: 3; margin: 0 auto 50px auto;} .type-travel__slogan{ height: fit-content; line-height: 1.5rem; color: #fff; position: relative; text-align: center; z-index: 3; margin: 0 20% 100px 20%;} .type-travel .container { max-width: 100%;} .type-travel .col-text{ position: relative; margin-top: -60px;} .type-trave .swiper{z-index: 2;} .type-travel__cards{padding: 0;} /* ! - scroll-to */ .type-travel .col-scroll-to{ position: relative;} .type-travel .col-scroll-to .cta-to-content{top: 100px;} .type-travel .col-scroll-to .cta-to-content p, .type-travel .col-scroll-to .cta-to-content p span{color: #fff;} .type-travel .col-scroll-to path, .type-travel .col-scroll-to circle{ stroke: #fff!important;} .type-travel .container .col-cavern { padding: 0;} .type-travel .container .col-cavern .type-travel__cavern { position: relative; z-index: 5; width: 100%; } /* ! ___display-min-lg */ @media (min-width: 992px) { .type-travel .container .col-cavern { position: relative; top: -450px; z-index: 0; } .type-travel .col-scroll-to .cta-to-content{right: 100px;} } /* ! ___display-min-xxl */ @media (min-width: 1400px) { .type-travel .container .col-cavern .type-travel__cavern { top: -100px;} } /* ! ___display-min-3xl */ @media (min-width: 1800px) { .type-travel .container .col-cavern .type-travel__cavern { top: -300px;} } /* ! ___display-min-xxl */ @media (min-width: 1930px) { .type-travel { background-size: cover !important; background-position: -3px top !important; width: 100.3%; } } /* ! ___display-max-lg */ @media (max-width: 991.98px) { .type-travel { height: 2045px; background-attachment: scroll; margin-top: -114px;} .type-travel__title { font-size: clamp(2.5rem, 7vw, 4rem); margin: -30px auto 25px auto;} .type-travel .container .col-cavern .type-travel__cavern{margin-top: -110px;} } /* ! ___display-max-md */ @media (max-width: 767.98px) { .type-travel { /*height: 2040px;*/ height: auto; background-size: contain; background-position: 0px 0px;} .type-travel__slogan { margin: 0 10% 80px 10%;} .type-travel .col-text{margin-top: -100px;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { /* .type-travel { height: 1800px; } */ .type-travel__slogan { margin: 0 5% 40px 5%; } body#Home .Section.type-travel .card { width: 100% !important; height: 450px !important; } .type-travel .container .col-cavern .type-travel__cavern{margin-top: 0px; position: relative; z-index: 1;} } /* -------------------------------------------------------------------------------- */ /* ! section ACCOMODATIONS */ /* -------------------------------------------------------------------------------- */ .accommodations { width: 100%; height: 115vh; background: #000; padding-top: 0px; margin-top: -50px; position: relative;} .accommodations .title-and-paragraph{ position: relative; z-index: 10;} .accommodations .container{max-width: 100%;} .accommodations__subtitle{ font-size: 80px; color: #fff; position: relative; text-align: center; z-index: 3; margin: 0 auto 50px auto;} .accommodations__slogan{ height: fit-content; line-height: 1.5rem; color: #fff; position: relative; text-align: center; z-index: 3; margin: 0 20% 100px 20%;} .accommodations__cards { position: relative; z-index: 10; padding: 0;} .accommodations__cards__card { width: 300px; height: 400px; background: rgba(255, 255, 255, 0.29); backdrop-filter: blur(25px); border-radius: 20px; color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center;} .accommodations__fish{ position: absolute; bottom: -40px; left: 10%; z-index: 2; width: 450px;} .accommodations .col-scroll-to{position: relative;} .accommodations .col-scroll-to .cta-to-content { right: 100px; bottom: -50px;} .accommodations .col-scroll-to .cta-to-content__scroll { filter: invert(1);} /* ! ___display-max-xl */ @media (max-width: 1199.98px) { .accommodations__fish { bottom: -150px;} } /* ! ___display-max-lg */ @media (max-width: 991.98px) { .accommodations { height: auto; padding-top: 0; margin-top: -400px;} .accommodations__subtitle { font-size: clamp(2.5rem, 7vw, 4rem); margin: 0 auto 25px auto;} .accommodations__slogan{margin: 0 20% 50px 20%;} body:not(#Engi) .card.struttura{width: 100%;} .accommodations__fish { position: absolute; bottom: -160px; left: 10%; width: 410px; z-index: 2;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .accommodations__fish { bottom: -160px; left: -3%; width: 280px; opacity: 0.7; } .accommodations__slogan { margin: 0 5% 50px 5%; } } /* -------------------------------------------------------------------------------- */ /* ! section TOURS */ /* -------------------------------------------------------------------------------- */ .tours { width: 100%; background: linear-gradient(180deg, #000000 0%, #00071B 100%); padding-top: 200px; padding-bottom: 400px; margin-top: -5px;} .tours .container{max-width: 100%;} .tours__subtitle{ font-size: 80px; color: #fff; position: relative; text-align: center; z-index: 3; margin: 0 auto 50px auto;} .tours__slogan{ line-height: 1.5rem; color: #fff; position: relative; text-align: center; z-index: 3; max-width: 600px; margin: 0 auto 100px auto;} .tours__datas { margin-bottom: 0px;} .tours__datas__data { position: relative; z-index: 10;display: flex; flex-direction: row; gap: 20px; flex-wrap: nowrap; justify-content: center; margin-bottom: 25px; overflow-x: auto;} .tours__datas__data__button { display: flex; align-items: center; justify-content: center; border: 1px solid #fff; background: rgba(255, 255, 255, 0.1); padding: 10px 15px; border-radius: 50px; transition: all 0.25s cubic-bezier(.215, .61, .355, 1);} .tours__datas__data__button:hover { cursor: pointer; background: rgba(255, 255, 255, 0.2);} .tours__datas__data__button.active { background: #1ACD5F;} .tours__datas__data__button__label { color: #fff;} .active .tours__datas__data__button__label { color: #000;} .tours__col-cards{padding: 0;} .tours__cards { display: flex; gap: 50px; position: relative; z-index: 3;} .tours .col-scroll-to{position: relative;} .tours .col-scroll-to .cta-to-content { right: 100px; bottom: -50px;} .tours .col-scroll-to .cta-to-content__scroll { filter: invert(1);} .tours .swiper-slide{ width: 350px; height: 500px; display: flex; align-items: center; justify-content: center;} /* ! ___display-max-lg */ @media (max-width: 991.98px) { .tours { padding-top: 200px; padding-bottom: 300px;} .tours__subtitle { font-size: clamp(2.5rem, 7vw, 4rem); margin: 0 auto 25px auto;} .tours__slogan{margin: 0 auto 50px auto;} body:not(#Engi) .card.tour{width: 100%;} } /* -------------------------------------------------------------------------------- */ /* ! section pesci-orizzontali */ /* -------------------------------------------------------------------------------- */ .pesci-orizzontali{ position: relative; top: -370px; height: 0px;} .pesci-orizzontali .container{ max-width: 100%; padding: 0; margin: 0;} .pesci-orizzontali .container .row{ padding: 0; margin: 0;} .pesci-orizzontali .container .row div[class^="col-"] { padding: 0; margin: 0;} .pesci-orizzontali .container .row div[class^="col-"] img{ width: 100%; position: relative; z-index: 1;} /* ! ___display-max-md */ @media (max-width: 767.98px) { .pesci-orizzontali { top: -250px;} } /* -------------------------------------------------------------------------------- */ /* ! section WEDDING */ /* -------------------------------------------------------------------------------- */ .wedding{ position: relative; background: linear-gradient(0deg, #00061b 0%, #00071a 100%); padding-bottom: 150px; padding-top: 200px; margin-top: -55px; margin-bottom: -55px;} .wedding__title{ color: #fff; margin-bottom: 50px;} .wedding .col-contents{ position: relative; z-index: 3; background: #006a903d; border-radius: 70px; backdrop-filter: blur(50px); box-shadow: 0px 5px 15px 0px #00000045; padding: 50px;} .wedding__item{ display: flex; flex-direction: row; gap: 25px; margin-bottom: 25px;} .wedding__item .icon{ width: 25px; height: 25px; color: #fff;} .wedding__item__content{ display: flex; flex-direction: column; gap: 10px;} .wedding__item__content__title{ font-size: 20px; font-weight: 600; color: #fff; margin-bottom: 0;} .wedding__item__content__text{ font-size: 18px; font-weight: 200; color: #fff; margin-bottom: 0;} .wedding .cta{ display: block; padding: 16px 36px; } .wedding .cta:hover{ /*background: var(--color-yellow)!important;*/ color: #fff;} .wedding .col-images{ position: relative; display: flex; align-items: center; justify-content: center;} .wedding .col-images__big{ width: 500px; height: 660px; border-radius: 25px;} .wedding .col-images__small{ position: absolute; bottom: 130px; right: -120px; width: 320px; height: 465px; border-radius: 25px;} .wedding__pesce-palla{ position: absolute; z-index: 2; top: 100px; left: 40px; width: 220px;} .wedding .col-scroll-to{position: relative;} .wedding .col-scroll-to .cta-to-content { right: 100px; bottom: -150px;} .wedding .col-scroll-to .cta-to-content__scroll { filter: invert(1);} .wedding__cavalluccio-marino{ position: absolute; z-index: 2; bottom: 0px; left: 52%; width: 150px;} /* ! ___display-max-2xxl */ @media (max-width: 1599.98px) { .wedding .col-images__small { bottom: 130px; right: -80px; width: 250px; height: 375px; } } /* ! ___display-max-lg */ @media (max-width: 991.98px) { .wedding { padding-bottom: 210px; padding-top: 200px; margin-top: -200px; margin-bottom: -150px; overflow-x: hidden; overflow-y: clip;} .wedding__title{ font-size: clamp(2.5rem, 7vw, 4rem); margin-bottom: 25px; line-height: 4rem; } .wedding .col-contents { border-radius: 56px; padding: 30px;} .wedding .col-images { position: absolute; top: 200px; right: -10px;} .wedding .col-images__big { width: 350px; height: 500px; border-radius: 25px;} .wedding .col-images__small { position: absolute; bottom: -20px; right: 50px; width: 200px; height: 275px;} .wedding__cavalluccio-marino { bottom: 310px; right: 80px; left: unset; width: 120px;} .wedding__pesce-palla { position: absolute; z-index: 2; top: 230px; left: 40px; width: 220px;} } /* ! ___display-max-md */ @media (max-width: 767.98px) { .wedding{overflow-y: hidden;} .wedding .col-images__small{ bottom: -180px; } .wedding__pesce-palla { top: 100px; left: -70px; width: 160px; } .wedding__cavalluccio-marino { bottom: 100px; left: 58%; width: 90px; z-index: 6;} } /* ! ___display-max--sm */ @media (max-width: 575.98px) { .wedding { padding-bottom: 190px; padding-top: 50px;} .wedding__pesce-palla { top: 200px;} .wedding .col-contents { border-radius: 35px; padding: 15px; width: calc(100% - 50px); margin-left: 25px; } .wedding__item { padding-right: 10px; gap: 10px;} .wedding .col-images{position: relative; top: unset; right: unset;} .wedding__cavalluccio-marino { position: absolute; z-index: 6; bottom: 590px; right: 2%; left: unset; width: 70px;} .wedding .col-images__big { top: unset; width: unset; height: 240px; border-radius: 25px; left: 30px; top: 20px; position: relative;} .wedding .col-images__small { position: relative; bottom: -70px; right: unset; left: unset; width: 120px; height: 185px; } .wedding .cta { width: 100%; text-align: center;} }