.picker,.picker__holder{width:100%;position:absolute}.picker{font-size:16px;text-align:left;line-height:1.2;color:#000;z-index:10000;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.picker__input{cursor:default}.picker__input.picker__input--active{border-color:#0089ec}.picker__holder{overflow-y:auto;-webkit-overflow-scrolling:touch;background:#fff;border:1px solid #aaa;border-top-width:0;border-bottom-width:0;border-radius:0 0 5px 5px;box-sizing:border-box;min-width:176px;max-width:466px;max-height:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);-moz-opacity:0;opacity:0;-webkit-transform:translateY(-1em)perspective(600px)rotateX(10deg);transform:translateY(-1em)perspective(600px)rotateX(10deg);transition:-webkit-transform .15s ease-out,opacity .15s ease-out,max-height 0s .15s,border-width 0s .15s;transition:transform .15s ease-out,opacity .15s ease-out,max-height 0s .15s,border-width 0s .15s}.picker__frame{padding:1px}.picker__wrap{margin:-1px}.picker--opened .picker__holder{max-height:25em;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);-moz-opacity:1;opacity:1;border-top-width:1px;border-bottom-width:1px;-webkit-transform:translateY(0)perspective(600px)rotateX(0);transform:translateY(0)perspective(600px)rotateX(0);transition:-webkit-transform .15s ease-out,opacity .15s ease-out,max-height 0s,border-width 0s;transition:transform .15s ease-out,opacity .15s ease-out,max-height 0s,border-width 0s;box-shadow:0 6px 18px 1px rgba(0,0,0,.12)}.picker__footer,.picker__header,.picker__table{text-align:center}.picker__day--highlighted,.picker__select--month:focus,.picker__select--year:focus{border-color:#0089ec}.picker__box{padding:0 1em}.picker__header{position:relative;margin-top:.75em}.picker__month,.picker__year{font-weight:500;display:inline-block;margin-left:.25em;margin-right:.25em}.picker__year{color:#999;font-size:.8em;font-style:italic}.picker__select--month,.picker__select--year{border:1px solid #b7b7b7;height:2em;padding:.5em;margin-left:.25em;margin-right:.25em}.picker__select--month{width:35%}.picker__select--year{width:22.5%}.picker__nav--next,.picker__nav--prev{position:absolute;padding:.5em 1.25em;width:1em;height:1em;box-sizing:content-box;top:-.25em}.picker__nav--prev{left:-1em;padding-right:1.25em}.picker__nav--next{right:-1em;padding-left:1.25em}@media (min-width:24.5em){.picker__select--month,.picker__select--year{margin-top:-.5em}.picker__nav--next,.picker__nav--prev{top:-.33em}.picker__nav--prev{padding-right:1.5em}.picker__nav--next{padding-left:1.5em}}.picker__nav--next:before,.picker__nav--prev:before{content:" ";border-top:.5em solid transparent;border-bottom:.5em solid transparent;border-right:.75em solid #000;width:0;height:0;display:block;margin:0 auto}.picker__nav--next:before{border-right:0;border-left:.75em solid #000}.picker__nav--next:hover,.picker__nav--prev:hover{cursor:pointer;color:#000;background:#b1dcfb}.picker__nav--disabled,.picker__nav--disabled:before,.picker__nav--disabled:before:hover,.picker__nav--disabled:hover{cursor:default;background:0 0;border-right-color:#f5f5f5;border-left-color:#f5f5f5}.picker--focused .picker__day--highlighted,.picker__day--highlighted:hover,.picker__day--infocus:hover,.picker__day--outfocus:hover{color:#000;cursor:pointer;background:#b1dcfb}.picker__table{border-collapse:collapse;border-spacing:0;table-layout:fixed;font-size:inherit;width:100%;margin-top:.75em;margin-bottom:.5em}@media (min-height:33.875em){.picker__table{margin-bottom:.75em}}.picker__table td{margin:0;padding:0}.picker__weekday{width:14.285714286%;font-size:.75em;padding-bottom:.25em;color:#999;font-weight:500}@media (min-height:33.875em){.picker__weekday{padding-bottom:.5em}}.picker__day{padding:.3125em 0;font-weight:200;border:1px solid transparent}.picker__day--today{position:relative}.picker__day--today:before{content:" ";position:absolute;top:2px;right:2px;width:0;height:0;border-top:.5em solid #0059bc;border-left:.5em solid transparent}.picker__day--disabled:before{border-top-color:#aaa}.picker__day--outfocus{color:#ddd}.picker--focused .picker__day--selected,.picker__day--selected,.picker__day--selected:hover{background:#0089ec;color:#fff}.picker--focused .picker__day--disabled,.picker__day--disabled,.picker__day--disabled:hover{background:#f5f5f5;border-color:#f5f5f5;color:#ddd;cursor:default}.picker__day--highlighted.picker__day--disabled,.picker__day--highlighted.picker__day--disabled:hover{background:#bbb}.picker__button--clear,.picker__button--close,.picker__button--today{border:1px solid #fff;background:#fff;font-size:.8em;padding:.66em 0;font-weight:700;width:33%;display:inline-block;vertical-align:bottom}.picker__button--clear:hover,.picker__button--close:hover,.picker__button--today:hover{cursor:pointer;color:#000;background:#b1dcfb;border-bottom-color:#b1dcfb}.picker__button--clear:focus,.picker__button--close:focus,.picker__button--today:focus{background:#b1dcfb;border-color:#0089ec;outline:0}.picker__button--clear:before,.picker__button--close:before,.picker__button--today:before{position:relative;display:inline-block;height:0}.picker__button--clear:before,.picker__button--today:before{content:" ";margin-right:.45em}.picker__button--today:before{top:-.05em;width:0;border-top:.66em solid #0059bc;border-left:.66em solid transparent}.picker__button--clear:before{top:-.25em;width:.66em;border-top:3px solid #e20}.picker__button--close:before{content:"\D7";top:-.1em;vertical-align:top;font-size:1.1em;margin-right:.35em;color:#777}.picker__button--today[disabled],.picker__button--today[disabled]:hover{background:#f5f5f5;border-color:#f5f5f5;color:#ddd;cursor:default}.picker__button--today[disabled]:before{border-top-color:#aaa}#direct-ferries-engine, #direct-ferries-engine .engine-form-contents { position: relative; } #direct-ferries-engine .form-control:hover, #direct-ferries-engine .form-control.no-readonly-style:hover { cursor: pointer; } #direct-ferries-engine .form-control.no-readonly-style { background-color: #FFF; background-image: none; } #direct-ferries-engine .form-control.no-readonly-style[disabled] { background-color: #EEE; } #direct-ferries-engine .loading-overlay { display: none; } #direct-ferries-engine.loading .loading-overlay, #form-modal.loading .loading-overlay { content: ""; position: absolute; height: 100%; width: 100%; top: 0; left: 0; z-index: 20; } #direct-ferries-engine.loading .engine-overlay.loading-overlay, #form-modal.loading .modal-overlay.loading-overlay { display: block; background: rgba(255, 255, 255, .5); } #direct-ferries-engine .loading-center { display: table; width: 100%; height: 100%; } #direct-ferries-engine .loading-message { display: table-cell; vertical-align: middle; text-align: center; } #direct-ferries-engine .loading-message span { display: inline-block; background-color: #FFF; padding: 8px 16px; border-radius: 3px; } #direct-ferries-engine .engine-field-label { font-size: 16px; white-space: nowrap; } #direct-ferries-engine .required-indicator { color: red; margin-left: 3px; } #direct-ferries-engine .auto-suggest-list { position: relative; } #direct-ferries-engine .list-wrapper { position: absolute; min-width: 470px; top: 0; left: 0; z-index: 3; } #direct-ferries-engine #add-return-btn { font-weight: bold; font-size: 16px; padding: 10px 16px; border: 2px transparent solid; border-radius: 4px; } #direct-ferries-engine.hide-return .return-col, #direct-ferries-engine:not(.hide-return) .add-return-date { display: none; } #direct-ferries-engine .date-col { padding-right: 5px; } #direct-ferries-engine .time-col { padding-left: 5px; } @media (min-width: 768px) and (max-width: 991px) { #direct-ferries-engine .return-auto-suggest .list-wrapper { left: auto; right: 0; } } @media (max-width: 767px) { #form-modal label.radio-inline { display: block; } #form-modal .radio label, #form-modal label.radio-inline { padding-left: 35px; } #form-modal label.radio-inline + label.radio-inline { margin: 10px 0 0; } } @media (min-width: 767px) { #direct-ferries-engine.hide-return .route-date-fields-wrapper { margin-left: -15px; margin-right: -15px; } #direct-ferries-engine.hide-return .route-date-fields-wrapper:before, #direct-ferries-engine.hide-return .route-date-fields-wrapper:after { display: table; content: " "; } #direct-ferries-engine.hide-return .route-date-fields-wrapper:after { clear: both; } #direct-ferries-engine.hide-return .depart-col { width: 100%; padding-left: 0; padding-right: 0; } #direct-ferries-engine.hide-return .route-depart-row, #direct-ferries-engine.hide-return .route-return-row { float: left; width: 50%; padding-left: 15px; padding-right: 15px; margin-left: 0; margin-right: 0; } } .picker, .picker__holder { min-width: 350px; } .picker__list { padding: 0; } .picker__footer, .picker__list > li:last-child { display: none !important; } .picker--opened .picker__holder { border: none; } .picker--focused .picker__day--highlighted:not(.picker__day--disabled), .picker__day--highlighted:not(.picker__day--disabled):hover, .picker__day--infocus:not(.picker__day--disabled):hover, .picker__day--outfocus:not(.picker__day--disabled):hover, .picker__nav--next:hover, .picker__nav--prev:hover, .picker--focused .picker__day--selected:not(.picker__day--disabled), .picker__day--selected:not(.picker__day--disabled), .picker__day--selected:not(.picker__day--disabled):hover { background-color: #542E91; color: #FFF; } .picker__day--highlighted.picker__day--disabled, .picker__day--highlighted.picker__day--disabled:hover { background: #F5F5F5; border-color: #F5F5F5; color: #DDD; cursor: default; } .picker__day--today:before { border-top-color: #542E91; } .picker__day--today:hover:before { border-top-color: #FFF; } .picker__nav--next:hover:before { border-left-color: #FFF; } .picker__nav--prev:hover:before { border-right-color: #FFF; } .picker__weekday { text-align: center; } .picker__table td { border: 1px #EEE solid; } .picker__table tr td:first-child { border-left-color: transparent; } .picker__table tr td:last-child { border-right-color: transparent; } .picker__table tr:last-child td { border-bottom-color: transparent; } @font-face { font-family: HolidayExtrasSans; src: url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Regular.eot'); src: url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Regular.eot?#iefix') format('embedded-opentype'), url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Regular.woff2') format('woff2'), url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Regular.woff') format('woff'), url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Regular.ttf') format('truetype'); font-weight: 400; font-display: auto; font-style: normal } @font-face { font-family: HolidayExtrasSans; src: url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Bold.eot'); src: url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Bold.eot?#iefix') format('embedded-opentype'), url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Bold.woff2') format('woff2'), url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Bold.woff') format('woff'), url('//d17s4kc6349e5h.cloudfront.net/holidayextras/assets/fonts/HolidayExtrasSans-Bold.ttf') format('truetype'); font-weight: 700; font-display: auto; font-style: normal } *:focus, *:active { outline: none !important; } .criteo_header { display: none !important; } html, body { height: 100%; } body { background-color: #FFF; font-family: "HolidayExtrasSans", "Helvetica Neue", Helvetica, Arial, sans-serif; } .form-control { background-color: #FFF; background-position: top 7px right 3px; background-repeat: no-repeat; background-size: 30px; padding: 9px 25px 9px 16px; font-size: 16px; height: 46px; font-weight: normal; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 6px; } .engine-form-contents .form-control, .engine-form-contents .form-control:focus, .engine-form-contents .form-control.picker__input.picker__input--active { border: 3px #FFF4A2 solid; -webkit-box-shadow: none; box-shadow: none; outline: none; } .modal-form .form-control, .modal-form .form-control:focus, .modal-form .form-control.picker__input.picker__input--active { border: 2px #E4E4E4 solid; -webkit-box-shadow: none; box-shadow: none; outline: none; } .modal-form .form-control[disabled], .modal-form .form-control[disabled]:focus { background-color: #F3F3F3; opacity: .5; } .modal-form .control-label, .modal-form .checkbox-inline { padding-top: 13px; } select.form-control { background-image: url(//static1.holidayextras.com/images/hx-ppc/dd-arrow.png); background-position: center right 11px; background-repeat: no-repeat; background-size: 11px; padding-right: 22px; } select::-ms-expand { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; } #direct-ferries-engine .engine-form-contents .form-control-wrapper:not(.route-field) .form-control { background-image: url(//static1.holidayextras.com/images/ppc/direct-ferries/icons-sprite.png); background-repeat: no-repeat; background-size: 50px; padding-right: 35px; } #direct-ferries-engine .form-control-wrapper.input-loading .form-control { background-image: url(//static1.holidayextras.com/images/ppc/fade-loader.gif); background-position: center right 10px; background-size: auto 20px; background-repeat: no-repeat; padding-right: 40px; } .btn-primary { padding-top: 8px; padding-bottom: 8px; font-size: 18px; } .btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:focus, .btn-primary:active:focus, .btn-primary[disabled], .btn-primary[disabled]:hover, .btn-primary[disabled]:active, .btn-primary[disabled]:focus, .btn-primary[disabled]:active:focus { background-color: #542E91; color: #FFF; border: 3px rgba(255, 255, 255, .18) solid; } .btn-primary:after { display: inline-block; content: url(data:image/svg+xml,%3Csvg%20fill%3D%22%23FEE443%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z%22/%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22/%3E%0A%3C/svg%3E%0A); vertical-align: middle; margin-top: -4px; height: 24px; } .yellow-text { color: #FEDC08; } .placeholder { display: block; width: 100%; border-radius: 6px; } .placeholder.placeholder-input { background-color: #FFF; border: 3px #FFF4A2 solid; height: 46px; } .placeholder.placeholder-label { background-color: rgba(0, 0, 0, .055); width: 120px; max-width: 100%; } .placeholder.placeholder-label:before { content: "\00a0"; } .placeholder.placeholder-button { background: #542E91; height: 50px; } header { position: relative; background: #542E91; background: linear-gradient(to right, #542E91 53%,rgba(84, 46, 145, .8) 100%); color: #FFF; margin-bottom: 30px; z-index: 3; } header .logo a { display: block; } header .logo a:hover { background-color: #6135A8; } header .header-container-inner { display: table; width: 100%; } header .logo, header .title, header .contact-number { display: table-cell; vertical-align: middle; } header .logo { width: 1%; } header .logo svg { vertical-align: middle; } header .contact-number { text-align: right; } header .contact-number .number-link { display: inline-block; background-color: #FEDC08; color: #542E91; padding: 4px 18px; line-height: 18px; text-align: center; border-radius: 3px; } header .contact-number a.number-link:hover, header .contact-number a.number-link:focus { background-color: #ECCB01; text-decoration: none; } #main-bg { position: absolute; background-color: #ECECEC; background-repeat: no-repeat; background-size: cover; width: 100%; height: 550px; top: 0; left: 0; z-index: 1; } main { position: relative; z-index: 10; } .content-wrapper { font-size: 20px; } .check-list { margin: 30px 0 40px; } .check-list li { background: url(//static1.holidayextras.com/images/images/ppc/green-single-tick.png) 0 4px no-repeat; background-size: auto 12px; padding-left: 25px; line-height: 22px; } .check-list li + li { margin-top: 20px; } .aside-content-wrapper { background-color: #542E91; border-top: 7px #FEDC08 solid; color: #FFF; } .content-text + .content-text, .content-text + .content-image, .content-image + .content-text, .content-image + .aside-content-wrapper, .content-text + .aside-content-wrapper, .aside-content-wrapper + .content-image, .aside-content-wrapper + .content-text { margin-top: 30px; } .content-text > *:last-child { margin-bottom: 0; } .top-content + .aside-content-wrapper { margin-top: 30px; } .aside-content-wrapper .image-wrapper img { width: 100%; } .aside-content-wrapper .text-content { padding: 20px; } .aside-content-wrapper .text-content .h3 { margin-top: 0; text-transform: uppercase; } .aside-content-wrapper .text-content .h3 strong { color: #FEDC08; } .aside-content-wrapper .text-content p:last-child { margin-bottom: 0; } .form-control[disabled], #direct-ferries-engine .form-control.no-readonly-style[disabled] { background-color: #FFF; opacity: .45; } .engine-form-contents { background-color: #FEDC08; padding: 25px 30px 20px; border-radius: 5px; box-shadow: 0 1px 4px rgba(0, 0, 0, .12); } .engine-form-contents .form-group { margin-bottom: 20px; } .engine-wrapper label { font-weight: 500; } #direct-ferries-engine #add-return-btn { background-color: #FFDE00; border-color: #F4D100; color: #542993; padding: 4px 10px; } #direct-ferries-engine #add-return-btn:hover, #direct-ferries-engine #add-return-btn:focus { background-color: #F8D700; text-decoration: none; } .engine-travellers-fields { background-color: #FFF4A2; padding: 12px 20px; border-radius: 5px; } .engine-form-contents .engine-travellers-fields .form-group { margin: 0; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.date-field .form-control { background-position: top -205px right -20px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.time-dropdown .form-control { background-position: top -245px right -20px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.passengers-field .form-control { background-position: top -285px right -20px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.animals-field .form-control { background-position: top -325px right -20px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.vehicle-field .form-control { background-position: top -365px right -20px; } .engine-wrapper .engine-submit-button .btn { padding: 10px; font-size: 18px; line-height: 1.3333333; border-radius: 6px; } .error-messages-wrapper .error-messages { background: #D84444; padding: 10px; color: #FFF; margin-bottom: 15px; border-radius: 3px; } .error-messages-wrapper .error-messages ul { list-style-type: circle; padding-left: 22px; margin: 0; } #direct-ferries-engine .form-control-wrapper.highlight-error .form-control { border-color: #D84444; background-color: #FBE0E0; color: #BB2F2F; font-weight: 600; } #direct-ferries-engine .form-control-wrapper.highlight-error .form-control::-webkit-input-placeholder { color: #BB2F2F; } #direct-ferries-engine .form-control-wrapper.highlight-error .form-control::-moz-placeholder { color: #BB2F2F; } #direct-ferries-engine .form-control-wrapper.highlight-error .form-control:-ms-input-placeholder { color: #BB2F2F; } #direct-ferries-engine .loading-message span { font-size: 18px; padding: 15px 25px; box-shadow: 0 0 33px rgba(0, 0, 0, .4); } #direct-ferries-engine.loading .engine-overlay.loading-overlay { background: none; } #direct-ferries-engine.loading .engine-form-contents > div:not(.loading-overlay) { -webkit-filter: blur(2px); -moz-filter: blur(2px); filter: blur(2px); opacity: .8; } .auto-suggest-list .list-inner { position: relative; background-color: #FFF; border: 3px #FFF4A2 solid; margin-top: 5px; border-radius: 3px; box-shadow: 0 1px 8px rgba(0, 0, 0, .07); } .auto-suggest-list .list-inner:before, .auto-suggest-list .list-inner:after { content: ""; position: absolute; left: 10px; } .auto-suggest-list .list-inner:before { border: 16px transparent solid; border-bottom-color: #FFF4A2; top: -32px; left: 6px; z-index: 1; } .auto-suggest-list .list-inner:after { border: 12px transparent solid; border-bottom-color: #FFF; top: -24px; z-index: 2; } .auto-suggest-list ul { margin: 4px; max-height: 320px; overflow-y: auto; -webkit-overflow-scrolling: touch; } .auto-suggest-list li { position: relative; padding: 5px 12px; color: #542E91; font-weight: 600; } .auto-suggest-list .location { color: #9E9E9E; font-size: 11px; font-weight: normal; } .auto-suggest-list .header-row { font-size: 16px; color: #555; } .auto-suggest-list li + .header-row { padding-top: 10px; } .auto-suggest-list li + li:not(.header-row) { border-top: 1px #E2E2E2 dotted; } .auto-suggest-list li.header-row ~ li:not(.header-row):nth-child(even) { background-color: #F9F9F9; } .auto-suggest-list li.selected-row { padding-right: 45px; } .auto-suggest-list li.selected-row:before, .auto-suggest-list li.selected-row:after { content: ""; position: absolute; top: 50%; right: 0; margin-top: -6px; } .auto-suggest-list li.selected-row:before { border: 6px transparent solid; border-right-color: #542993; right: 22px; } .auto-suggest-list li.selected-row:after { background-color: #542993; height: 12px; width: 12px; right: 10px; border-radius: 0 2px 2px 0; } .auto-suggest-list li.item-row:hover { background-color: #542E91 !important; border-top-color: #542E91 !important; cursor: pointer; border-radius: 4px; } .auto-suggest-list li.item-row:hover + li { border-top-color: transparent !important; } .auto-suggest-list li.item-row:hover, .auto-suggest-list li.item-row:hover .location { color: #FFF !important; } .auto-suggest-list span.highlighted { background-color: #FFE36E; border-radius: 2px; } .auto-suggest-list li.item-row:hover span.highlighted { background-color: transparent; } .auto-suggest-list li.selected-row:hover:before { border-right-color: #FFF; } .auto-suggest-list li.selected-row:hover:after { background-color: #FFF; } .content-wrapper img { max-width: 100%; } .content-image img { width: 100%; } .interactive-image { position: relative; overflow: hidden; } .interactive-modal { position: absolute; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; top: 105%; left: 20px; opacity: 0; height: calc(100% - 40px); width: calc(100% - 40px); transition: opacity ease-in .7s, top ease-in .5s; } .interactive-modal .modal-inner { background-color: #FFF; border: 1px #DEDEDE solid; max-height: 100%; overflow-y: auto; border-radius: 5px; box-shadow: 0 1px 10px rgba(0, 0, 0, .2); } .interactive-modal .modal-contents { padding: 15px; font-size: 16px; color: #333; } .interactive-image .image-wrapper img:hover { cursor: pointer; } .interactive-image .close-modal { display: none; position: absolute; background-color: #542993; color: #FFDE00; top: 5px; right: 5px; padding: 7px 8px; font-size: 14px; line-height: 14px; border-radius: 3px; z-index: 3; } .interactive-image .close-modal:hover, .interactive-image .close-modal:focus { background-color: #3E1D6F; text-decoration: none; } .interactive-image.show-modal .close-modal { display: block; } .interactive-image.show-modal .interactive-modal { top: 20px; opacity: 1; transition: opacity ease-in .5s, top ease-in .3s; } .interactive-image.show-modal .image-wrapper img { -webkit-filter: blur(3px); -moz-filter: blur(3px); filter: blur(3px); } footer { margin-top: 30px; padding-top: 15px; border-top: 1px #F7F7F7 solid; text-align: center; } footer .powered-by { color: #B3B3B3; padding: 0 15px 15px; } footer .footer-links a { display: inline-block; margin: 0 10px 5px; } .modal { background: rgba(0, 0, 0, .18); } .modal-open header, .modal-open #main-bg, .modal-open #direct-ferries-engine form, .modal-open .content-wrapper, .modal-open footer { -webkit-filter: blur(2px); -moz-filter: blur(2px); filter: blur(2px); } .modal-header .close { margin-top: -5px; font-size: 30px; } .modal-content { border-color: rgba(0, 0, 0, .12); box-shadow: 0 2px 6px rgba(0, 0, 0, .2); } @media (min-width: 1200px) { .engine-wrapper, .content-wrapper { padding-left: 70px; padding-right: 70px; } } @media (min-width: 768px) and (max-width: 991px) { .return-auto-suggest .auto-suggest-list .list-inner:after { left: auto; right: 10px; } .return-auto-suggest .auto-suggest-list .list-inner:before { left: auto; right: 6px; } } @media (max-width: 991px) { .engine-wrapper { margin: 70px 0 0; } .top-content { margin-top: 30px; } } @media (min-width: 768px) { header .logo svg { height: 70px; width: 229px; margin: 10px 0; } header .title { font-size: 18px; padding-left: 15px; } } @media (min-width: 992px) { header .title { font-size: 24px; padding-left: 50px; } .engine-wrapper { margin: 170px 0 40px; } } @media (max-width: 767px) { header { margin-bottom: 20px; } header .logo svg { height: 40px; width: 131px; } .engine-wrapper { margin: 0; } .traveller-col + .traveller-col .form-group { margin-top: 10px; } .engine-submit-button .form-group { margin: 0; } } @media (min-width: 577px) { .content-wrapper { padding-bottom: 40px; } } @media (max-width: 576px) { h1, .h1 { font-size: 22px; } h2, .h2 { font-size: 20px; } h3, .h3 { font-size: 18px; } h4, .h4 { font-size: 16px; } h5, .h5 { font-size: 14px; } .engine-form-contents { padding: 20px 15px 15px; } .engine-travellers-fields { padding: 12px; } #direct-ferries-engine .list-wrapper { min-width: auto; width: 100%; } .auto-suggest-list li { padding: 12px; } .auto-suggest-list li + .header-row { padding-top: 20px; } .content-wrapper { font-size: 16px; } .check-list { margin: 20px 0 15px; } .check-list li + li { margin-top: 5px; } } @media (max-width: 499px) { header .contact-number .number-link { padding: 4px 6px; } } @media (min-width: 380px) { #direct-ferries-engine .add-return-date { background-color: #F3D000; height: 1px; margin: 20px 0px 35px; text-align: center; } #direct-ferries-engine .add-return-date-inner { display: inline-block; position: relative; top: -18px; z-index: 2; } } @media (max-width: 379px) { #direct-ferries-engine #add-return-btn { display: block; width: 100%; margin-bottom: 20px; } } @media screen and (min-width:0\0) and (min-resolution:.001dpcm) { #direct-ferries-engine .form-control { padding-right: 16px; background-image: none; } #direct-ferries-engine .engine-form-contents .form-control-wrapper:not(.route-field):not(.passengers-field):not(.animals-field):not(.vehicle-field) .form-control { padding-left: 40px; padding-right: 16px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.date-field .form-control { background-position: 10px -206px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.time-dropdown .form-control { background-position: 10px -245px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.passengers-field .form-control { background-position: top -285px right -20px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.animals-field .form-control { background-position: top -325px right -20px; } #direct-ferries-engine .engine-form-contents .form-control-wrapper.vehicle-field .form-control { background-position: top -365px right -20px; } #direct-ferries-engine.loading .engine-form-contents > div:not(.loading-overlay) { filter: none; } }