html, body{ width:100%; overflow-x:hidden; } /* above - solve elementor horizontal scroll on mobile - do not move this comment above the code - css need to start without a comment at the top */ /* home slider dots position */ .slick_slide_banner .jet-listing-grid__slider .jet-slick-dots li { margin-top: -13%; z-index: 50; } /* Mobile override */ @media (max-width: 768px) { .slick_slide_banner .jet-listing-grid__slider .jet-slick-dots li { display:none; } } /* fix replaced css by elementor */ .elementor .elementor-element.elementor-widget-n-tabs:not(:has(>.elementor-widget-container))>.e-n-tabs>.e-n-tabs-heading .e-n-tab-title[aria-selected=true], .elementor .elementor-element.elementor-widget-n-tabs:not(:has(>.elementor-widget-container))>.e-n-tabs[data-touch-mode=true]>.e-n-tabs-heading .e-n-tab-title[aria-selected=false]:hover, .elementor .elementor-element.elementor-widget-n-tabs>.elementor-widget-container>.e-n-tabs>.e-n-tabs-heading .e-n-tab-title[aria-selected=true], .elementor .elementor-element.elementor-widget-n-tabs>.elementor-widget-container>.e-n-tabs[data-touch-mode=true]>.e-n-tabs-heading .e-n-tab-title[aria-selected=false]:hover{ background-color: inherit !important; } .elementor .elementor-element.elementor-widget-n-tabs:not(:has(>.elementor-widget-container))>.e-n-tabs[data-touch-mode=false]>.e-n-tabs-heading .e-n-tab-title[aria-selected=false]:hover, .elementor .elementor-element.elementor-widget-n-tabs>.elementor-widget-container>.e-n-tabs[data-touch-mode=false]>.e-n-tabs-heading .e-n-tab-title[aria-selected=false]:hover{ background-color: inherit !important; } .elementor-widget-n-tabs .e-n-tab-title { border-radius: var(--n-tabs-title-border-radius) !important; } /* End Elementor replaced css */ /* sticky header and header styles */ #theheader.elementor-sticky--effects { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); } .dialog-type-lightbox { z-index: 99999; } /* JET Filter */ .filter-inline .jet-filter-label { font-family: var(--e-global-typography-6592eb7-font-family), Sans-serif; font-size: var(--e-global-typography-6592eb7-font-size); font-weight: var(--e-global-typography-6592eb7-font-weight); line-height: var(--e-global-typography-6592eb7-line-height); letter-spacing: var(--e-global-typography-6592eb7-letter-spacing); } .filter-inline .jet-smart-filters-select.jet-filter { display:flex !important; gap:20px; align-items:center; } .filter-inline .jet-smart-filters-select.jet-filter[style*="display: none;"]{ display:none !important; } .filter-inline .jet-filter .jet-select{ width:100%; flex-grow:1 !important; } @media screen and (max-width:900px){ .filter-inline .jet-filter { flex-direction:column; } } /* provides 'boxed content width' positioning in full width elementor container for alignment purposes where we need to show full covering image backgrounds in one column that stretch to edge of page - this should be the only scenario where we need these styles - for all others, use native elementor controls */ /* *This area affects the Slider widget on the front page. I am removing this and looking to use Elementor formating to control this - Paul. 8/01/25 * .boxedleft { padding-left: calc(50vw - 670px) !important; padding-right: 5% !important; } .boxedright { padding-right: calc(50vw - 670px) !important; padding-left: 3% !important; }*/ /* general styles */ ul { padding-bottom: 15px; } .lighticon { filter: invert(1); } /* add border radius to jet engine interactive mapping component */ .jet-map-listing { border-radius: 15px; } /* component for fixed image gallery styles - adjust opacity for clicked style to match thumb navigation more obvious */ #slider_B .swiper-slide.swiper-slide-active { opacity: 1; } #slider_B .swiper-slide { opacity: 0.5; } /* use this to work around the need to create excessive numbers of unique global fonts */ .uppercasetext { text-transform: uppercase; } .capitalisetext { text-transform: capitalize; } #theloadmore { cursor: pointer; } .shadow-xsmall { box-shadow: 0px 2px 2px 0px #1018280A; } .shadow-small { box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06); } .shadow-medium { box-shadow: 0px 6px 15px -2px rgba(16, 24, 40, 0.08); } .shadow-large { box-shadow: 0px 8px 24px -3px rgba(16, 24, 40, 0.10); } .shadow-large { box-shadow: 0px 20px 40px -8px rgba(16, 24, 40, 0.10); } .shadow-xlarge { box-shadow: 0px 25px 60px -15px rgba(16, 24, 40, 0.20); } .blur-small { filter: blur(8px); } .blur-medium { filter: blur(16px); } .hide-form-labels .elementor-field-label { display: none; } /* query editor buttons - width: auto */ .jet-engine-frontend-query-editor-buttons { width: auto; right: 0; } /* prevent odd red colour setting in forms text input */ .elementor-field-textual { color: var(--e-global-color-text) !important; } /* .bottomblur10, .bottomblur20, .bottomblur30, .inc-overlay, .sot-overlay { position: relative; background: linear-gradient( to top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 45% ); background-blend-mode: multiply; border-radius: inherit; } */ .bottomblur10, .bottomblur20, .bottomblur30, .inc-overlay, .sot-overlay { position: relative; } .bottomblur10:hover, .bottomblur20:hover, .bottomblur30:hover, .inc-overlay:hover, .sot-overlay:hover { filter: brightness(0.8); /* Slightly darken the image */ transition: filter 0.3s ease-in-out; /* Smooth transition */ } .bottomblur10:hover, .bottomblur20:hover, .bottomblur30:hover, .inc-overlay:hover, .sot-overlay-hover:hover { filter: brightness(0.8); /* Slightly darken the image */ transition: filter 0.3s ease-in-out; /* Smooth transition */ } .bottomblur10::after, .bottomblur20::after, .bottomblur30::after, .inc-overlay::after, .sot-overlay::after { content: ""; position: absolute; inset: 0; background: linear-gradient( to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 45% ); z-index: 1; /* Below content */ pointer-events: none; border-radius: inherit; } .bottomblur10 > *, .bottomblur20 > *, .bottomblur30 > *, .inc-overlay > *, .sot-overlay > * { position: relative; /* Ensures headings or content appear above the overlay */ z-index: 2; } /* improved bullet styles */ .sotbullets ul { padding-left: 35px; list-style: disc; } .sotbullets ul li, .sotbullets ol li { padding: 5px 0; position: relative; } .sotbullets ul li::marker { color: var(--e-global-color-accent); font-size: 1.2em; } /* Custom CSS for Elementor Accordion */ .presailing-checklist .jet-toggle__label-text:before { content: ''; display: inline-block; width: 30px; height: 30px; margin-right: 10px; margin-left: -30px; background-image: url('png/checkboxempty.png'); /* Insert checkbox image URL here */ background-size: contain; background-repeat: no-repeat; background-position: center; vertical-align: middle; /* Align to middle of text */ position: relative; top: 0px; } .presailing-checklist .jet-toggle--active .jet-toggle__label-text:before { background-image: url('png/checkbox.png'); /* Checked icon image URL */ } @media only screen and (max-width: 1024px) { /* Fix the lightbox issue for the logged in user */ body.admin-bar .dialog-type-lightbox { position: fixed; } } @media only screen and (max-width: 767px) { /* Custom CSS for mobile tabs */ .e-n-tabs-mobile .e-n-tab-title { justify-content: space-between !important; } .e-n-tabs-mobile .e-n-tab-title:after { content: ''; background: url(https://spiritoftasmania.com.au/wp-content/uploads/2024/12/caret-right-bold.svg) no-repeat; background-size: 16px; width: 16px; height: 16px; background-position: center right; } .e-n-tabs-mobile .e-n-tab-title[aria-selected="false"]:after { filter: brightness(0%); } /* end Custom CSS for mobile tabs */ } /* custom css for adding red border on offset element with white background */ .inset-box-#ffffff { border: solid 1px #C8102E; } /* css for megamenu a link to follow standard color scheme - true neutral grey */ /* .jetmegamenu .jet-tabs__label-text a{ color: #222C33 !important; } */ .jetmegamenu .jet-tabs__label-text a { color: #222C33 !important; width: 100% !important; display: block !important; } .jetmegamenu .jet-tabs__label-text{ width: 100% !important; } .elementor-kit-155 input:not([type="button"]):not([type="submit"]) { line-height: 14px !important; } .custom_choose_date .jet-date-period__datepicker-button.input-group-addon{ border: none; font-size: 12px; font-weight: 400; line-height: 1.2em; letter-spacing: 0px; color: #080D0F; } .custom_choose_date .jet-date-period__datepicker-button i{ padding-right: 5px; } .custom_choose_date .jet-date-period__datepicker-button.input-group-addon .jet-date-period-start{ color: var( --e-global-color-accent ); display:none; } .custom_choose_date .jet-date-period__prev,.custom_choose_date .jet-date-period__next{ display:none !important; } .sailing-day-active .elementor{ border: 2px solid var( --e-global-color-accent ) !important; border-radius: 10px; } #query-sailing-by-departsfrom .slick-active .elementor{ border: 1px solid #ddd; border-radius: 10px; } .sailingdates_custom .elementor-widget{ border-bottom: 1px solid #f2f2f2; padding: 5px 0 7px; } .sailingdates_custom{ padding-right:0px; padding-left:0px } .datepicker--day-name, .datepicker--cell.-current- { color: var( --e-global-color-accent ) !important; } .datepicker--cell.-selected- { background: var( --e-global-color-accent ) !important; } #departs-location-text-current .elementor-shortcode, #departs-location-text-switch .elementor-shortcode{ color: var(--e-global-color-text); font-family: var(--e-global-typography-6592eb7-font-family), Sans-serif; font-size: var(--e-global-typography-6592eb7-font-size); font-weight: var(--e-global-typography-6592eb7-font-weight); line-height: var(--e-global-typography-6592eb7-line-height); letter-spacing: var(--e-global-typography-6592eb7-letter-spacing); } #departs-location-filter-trigger span{ color: var(--e-global-color-accent); font-family: var(--e-global-typography-798a4c0-font-family), Sans-serif; font-size: var(--e-global-typography-798a4c0-font-size); font-weight: var(--e-global-typography-798a4c0-font-weight); line-height: var(--e-global-typography-798a4c0-line-height); letter-spacing: var(--e-global-typography-798a4c0-letter-spacing); cursor: pointer; } #sailing-carousel { display: flex; align-items: center; } .badge-wrapper,.badge-default { width: 100px; border-radius: 5px; max-width:100px; } .carousel-container { display: flex; overflow: hidden; width: 100%; } .carousel-nav { cursor: pointer; font-size: 18px; padding: 10px; } .carousel-slides { display: flex; gap: 10px; /* Space between cards */ overflow-x: auto; } .carousel-slide { width: 110px; height: 90px; background-color: #ffffff; border-radius: 9px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 14px; text-align: center; padding: 10px; } .date-title { font-weight: bold; margin-bottom: 5px; } #container_sailing{ position: relative; } #container_gif{ display: none; position: absolute; text-align: center; margin: auto; top: 0; left: 0; right: 0; bottom: 0; background: #fff; opacity: 0.5; } .show-gif { display: block !important; } .row-screening .jet-listing-dynamic-repeater__item { display: flex; flex-direction: column; } .row-screening { width: 100%; } .row-screening .jet-listing-dynamic-repeater__item > * { display: flex; flex-basis: 100%; justify-content: space-between !important; place-content: space-between; } .jet-listing-dynamic-repeater__item .time { font-weight: 400; } .schedule-time .jet-listing-grid__items .jet-listing-grid__item:not(:last-child) > div { padding-bottom: 12px; border-bottom: 1px solid var(--e-global-color-38addba); margin-bottom: 12px; } .jet-video__overlay.jet-video__overlay--custom-bg { background-image: none !important; background: transparent; } .movie-list .jet-video { background: transparent !important; } .movie-list .e-icon-wrapper.e-icon-unmarked :is(i,svg) { visibility:hidden; } .movie-list .e-icon-wrapper.e-icon-unmarked { color: transparent !important; background: url("svg/unfilled.svg"); background-size: contain; } .time { font-size: var(--e-global-typography-3176eb7-font-size); font-weight: 500; } /*=========== MASONRY LAYOUT SINGLE IMAGE LEFT FULL HEIGHT, 2 STACKED RIGHT ===========*/ /* Parent grid container for the listing grid */ .atdw-imggrid .jet-listing-grid__items, .atdw-imggrid-btn .jet-listing-grid__items, .atdw-imggrid-right .jet-listing-grid__items, .atdw-imggrid-right-btn .jet-listing-grid__items { display: grid; grid-template-columns: 50% 50%; /* Left and right columns */ grid-template-rows: 1fr 1fr; /* Two equal-height rows */ gap: 0; /* Adjust spacing if necessary */ height: 100%; /* Full height of the container */ width: 100%; /* Full width of the container */ margin: 0; } /* First listing item spans the entire left column */ .atdw-imggrid .jet-listing-grid__item:nth-child(1), .atdw-imggrid-btn .jet-listing-grid__item:nth-child(1) { grid-column: 1 / 2; /* Place in the first column */ grid-row: 1 / span 2; /* Span both rows (entire height) */ display: flex; /* Set to flex for child alignment */ flex-direction: column; /* Stack children vertically */ height: 100%; /* Fill the grid height */ width: 100%; /* Full width of grid cell */ } /* First listing item spans the entire right column */ .atdw-imggrid-right .jet-listing-grid__item:nth-child(1), .atdw-imggrid-right-btn .jet-listing-grid__item:nth-child(1) { order: 2; grid-row: span 2; height: 100%; } .atdw-imggrid-right .jet-listing-grid__item:nth-child(2), .atdw-imggrid-right-btn .jet-listing-grid__item:nth-child(2) { order: 1; } .atdw-imggrid-right .jet-listing-grid__item:nth-child(3), .atdw-imggrid-right-btn .jet-listing-grid__item:nth-child(3) { order: 3; } /* Fix any intermediary parent of .atdwimagebox */ .atdw-imggrid .jet-listing-grid__item:nth-child(1) > *, .atdw-imggrid-btn .jet-listing-grid__item:nth-child(1) > *, .atdw-imggrid-right .jet-listing-grid__item:nth-child(1) > *, .atdw-imggrid-right-btn .jet-listing-grid__item:nth-child(1) > * { display: flex; /* Ensure any intermediate wrapper uses flex */ flex-direction: column; /* Stack children vertically */ height: 100%; /* Fill the parent's height */ width: 100%; /* Full width */ } /* Ensure the atdwimagebox fills its immediate parent */ .atdw-imggrid .jet-listing-grid__item:nth-child(1) .atdwimagebox, .atdw-imggrid-btn .jet-listing-grid__item:nth-child(1) .atdwimagebox, .atdw-imggrid-right .jet-listing-grid__item:nth-child(1) .atdwimagebox, .atdw-imggrid-right-btn .jet-listing-grid__item:nth-child(1) .atdwimagebox { flex-grow: 1; /* Stretch to fill available height */ height: auto; /* Remove conflicting height styles */ width: 100%; /* Full width */ } /* Equal height and aspect-ratio */ /* div[data-elementor-type="jet-listing-items"], .atdwimagebox, .jet-engine-listing-overlay-wrap { height: 100% !important; } .jet-listing-grid__items>.jet-listing-grid__item { aspect-ratio: 3 / 2; }*/ /* pip adjustment to the code above to utilise atdw-imggrid as this was affecting other listing grids overlapping on the site */ .atdw-imggrid .jet-listing-grid__items > .jet-listing-grid__item, .atdw-imggrid-btn .jet-listing-grid__items > .jet-listing-grid__item, .atdw-imggrid-right .jet-listing-grid__items > .jet-listing-grid__item, .atdw-imggrid-right-btn .jet-listing-grid__items > .jet-listing-grid__item, .atdw-imggrid-right-btn-slider .jet-listing-grid__item { aspect-ratio: 3 / 2; } /* atdw-imggrid-btn - First column height +70px */ .atdw-imggrid-btn .jet-listing-grid__item:nth-child(1), .atdw-imggrid-right-btn .jet-listing-grid__item:nth-child(1) { height: calc(100% + 70px); } @media only screen and (max-width: 767px) { .atdw-imggrid .jet-listing-grid__items, .atdw-imggrid-btn .jet-listing-grid__items, .atdw-imggrid-right .jet-listing-grid__items, .atdw-imggrid-right-btn .jet-listing-grid__items { display: flex; } .atdw-imggrid .jet-listing-grid__item:nth-child(1), .atdw-imggrid-btn .jet-listing-grid__item:nth-child(1), .atdw-imggrid-right .jet-listing-grid__item:nth-child(1), .atdw-imggrid-right-btn .jet-listing-grid__item:nth-child(1) { grid-row: 1; } .atdw-imggrid .jet-listing-grid__items, .atdw-imggrid-btn .jet-listing-grid__items, .atdw-imggrid-right .jet-listing-grid__items , .atdw-imggrid-right-btn .jet-listing-grid__items { grid-template-rows: 1fr; grid-template-columns: 100%; } } #query-sailing-by-departsfrom .slick-initialized .slick-current>.elementor { border: 2px solid var(--e-global-color-accent) !important; border-radius: 10px; } .custom_choose_date .jet-date-period__datepicker-button.input-group-addon i{ color: #3D628C; } @media (max-width: 768px) { .custom_choose_date .jet-date-period__datepicker-button.input-group-addon{ border: 1px solid #ccc; background-color: #fff; } .custom_choose_date .jet-date-period__datepicker-button.input-group-addon i{ color: #3D628C; font-size: 14px; } .jet-date-period__wrapper{ display: block !important; } .depart{ text-align: center; } .arrive{ text-align: center; } } @media (max-width: 1030px) { .depart{ text-align: center; } .arrive{ text-align: center; } } @media screen and (min-width:980px) { :not(.elementor-editor-active) .schedule-content { opacity: 0; position: absolute; display: none; transition: all 0.55s ease-in; /*transform:translateX(-1000%);*/ width: 400px; } :not(.elementor-editor-active) .schedule-toggle:hover .schedule-content { opacity: 1; position: absolute; top: -150px; display: block; transform:translateX(0%); width: 400px; } } .booking-form-lite-container { width: 100%; margin: auto; } .booking-form-lite-container i { color: #3D628C; } .row { display: flex; gap: 15px; } /* Style for the checkbox row */ .checkbox-row { /* margin-left: 35px; */ padding-bottom: 25px; } .checkbox-row label { font-size: 14px; } /* Add 10px margin below the first row */ .first-row { margin-bottom: 10px; } /* Adjust widths to 25% when return fields are shown */ #departPortContainerLite, #returnPortContainerLite, { width: 35%; } /* Set specific widths for elements in the second row */ #vehicleTravellingContainerLite { width: 15%; } #bookNowContainerLite { width: 15%; } .field-container { position: relative; } .hidden { display: none; } .field-container i { position: absolute; top: 12px; left: 10px; } .field-container select, .field-container input[type="text"], .field-container input[type="checkbox"] { font-family: var(--e-global-typography-b4cb2b1-font-family), Sans-serif; font-weight: var(--e-global-typography-b4cb2b1-font-weight) !important; font-size: var(--e-global-typography-b4cb2b1-font-size) !important; color: var(--e-global-color-text) !important; line-height: 1.2em; border: 1px solid #D2DEDE; border-radius: 8px; padding: 20px 10px 10px 30px; background-color: #FFFFFF; width: 100%; } /* Apply to labels in .field-container but exclude labels in .increment-field */ .field-container label:not(.increment-field label) { font-family: var(--e-global-typography-b4cb2b1-font-family), Sans-serif; font-size: 12px; font-weight: 300; line-height: 1.4em; color: #666; position: absolute; top: 12px; left: 35px; transition: 0.2s ease all; pointer-events: none; } .field-container input:focus + label, .field-container select:focus + label, .field-container input:not(:placeholder-shown) + label, .field-container select:not([value=""]) + label { top: 5px; font-size: 12px; color: #333; } .increment-field { display: flex; align-items: center; gap: 10px; } .increment, .decrement { background: none; border: none; cursor: pointer; padding: 8px 12px; margin-top: 10px; } /* Style for input boxes inside .increment-field */ .increment-field input[type="text"] { height: 40px; width: 60px !important; text-align: center; border: 1px solid #D2DEDE; border-radius: 8px; font-size: 14px; margin-top: 10px; } #returnPortLite, #travellingWith, #departPortLite { font-family: var(--e-global-typography-b4cb2b1-font-family), Sans-serif; height: 56px; border-radius: 8px; border: 1px solid #D2DEDE; } #travellingWith, #returnPortLite { margin-left: 5px; } #vehicleTravellingContainerLite label { font-size: 14px !important; } #vehicleTravelling { margin-left: 30px; margin-top: 9px; } .dropdown-panel label { padding-top: 20px; width: 50%; } /* Button styling */ #bookNowButtonLite { width: 100%; height: 56px; padding: 10px; border: none; background-color: #9FD457; color: #FFFFFF; font-size: 16px; border-radius: 8px; cursor: pointer; margin-left: 5px; } #bookNowButtonLite:hover { background-color: #6cad13; } .confirm-link { color: white !important; background-color: var(--e-global-color-accent); padding: 8px 15px; border-radius: 8px; font-size: 16px !important; margin-top: 35px; font-family: var(--e-global-typography-b4cb2b1-font-family), Sans-serif; } /* Responsive adjustments for devices with width < 1024px */ @media (max-width: 1024px) { .row { flex-direction: column; } .field-container, #departPortContainerLite, #returnPortContainerLite, #vehicleTravellingContainerLite, #bookNowContainerLite { width: 100%; } } /* efe custom */ #oneWayButton, #roundTripButton{ background-color: transparent; border: 2px solid #012169; border-radius: 50px; color: #012169; padding: 10px 25px; margin-bottom: 7px; } #oneWayButton.selected, #roundTripButton.selected{ background-color: #012169; color: #fff; } #departPortLite{ -webkit-appearance: none; padding: 20px 33px 0px; -moz-appearance: none; } .first-row-checkbox{ display: flex; } .checkbox-row{ width: 50%; } #vehicleTravellingContainerLite { display: flex; align-items: center; width: 50%; justify-content: flex-start; padding-bottom: 0px; } .toggle-ios { display: none; } .toggle-ios + .toggle-btn { outline: 0; display: block; width: 3.5em; height: 2em; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* background: #9FD457; */ border-radius: 2em; padding: 2px; -webkit-transition: all .4s ease; transition: all .4s ease; border: 1px solid #e8eae9; } .toggle-ios + .toggle-btn:after { position: relative; display: block; content: ""; width: 50%; height: 100%; left: 0; border-radius: 2em; background: #fbfbfb; -webkit-transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease; transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 0 rgba(0, 0, 0, 0.08); } .toggle-ios:checked + .toggle-btn { background: #84BA3A; } .toggle-ios:checked + .toggle-btn:after { left: 50%; } .vehicle{ margin-left: 20px; } #vehicleTravellingContainerLite{ width: 15%; } #bookNowContainerLite { width: 15%; } #returnPortContainerLite{ position: relative; } .icon-container { position: absolute; top: 12%; left: -10%; font-size: 24px; z-index: 1; } /* #travellingWithPanel{ padding: 20px; background-color: #fff; border-radius: 30px; box-shadow: 0px 4px 23px rgba(0, 0, 0, 0.5); } */ .increment-field { padding-bottom: 14px; border-bottom: 1px solid #ddd; } button.decrement , button.increment { border-radius: 50%; height: 30px; width: 30px; border: 1px solid #ccc; background-color: #fff; color: #ccc; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0px; } button.decrement:hover , button.increment:hover{ border-radius: 50%; background-color: #012169; color: #fff ; border-color: #ccc; } button.decrement:focus , button.increment:focus{ border-radius: 50%; background-color: #012169; color: #fff ; border-color: #ccc; } #travellingWithPanel .increment-field input{ border: none; display: flex; align-items: center; justify-content: center; padding: 0px; } #confirm-link{ margin-top:20px; } a.confirm-link { background-color: #012169; } a.confirm-link:hover { background-color: #000; } input#travellingWith { margin-left: 0px; } @media (max-width: 1024px) { #departDate{ padding: 15px 0px 0px 35px; margin-left: 0px !important; } .second-row{ margin-top: 15px; } input#travellingWith { padding: 15px 0px 0px 35px; } .show-return-fields .row.first-row { display: grid; grid-template-columns: repeat(2, 1fr); } .show-return-fields #departPortContainer, .show-return-fields #departDateContainer, .show-return-fields #returnPortContainerLite, .show-return-fields #returnDateContainerLite { width: 100%; } .icon-container { position: absolute; top: 12%; left: -9%; font-size: 24px; z-index: 1; } #departDateContainer input.flatpickr-mobile , #returnDateContainer input.flatpickr-mobile{ padding: 15px 0 0 35px; margin-left: 0px !important; font-family: var(--e-global-typography-b4cb2b1-font-family), Sans-serif; height: 56px; border-radius: 8px; border: 1px solid #D2DEDE; width: 100% !important; font-size: var(--e-global-typography-b4cb2b1-font-size) !important; color: var(--e-global-color-text) !important; background-color: #fff; box-sizing: border-box; } #returnDateContainer input.flatpickr-mobile{ margin-left: 5px !important; } #departDateContainer input[type="date"].flatpickr-mobile ,#returnDateContainer input[type="date"].flatpickr-mobile { width: 100% !important; box-sizing: border-box; max-width:100% !important; -webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important; text-align: left !important; margin-left: 0 !important; margin-right: 0 !important; } } @media (max-width: 426px) { .icon-container { position: absolute; top: 12%; left: -17%; font-size: 24px; z-index: 1; } } .sot_submit_form .jet-form-builder-row { flex-grow: 1; } .sot_submit_form .jet-form-builder input, .sot_submit_form .jet-form-builder textarea, .sot_submit_form .jet-form-builder select { border-radius: 8px !important; color: var(--e-global-color-text) !important; } .sot_submit_form .jet-form-builder__label { font-size: 16px; } .sot_submit_form .jet-form-builder-file-upload__fields input { border-radius: 0px !important; } .terms-style p { font-size: 16px; } .terms-style h2 { font-size: 32px; margin-top: 25px; } .terms-style h3 { font-size: 24px; margin-top: 15px; } .terms-style h3::after { content: ''; display: block; border-top: 1px solid #eee; /* Adjust color and style as needed */ margin-top: 10px; /* Space between the