/* Minification failed. Returning unminified contents.
(9649,21): run-time error CSS1039: Token not allowed after unary operator: '-strawberry-sans-text'
*/
.slideupOverlay {
background: url("../../Images/bg-body-gray.gif") repeat scroll center center transparent;
display: block;
height: 2000px;
position: absolute;
z-index: 999;
}
/*# sourceMappingURL=slideOver.css.map */
/*
COLORS
*/
/*
Strawberry
*/
/*
Inputs
*/
/*
New identity colors
*/
/*
Fonts
*/
/*
Link Text
*/
/*
Backgrounds
*/
/* Buttons */
/* Search Buttons */
/* NCC Buttons */
/*
Other
*/
/*
Breakpoints
*/
/*
Mixins
*/
/*
Extended Classes
*/
.dropdown__input,
.dropdown-input, .dropdown .ui-autocomplete,
.dropdown .dropdown__box, .chat-link--text, .chat-link, .ff-dropdown, .reveal-modal__title, .reveal-modal {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/*
Easing animations
*/
.collapsable-mode {
overflow: hidden;
}
.collapsable-mode__content {
max-height: 0;
overflow: hidden;
transform: translateY(-100%);
transition: all 400ms ease-in-out 0s;
}
.collapsable-mode--expand .collapsable-mode__content {
max-height: 10000px;
transform: translateY(0);
}
/*
== malihu jquery custom scrollbar plugin ==
Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller
*/
/*
CONTENTS:
1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited).
2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar.
3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar.
4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars.
5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars.
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.
*/
/*
------------------------------------------------------------------------------------------------------------------------
1. BASIC STYLE
------------------------------------------------------------------------------------------------------------------------
*/
.mCustomScrollbar {
-ms-touch-action: none;
touch-action: none; /* MSPointer events - direct all pointer events to js */
}
.mCustomScrollbar.mCS_no_scrollbar {
-ms-touch-action: auto;
touch-action: auto;
}
.mCustomScrollBox { /* contains plugin's markup */
position: relative;
overflow: hidden;
height: 100%;
max-width: 100%;
outline: none;
direction: ltr;
}
.mCSB_container { /* contains the original content */
overflow: hidden;
width: auto;
height: auto;
}
/*
------------------------------------------------------------------------------------------------------------------------
2. VERTICAL SCROLLBAR
y-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_inside > .mCSB_container {
margin-right: 30px;
}
.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
margin-right: 0;
} /* non-visible scrollbar */
.mCS-dir-rtl > .mCSB_inside > .mCSB_container { /* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
margin-left: 0;
} /* RTL direction/left-side scrollbar */
.mCSB_scrollTools { /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
position: absolute;
width: 16px;
height: auto;
left: auto;
top: 0;
right: 0;
bottom: 0;
}
.mCSB_outside + .mCSB_scrollTools {
right: -26px;
} /* scrollbar position: outside */
.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools,
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { /* RTL direction/left-side scrollbar */
right: auto;
left: 0;
}
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
left: -26px;
} /* RTL direction/left-side scrollbar (scrollbar position: outside) */
.mCSB_scrollTools .mCSB_draggerContainer { /* contains the draggable element and dragger rail markup */
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
height: auto;
}
.mCSB_scrollTools a + .mCSB_draggerContainer {
margin: 20px 0;
}
.mCSB_scrollTools .mCSB_draggerRail {
width: 2px;
height: 100%;
margin: 0 auto;
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
}
.mCSB_scrollTools .mCSB_dragger { /* the draggable element */
cursor: pointer;
width: 100%;
height: 30px; /* minimum dragger height */
z-index: 1;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { /* the dragger element */
position: relative;
width: 4px;
height: 100%;
margin: 0 auto;
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
text-align: center;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
width: 12px; /* auto-expanded scrollbar */
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 8px; /* auto-expanded scrollbar */
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown {
display: block;
position: absolute;
height: 20px;
width: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools .mCSB_buttonDown {
bottom: 0;
}
/*
------------------------------------------------------------------------------------------------------------------------
3. HORIZONTAL SCROLLBAR
x-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_horizontal.mCSB_inside > .mCSB_container {
margin-right: 0;
margin-bottom: 30px;
}
.mCSB_horizontal.mCSB_outside > .mCSB_container {
min-height: 100%;
}
.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
margin-bottom: 0;
} /* non-visible scrollbar */
.mCSB_scrollTools.mCSB_scrollTools_horizontal {
width: auto;
height: 16px;
top: auto;
right: 0;
bottom: 0;
left: 0;
}
.mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
bottom: -26px;
} /* scrollbar position: outside */
.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer {
margin: 0 20px;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 2px;
margin: 7px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 30px; /* minimum dragger width */
height: 100%;
left: 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
height: 12px; /* auto-expanded scrollbar */
margin: 2px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 8px; /* auto-expanded scrollbar */
margin: 4px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
display: block;
position: absolute;
width: 20px;
height: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft {
left: 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
right: 0;
}
/*
------------------------------------------------------------------------------------------------------------------------
4. VERTICAL AND HORIZONTAL SCROLLBARS
yx-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_container_wrapper {
position: absolute;
height: auto;
width: auto;
overflow: hidden;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin-right: 30px;
margin-bottom: 30px;
}
.mCSB_container_wrapper > .mCSB_container {
padding-right: 30px;
padding-bottom: 30px;
}
.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical {
bottom: 20px;
}
.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
right: 20px;
}
/* non-visible horizontal scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical {
bottom: 0;
}
/* non-visible vertical scrollbar/RTL direction/left-side scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
right: 0;
}
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
left: 20px;
}
/* non-visible scrollbar/RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal {
left: 0;
}
.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper { /* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container {
padding-right: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container {
padding-bottom: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
margin-right: 0; /* non-visible scrollbar */
margin-left: 0;
}
/* non-visible horizontal scrollbar */
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden {
margin-bottom: 0;
}
/*
------------------------------------------------------------------------------------------------------------------------
5. TRANSITIONS
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
-webkit-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
-moz-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
-o-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail {
-webkit-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
-moz-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
-o-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
/*
------------------------------------------------------------------------------------------------------------------------
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
------------------------------------------------------------------------------------------------------------------------
*/
/*
----------------------------------------
6.1 THEMES
----------------------------------------
*/
/* default theme ("light") */
.mCSB_scrollTools {
opacity: 0.75;
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {
opacity: 0;
filter: "alpha(opacity=0)";
-ms-filter: "alpha(opacity=0)";
}
.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollBox:hover > .mCSB_scrollTools,
.mCustomScrollBox:hover ~ .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=100)";
-ms-filter: "alpha(opacity=100)";
}
.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.4);
filter: "alpha(opacity=40)";
-ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
filter: "alpha(opacity=85)";
-ms-filter: "alpha(opacity=85)";
}
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
filter: "alpha(opacity=90)";
-ms-filter: "alpha(opacity=90)";
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
background-image: url(mCSB_buttons.png); /* css sprites */
background-repeat: no-repeat;
opacity: 0.4;
filter: "alpha(opacity=40)";
-ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_buttonUp {
background-position: 0 0;
/*
sprites locations
light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px
dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px
*/
}
.mCSB_scrollTools .mCSB_buttonDown {
background-position: 0 -20px;
/*
sprites locations
light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px
dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px
*/
}
.mCSB_scrollTools .mCSB_buttonLeft {
background-position: 0 -40px;
/*
sprites locations
light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px
dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px
*/
}
.mCSB_scrollTools .mCSB_buttonRight {
background-position: 0 -56px;
/*
sprites locations
light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px
dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px
*/
}
.mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover {
opacity: 0.75;
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCSB_scrollTools .mCSB_buttonUp:active,
.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active {
opacity: 0.9;
filter: "alpha(opacity=90)";
-ms-filter: "alpha(opacity=90)";
}
/* theme: "dark" */
.mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px 0;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -20px;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -40px;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -56px;
}
/* ---------------------------------------- */
/* theme: "light-2", "dark-2" */
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px 0;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -20px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -40px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -56px;
}
/* theme: "dark-2" */
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px 0;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -20px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -40px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -56px;
}
/* ---------------------------------------- */
/* theme: "light-thick", "dark-thick" */
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 4px;
margin: 6px 0;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 6px;
margin: 5px auto;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -16px 0;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -16px -20px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -20px -40px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -20px -56px;
}
/* theme: "dark-thick" */
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -96px 0;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -96px -20px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -100px -40px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -100px -56px;
}
/* ---------------------------------------- */
/* theme: "light-thin", "dark-thin" */
.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
}
.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 2px;
}
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
}
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 2px;
margin: 7px auto;
}
/* theme "dark-thin" */
.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px 0;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -20px;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -40px;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -56px;
}
/* ---------------------------------------- */
/* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */
.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.15);
}
.mCS-rounded.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger {
height: 14px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 14px;
margin: 0 1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 14px;
}
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 14px;
margin: 1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
width: 16px; /* auto-expanded scrollbar */
height: 16px;
margin: -1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 4px; /* auto-expanded scrollbar */
}
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
height: 16px; /* auto-expanded scrollbar */
width: 16px;
margin: 0 -1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 4px; /* auto-expanded scrollbar */
margin: 6px 0;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp {
background-position: 0 -72px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown {
background-position: 0 -92px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft {
background-position: 0 -112px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight {
background-position: 0 -128px;
}
/* theme "rounded-dark", "rounded-dots-dark" */
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px -72px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -92px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -112px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -128px;
}
/* theme "rounded-dots", "rounded-dots-dark" */
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail {
width: 4px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
background-color: transparent;
background-position: center;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
background-repeat: repeat-y;
opacity: 0.3;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
height: 4px;
margin: 6px 0;
background-repeat: repeat-x;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp {
background-position: -16px -72px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown {
background-position: -16px -92px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -20px -112px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight {
background-position: -20px -128px;
}
/* theme "rounded-dots-dark" */
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=");
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -96px -72px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -96px -92px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -100px -112px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -100px -128px;
}
/* ---------------------------------------- */
/* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-repeat: repeat-y;
background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
}
/* theme "3d", "3d-dark" */
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger {
height: 70px;
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 70px;
}
.mCS-3d.mCSB_scrollTools,
.mCS-3d-dark.mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
}
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
width: 8px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2);
}
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #555;
}
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 8px;
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 8px;
margin: 4px 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 8px;
margin: 4px auto;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "3d-dark" */
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme: "3d-thick", "3d-thick-dark" */
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical,
.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical {
right: 1px;
}
.mCS-3d-thick.mCSB_scrollTools_vertical,
.mCS-3d-thick-dark.mCSB_scrollTools_vertical {
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}
.mCS-3d-thick.mCSB_scrollTools_horizontal,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
bottom: 1px;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4);
width: 12px;
margin: 2px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #555;
}
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 12px;
width: auto;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
background-color: #000;
background-color: rgba(0, 0, 0, 0.05);
box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme: "3d-thick-dark" */
.mCS-3d-thick-dark.mCSB_scrollTools {
box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #777;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
background-color: #fff;
background-color: rgba(0, 0, 0, 0.05);
box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme: "minimal", "minimal-dark" */
.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical {
right: 0;
margin: 12px 0;
}
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
bottom: 0;
margin: 0 12px;
}
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical {
left: 0;
right: auto;
}
.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger {
height: 50px;
}
.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 50px;
}
.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.2);
filter: "alpha(opacity=20)";
-ms-filter: "alpha(opacity=20)";
}
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.5);
filter: "alpha(opacity=50)";
-ms-filter: "alpha(opacity=50)";
}
/* theme: "minimal-dark" */
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
filter: "alpha(opacity=20)";
-ms-filter: "alpha(opacity=20)";
}
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.5);
filter: "alpha(opacity=50)";
-ms-filter: "alpha(opacity=50)";
}
/* ---------------------------------------- */
/* theme "light-3", "dark-3" */
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
width: 6px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
}
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
}
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 6px;
margin: 5px 0;
}
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 12px;
}
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 12px;
margin: 2px 0;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "dark-3" */
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
width: 12px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
}
.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
margin: 3px 5px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 6px;
margin: 5px 3px;
position: absolute;
width: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 12px;
margin: 2px 0;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "inset-dark", "inset-2-dark", "inset-3-dark" */
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* theme "inset-2", "inset-2-dark" */
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
border-width: 1px;
border-style: solid;
border-color: #fff;
border-color: rgba(255, 255, 255, 0.2);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
border-color: #000;
border-color: rgba(0, 0, 0, 0.2);
}
/* theme "inset-3", "inset-3-dark" */
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.6);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.6);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
/* ---------------------------------------- */
.link-to-main-content {
position: absolute;
top: -80px;
left: 0;
width: 100%;
height: 15px;
padding: 0 10px;
line-height: 15px;
font-weight: 500;
-webkit-transition: top 200ms;
transition: top 200ms;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.link-to-main-content:focus {
top: 0;
z-index: 1001;
color: #000;
background: rgba(255, 255, 255, 0.8);
-webkit-transition: top 200ms;
transition: top 200ms;
}
.strawberry-close {
display: none;
}
.strawberry-modal {
font-family: StrawberrySansText;
}
.strawberry-modal .js-modal-container .reveal-modal__title {
background: #FFFFFF;
color: #000;
font-family: StrawberrySansDisplay;
font-style: normal;
font-weight: 500;
font-size: 20px;
line-height: 24px;
border-bottom: 1px solid #EAEAEA;
text-align: center;
height: 56px;
padding: 16px 30px 16px 20px;
}
.strawberry-modal .reveal-modal__footer {
background: #FFFFFF;
}
.strawberry-modal .reveal-modal__footer a.js-modal-close {
width: calc(100% - 20px);
}
.strawberry-modal .reveal-modal__footer a {
vertical-align: bottom;
}
.strawberry-modal .reveal-modal__footer a.mobile-margin-bottom {
margin-bottom: 10px;
}
.strawberry-modal.ff-booking-code .input-double__left {
padding-right: 0px;
}
.strawberry-modal.ff-booking-code .btn.btn-primary, .strawberry-modal.ff-booking-code .btn.btn-add {
display: flex;
justify-content: center;
width: 112px;
}
.strawberry-modal .reveal-modal__intro {
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 24px;
}
.strawberry-modal .reveal-modal .reveal-modal__close {
top: 12px;
}
.strawberry-modal .reveal-modal .reveal-modal__close .strawberry-close {
display: block;
width: 24px;
height: 24px;
}
.strawberry-modal .nch-icon-close-x:before {
content: "";
}
.strawberry-modal input[type=text] {
background: #F5F5F5;
border-radius: 12px;
border: 0px;
width: calc(100% - 120px);
height: 47px;
}
.strawberry-modal input[type=text]::placeholder {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
color: #403D3B;
}
.strawberry-modal .btn.btn-primary, .strawberry-modal .btn.btn-add {
background: #FC5E58;
font-family: StrawberrySansText;
font-weight: 700;
font-size: 16px;
line-height: 24px;
border-radius: 12px !important;
border: 0px;
height: 44px;
color: #000;
width: 80px;
}
.strawberry-modal .btn.btn-secondary-rev {
border-color: #D8D4D0;
border-radius: 12px !important;
height: 44px;
}
.strawberry-modal .btn.btn-secondary-rev:hover {
background-color: #fff;
color: #000000;
}
.strawberry-modal .ff-error {
background-color: #fff;
border: 1px solid #EB0001;
border-radius: 8px;
margin-top: 16px;
}
.strawberry-modal .input-double__right {
padding: 6px 20px 6px 20px;
display: inline-flex;
align-items: center;
}
.strawberry-modal .label {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 14px;
}
.strawberry-modal .room .room__title.h4 {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 700;
font-size: 16px;
line-height: 24px;
border: none;
}
.strawberry-modal .room .room__title.h4 a.small {
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.strawberry-modal .ff-add-room-button {
text-decoration: underline;
display: flex;
}
.strawberry-modal .ff-add-room-button img {
margin-right: 8px;
}
.is-reveal-modal-on {
overflow: hidden;
}
.reveal-modal-active {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 9999;
overflow-y: auto;
}
.reveal-modal {
display: none;
width: 90%;
margin-left: -45%;
top: 150px;
left: 50%;
position: absolute;
z-index: 9999;
padding: 20px;
background-color: #fff;
}
.reveal-modal--fixed .reveal-modal {
position: fixed;
}
.reveal-modal .reveal-modal__close {
position: absolute;
top: 15px;
right: 20px;
z-index: 1001;
font-size: 18px;
cursor: pointer;
color: #000;
text-decoration: none;
}
.reveal-modal .reveal-modal__close:focus {
color: #5A0032;
}
.reveal-modal--full-screen .reveal-modal {
position: absolute;
top: 0;
left: 0;
margin: 0;
width: 100%;
height: 100%;
background: transparent;
}
.reveal-modal__title {
font-size: 22px;
font-weight: 500;
margin: -20px -20px 15px -20px;
display: block;
line-height: 28px;
height: 44px;
padding: 10px 30px 10px 20px;
}
.reveal-modal__sub-title {
font-size: 18px;
margin: 0 0 5px 0;
}
.reveal-modal__intro {
font-size: 16px;
line-height: 1.3;
margin-bottom: 20px;
}
.reveal-modal__scroll-content {
overflow: hidden;
height: 50vh;
overflow-y: scroll;
margin: -15px -20px;
padding: 20px;
}
.reveal-modal__footer {
background: #EEFBFC;
padding: 10px 20px;
margin: 20px -20px -20px;
text-align: center;
}
.reveal-modal__footer .btn {
min-width: 150px;
margin: 10px;
}
.reveal-modal__photo {
position: relative;
margin-bottom: 1rem;
}
.reveal-modal__photo--with-text:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.5) 100%);
z-index: 1;
}
.reveal-modal__photo__text {
box-sizing: border-box;
position: absolute;
bottom: 30px;
left: 0;
width: 100%;
padding: 0 20px;
text-align: center;
font-size: 36px;
color: #fff;
z-index: 2;
}
.reveal-modal__photo img {
display: block;
height: auto;
width: 100%;
}
/*
White header
*/
.reveal-modal--white-header .reveal-modal__title {
background: #fff;
color: #000;
}
.reveal-modal--white-header .reveal-modal__close {
color: #222;
}
/*
With Photo
*/
.reveal-modal--with-photo .reveal-modal-active {
background: rgba(0, 0, 0, 0.6);
}
.reveal-modal--with-photo .reveal-modal.small {
left: 50%;
transform: translateX(-50%);
max-width: 540px;
margin-left: 0;
}
.reveal-modal--with-photo .reveal-modal__title {
font-size: 1.25rem;
}
.reveal-modal--with-photo .reveal-modal__photo {
border-radius: 1rem;
}
.reveal-modal--with-photo .reveal-modal__photo img {
border-radius: 1rem;
display: inline-block;
}
.reveal-modal--with-photo .reveal-modal__topic {
font-weight: 400;
}
.reveal-modal--with-photo .reveal-modal__description {
margin-top: 10px;
}
.reveal-modal--with-photo .reveal-modal__input {
margin: 20px 0;
}
.reveal-modal--with-photo .reveal-modal__input + .ff-error {
margin: 20px 0;
}
.reveal-modal--with-photo .reveal-modal__label {
font-weight: 400;
}
.reveal-modal--with-photo .reveal-modal__text {
margin: 20px 0;
}
.reveal-modal--with-photo .reveal-modal__btn-wrapper {
margin: 20px -20px -20px -20px;
padding: 10px 20px;
text-align: center;
background: #EEFBFC;
}
.reveal-modal--with-photo .reveal-modal__btn-wrapper__btn {
width: 100%;
margin: 10px auto;
}
.reveal-modal--with-photo .reveal-modal__btn-wrapper__link {
font-size: 16px;
font-weight: 400;
}
.reveal-modal--with-photo .reveal-modal__output {
height: 40px;
margin: 20px 0;
padding: 6px 10px 5px 10px;
line-height: 40px;
text-align: center;
font-size: 1rem;
background: #F7F5F3;
border-radius: 0.5rem;
}
.reveal-modal--with-photo .reveal-modal--white-header {
background: none;
pointer-events: none;
}
.reveal-modal--with-photo .reveal-modal--white-header .reveal-modal {
pointer-events: auto;
}
/*
Active revelar modal with css animations
*/
.with-css-animation {
background-color: rgba(0, 0, 0, 0);
}
.with-css-animation .reveal-modal {
visibility: hidden;
opacity: 0;
display: block;
}
.with-css-animation {
-webkit-transition: background-color 300ms 50ms;
transition: background-color 300ms 50ms;
}
.with-css-animation .reveal-modal {
-webkit-transition: opacity 400ms 400ms;
transition: opacity 400ms 400ms;
}
.reveal-modal-active {
background-color: rgba(0, 0, 0, 0.9);
}
.reveal-modal-active .reveal-modal {
visibility: visible;
opacity: 1;
}
/*
ONLY FOR MOBILE - Active revelar modal with css animations
*/
@media only screen and (max-width: 480px) {
.reveal-modal {
overflow-y: scroll;
}
.reveal-modal .reveal-modal__title {
font-size: 12px;
}
.reveal-modal .reveal-modal__description {
font-size: 14px;
}
.reveal-modal .reveal-modal__terms-label {
font-size: 14px;
line-height: 1.5;
}
.with-css-animation .reveal-modal:not(.tiny) {
margin: 0;
top: 0;
left: 0;
width: 100% !important;
height: 100%;
}
.reveal-modal.tiny {
margin: 0;
top: auto;
bottom: 0.5rem;
left: 0.5rem;
width: calc(100% - 1rem);
}
.reveal-modal.tiny .reveal-modal__title {
font-size: 22px;
padding-top: 1rem;
}
.reveal-modal.tiny .label-checkbox {
font-size: 14px;
line-height: 1.5;
}
.reveal-modal.tiny .reveal-modal__btn-wrapper {
background: none;
margin: 0;
padding: 0;
}
.reveal-modal.tiny .reveal-modal__btn-wrapper__link {
display: none;
}
.reveal-modal.tiny .reveal-modal__btn-wrapper__btn {
margin: 0;
}
}
@media only screen and (min-width: 481px) {
.reveal-modal--with-photo .reveal-modal__btn-wrapper {
text-align: left;
overflow: hidden;
}
.reveal-modal--with-photo .reveal-modal__btn-wrapper__btn {
float: right;
width: auto;
}
.reveal-modal--with-photo .reveal-modal__btn-wrapper__link {
float: right;
margin: 18px 20px 0 0;
}
.reveal-modal--with-photo .reveal-modal__btn-wrapper .ff-error {
clear: both;
}
.reveal-modal__title {
font-size: 18px;
}
.reveal-modal.tiny {
bottom: 1rem;
top: auto;
max-width: 25rem;
}
.reveal-modal.tiny .label-checkbox {
font-size: 14px;
line-height: 1.5;
}
.reveal-modal.tiny .reveal-modal__btn-wrapper {
background: none;
margin: 0;
padding: 0;
}
}
@media only screen and (min-width: 768px) {
.reveal-modal--full-screen .reveal-modal__close {
font-size: 48px;
}
.reveal-modal__title {
font-size: 22px;
}
}
@media only screen and (min-width: 481px) {
.strawberry-modal .reveal-modal {
border-radius: 16px;
}
.strawberry-modal .js-modal-container .reveal-modal__title {
border-radius: 16px 16px 0px 0px;
text-align: unset;
}
.strawberry-modal .js-modal-container .reveal-modal {
border-radius: 16px 16px 16px 16px;
}
.strawberry-modal .js-modal-container .reveal-modal__footer {
border-radius: 16px 16px 16px 16px;
}
.strawberry-modal .js-modal-container .reveal-modal__footer a.js-modal-close {
width: unset;
}
.strawberry-modal .js-modal-container .reveal-modal__footer a.mobile-margin-bottom {
margin-bottom: 0px;
}
.reveal-modal.small {
margin-left: -20%;
width: 40%;
}
.reveal-modal.medium {
margin-left: -30%;
width: 60%;
}
.reveal-modal.large {
margin-left: -35%;
width: 70%;
}
.reveal-modal.xlarge {
margin-left: -47.5%;
width: 95%;
}
.reveal-modal--full-screen .reveal-modal {
margin: 0;
width: 100%;
}
.reveal-modal--with-photo .reveal-modal.small {
width: 540px;
}
}
.ff-media, .ff-media--padding, .ff-media-EXT {
overflow: hidden;
}
.ff-media .ff-media-img, .ff-media--padding .ff-media-img, .ff-media-EXT .ff-media-img {
float: left;
margin: 0 10px 0 0;
}
.ff-media .ff-media-img img, .ff-media--padding .ff-media-img img, .ff-media-EXT .ff-media-img img {
display: block;
}
.ff-media .ff-media-imgEXT, .ff-media--padding .ff-media-imgEXT, .ff-media-EXT .ff-media-imgEXT {
float: right;
margin: 0 0 0 10px;
}
.ff-media .ff-media-icon-small, .ff-media--padding .ff-media-icon-small, .ff-media-EXT .ff-media-icon-small,
.ff-media .ff-media-icon,
.ff-media--padding .ff-media-icon,
.ff-media-EXT .ff-media-icon,
.ff-media .ff-media-icon2x,
.ff-media--padding .ff-media-icon2x,
.ff-media-EXT .ff-media-icon2x {
position: relative;
display: block;
float: left;
width: 34px;
height: 38px;
}
.ff-media .ff-media-icon-small [class^=nch-icon-], .ff-media--padding .ff-media-icon-small [class^=nch-icon-], .ff-media-EXT .ff-media-icon-small [class^=nch-icon-], .ff-media .ff-media-icon-small [class*=" nch-icon-"], .ff-media--padding .ff-media-icon-small [class*=" nch-icon-"], .ff-media-EXT .ff-media-icon-small [class*=" nch-icon-"],
.ff-media .ff-media-icon [class^=nch-icon-],
.ff-media--padding .ff-media-icon [class^=nch-icon-],
.ff-media-EXT .ff-media-icon [class^=nch-icon-],
.ff-media .ff-media-icon [class*=" nch-icon-"],
.ff-media--padding .ff-media-icon [class*=" nch-icon-"],
.ff-media-EXT .ff-media-icon [class*=" nch-icon-"],
.ff-media .ff-media-icon2x [class^=nch-icon-],
.ff-media--padding .ff-media-icon2x [class^=nch-icon-],
.ff-media-EXT .ff-media-icon2x [class^=nch-icon-],
.ff-media .ff-media-icon2x [class*=" nch-icon-"],
.ff-media--padding .ff-media-icon2x [class*=" nch-icon-"],
.ff-media-EXT .ff-media-icon2x [class*=" nch-icon-"] {
font-size: 32px;
position: absolute;
top: -4px;
left: -4px;
}
.ff-media .ff-media-icon-small, .ff-media--padding .ff-media-icon-small, .ff-media-EXT .ff-media-icon-small {
width: 28px;
height: 25px;
}
.ff-media .ff-media-icon-small [class^=nch-icon-], .ff-media--padding .ff-media-icon-small [class^=nch-icon-], .ff-media-EXT .ff-media-icon-small [class^=nch-icon-], .ff-media .ff-media-icon-small [class*=" nch-icon-"], .ff-media--padding .ff-media-icon-small [class*=" nch-icon-"], .ff-media-EXT .ff-media-icon-small [class*=" nch-icon-"] {
font-size: 28px;
top: -3px;
left: -3px;
}
.ff-media .ff-media-icon2x, .ff-media--padding .ff-media-icon2x, .ff-media-EXT .ff-media-icon2x {
width: 48px;
}
.ff-media .ff-media-icon2x [class^=nch-icon-], .ff-media--padding .ff-media-icon2x [class^=nch-icon-], .ff-media-EXT .ff-media-icon2x [class^=nch-icon-], .ff-media .ff-media-icon2x [class*=" nch-icon-"], .ff-media--padding .ff-media-icon2x [class*=" nch-icon-"], .ff-media-EXT .ff-media-icon2x [class*=" nch-icon-"] {
font-size: 64px;
left: -15px;
top: -15px;
}
.ff-media .ff-media-icon-smallEXP, .ff-media--padding .ff-media-icon-smallEXP, .ff-media-EXT .ff-media-icon-smallEXP,
.ff-media .ff-media-iconEXT,
.ff-media--padding .ff-media-iconEXT,
.ff-media-EXT .ff-media-iconEXT,
.ff-media .ff-media-icon2xEXT,
.ff-media--padding .ff-media-icon2xEXT,
.ff-media-EXT .ff-media-icon2xEXT {
float: right;
}
.ff-media .ff-media-bd, .ff-media--padding .ff-media-bd, .ff-media-EXT .ff-media-bd {
overflow: hidden;
}
.ff-media-EXT .ff-media-img {
margin-right: 20px;
}
.ff-media-EXT .ff-media-imgEXT {
margin-left: 20px;
}
.ff-media--padding .ff-media-img {
margin-right: 0;
}
.ff-media--padding .ff-media-bd {
padding-left: 20px;
}
@media only screen and (max-width: 480px) {
.ff-media-EXT .ff-media-imgEXT, .ff-media .ff-media-imgEXT, .ff-media--padding .ff-media-imgEXT {
float: none;
margin: 0 0 10px;
}
.ff-media-EXT .ff-media-img, .ff-media .ff-media-img, .ff-media--padding .ff-media-img {
float: none;
margin-right: 0;
margin-bottom: 10px;
}
.ff-media-EXT .ff-media-bd .text-right, .ff-media .ff-media-bd .text-right, .ff-media--padding .ff-media-bd .text-right {
text-align: left !important;
}
}
.btn {
-webkit-appearance: none;
-moz-appearance: none;
box-sizing: border-box;
display: inline-block;
cursor: pointer;
border-radius: 2px;
text-align: center;
font-weight: normal;
text-decoration: none;
font-family: arial, helvetica, calibri, sans-serif;
font-size: 18px;
line-height: 1.5;
font-weight: 400;
padding: 8px 20px 3px 20px;
background: none;
}
.btn-primary, .btn-add {
background: #00AA50;
border: 1px solid #00AA50;
color: #FFFFFF;
font-weight: 500;
}
.btn-primary:hover, .btn-add:hover {
background-color: #2E8559;
border-color: #2E8559;
color: #FFFFFF;
}
.btn-primary:focus, .btn-add:focus {
background-color: #2E8559;
border-color: #FFFFFF;
color: #FFFFFF;
}
.btn-primary.disabled, .disabled.btn-add, .btn-primary:disabled, .btn-add:disabled {
opacity: 1 !important;
cursor: default;
background: #ccd9dd;
border: 1px solid #ccd9dd;
color: #FFFFFF;
}
.btn-primary.disabled:hover, .disabled.btn-add:hover, .btn-primary.disabled:focus, .disabled.btn-add:focus, .btn-primary:disabled:hover, .btn-add:disabled:hover, .btn-primary:disabled:focus, .btn-add:disabled:focus {
background: #ccd9dd;
border: 1px solid #ccd9dd;
color: #FFFFFF;
}
.btn-primary-unavailable {
background: #ccd9dd;
border: 1px solid #ccd9dd;
color: #FFFFFF;
font-size: 16px;
}
.btn-primary-external {
background: #004054;
border-color: #004054;
font-size: 16px;
}
.btn-primary-external:hover {
background: #336676;
}
.btn--small {
font-size: 14px;
line-height: 1.6;
padding: 3px 10px 1px;
}
.btn--large {
font-size: 20px;
}
.btn--expand {
width: 100%;
}
.btn--uppercase {
text-transform: uppercase;
}
.btn-secondary {
background: transparent;
border: 1px solid #FFFFFF;
color: #FFFFFF;
}
.btn-secondary:hover {
background-color: #FFFFFF;
color: #002F3D;
}
.btn-secondary:focus {
background-color: #FFFFFF;
color: #002F3D;
}
.btn-secondary.disabled, .btn-secondary:disabled {
opacity: 0.5;
cursor: default;
}
.btn-secondary.disabled:hover, .btn-secondary.disabled:focus, .btn-secondary:disabled:hover, .btn-secondary:disabled:focus {
background: #002F3D;
color: #FFFFFF;
}
.btn-secondary-rev {
background: transparent;
border: 1px solid #002F3D;
color: #002F3D;
}
.btn-secondary-rev:hover {
background-color: #002F3D;
color: #FFFFFF;
}
.btn-secondary-rev:focus {
background-color: #002F3D;
color: #FFFFFF;
}
.btn-secondary-rev.disabled, .btn-secondary-rev:disabled {
opacity: 0.5;
cursor: default;
}
.btn-secondary-rev.disabled:hover, .btn-secondary-rev.disabled:focus, .btn-secondary-rev:disabled:hover, .btn-secondary-rev:disabled:focus {
background: transparent;
border: 1px solid #002F3D;
color: #002F3D;
}
.btn-primary-search {
background: #5ADAE9;
border: 1px solid #5ADAE9;
color: #002F3D;
font-weight: 500;
}
.btn-primary-search:hover {
background-color: #4FBDC9;
border-color: #4FBDC9;
color: #002F3D;
}
.btn-primary-search:focus {
background-color: #4FBDC9;
border-color: #fff;
color: #002F3D;
}
.btn-primary-search.disabled, .btn-primary-search:disabled {
opacity: 0.5;
cursor: default;
}
.btn-primary-search.disabled:hover, .btn-primary-search.disabled:focus, .btn-primary-search:disabled:hover, .btn-primary-search:disabled:focus {
background: #5ADAE9;
border-color: #5ADAE9;
color: #002F3D;
}
.btn-secondary-search {
background: #BDF0F6;
border: 1px solid #BDF0F6;
color: #002F3D;
font-weight: 500;
}
.btn-secondary-search:hover {
background-color: #5ADAE9;
border-color: #5ADAE9;
color: #002F3D;
}
.btn-secondary-search:focus {
background-color: #5ADAE9;
border-color: #fff;
color: #002F3D;
}
.btn-secondary-search.disabled, .btn-secondary-search:disabled {
opacity: 0.5;
cursor: default;
}
.btn-secondary-search.disabled:hover, .btn-secondary-search.disabled:focus, .btn-secondary-search:disabled:hover, .btn-secondary-search:disabled:focus {
background: #BDF0F6;
border-color: #BDF0F6;
color: #002F3D;
}
.btn-ncc {
background: #0A1F62;
border: 1px solid #0A1F62;
color: #FFFFFF;
font-weight: 500;
}
.btn-ncc:hover {
background-color: #747676;
border-color: #747676;
color: #FFFFFF;
}
.btn-ncc:focus {
background-color: #747676;
border-color: #747676;
color: #FFFFFF;
}
.btn-old-secondary {
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #e5e5e5)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* IE10+ */
background: linear-gradient(to bottom, #ffffff 0%, #e5e5e5 100%); /* W3C */
border: 1px solid #D0D0D0;
color: #222;
}
.btn-old-secondary:hover, .btn-old-secondary:focus {
background: #e5e5e5; /* Old browsers */
background: -moz-linear-gradient(top, #e5e5e5 0%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e5e5e5), color-stop(100%, #ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #e5e5e5 0%, #ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #e5e5e5 0%, #ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #e5e5e5 0%, #ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom, #e5e5e5 0%, #ffffff 100%); /* W3C */
color: #222;
}
.btn-bordered {
border: 1px solid #002F3D;
background: transparent;
color: #002F3D;
text-transform: uppercase;
max-width: 170px;
text-align: center;
width: 100%;
}
.btn-bordered [class^=nch-icon-], .btn-bordered [class*=" nch-icon-"] {
font-size: 26px;
padding: 0 2px;
}
.btn-bordered:hover, .btn-bordered:focus {
background: #EEFBFC;
}
.group-booking {
max-width: none !important;
width: auto !important;
}
.btn-link-icon {
border: none;
padding: 2px 0 0 5px;
color: #002F3D;
}
.btn-link-icon:hover, .btn-link-icon:focus {
background: #EEFBFC;
}
.btn-link-icon [class^=nch-icon-], .btn-link-icon [class*=" nch-icon-"] {
padding: 0 2px;
}
.btn-link-icon-secondary {
border: none;
padding: 2px 0 0 5px;
color: #FFFFFF;
}
.btn-link-icon-secondary:hover, .btn-link-icon-secondary:focus {
background: #FFFFFF;
color: #002F3D;
}
.btn-link-icon-secondary [class^=nch-icon-], .btn-link-icon-secondary [class*=" nch-icon-"] {
padding: 0 2px;
}
.btn-bordered--expand {
max-width: none;
}
.btn--double-line {
text-align: left;
padding-right: 10px;
padding-left: 10px;
line-height: 1;
overflow: hidden;
}
.btn--double-line .btn--double-line__first {
float: left;
}
.btn--double-line .btn--double-line__second {
display: block;
font-size: 14px;
}
.btn--double-line.btn--arrow .nch-icon-big-arrow-right {
float: right;
}
.btn--arrow {
padding-right: 0;
}
.btn--arrow .nch-icon-big-arrow-right {
margin: 0 5px 0 15px;
padding-left: 10px;
border-left: 1px solid #fff;
}
.btn--arrow.btn--small .nch-icon-big-arrow-right {
font-size: 20px;
}
.btn--icon-right {
padding-right: 0;
padding-left: 10px;
}
.btn--icon-right [class^=nch-icon-], .btn--icon-right [class*=" nch-icon-"] {
margin: 0 5px 0 10px;
padding: 0;
}
.btn--icon-right.btn--small [class^=nch-icon-], .btn--icon-right.btn--small [class*=" nch-icon-"] {
font-size: 24px;
}
.btn--icon-left {
padding-left: 0;
padding-right: 10px;
}
.btn--icon-left [class^=nch-icon-], .btn--icon-left [class*=" nch-icon-"] {
margin: 0 5px 0 5px;
padding: 0;
}
.btn--icon-left.btn--small [class^=nch-icon-], .btn--icon-left.btn--small [class*=" nch-icon-"] {
font-size: 24px;
}
.btn-selected {
background-color: #fff;
border-color: #000;
text-indent: -9999px;
position: relative;
min-width: 60px;
min-height: 34px;
height: 40px;
cursor: default;
}
.btn-selected:after {
font-family: "nch-icons";
text-indent: 0;
content: "\e653";
color: #000;
font-size: 32px;
display: block;
position: absolute;
top: -12px;
left: 50%;
margin-left: -14px;
}
.btn-search-close {
padding: 0;
text-transform: uppercase;
font-size: 16px;
color: #fff;
border: 0 none;
}
.btn-search-close .nch-icon-close-x {
position: relative;
top: -2px;
margin: 0 0 0 10px;
font-size: 19px;
}
.btn-on-photo {
font-weight: 500;
color: #002F3D;
border: 1px solid #fff;
background: #fff;
}
.btn-on-photo:hover {
background-color: #002F3D;
color: #FFFFFF;
}
.btn-on-photo:focus {
background-color: #002F3D;
color: #FFFFFF;
}
.btn-on-photo.disabled, .btn-on-photo:disabled {
opacity: 0.5;
cursor: default;
}
.btn-on-photo.disabled:hover, .btn-on-photo.disabled:focus, .btn-on-photo:disabled:hover, .btn-on-photo:disabled:focus {
background: transparent;
border: 1px solid #002F3D;
color: #002F3D;
}
.btn-text-link, .btn-text-link--color {
display: inline-block;
font-size: 14px;
line-height: 1.5;
font-weight: 500;
color: #000;
cursor: pointer;
text-decoration: none;
border: none;
padding: 0;
}
.btn-text-link:after, .btn-text-link--color:after {
content: "";
display: block;
width: 100%;
height: 1px;
background: currentColor;
}
.btn-text-link:hover, .btn-text-link--color:hover, .btn-text-link:focus, .btn-text-link--color:focus {
color: #5A0032;
text-decoration: none;
}
.btn-text-link:hover:after, .btn-text-link--color:hover:after, .btn-text-link:focus:after, .btn-text-link--color:focus:after {
background: currentColor;
}
.btn-text-link--color {
font-size: 16px;
}
.btn-text-link--color:after {
background: #2ebd59;
}
.btn-add {
position: relative;
padding: 8px 10px 3px 10px;
text-transform: uppercase;
}
.btn-add [class^=nch-icon-], .btn-add [class*=" nch-icon-"] {
position: relative;
top: -3px;
margin: 0 10px 0 0;
font-size: 30px;
}
.btn-add--checked {
color: #00aa50;
background: #fff;
}
.btn-in-form {
display: block;
height: 40px;
min-width: 44px;
padding: 5px 10px 4px 10px;
font-size: 16px;
color: #000;
background: none;
border: 1px solid rgba(0, 0, 0, 0);
}
.btn-in-form:hover {
color: #83bffc;
}
.btn-in-form--selected {
border: 1px solid #668C98;
}
.btn-text-link-icon {
font-size: 16px;
color: #000;
background: none;
border: 0;
}
.btn-text-link-icon [class^=nch-icon-], .btn-text-link-icon [class*=" nch-icon-"] {
padding: 0 2px;
font-size: 16px;
}
.btn-text-link-icon:hover {
color: #5A0032;
}
.btn--no-style {
border: none;
background: none;
font-size: inherit;
font-weight: inherit;
font-weight: inherit;
}
.btn--clear-style {
background: none;
border: none;
}
/*
Custom button use by Editors
*/
a.button {
box-sizing: border-box;
padding: calc(0.75rem - 2px) 1.5rem;
border-radius: 0.75rem;
font-size: 1rem;
text-decoration: none;
line-height: 24px;
display: inline-block;
font-family: StrawberrySansText;
font-weight: 700 !important;
background: #F9D9D8;
color: #5A0032;
border-style: none;
}
.badge {
position: absolute;
top: 0px;
left: 0px;
padding: 4px 8px 4px 8px;
text-transform: uppercase;
font-size: 12px;
letter-spacing: 0.12em;
font-family: StrawberrySansText;
border-radius: 8px 0px;
}
.badge__header {
line-height: 1rem;
display: block;
}
.badge__text {
display: block;
line-height: 1rem;
}
.badge--large {
padding: 8px 10px 4px 8px;
font-size: 16px;
}
/*
.ff-crop-img {
overflow: hidden;
text-align: center;
display:block;
.ff-cimg {
display: inline-block;
width: 100%;
min-width: 100px;
position: relative;
left: 100%;
margin-left: -200%;
}
}
*/
.ff-crop-img {
overflow: hidden;
text-align: center;
display: block;
}
.ff-crop-img .ff-cimg {
display: block;
position: relative;
top: 0;
left: 50%;
width: 100%;
height: auto;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
min-width: 100px;
margin-top: 50px;
}
.ff-crop-img .ff-cimg-no-vertival {
-webkit-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transform: translate(-50%, 0);
margin-top: 0;
}
.ie8 .ff-crop-img .ff-cimg,
.no-transform .ff-crop-img .ff-cimg {
display: inline-block;
left: 100%;
margin-left: -200%;
margin-top: 0;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.ff-dropdown {
position: absolute;
top: 40px;
left: 0;
z-index: 11;
padding: 4px 0;
border-radius: 4px;
border: 1px solid #f2f2f2;
background: #fff;
margin: 2px 0 0 0;
display: none;
}
.ff-dropdown ul {
margin: 0;
}
.ff-dropdown:before {
content: "";
position: absolute;
top: -8px;
left: 15px;
width: 14px;
height: 14px;
border-radius: 4px 0 0 0;
-webkit-transform: rotate(52deg) skew(0, -15deg);
transform: rotate(52deg) skew(0, -15deg);
background: #fff;
border: 1px solid transparent;
border-top-color: #f2f2f2;
border-left-color: #f2f2f2;
}
/*
Falback for old browser
*/
.no-animation .ff-dropdown:before {
content: "";
position: absolute;
top: -9px;
width: 34px;
height: 9px;
border: none;
background: url("../../Images/ff-image/arrow_white.png") no-repeat;
border-radius: 0;
-webkit-transform: none;
transform: none;
}
/*
Style for dropdown you will find in _custom-dropdown conected with class .ui-autocomplete
*/
.ff-autocimplite .ui-autocomplete {
padding: 0;
margin: 0;
list-style: none;
}
.ff-autocimplite .ui-menu-item {
margin: 0;
list-style: none;
padding: 3px 8px;
}
.ff-autocimplite .ui-menu-item:first-child {
padding-top: 10px;
}
.ff-autocimplite .ui-menu-item a {
display: block;
font-size: 16px;
line-height: 20px;
color: #444;
overflow: hidden;
cursor: pointer;
}
.ff-autocimplite .ui-menu-item a:hover, .ff-autocimplite .ui-menu-item a.ui-state-focus {
background: #efefef;
}
.ff-autocimplite .ui-menu-item a img {
width: 30px;
float: left;
margin: 0 10px 0 0;
}
.ff-autocimplite .ui-menu-item a p {
margin: 0 0 5px 0;
}
.ff-autocimplite .separator {
padding: 10px 8px 10px 8px;
font-size: 16px;
line-height: 22px;
font-weight: 700;
color: #444;
position: relative;
}
.ff-autocimplite .separator:first-child {
margin: 0;
padding-top: 0;
border: none;
}
.ff-autocimplite .separator:before {
content: "";
display: block;
width: 100%;
height: 1px;
background: #e5e5e5;
margin-bottom: 10px;
}
.ff-autocimplite .inner-separator {
padding-bottom: 10px;
}
.ff-autocimplite .inner-separator:after {
content: "";
display: block;
height: 1px;
border-bottom: 1px solid #e5e5e5;
margin-top: 10px;
}
.ff-autocimplite .ff-autocimplite__second {
color: #bbb;
display: block;
}
/*
Medium
*/
@media only screen and (min-width: 768px) {
.ff-autocimplite .ff-autocimplite__second {
display: inline-block;
}
}
/*
New Preloader
HTML
<div class="ff-loader-layer">
<div class="ff-loader">
<div class="ff-loader-anim1"></div>
<div class="ff-loader-anim2"></div>
<div class="ff-loader-anim3"></div>
</div>
</div>
*/
.ff-loader-layer, .ff-loader-layer--with-message {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.45);
z-index: 9999;
}
.ff-loader {
position: fixed;
top: 50%;
left: 50%;
margin: -50px 0 0 -50px;
height: 100px;
width: 100px;
line-height: 100px;
text-align: center;
background-color: rgba(255, 255, 255, 0.9);
border-radius: 4px;
z-index: 10000;
overflow: hidden;
}
.ff-loader > div,
.ff-loader-message__content > div {
width: 18px;
height: 18px;
background-color: #000;
border-radius: 100%;
display: inline-block;
-webkit-animation: bouncedelay 1.4s infinite ease-in-out;
animation: bouncedelay 1.4s infinite ease-in-out;
/* Prevent first frame from flickering when animation starts */
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.ff-loader-small {
height: 40px;
width: 80px;
line-height: 40px;
position: static;
margin: 20px 0 0 0;
}
.ff-loader-small > div {
width: 10px;
height: 10px;
}
.ff-loader-price {
margin-top: 5px;
}
.global-calendar--sticky #calendar-view-container .ff-loader-small {
/* P42859-6711 Update load indicator disappear while scrolling hotel page */
-webkit-transform: translate3d(0, 0, 0);
margin-top: 0;
}
.ff-loader .ff-loader-anim1,
.ff-loader-message__content .ff-loader-anim1 {
-webkit-animation-delay: -0.32s;
animation-delay: -0.32s;
}
.ff-loader .ff-loader-anim2,
.ff-loader-message__content .ff-loader-anim2 {
-webkit-animation-delay: -0.16s;
animation-delay: -0.16s;
}
@-webkit-keyframes bouncedelay {
0%, 80%, 100% {
-webkit-transform: scale(0);
}
40% {
-webkit-transform: scale(1);
}
}
@keyframes bouncedelay {
0%, 80%, 100% {
transform: scale(0);
-webkit-transform: scale(0);
}
40% {
transform: scale(1);
-webkit-transform: scale(1);
}
}
.ie8 .ff-loader,
.ie9 .ff-loader,
.no-animation .ff-loader {
background-image: url(../../Images/loader.gif);
background-repeat: no-repeat;
background-color: #000;
background-position: center;
display: block;
margin: 10px auto;
}
.ie8 .ff-loader div,
.ie9 .ff-loader div,
.no-animation .ff-loader div {
display: none;
}
.no-animation .ff-loader-layer, .no-animation .ff-loader-layer--with-message {
background: url("../../Images/overlay-bg.png") repeat scroll 0 0 transparent;
}
.ff-loader-layer--with-message .ff-loader-message {
position: fixed;
top: 50%;
left: 0;
right: 0;
margin: 0 auto;
text-align: center;
}
.ff-loader-layer--with-message .ff-loader-message__content {
display: inline-block;
padding: 10px 15px 30px;
background-color: rgba(255, 255, 255, 0.9);
margin-top: -50%;
}
.ff-loader-message {
margin-bottom: 10px;
}
.ff-loader-message__title {
margin: 0 0 20px 0;
}
.ui-widget-content {
background: white;
}
.ui-helper-hidden {
display: none;
}
.ui-helper-hidden-accessible {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
clip: rect(1px, 1px, 1px, 1px);
}
.ui-helper-reset {
margin: 0;
padding: 0;
border: 0;
outline: 0;
line-height: 1.3;
text-decoration: none;
font-size: 100%;
list-style: none;
}
.ui-helper-clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
background: none repeat scroll 0 0 transparent;
}
.ui-helper-clearfix {
display: inline-block;
}
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix {
height: 1%;
}
.ui-helper-clearfix {
display: block;
}
/* end clearfix */
.ui-helper-zfix {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
opacity: 0;
filter: Alpha(Opacity=0);
}
.ui-widget-content.ui-helper-clearfix {
background-color: transparent;
}
.ui-state-disabled {
cursor: default !important;
}
.ui-icon {
display: block;
text-indent: -99999px;
overflow: hidden;
background-repeat: no-repeat;
}
.ui-widget-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.ui-widget-header {
background-color: #FFF;
border-bottom: 1px solid #EAEAEA;
font-family: StrawberrySansDisplay;
color: #000;
font-style: normal;
font-weight: 500;
font-size: 20px;
line-height: 24px;
letter-spacing: -0.02em;
}
.ui-widget-overlay {
background: #000;
opacity: 0.5;
filter: Alpha(Opacity=50);
z-index: 100;
}
.ui-widget-shadow {
margin: -5px 0 0 -5px;
padding: 5px;
background: #000000;
opacity: 0.2;
filter: Alpha(Opacity=20);
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.ui-dialog {
position: absolute;
padding: 0px;
overflow: hidden;
z-index: 1002;
max-width: 620px;
background: #FFFFFF;
border-bottom: 1px solid #EAEAEA;
border-radius: 1rem;
padding: 1rem 1.5rem;
}
.ui-dialog.ui-dialog-no-padding {
padding: 0;
}
.ui-dialog.termsAndConditionsDialog {
max-width: 620px;
}
.ui-dialog .ui-dialog-titlebar {
padding: 0.4em 1em;
position: relative;
}
.ui-dialog .ui-dialog-title {
float: left;
/*margin: .1em 16px .1em 0;*/
}
.ui-dialog .ui-dialog-titlebar-close {
position: absolute;
right: 10px;
top: 50%;
width: 25px;
margin: -17px 0 0 0;
padding: 1px;
height: 35px;
line-height: 35px;
background: transparent;
border: none;
overflow: hidden;
text-align: center;
}
.ui-dialog .ui-dialog-titlebar-close .ui-icon {
display: block;
margin: 0 0 0 -50%;
font-size: 18px;
width: 48px;
height: 35px;
min-width: 24px;
text-indent: 0;
color: #fff;
font-family: "nch-icons";
}
.ui-dialog .ui-dialog-titlebar-close .ui-icon:before {
content: "\e900";
}
.ui-dialog .ui-dialog-content {
position: relative;
border: 0;
padding: 20px;
background: none;
overflow: auto;
-webkit-overflow-scrolling: touch;
zoom: 1;
font-weight: 600;
}
.ui-dialog .ui-dialog-content {
box-sizing: border-box;
}
[aria-describedby=transformSlideShowContainer].ui-dialog .ui-dialog-content.transform {
padding: 16px 8px;
}
[aria-describedby=transformSlideShowContainer].ui-dialog .ui-dialog-content .slider {
max-width: 100%;
}
[aria-describedby=transformSlideShowContainer].ui-dialog .ui-dialog-content .slider .imageslide {
background-color: #fff !important;
max-width: 100%;
}
[aria-describedby=transformSlideShowContainer].ui-dialog .ui-dialog-content .slider .imageslide img {
border-radius: 8px;
}
[aria-describedby=transformSlideShowContainer].ui-dialog .ui-dialog-titlebar {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 28px;
border-bottom-style: none;
padding-bottom: 0px;
}
[aria-describedby=transformSlideShowContainer].ui-dialog .ui-dialog-titlebar-close .ui-icon:before {
content: "";
display: inline-block;
width: 16px;
height: 16px;
cursor: pointer;
background-repeat: no-repeat;
background-image: url("../../Images/strawberry-close.svg");
}
.ui-dialog .ui-dialog-content > * {
-webkit-transform: translateZ(0px);
}
.ui-dialog .ui-dialog-buttonpane {
text-align: left;
border-width: 1px 0 0 0;
background-image: none;
margin: 0.5em 0 0 0;
padding: 0.3em 1em 0.5em 0.4em;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
margin: 0.5em 0.4em 0.5em 0;
cursor: pointer;
}
.ui-dialog .ui-resizable-se {
width: 14px;
height: 14px;
right: 3px;
bottom: 3px;
}
.ui-draggable .ui-dialog-titlebar {
cursor: move;
font-size: 15px;
}
/*Language dialog*/
.language-dialog.ui-dialog .ui-dialog-titlebar {
text-align: center;
background-color: #148379;
}
.language-dialog .ui-dialog-titlebar-close {
display: block;
background: transparent;
border: none;
}
.language-dialog .ui-dialog-content .button {
margin-left: 20px;
background: #d7d7d7;
padding: 4px 7px 2px;
border: 1px solid #bbb;
border-radius: 3px;
zoom: 1;
line-height: 20px;
font-size: 12px;
display: inline-block;
text-transform: uppercase;
color: #444;
text-decoration: none;
}
.language-dialog .ui-dialog-content .button:hover {
background: #fff;
}
.language-dialog .ui-dialog-content .button:focus {
border-color: #4aada3;
}
.language-dialog.ui-dialog .ui-dialog-titlebar {
text-align: center;
background-color: #148379;
}
.language-dialog .ui-dialog-titlebar-close {
display: block;
}
.language-dialog .ui-dialog-content .button {
margin-left: 20px;
}
.selectChainOrSort {
display: none;
}
.selectChainOrSort {
display: none;
}
/* Form */
.ui-dialog .form {
padding: 0;
}
.ui-dialog .form p {
text-align: inherit;
}
.ui-dialog .form__section {
margin: 0;
}
@media only screen and (min-width:768px) and (max-width:1023px) {
.ui-dialog.termsAndConditionsDialog {
max-width: 100%;
}
}
@media only screen and (max-width: 480px) {
.ui-dialog.termsAndConditionsDialog {
max-width: 100%;
position: fixed !important;
top: 0;
left: 0;
bottom: 0;
}
.ui-dialog .ui-dialog-content {
height: 85vh !important;
}
}
@media only screen and (max-width: 600px) {
.ui-dialog {
border-bottom-style: none;
border-radius: 0;
padding: 0;
width: 100vw !important;
}
}
.language-selector {
display: inline-block;
position: relative;
}
.language-selector__label {
position: relative;
line-height: 25px;
}
.language-selector__label:after {
content: "";
width: 0;
height: 0;
border: inset 5px;
border-color: rgba(255, 255, 255, 0.4) transparent transparent transparent;
border-top-style: solid;
margin-left: 3px;
display: inline-block;
margin-bottom: -3px;
}
.language-selector:hover .language-selector__label {
color: white;
}
.language-selector__select {
cursor: pointer;
position: absolute;
background-color: white;
font-size: 14px;
opacity: 0.001;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.js-nch-chat-disabled {
cursor: not-allowed;
}
.js-nch-chat-disabled:hover {
color: #bbb;
}
.chat-link {
padding: 2px 10px;
display: block;
width: 100%;
color: #BBBBBB;
border: 1px solid #BBBBBB;
border-radius: 2px;
text-transform: uppercase;
text-align: center;
font-size: 16px;
line-height: 36px;
margin: 18px 0 20px 0;
}
.chat-link:hover {
color: #fff;
}
.chat-link .nch-icon-chat {
font-size: 20px;
}
.chat-link__content {
display: inline-block;
white-space: nowrap;
}
@media only screen and (min-width: 768px) {
.chat-link {
max-width: 160px;
font-size: 14px;
line-height: 26px;
}
}
@media only screen and (min-width: 1024px) {
.chat-link--text {
padding-right: 20%;
display: block;
}
}
.video-lightbox-overlay {
display: none;
position: fixed;
top: 0;
left: 0;
z-index: 1000;
right: 0;
bottom: 0;
overflow: hidden;
}
.video-lightbox-overlay.visible {
display: block;
}
.video-lightbox-overlay:before {
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
background: #000;
right: 0;
bottom: 0;
filter: alpha(opacity=70);
opacity: 0.7;
}
.ie8 .video-lightbox-overlay:before {
background: url("../../Images/overlay-bg.png") repeat;
}
.l-embed-container {
position: relative;
padding-bottom: 56.25%;
height: 0;
top: 50%;
margin-top: -28.125%;
margin-left: auto;
margin-right: auto;
width: 80%;
}
.l-embed-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.l-video-container {
width: 100%;
height: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.l-video-close {
position: absolute;
top: 10px;
right: 10px;
z-index: 1001;
background: #fff;
width: 30px;
height: 30px;
border-radius: 5px;
cursor: pointer;
}
.l-video-close:before {
display: block;
margin: -1px;
color: #000;
}
/*
360 video link
*/
.video-lightbox__extra-link {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.video-lightbox__extra-link-content {
position: absolute;
margin-top: 2px;
width: 100%;
padding: 16px 15px;
box-sizing: border-box;
background: #222;
color: #fff;
font-size: 16px;
}
.embed-container--with-extra-text {
top: 0 !important;
}
@media only screen and (min-width: 1024px, 999999em) {
.embed-container--with-extra-text {
top: 60px !important;
}
}
/* TipTip CSS - Version 1.2 */
#tiptip_holder {
display: none;
position: absolute;
top: 0;
left: 0;
z-index: 99999; /*margin: 40px;*/
}
#tiptip_holder.tip_top {
padding-bottom: 8px;
}
#tiptip_holder.tip_bottom {
padding-top: 8px;
padding-left: 1px;
}
#tiptip_holder.tip_right {
padding-left: 8px;
}
#tiptip_holder.tip_left {
padding-right: 8px;
}
#tiptip_content {
font-size: 13px;
color: #000;
padding: 10px;
border: 1px solid #e6e6e6;
background-color: #e6e6e6;
border-radius: 4px;
}
#tiptip_content p {
margin: 0;
line-height: 1.2;
font-size: 14px;
color: #333;
}
#tiptip_content .tel {
color: #333;
display: block;
text-decoration: none;
}
#tiptip_content a.tel:hover {
text-decoration: underline;
}
#tiptip_arrow, #tiptip_arrow_inner {
position: absolute;
border-color: transparent;
border-style: solid;
border-width: 10px;
height: 0;
width: 0;
}
#tiptip_holder.tip_top #tiptip_arrow {
border-top-color: #e6e6e6;
}
#tiptip_holder.tip_bottom #tiptip_arrow {
border-bottom-color: #e6e6e6;
}
#tiptip_holder.tip_right #tiptip_arrow {
border-right-color: #e6e6e6;
}
#tiptip_holder.tip_left #tiptip_arrow {
border-left-color: #e6e6e6;
}
#tiptip_holder.tip_top #tiptip_arrow_inner {
margin-top: -9px;
margin-left: -10px;
border-top-color: #e6e6e6;
}
#tiptip_holder.tip_bottom #tiptip_arrow_inner {
margin-top: -9px;
margin-left: -10px;
border-bottom-color: #e6e6e6;
}
#tiptip_holder.tip_right #tiptip_arrow_inner {
margin-top: -10px;
margin-left: -10px;
border-right-color: #e6e6e6;
}
#tiptip_holder.tip_left #tiptip_arrow_inner {
margin-top: -9px;
margin-left: -9px;
border-left-color: #e6e6e6;
}
#tiptip_content .tel .value {
white-space: nowrap;
}
/* Webkit Hacks */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
#tiptip_content {
background-color: #e6e6e6;
}
#tiptip_holder.tip_bottom #tiptip_arrow_inner {
border-bottom-color: #e6e6e6;
}
#tiptip_holder.tip_top #tiptip_arrow_inner {
border-top-color: #e6e6e6;
}
}
.phone-select__spacing {
padding-right: 10px !important;
}
.phone-select__country-nr {
position: absolute;
left: 1px;
top: 1px;
background: #EEFBFC;
width: 50px;
text-align: center;
line-height: 40px;
height: 38px;
color: #000;
font-size: 14px;
}
.phone-select__input {
position: relative;
}
.phone-select__input .input {
padding-left: 58px;
}
.dropdown {
display: block;
/* Autocomplete resets */
/* Box - a bordered container */
/* Ul */
/* Interactive item - the one that a user hovers or clicks on */
/* Interactive item - when it's a radio button */
/* Divider / Separator */
/* Meta data */
}
.dropdown .dropdown__box .ff-error {
margin: 0 10px 10px;
position: relative;
z-index: 10;
}
.dropdown > .hide-before-load {
visibility: hidden;
height: 40px;
overflow: hidden;
display: block;
}
.dropdown .dropdown__arrow {
position: relative;
background: #fff;
}
.dropdown .dropdown__arrow .dropdown__input,
.dropdown .dropdown__arrow .dropdown-input {
padding-right: 30px;
position: relative;
background: rgba(255, 255, 255, 0.01);
overflow: hidden;
}
.dropdown .dropdown__arrow .dropdown__box {
z-index: 3;
}
.dropdown.dropdown-strawberry .dropdown__input,
.dropdown.dropdown-strawberry .dropdown-input {
overflow: hidden;
border-style: none;
background-image: url("../../Images/strawberry-dropdown-down.svg");
background-repeat: no-repeat;
background-position-x: calc(100% - 21px);
background-position-y: 16px;
font-family: "StrawberrySansText";
font-weight: 400;
font-size: 14px;
line-height: 20px;
background-color: #F7F5F3;
border-radius: 16px;
height: 56px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 16px;
gap: 8px;
}
.dropdown.dropdown-strawberry .dropdown__input.focus,
.dropdown.dropdown-strawberry .dropdown-input.focus {
background-image: url("../../Images/strawberry-dropdown-up.svg");
}
.dropdown.dropdown-strawberry dropdown__item:active {
background-color: #F7F5F3;
}
.dropdown.dropdown-strawberry ul.dropdown__list--dividers li::after {
display: none;
}
.dropdown.dropdown-strawberry.dropdown-strawberry-radio .label-title-radio {
margin-left: 30px;
}
.dropdown.dropdown-strawberry.dropdown-strawberry-radio li {
padding-top: 5px;
}
.dropdown.dropdown-strawberry.dropdown-strawberry-radio .input-radio {
opacity: unset;
position: absolute;
left: 5px;
-webkit-appearance: none;
appearance: none;
margin: 0;
width: 19.5px;
height: 19.5px;
border: 1.5px solid;
border-radius: 50%;
display: grid;
place-content: center;
}
.dropdown.dropdown-strawberry.dropdown-strawberry-radio .label-radio.dropdown__item {
background: #F7F5F3;
}
.dropdown.dropdown-strawberry.dropdown-strawberry-radio .input-radio::before {
content: "";
width: 6px;
height: 6px;
border: 1.5px solid;
border-radius: 50%;
transform: scale(0);
}
.dropdown.dropdown-strawberry.dropdown-strawberry-radio .input-radio:checked::before {
transform: scale(1);
}
.dropdown.dropdown-strawberry .input-radio:checked + .label-radio:after {
display: none;
}
.dropdown.dropdown-strawberry .label-radio.dropdown__item {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
padding: 8px 12px;
border-radius: 8px;
background: #FFF;
}
.dropdown.dropdown-strawberry .label-radio.dropdown__item::before {
display: none;
}
.dropdown.dropdown-strawberry .label-radio.dropdown__item:hover {
background: #F7F5F3;
}
.dropdown.dropdown-strawberry .dropdown__box {
padding: 24px 12px;
background: #FFFFFF;
box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.25);
border-radius: 8px;
border-style: none;
}
.dropdown.dropdown-strawberry .dropdown__box::before {
display: none;
}
.dropdown .dropdown__close-button {
width: 16px;
height: 16px;
font-size: 16px;
margin: 4px 10px 8px 10px;
margin-left: auto;
cursor: pointer;
}
.dropdown [data-search-match=false] {
display: none;
}
.dropdown .ui-autocomplete {
color: #000;
}
.dropdown .ui-autocomplete li,
.dropdown .ui-autocomplete .ui-menu-item:first-child {
padding: 0;
}
.dropdown .ui-autocomplete,
.dropdown .dropdown__box {
background-color: white;
border: 1px solid #668C98;
width: 100%;
margin: 5px 0 10px 0;
padding: 10px 0;
position: relative;
display: none;
}
.dropdown .ui-autocomplete:before,
.dropdown .dropdown__box:before {
content: "";
display: block;
width: 14px;
height: 14px;
position: absolute;
border: solid #668C98;
border-width: 1px 0px 0px 1px;
background-color: white;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
top: -8px;
left: 20px;
}
.dropdown .dropdown__list {
padding: 0;
list-style: none;
}
.dropdown .dropdown__list--dividers > li:not(:last-child):after {
content: "";
display: block;
height: 1px;
margin: 0 10px;
background: #D8D4D0;
}
.dropdown .dropdown__list--dividers .dropdown__item {
position: relative;
margin: -1px 0 !important;
}
.dropdown .ui-autocomplete .ui-menu-item a,
.dropdown .dropdown__item,
.dropdown .ui-autocomplete .ui-autocomplete-category,
.dropdown .dropdown__category {
display: block;
margin: 0;
padding: 6px 10px 5px;
font-size: 16px;
line-height: 1.2;
text-decoration: none;
}
.dropdown .ui-autocomplete .ui-autocomplete-category,
.dropdown .dropdown__category {
font-weight: 600;
}
.dropdown .ui-autocomplete .ui-menu-item a,
.dropdown .dropdown__item {
font-weight: 400;
}
.dropdown .ui-autocomplete .ui-menu-item a, .dropdown .ui-autocomplete .ui-menu-item a:hover, .dropdown .ui-autocomplete .ui-menu-item a:focus,
.dropdown .dropdown__item,
.dropdown .dropdown__item:hover,
.dropdown .dropdown__item:focus {
color: #000;
}
.dropdown .ui-autocomplete .ui-menu-item a.ui-state-focus, .dropdown .ui-autocomplete .ui-menu-item a:not(.no-hover):hover, .dropdown .ui-autocomplete .ui-menu-item a:not(.no-hover):focus,
.dropdown .dropdown__item.ui-state-focus,
.dropdown .dropdown__item:not(.no-hover):hover,
.dropdown .dropdown__item:not(.no-hover):focus {
background-color: #F7F5F3;
}
.dropdown .ui-autocomplete .ui-menu-item a.label-radio,
.dropdown .dropdown__item.label-radio {
padding-top: 17px;
padding-bottom: 14px;
}
.dropdown .ui-autocomplete .ui-menu-item a.label-radio,
.dropdown .dropdown__item.label-radio {
padding-left: 38px;
}
.dropdown .ui-autocomplete .ui-menu-item a.label-radio:before,
.dropdown .dropdown__item.label-radio:before {
top: 15px;
left: 10px;
}
.dropdown .ui-autocomplete .ui-menu-item a.label-radio:after,
.dropdown .dropdown__item.label-radio:after {
top: 19px;
left: 14px;
}
.dropdown .ui-autocomplete .ui-menu-item a.label-radio:before,
.dropdown .dropdown__item.label-radio:before {
background-color: #fff;
}
.dropdown .dropdown__item.is-selected,
.dropdown .input-radio:checked + .dropdown__item.label-radio {
font-weight: 600;
}
.dropdown .input-radio:focus + .dropdown__item.label-radio {
background-color: #F7F5F3;
}
.dropdown .dropdown__divider {
margin: 6px 10px 5px;
}
.dropdown .dropdown__divider:before {
display: block;
content: "";
height: 1px;
background: #D8D4D0;
}
.dropdown .ui-autocomplete .separator:before {
background: #D8D4D0;
}
.dropdown .ui-autocomplete .inner-separator:after {
margin: 5px 10px;
border-color: #D8D4D0;
border-width: 1px;
}
.dropdown .ui-autocomplete .ff-autocimplite__second,
.dropdown .dropdown__meta {
color: #403D3B;
}
.dropdown-wrapper {
position: relative;
}
[data-search-match=true] ~ .dropdown-wrapper__empty-search-message {
display: none;
}
.dropdown__input,
.dropdown-input {
border: 1px solid #BBBBBB;
line-height: 30px;
padding: 5px 10px;
cursor: pointer;
width: 100%;
color: #222;
outline: none;
}
.dropdown__input.focus,
.dropdown-input.focus {
box-shadow: 0 0 0 4px #83bffc inset;
}
.search-bar-expanded .dropdown__input,
.search-bar-expanded .dropdown-input {
line-height: 24px;
}
.datepicker--left .ff-error,
.datepicker--right .ff-error {
width: 200%;
width: calc(200% - 8px);
}
.datepicker--right .ff-error {
visibility: hidden;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
/*
Only for mobile sizes
*/
@media only screen and (max-width: 480px) {
.datepicker--right .dropdown__box,
.datepicker--left .dropdown__box {
width: 200%;
text-align: center;
}
.datepicker--right .dropdown__box {
margin-left: -100%;
}
.datepicker--right .dropdown__box:before {
left: auto;
right: 20px;
}
}
/*
Tablet
*/
@media only screen and (min-width: 481px) {
.dropdown .ui-autocomplete,
.dropdown .dropdown__box {
min-width: 200px;
}
}
/*
Medium
*/
@media only screen and (min-width: 768px) {
.dropdown .dropdown__close-button {
margin-right: 16px;
}
.dropdown .ui-autocomplete,
.dropdown .dropdown__box {
position: absolute;
border-radius: 2px;
z-index: 300;
margin: 5px 0;
min-width: 280px;
}
.dropdown .ui-autocomplete .ui-menu-item a,
.dropdown .dropdown__item,
.dropdown .ui-autocomplete .ui-autocomplete-category,
.dropdown .dropdown__category,
.dropdown .ui-autocomplete .separator {
display: block;
padding-left: 16px;
padding-right: 16px;
}
.dropdown .ui-autocomplete .ui-menu-item a.label-radio,
.dropdown .dropdown__item.label-radio {
padding-left: 44px;
}
.dropdown .ui-autocomplete .ui-menu-item a.label-radio:before,
.dropdown .dropdown__item.label-radio:before {
top: 15px;
left: 16px;
}
.dropdown .ui-autocomplete .ui-menu-item a.label-radio:after,
.dropdown .dropdown__item.label-radio:after {
top: 19px;
left: 20px;
}
.dropdown .dropdown__divider {
margin-left: 16px;
margin-right: 16px;
}
.dropdown .ui-autocomplete .inner-separator:after {
margin: 5px 16px;
}
.dropdown .dropdown__list--dividers > li:not(:last-child):after {
margin: 0 16px;
}
.dropdown__input.focus,
.dropdown-input.focus {
outline: none;
box-shadow: 0 0 0 4px #83bffc inset;
}
.dropdown__input.focus:after,
.dropdown-input.focus:after {
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
cursor: default;
}
}
.campaignCalendar .dropdown .ui-autocomplete:before,
.campaignCalendar .dropdown .dropdown__box:before {
display: none;
}
.popover-notification {
position: relative;
z-index: 1000;
margin: 0 auto;
padding: 0;
width: 100%;
max-width: 1280px;
min-width: 320px;
}
.popover-notification__wrapper {
background: #004054;
padding: 30px 20px;
margin-bottom: 1px;
}
.popover-notification.is-active {
display: block;
}
.popover-notification.with-link {
max-width: 240px;
padding: 32px 20px 20px;
}
.popover-notification .nch-icon-close-x {
font-size: 18px;
}
.popover-notification .btn-secondary {
margin-top: 20px;
}
.popover-notification__close {
position: absolute;
top: 10px;
right: 10px;
padding: 0;
color: #FFFFFF;
border: 0 none;
z-index: 1001;
}
.popover-notification__close:focus {
color: #5A0032;
border: 1px solid #5A0032;
box-shadow: none;
}
.popover-notification__title {
font-size: 20px;
color: #FFFFFF;
margin-bottom: 10px;
}
.popover-notification__text {
color: #FFFFFF;
}
@media only screen and (min-width: 768px) {
.popover-notification__wrapper {
position: absolute;
top: 0;
right: 60px;
max-width: 200px;
padding: 40px 20px;
text-align: center;
border-radius: 0 0 10px 10px;
box-shadow: 0px 2px 6px 0px rgba(61, 64, 66, 0.75);
}
}
@media only screen and (min-width: 1024px) {
.popover-notification {
position: fixed;
top: 60px;
left: 0;
right: 0;
}
}
.become-member-modal__footer {
background: #00394a;
color: #fff;
padding: 30px 20px;
margin: 0 -20px -20px;
}
@media only screen and (min-width: 768px) {
.become-member-modal__footer {
text-align: center;
}
}
.become-member-modal__header {
display: block;
margin: 30px 0;
}
@media only screen and (min-width: 768px) {
.become-member-modal__header {
text-align: center;
margin: 40px 0;
}
}
.become-member-modal__logos {
list-style: none;
margin: 20px 0 0;
padding: 0;
overflow: hidden;
}
.become-member-modal__logos li {
display: block;
text-align: center;
}
@media only screen and (min-width: 481px) {
.become-member-modal__logos li {
padding: 0 20px;
display: inline-block;
vertical-align: middle;
}
}
@media only screen and (min-width: 481px) {
.become-member-modal .join-ncc__benefits {
margin: 20px !important;
}
}
@media only screen and (min-width: 768px) {
.become-member-modal .join-ncc__benefits {
margin: 20px 40px !important;
}
}
.additional-packages-page {
margin-top: 8rem !important;
}
.additional-packages-page .homelink-wrapper {
margin-bottom: 2rem;
}
.additional-packages .special-request-label {
font-weight: 400;
font-size: 12px;
line-height: 14px;
}
.additional-packages .special-request-textarea {
background: #F7F5F3;
border-radius: 12px;
border-style: none;
font-weight: 400;
font-size: 14px;
line-height: 20px;
padding: 16px;
}
.additional-packages .ff-media--pading .ff-media-bd {
padding-right: 4px;
}
.additional-packages .ff-media-img img {
max-width: 310px;
border-radius: 8px;
}
.additional-packages .external-link {
padding: 1rem;
}
.additional-packages .external-link img {
width: 100%;
display: block;
}
.additional-packages .external-link .text {
margin-bottom: 1.5rem;
}
.additional-packages .external-link p {
margin: 0;
}
.additional-packages .external-link .btn {
width: 100%;
}
.additional-packages .select.strawberry-select {
font-weight: 400;
font-size: 16px;
line-height: 24px;
width: 79px;
}
.additional-packages label.label {
font-weight: 400;
font-size: 12px;
line-height: 14px;
}
.additional-packages label.label-checkbox.strawberry-checkbox {
font-weight: 400;
font-size: 16px;
line-height: 24px;
}
.additional-packages label.label.label-terms {
font-weight: 500;
font-size: 24px;
line-height: 32px;
letter-spacing: -0.02em;
}
.additional-packages .strawberry-button {
height: unset !important;
}
@media only screen and (min-width: 768px) {
.additional-packages .external-link {
padding: 2rem 2.5rem 2rem 1rem;
}
.additional-packages .external-link img {
width: 17.5rem;
float: left;
}
.additional-packages .external-link .content {
width: calc(100% - 19rem);
float: right;
padding-left: 1.5rem;
}
.additional-packages .external-link .btn {
width: auto;
float: right;
}
}
.hotel-info-bar {
min-height: 70px;
width: 100%;
}
.hotel-info-bar .hint-line {
font-size: 14px;
line-height: 22px;
font-weight: 700;
}
.hotel-info-bar .hint-line .nch-icon-info {
margin: -5px 0 0 0;
display: inline-block;
}
.hotel-info-bar__rate {
min-height: 40px;
border-radius: 2px;
padding: 8px 20px 0 20px;
margin: 0;
background: #F7F5F3;
color: #000;
font-size: 18px;
font-weight: bold;
line-height: 1.5;
text-transform: uppercase;
white-space: nowrap;
}
.package-details {
width: auto;
margin: 10px 0;
}
.package-details tr {
border: none;
}
.package-details td {
padding: 0 10px 0 0;
font-size: 14px;
font-weight: 800;
line-height: 1.3;
}
.package-details .date-row td {
padding-top: 10px;
}
@media only screen and (min-width: 768px) {
.hotel-info-bar__title {
width: 87.5%;
}
}
@media (max-width: 768px) {
.additional-packages .form-step__editable {
padding: 0px;
}
.additional-packages .form-step__editable .grid span {
padding-left: 0px;
}
.additional-packages .form-step__editable p {
margin-left: -20px;
}
.additional-packages .form-step__header {
font-weight: 700;
font-size: 14px;
line-height: 20px;
padding: 16px;
}
.additional-packages .ff-media-img img {
width: 100%;
}
.additional-packages .addon-name {
font-weight: 500;
font-size: 20px;
line-height: 24px;
}
.additional-packages .price {
font-weight: 700;
font-size: 16px;
line-height: 24px;
}
.additional-packages label.label.label-terms {
font-weight: 500;
font-size: 20px;
line-height: 24px;
}
}
.iframe_wrapper {
position: relative;
width: 100%;
}
.iframe_wrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/*# sourceMappingURL=GLOBAL-COMPONENTS.css.map */
@charset "UTF-8";
/*------------------------------------*\
$CSSWIZARDRY-GRIDS
\*------------------------------------*/
/**
* CONTENTS
* INTRODUCTION.........How the grid system works.
* VARIABLES............Your settings.
* MIXINS...............Library mixins.
* GRID SETUP...........Build the grid structure.
* WIDTHS...............Build our responsive widths around our breakpoints.
* PUSH.................Push classes.
* PULL.................Pull classes.
*/
/*------------------------------------*\
$INTRODUCTION
\*------------------------------------*/
/**
* csswizardry grids provides you with widths to suit a number of breakpoints
* designed around devices of a size you specify. Out of the box, csswizardry
* grids caters to the following types of device:
*
* palm -- palm-based devices, like phones and small tablets
* lap -- lap-based devices, like iPads or laptops
* portable -- all of the above
* desk -- stationary devices, like desktop computers
* regular -- any/all types of device
*
* These namespaces are then used in the library to give you the ability to
* manipulate your layouts based around them, for example:
*
<div class="grid__item one-whole lap--one-half desk--one-third">
*
* This would give you a grid item which is 100% width unless it is on a lap
* device, at which point it become 50% wide, or it is on a desktop device, at
* which point it becomes 33.333% width.
*
* csswizardry grids also has push and pull classes which allow you to nudge
* grid items left and right by a defined amount. These follow the same naming
* convention as above, but are prepended by either `push--` or `pull--`, for
* example:
*
`class="grid__item one-half push--one-half"`
*
* This would give you a grid item which is 50% width and pushed over to the
* right by 50%.
*
* All classes in csswizardry grids follow this patten, so you should fairly
* quickly be able to piece together any combinations you can imagine, for
* example:
*
`class="grid__item one-whole lap--one-half desk--one-third push--desk--one-third"`
*
`class="grid__item one-quarter palm--one-half push--palm--one-half"`
*
`class="grid__item palm--one-third desk--five-twelfths"`
*/
/*------------------------------------*\
$VARIABLES
\*------------------------------------*/
/**
* If you are building a non-responsive site but would still like to use
* csswizardry-grids, set this to ‘false’:
*/
/**
* Is this build mobile first? Setting to ‘true’ means that all grids will be
* 100% width if you do not apply a more specific class to them.
*/
/**
* Set the spacing between your grid items.
*/
/**
* Would you like Sass’ silent classes, or regular CSS classes?
*/
/**
* Would you like push and pull classes enabled?
*/
/**
* Using `inline-block` means that the grid items need their whitespace removing
* in order for them to work correctly. Set the following to true if you are
* going to achieve this by manually removing/commenting out any whitespace in
* your HTML yourself.
*
* Setting this to false invokes a hack which cannot always be guaranteed,
* please see the following for more detail:
*
* github.com/csswizardry/csswizardry-grids/commit/744d4b23c9d2b77d605b5991e54a397df72e0688
* github.com/csswizardry/inuit.css/issues/170#issuecomment-14859371
*/
/**
* Define your breakpoints. The first value is the prefix that shall be used for
* your classes (e.g. `.palm--one-half`), the second value is the media query
* that the breakpoint fires at.
*
$breakpoints: (
'palm' '(max-width: 480px)',
'lap' '(min-width: 481px) and (max-width: 1023px)',
'portable' '(max-width: 1023px)',
'desk' '(min-width: 1024px)'
) !default;
*/
/**
* Define which namespaced breakpoints you would like to generate for each of
* widths, push and pull. This is handy if you only need pull on, say, desk, or
* you only need a new width breakpoint at mobile sizes. It allows you to only
* compile as much CSS as you need. All are turned on by default, but you can
* add and remove breakpoints at will.
*
* Push and pull shall only be used if `$push` and/or `$pull` and `$responsive`
* have been set to ‘true’.
*/
/**
* You do not need to edit anything from this line onward; csswizardry-grids is
* good to go. Happy griddin’!
*/
/*------------------------------------*\
$MIXINS
\*------------------------------------*/
/**
* These mixins are for the library to use only, you should not need to modify
* them at all.
*
* Enclose a block of code with a media query as named in `$breakpoints`.
*/
/**
* Drop relative positioning into silent classes which can’t take advantage of
* the `[class*="push--"]` and `[class*="pull--"]` selectors.
*/
/*------------------------------------*\
$GRID SETUP
\*------------------------------------*/
/**
* 1. Allow the grid system to be used on lists.
* 2. Remove any margins and paddings that might affect the grid system.
* 3. Apply a negative `margin-left` to negate the columns’ gutters.
*/
.grid {
list-style: none; /* [1] */
margin: 0; /* [2] */
padding: 0; /* [2] */
margin-left: -20px; /* [3] */
letter-spacing: -0.31em;
line-height: 0;
}
/* Opera hack */
.opera:-o-prefocus,
.grid {
word-spacing: -0.43em;
}
/**
* 1. Cause columns to stack side-by-side.
* 2. Space columns apart.
* 3. Align columns to the tops of each other.
* 4. Full-width unless told to behave otherwise.
* 5. Required to combine fluid widths and fixed gutters.
*/
.grid__item {
display: inline-block; /* [1] */
padding-left: 20px; /* [2] */
vertical-align: top; /* [3] */
width: 100%; /* [4] */
-webkit-box-sizing: border-box; /* [5] */
-moz-box-sizing: border-box; /* [5] */
box-sizing: border-box; /* [5] */
letter-spacing: normal;
word-spacing: normal;
line-height: 1.5;
}
/**
* Reversed grids allow you to structure your source in the opposite order to
* how your rendered layout will appear. Extends `.grid`.
*/
.grid--rev {
direction: rtl;
text-align: left;
}
.grid--rev > .grid__item {
direction: ltr;
text-align: left;
}
/**
* Gutterless grids have all the properties of regular grids, minus any spacing.
* Extends `.grid`.
*/
.grid--full {
margin-left: 0;
}
.grid--full > .grid__item {
padding-left: 0;
}
/**
* Align the entire grid to the right. Extends `.grid`.
*/
.grid--right {
text-align: right;
}
.grid--right > .grid__item {
text-align: left;
}
/**
* Centered grids align grid items centrally without needing to use push or pull
* classes. Extends `.grid`.
*/
.grid--center {
text-align: center;
}
.grid--center > .grid__item {
text-align: left;
}
/**
* Align grid cells vertically (`.grid--middle` or `.grid--bottom`). Extends
* `.grid`.
*/
.grid--middle > .grid__item {
vertical-align: middle;
}
.grid--bottom > .grid__item {
vertical-align: bottom;
}
/**
* Create grids with narrower gutters. Extends `.grid`.
*/
.grid--narrow {
margin-left: -10px;
}
.grid--narrow > .grid__item {
padding-left: 10px;
}
/**
* Create grids with wider gutters. Extends `.grid`.
*/
.grid--wide {
margin-left: -40px;
}
.grid--wide > .grid__item {
padding-left: 40px;
}
/*------------------------------------*\
$WIDTHS
\*------------------------------------*/
/**
* Create our width classes, prefixed by the specified namespace.
*/
/**
* Our regular, non-responsive width classes.
*/
/**
* Whole
*/
.one-whole {
width: 100%;
}
/**
* Halves
*/
.one-half, .six-twelfths, .five-tenths, .four-eighths, .three-sixths, .two-quarters {
width: 50%;
}
/**
* Thirds
*/
.one-third, .four-twelfths, .two-sixths {
width: 33.333%;
}
.two-thirds, .eight-twelfths, .four-sixths {
width: 66.666%;
}
/**
* Quarters
*/
.one-quarter, .three-twelfths, .two-eighths {
width: 25%;
}
.three-quarters, .nine-twelfths, .six-eighths {
width: 75%;
}
/**
* Fifths
*/
.one-fifth, .two-tenths {
width: 20%;
}
.two-fifths, .four-tenths {
width: 40%;
}
.three-fifths, .six-tenths {
width: 60%;
}
.four-fifths, .eight-tenths {
width: 80%;
}
/**
* Sixths
*/
.one-sixth, .two-twelfths {
width: 16.666%;
}
.five-sixths, .ten-twelfths {
width: 83.333%;
}
/**
* Eighths
*/
.one-eighth {
width: 12.5%;
}
.three-eighths {
width: 37.5%;
}
.five-eighths {
width: 62.5%;
}
.seven-eighths {
width: 87.5%;
}
/**
* Tenths
*/
.one-tenth {
width: 10%;
}
.three-tenths {
width: 30%;
}
.seven-tenths {
width: 70%;
}
.nine-tenths {
width: 90%;
}
/**
* Twelfths
*/
.one-twelfth {
width: 8.333%;
}
.five-twelfths {
width: 41.666%;
}
.seven-twelfths {
width: 58.333%;
}
.eleven-twelfths {
width: 91.666%;
}
/**
* Our responsive classes, if we have enabled them.
*/
@media only screen and (max-width: 480px) {
/**
* Whole
*/
.palm--one-whole {
width: 100%;
}
/**
* Halves
*/
.palm--one-half, .palm--six-twelfths, .palm--five-tenths, .palm--four-eighths, .palm--three-sixths, .palm--two-quarters {
width: 50%;
}
/**
* Thirds
*/
.palm--one-third, .palm--four-twelfths, .palm--two-sixths {
width: 33.333%;
}
.palm--two-thirds, .palm--eight-twelfths, .palm--four-sixths {
width: 66.666%;
}
/**
* Quarters
*/
.palm--one-quarter, .palm--three-twelfths, .palm--two-eighths {
width: 25%;
}
.palm--three-quarters, .palm--nine-twelfths, .palm--six-eighths {
width: 75%;
}
/**
* Fifths
*/
.palm--one-fifth, .palm--two-tenths {
width: 20%;
}
.palm--two-fifths, .palm--four-tenths {
width: 40%;
}
.palm--three-fifths, .palm--six-tenths {
width: 60%;
}
.palm--four-fifths, .palm--eight-tenths {
width: 80%;
}
/**
* Sixths
*/
.palm--one-sixth, .palm--two-twelfths {
width: 16.666%;
}
.palm--five-sixths, .palm--ten-twelfths {
width: 83.333%;
}
/**
* Eighths
*/
.palm--one-eighth {
width: 12.5%;
}
.palm--three-eighths {
width: 37.5%;
}
.palm--five-eighths {
width: 62.5%;
}
.palm--seven-eighths {
width: 87.5%;
}
/**
* Tenths
*/
.palm--one-tenth {
width: 10%;
}
.palm--three-tenths {
width: 30%;
}
.palm--seven-tenths {
width: 70%;
}
.palm--nine-tenths {
width: 90%;
}
/**
* Twelfths
*/
.palm--one-twelfth {
width: 8.333%;
}
.palm--five-twelfths {
width: 41.666%;
}
.palm--seven-twelfths {
width: 58.333%;
}
.palm--eleven-twelfths {
width: 91.666%;
}
}
@media only screen and (min-width: 481px) {
/**
* Whole
*/
.tab--one-whole {
width: 100%;
}
/**
* Halves
*/
.tab--one-half, .tab--six-twelfths, .tab--five-tenths, .tab--four-eighths, .tab--three-sixths, .tab--two-quarters {
width: 50%;
}
/**
* Thirds
*/
.tab--one-third, .tab--four-twelfths, .tab--two-sixths {
width: 33.333%;
}
.tab--two-thirds, .tab--eight-twelfths, .tab--four-sixths {
width: 66.666%;
}
/**
* Quarters
*/
.tab--one-quarter, .tab--three-twelfths, .tab--two-eighths {
width: 25%;
}
.tab--three-quarters, .tab--nine-twelfths, .tab--six-eighths {
width: 75%;
}
/**
* Fifths
*/
.tab--one-fifth, .tab--two-tenths {
width: 20%;
}
.tab--two-fifths, .tab--four-tenths {
width: 40%;
}
.tab--three-fifths, .tab--six-tenths {
width: 60%;
}
.tab--four-fifths, .tab--eight-tenths {
width: 80%;
}
/**
* Sixths
*/
.tab--one-sixth, .tab--two-twelfths {
width: 16.666%;
}
.tab--five-sixths, .tab--ten-twelfths {
width: 83.333%;
}
/**
* Eighths
*/
.tab--one-eighth {
width: 12.5%;
}
.tab--three-eighths {
width: 37.5%;
}
.tab--five-eighths {
width: 62.5%;
}
.tab--seven-eighths {
width: 87.5%;
}
/**
* Tenths
*/
.tab--one-tenth {
width: 10%;
}
.tab--three-tenths {
width: 30%;
}
.tab--seven-tenths {
width: 70%;
}
.tab--nine-tenths {
width: 90%;
}
/**
* Twelfths
*/
.tab--one-twelfth {
width: 8.333%;
}
.tab--five-twelfths {
width: 41.666%;
}
.tab--seven-twelfths {
width: 58.333%;
}
.tab--eleven-twelfths {
width: 91.666%;
}
}
@media only screen and (min-width: 768px) {
/**
* Whole
*/
.lap--one-whole {
width: 100%;
}
/**
* Halves
*/
.lap--one-half, .lap--six-twelfths, .lap--five-tenths, .lap--four-eighths, .lap--three-sixths, .lap--two-quarters {
width: 50%;
}
/**
* Thirds
*/
.lap--one-third, .lap--four-twelfths, .lap--two-sixths {
width: 33.333%;
}
.lap--two-thirds, .lap--eight-twelfths, .lap--four-sixths {
width: 66.666%;
}
/**
* Quarters
*/
.lap--one-quarter, .lap--three-twelfths, .lap--two-eighths {
width: 25%;
}
.lap--three-quarters, .lap--nine-twelfths, .lap--six-eighths {
width: 75%;
}
/**
* Fifths
*/
.lap--one-fifth, .lap--two-tenths {
width: 20%;
}
.lap--two-fifths, .lap--four-tenths {
width: 40%;
}
.lap--three-fifths, .lap--six-tenths {
width: 60%;
}
.lap--four-fifths, .lap--eight-tenths {
width: 80%;
}
/**
* Sixths
*/
.lap--one-sixth, .lap--two-twelfths {
width: 16.666%;
}
.lap--five-sixths, .lap--ten-twelfths {
width: 83.333%;
}
/**
* Eighths
*/
.lap--one-eighth {
width: 12.5%;
}
.lap--three-eighths {
width: 37.5%;
}
.lap--five-eighths {
width: 62.5%;
}
.lap--seven-eighths {
width: 87.5%;
}
/**
* Tenths
*/
.lap--one-tenth {
width: 10%;
}
.lap--three-tenths {
width: 30%;
}
.lap--seven-tenths {
width: 70%;
}
.lap--nine-tenths {
width: 90%;
}
/**
* Twelfths
*/
.lap--one-twelfth {
width: 8.333%;
}
.lap--five-twelfths {
width: 41.666%;
}
.lap--seven-twelfths {
width: 58.333%;
}
.lap--eleven-twelfths {
width: 91.666%;
}
}
@media only screen and (max-width: 1023px) {
/**
* Whole
*/
.portable--one-whole {
width: 100%;
}
/**
* Halves
*/
.portable--one-half, .portable--six-twelfths, .portable--five-tenths, .portable--four-eighths, .portable--three-sixths, .portable--two-quarters {
width: 50%;
}
/**
* Thirds
*/
.portable--one-third, .portable--four-twelfths, .portable--two-sixths {
width: 33.333%;
}
.portable--two-thirds, .portable--eight-twelfths, .portable--four-sixths {
width: 66.666%;
}
/**
* Quarters
*/
.portable--one-quarter, .portable--three-twelfths, .portable--two-eighths {
width: 25%;
}
.portable--three-quarters, .portable--nine-twelfths, .portable--six-eighths {
width: 75%;
}
/**
* Fifths
*/
.portable--one-fifth, .portable--two-tenths {
width: 20%;
}
.portable--two-fifths, .portable--four-tenths {
width: 40%;
}
.portable--three-fifths, .portable--six-tenths {
width: 60%;
}
.portable--four-fifths, .portable--eight-tenths {
width: 80%;
}
/**
* Sixths
*/
.portable--one-sixth, .portable--two-twelfths {
width: 16.666%;
}
.portable--five-sixths, .portable--ten-twelfths {
width: 83.333%;
}
/**
* Eighths
*/
.portable--one-eighth {
width: 12.5%;
}
.portable--three-eighths {
width: 37.5%;
}
.portable--five-eighths {
width: 62.5%;
}
.portable--seven-eighths {
width: 87.5%;
}
/**
* Tenths
*/
.portable--one-tenth {
width: 10%;
}
.portable--three-tenths {
width: 30%;
}
.portable--seven-tenths {
width: 70%;
}
.portable--nine-tenths {
width: 90%;
}
/**
* Twelfths
*/
.portable--one-twelfth {
width: 8.333%;
}
.portable--five-twelfths {
width: 41.666%;
}
.portable--seven-twelfths {
width: 58.333%;
}
.portable--eleven-twelfths {
width: 91.666%;
}
}
@media only screen and (min-width: 1024px) {
/**
* Whole
*/
.desk--one-whole {
width: 100%;
}
/**
* Halves
*/
.desk--one-half, .desk--six-twelfths, .desk--five-tenths, .desk--four-eighths, .desk--three-sixths, .desk--two-quarters {
width: 50%;
}
/**
* Thirds
*/
.desk--one-third, .desk--four-twelfths, .desk--two-sixths {
width: 33.333%;
}
.desk--two-thirds, .desk--eight-twelfths, .desk--four-sixths {
width: 66.666%;
}
/**
* Quarters
*/
.desk--one-quarter, .desk--three-twelfths, .desk--two-eighths {
width: 25%;
}
.desk--three-quarters, .desk--nine-twelfths, .desk--six-eighths {
width: 75%;
}
/**
* Fifths
*/
.desk--one-fifth, .desk--two-tenths {
width: 20%;
}
.desk--two-fifths, .desk--four-tenths {
width: 40%;
}
.desk--three-fifths, .desk--six-tenths {
width: 60%;
}
.desk--four-fifths, .desk--eight-tenths {
width: 80%;
}
/**
* Sixths
*/
.desk--one-sixth, .desk--two-twelfths {
width: 16.666%;
}
.desk--five-sixths, .desk--ten-twelfths {
width: 83.333%;
}
/**
* Eighths
*/
.desk--one-eighth {
width: 12.5%;
}
.desk--three-eighths {
width: 37.5%;
}
.desk--five-eighths {
width: 62.5%;
}
.desk--seven-eighths {
width: 87.5%;
}
/**
* Tenths
*/
.desk--one-tenth {
width: 10%;
}
.desk--three-tenths {
width: 30%;
}
.desk--seven-tenths {
width: 70%;
}
.desk--nine-tenths {
width: 90%;
}
/**
* Twelfths
*/
.desk--one-twelfth {
width: 8.333%;
}
.desk--five-twelfths {
width: 41.666%;
}
.desk--seven-twelfths {
width: 58.333%;
}
.desk--eleven-twelfths {
width: 91.666%;
}
}
/*------------------------------------*\
$PUSH
\*------------------------------------*/
/**
* Push classes, to move grid items over to the right by certain amounts.
*/
/**
* Not a particularly great selector, but the DRYest way to do things.
*/
[class*=push--] {
position: relative;
}
/**
* Whole
*/
.push--one-whole {
left: 100%;
}
/**
* Halves
*/
.push--one-half, .push--six-twelfths, .push--five-tenths, .push--four-eighths, .push--three-sixths, .push--two-quarters {
left: 50%;
}
/**
* Thirds
*/
.push--one-third, .push--four-twelfths, .push--two-sixths {
left: 33.333%;
}
.push--two-thirds, .push--eight-twelfths, .push--four-sixths {
left: 66.666%;
}
/**
* Quarters
*/
.push--one-quarter, .push--three-twelfths, .push--two-eighths {
left: 25%;
}
.push--three-quarters, .push--nine-twelfths, .push--six-eighths {
left: 75%;
}
/**
* Fifths
*/
.push--one-fifth, .push--two-tenths {
left: 20%;
}
.push--two-fifths, .push--four-tenths {
left: 40%;
}
.push--three-fifths, .push--six-tenths {
left: 60%;
}
.push--four-fifths, .push--eight-tenths {
left: 80%;
}
/**
* Sixths
*/
.push--one-sixth, .push--two-twelfths {
left: 16.666%;
}
.push--five-sixths, .push--ten-twelfths {
left: 83.333%;
}
/**
* Eighths
*/
.push--one-eighth {
left: 12.5%;
}
.push--three-eighths {
left: 37.5%;
}
.push--five-eighths {
left: 62.5%;
}
.push--seven-eighths {
left: 87.5%;
}
/**
* Tenths
*/
.push--one-tenth {
left: 10%;
}
.push--three-tenths {
left: 30%;
}
.push--seven-tenths {
left: 70%;
}
.push--nine-tenths {
left: 90%;
}
/**
* Twelfths
*/
.push--one-twelfth {
left: 8.333%;
}
.push--five-twelfths {
left: 41.666%;
}
.push--seven-twelfths {
left: 58.333%;
}
.push--eleven-twelfths {
left: 91.666%;
}
@media only screen and (max-width: 480px) {
/**
* Whole
*/
.push--palm--one-whole {
left: 100%;
}
/**
* Halves
*/
.push--palm--one-half, .push--palm--six-twelfths, .push--palm--five-tenths, .push--palm--four-eighths, .push--palm--three-sixths, .push--palm--two-quarters {
left: 50%;
}
/**
* Thirds
*/
.push--palm--one-third, .push--palm--four-twelfths, .push--palm--two-sixths {
left: 33.333%;
}
.push--palm--two-thirds, .push--palm--eight-twelfths, .push--palm--four-sixths {
left: 66.666%;
}
/**
* Quarters
*/
.push--palm--one-quarter, .push--palm--three-twelfths, .push--palm--two-eighths {
left: 25%;
}
.push--palm--three-quarters, .push--palm--nine-twelfths, .push--palm--six-eighths {
left: 75%;
}
/**
* Fifths
*/
.push--palm--one-fifth, .push--palm--two-tenths {
left: 20%;
}
.push--palm--two-fifths, .push--palm--four-tenths {
left: 40%;
}
.push--palm--three-fifths, .push--palm--six-tenths {
left: 60%;
}
.push--palm--four-fifths, .push--palm--eight-tenths {
left: 80%;
}
/**
* Sixths
*/
.push--palm--one-sixth, .push--palm--two-twelfths {
left: 16.666%;
}
.push--palm--five-sixths, .push--palm--ten-twelfths {
left: 83.333%;
}
/**
* Eighths
*/
.push--palm--one-eighth {
left: 12.5%;
}
.push--palm--three-eighths {
left: 37.5%;
}
.push--palm--five-eighths {
left: 62.5%;
}
.push--palm--seven-eighths {
left: 87.5%;
}
/**
* Tenths
*/
.push--palm--one-tenth {
left: 10%;
}
.push--palm--three-tenths {
left: 30%;
}
.push--palm--seven-tenths {
left: 70%;
}
.push--palm--nine-tenths {
left: 90%;
}
/**
* Twelfths
*/
.push--palm--one-twelfth {
left: 8.333%;
}
.push--palm--five-twelfths {
left: 41.666%;
}
.push--palm--seven-twelfths {
left: 58.333%;
}
.push--palm--eleven-twelfths {
left: 91.666%;
}
}
@media only screen and (min-width: 481px) {
/**
* Whole
*/
.push--tab--one-whole {
left: 100%;
}
/**
* Halves
*/
.push--tab--one-half, .push--tab--six-twelfths, .push--tab--five-tenths, .push--tab--four-eighths, .push--tab--three-sixths, .push--tab--two-quarters {
left: 50%;
}
/**
* Thirds
*/
.push--tab--one-third, .push--tab--four-twelfths, .push--tab--two-sixths {
left: 33.333%;
}
.push--tab--two-thirds, .push--tab--eight-twelfths, .push--tab--four-sixths {
left: 66.666%;
}
/**
* Quarters
*/
.push--tab--one-quarter, .push--tab--three-twelfths, .push--tab--two-eighths {
left: 25%;
}
.push--tab--three-quarters, .push--tab--nine-twelfths, .push--tab--six-eighths {
left: 75%;
}
/**
* Fifths
*/
.push--tab--one-fifth, .push--tab--two-tenths {
left: 20%;
}
.push--tab--two-fifths, .push--tab--four-tenths {
left: 40%;
}
.push--tab--three-fifths, .push--tab--six-tenths {
left: 60%;
}
.push--tab--four-fifths, .push--tab--eight-tenths {
left: 80%;
}
/**
* Sixths
*/
.push--tab--one-sixth, .push--tab--two-twelfths {
left: 16.666%;
}
.push--tab--five-sixths, .push--tab--ten-twelfths {
left: 83.333%;
}
/**
* Eighths
*/
.push--tab--one-eighth {
left: 12.5%;
}
.push--tab--three-eighths {
left: 37.5%;
}
.push--tab--five-eighths {
left: 62.5%;
}
.push--tab--seven-eighths {
left: 87.5%;
}
/**
* Tenths
*/
.push--tab--one-tenth {
left: 10%;
}
.push--tab--three-tenths {
left: 30%;
}
.push--tab--seven-tenths {
left: 70%;
}
.push--tab--nine-tenths {
left: 90%;
}
/**
* Twelfths
*/
.push--tab--one-twelfth {
left: 8.333%;
}
.push--tab--five-twelfths {
left: 41.666%;
}
.push--tab--seven-twelfths {
left: 58.333%;
}
.push--tab--eleven-twelfths {
left: 91.666%;
}
}
@media only screen and (min-width: 768px) {
/**
* Whole
*/
.push--lap--one-whole {
left: 100%;
}
/**
* Halves
*/
.push--lap--one-half, .push--lap--six-twelfths, .push--lap--five-tenths, .push--lap--four-eighths, .push--lap--three-sixths, .push--lap--two-quarters {
left: 50%;
}
/**
* Thirds
*/
.push--lap--one-third, .push--lap--four-twelfths, .push--lap--two-sixths {
left: 33.333%;
}
.push--lap--two-thirds, .push--lap--eight-twelfths, .push--lap--four-sixths {
left: 66.666%;
}
/**
* Quarters
*/
.push--lap--one-quarter, .push--lap--three-twelfths, .push--lap--two-eighths {
left: 25%;
}
.push--lap--three-quarters, .push--lap--nine-twelfths, .push--lap--six-eighths {
left: 75%;
}
/**
* Fifths
*/
.push--lap--one-fifth, .push--lap--two-tenths {
left: 20%;
}
.push--lap--two-fifths, .push--lap--four-tenths {
left: 40%;
}
.push--lap--three-fifths, .push--lap--six-tenths {
left: 60%;
}
.push--lap--four-fifths, .push--lap--eight-tenths {
left: 80%;
}
/**
* Sixths
*/
.push--lap--one-sixth, .push--lap--two-twelfths {
left: 16.666%;
}
.push--lap--five-sixths, .push--lap--ten-twelfths {
left: 83.333%;
}
/**
* Eighths
*/
.push--lap--one-eighth {
left: 12.5%;
}
.push--lap--three-eighths {
left: 37.5%;
}
.push--lap--five-eighths {
left: 62.5%;
}
.push--lap--seven-eighths {
left: 87.5%;
}
/**
* Tenths
*/
.push--lap--one-tenth {
left: 10%;
}
.push--lap--three-tenths {
left: 30%;
}
.push--lap--seven-tenths {
left: 70%;
}
.push--lap--nine-tenths {
left: 90%;
}
/**
* Twelfths
*/
.push--lap--one-twelfth {
left: 8.333%;
}
.push--lap--five-twelfths {
left: 41.666%;
}
.push--lap--seven-twelfths {
left: 58.333%;
}
.push--lap--eleven-twelfths {
left: 91.666%;
}
}
@media only screen and (max-width: 1023px) {
/**
* Whole
*/
.push--portable--one-whole {
left: 100%;
}
/**
* Halves
*/
.push--portable--one-half, .push--portable--six-twelfths, .push--portable--five-tenths, .push--portable--four-eighths, .push--portable--three-sixths, .push--portable--two-quarters {
left: 50%;
}
/**
* Thirds
*/
.push--portable--one-third, .push--portable--four-twelfths, .push--portable--two-sixths {
left: 33.333%;
}
.push--portable--two-thirds, .push--portable--eight-twelfths, .push--portable--four-sixths {
left: 66.666%;
}
/**
* Quarters
*/
.push--portable--one-quarter, .push--portable--three-twelfths, .push--portable--two-eighths {
left: 25%;
}
.push--portable--three-quarters, .push--portable--nine-twelfths, .push--portable--six-eighths {
left: 75%;
}
/**
* Fifths
*/
.push--portable--one-fifth, .push--portable--two-tenths {
left: 20%;
}
.push--portable--two-fifths, .push--portable--four-tenths {
left: 40%;
}
.push--portable--three-fifths, .push--portable--six-tenths {
left: 60%;
}
.push--portable--four-fifths, .push--portable--eight-tenths {
left: 80%;
}
/**
* Sixths
*/
.push--portable--one-sixth, .push--portable--two-twelfths {
left: 16.666%;
}
.push--portable--five-sixths, .push--portable--ten-twelfths {
left: 83.333%;
}
/**
* Eighths
*/
.push--portable--one-eighth {
left: 12.5%;
}
.push--portable--three-eighths {
left: 37.5%;
}
.push--portable--five-eighths {
left: 62.5%;
}
.push--portable--seven-eighths {
left: 87.5%;
}
/**
* Tenths
*/
.push--portable--one-tenth {
left: 10%;
}
.push--portable--three-tenths {
left: 30%;
}
.push--portable--seven-tenths {
left: 70%;
}
.push--portable--nine-tenths {
left: 90%;
}
/**
* Twelfths
*/
.push--portable--one-twelfth {
left: 8.333%;
}
.push--portable--five-twelfths {
left: 41.666%;
}
.push--portable--seven-twelfths {
left: 58.333%;
}
.push--portable--eleven-twelfths {
left: 91.666%;
}
}
@media only screen and (min-width: 1024px) {
/**
* Whole
*/
.push--desk--one-whole {
left: 100%;
}
/**
* Halves
*/
.push--desk--one-half, .push--desk--six-twelfths, .push--desk--five-tenths, .push--desk--four-eighths, .push--desk--three-sixths, .push--desk--two-quarters {
left: 50%;
}
/**
* Thirds
*/
.push--desk--one-third, .push--desk--four-twelfths, .push--desk--two-sixths {
left: 33.333%;
}
.push--desk--two-thirds, .push--desk--eight-twelfths, .push--desk--four-sixths {
left: 66.666%;
}
/**
* Quarters
*/
.push--desk--one-quarter, .push--desk--three-twelfths, .push--desk--two-eighths {
left: 25%;
}
.push--desk--three-quarters, .push--desk--nine-twelfths, .push--desk--six-eighths {
left: 75%;
}
/**
* Fifths
*/
.push--desk--one-fifth, .push--desk--two-tenths {
left: 20%;
}
.push--desk--two-fifths, .push--desk--four-tenths {
left: 40%;
}
.push--desk--three-fifths, .push--desk--six-tenths {
left: 60%;
}
.push--desk--four-fifths, .push--desk--eight-tenths {
left: 80%;
}
/**
* Sixths
*/
.push--desk--one-sixth, .push--desk--two-twelfths {
left: 16.666%;
}
.push--desk--five-sixths, .push--desk--ten-twelfths {
left: 83.333%;
}
/**
* Eighths
*/
.push--desk--one-eighth {
left: 12.5%;
}
.push--desk--three-eighths {
left: 37.5%;
}
.push--desk--five-eighths {
left: 62.5%;
}
.push--desk--seven-eighths {
left: 87.5%;
}
/**
* Tenths
*/
.push--desk--one-tenth {
left: 10%;
}
.push--desk--three-tenths {
left: 30%;
}
.push--desk--seven-tenths {
left: 70%;
}
.push--desk--nine-tenths {
left: 90%;
}
/**
* Twelfths
*/
.push--desk--one-twelfth {
left: 8.333%;
}
.push--desk--five-twelfths {
left: 41.666%;
}
.push--desk--seven-twelfths {
left: 58.333%;
}
.push--desk--eleven-twelfths {
left: 91.666%;
}
}
/*------------------------------------*\
$PULL
\*------------------------------------*/
/**
* Pull classes, to move grid items back to the left by certain amounts.
*/
/**
* Not a particularly great selector, but the DRYest way to do things.
*/
[class*=pull--] {
position: relative;
}
/**
* Whole
*/
.pull--one-whole {
right: 100%;
}
/**
* Halves
*/
.pull--one-half, .pull--six-twelfths, .pull--five-tenths, .pull--four-eighths, .pull--three-sixths, .pull--two-quarters {
right: 50%;
}
/**
* Thirds
*/
.pull--one-third, .pull--four-twelfths, .pull--two-sixths {
right: 33.333%;
}
.pull--two-thirds, .pull--eight-twelfths, .pull--four-sixths {
right: 66.666%;
}
/**
* Quarters
*/
.pull--one-quarter, .pull--three-twelfths, .pull--two-eighths {
right: 25%;
}
.pull--three-quarters, .pull--nine-twelfths, .pull--six-eighths {
right: 75%;
}
/**
* Fifths
*/
.pull--one-fifth, .pull--two-tenths {
right: 20%;
}
.pull--two-fifths, .pull--four-tenths {
right: 40%;
}
.pull--three-fifths, .pull--six-tenths {
right: 60%;
}
.pull--four-fifths, .pull--eight-tenths {
right: 80%;
}
/**
* Sixths
*/
.pull--one-sixth, .pull--two-twelfths {
right: 16.666%;
}
.pull--five-sixths, .pull--ten-twelfths {
right: 83.333%;
}
/**
* Eighths
*/
.pull--one-eighth {
right: 12.5%;
}
.pull--three-eighths {
right: 37.5%;
}
.pull--five-eighths {
right: 62.5%;
}
.pull--seven-eighths {
right: 87.5%;
}
/**
* Tenths
*/
.pull--one-tenth {
right: 10%;
}
.pull--three-tenths {
right: 30%;
}
.pull--seven-tenths {
right: 70%;
}
.pull--nine-tenths {
right: 90%;
}
/**
* Twelfths
*/
.pull--one-twelfth {
right: 8.333%;
}
.pull--five-twelfths {
right: 41.666%;
}
.pull--seven-twelfths {
right: 58.333%;
}
.pull--eleven-twelfths {
right: 91.666%;
}
@media only screen and (max-width: 480px) {
/**
* Whole
*/
.pull--palm--one-whole {
right: 100%;
}
/**
* Halves
*/
.pull--palm--one-half, .pull--palm--six-twelfths, .pull--palm--five-tenths, .pull--palm--four-eighths, .pull--palm--three-sixths, .pull--palm--two-quarters {
right: 50%;
}
/**
* Thirds
*/
.pull--palm--one-third, .pull--palm--four-twelfths, .pull--palm--two-sixths {
right: 33.333%;
}
.pull--palm--two-thirds, .pull--palm--eight-twelfths, .pull--palm--four-sixths {
right: 66.666%;
}
/**
* Quarters
*/
.pull--palm--one-quarter, .pull--palm--three-twelfths, .pull--palm--two-eighths {
right: 25%;
}
.pull--palm--three-quarters, .pull--palm--nine-twelfths, .pull--palm--six-eighths {
right: 75%;
}
/**
* Fifths
*/
.pull--palm--one-fifth, .pull--palm--two-tenths {
right: 20%;
}
.pull--palm--two-fifths, .pull--palm--four-tenths {
right: 40%;
}
.pull--palm--three-fifths, .pull--palm--six-tenths {
right: 60%;
}
.pull--palm--four-fifths, .pull--palm--eight-tenths {
right: 80%;
}
/**
* Sixths
*/
.pull--palm--one-sixth, .pull--palm--two-twelfths {
right: 16.666%;
}
.pull--palm--five-sixths, .pull--palm--ten-twelfths {
right: 83.333%;
}
/**
* Eighths
*/
.pull--palm--one-eighth {
right: 12.5%;
}
.pull--palm--three-eighths {
right: 37.5%;
}
.pull--palm--five-eighths {
right: 62.5%;
}
.pull--palm--seven-eighths {
right: 87.5%;
}
/**
* Tenths
*/
.pull--palm--one-tenth {
right: 10%;
}
.pull--palm--three-tenths {
right: 30%;
}
.pull--palm--seven-tenths {
right: 70%;
}
.pull--palm--nine-tenths {
right: 90%;
}
/**
* Twelfths
*/
.pull--palm--one-twelfth {
right: 8.333%;
}
.pull--palm--five-twelfths {
right: 41.666%;
}
.pull--palm--seven-twelfths {
right: 58.333%;
}
.pull--palm--eleven-twelfths {
right: 91.666%;
}
}
@media only screen and (min-width: 481px) {
/**
* Whole
*/
.pull--tab--one-whole {
right: 100%;
}
/**
* Halves
*/
.pull--tab--one-half, .pull--tab--six-twelfths, .pull--tab--five-tenths, .pull--tab--four-eighths, .pull--tab--three-sixths, .pull--tab--two-quarters {
right: 50%;
}
/**
* Thirds
*/
.pull--tab--one-third, .pull--tab--four-twelfths, .pull--tab--two-sixths {
right: 33.333%;
}
.pull--tab--two-thirds, .pull--tab--eight-twelfths, .pull--tab--four-sixths {
right: 66.666%;
}
/**
* Quarters
*/
.pull--tab--one-quarter, .pull--tab--three-twelfths, .pull--tab--two-eighths {
right: 25%;
}
.pull--tab--three-quarters, .pull--tab--nine-twelfths, .pull--tab--six-eighths {
right: 75%;
}
/**
* Fifths
*/
.pull--tab--one-fifth, .pull--tab--two-tenths {
right: 20%;
}
.pull--tab--two-fifths, .pull--tab--four-tenths {
right: 40%;
}
.pull--tab--three-fifths, .pull--tab--six-tenths {
right: 60%;
}
.pull--tab--four-fifths, .pull--tab--eight-tenths {
right: 80%;
}
/**
* Sixths
*/
.pull--tab--one-sixth, .pull--tab--two-twelfths {
right: 16.666%;
}
.pull--tab--five-sixths, .pull--tab--ten-twelfths {
right: 83.333%;
}
/**
* Eighths
*/
.pull--tab--one-eighth {
right: 12.5%;
}
.pull--tab--three-eighths {
right: 37.5%;
}
.pull--tab--five-eighths {
right: 62.5%;
}
.pull--tab--seven-eighths {
right: 87.5%;
}
/**
* Tenths
*/
.pull--tab--one-tenth {
right: 10%;
}
.pull--tab--three-tenths {
right: 30%;
}
.pull--tab--seven-tenths {
right: 70%;
}
.pull--tab--nine-tenths {
right: 90%;
}
/**
* Twelfths
*/
.pull--tab--one-twelfth {
right: 8.333%;
}
.pull--tab--five-twelfths {
right: 41.666%;
}
.pull--tab--seven-twelfths {
right: 58.333%;
}
.pull--tab--eleven-twelfths {
right: 91.666%;
}
}
@media only screen and (min-width: 768px) {
/**
* Whole
*/
.pull--lap--one-whole {
right: 100%;
}
/**
* Halves
*/
.pull--lap--one-half, .pull--lap--six-twelfths, .pull--lap--five-tenths, .pull--lap--four-eighths, .pull--lap--three-sixths, .pull--lap--two-quarters {
right: 50%;
}
/**
* Thirds
*/
.pull--lap--one-third, .pull--lap--four-twelfths, .pull--lap--two-sixths {
right: 33.333%;
}
.pull--lap--two-thirds, .pull--lap--eight-twelfths, .pull--lap--four-sixths {
right: 66.666%;
}
/**
* Quarters
*/
.pull--lap--one-quarter, .pull--lap--three-twelfths, .pull--lap--two-eighths {
right: 25%;
}
.pull--lap--three-quarters, .pull--lap--nine-twelfths, .pull--lap--six-eighths {
right: 75%;
}
/**
* Fifths
*/
.pull--lap--one-fifth, .pull--lap--two-tenths {
right: 20%;
}
.pull--lap--two-fifths, .pull--lap--four-tenths {
right: 40%;
}
.pull--lap--three-fifths, .pull--lap--six-tenths {
right: 60%;
}
.pull--lap--four-fifths, .pull--lap--eight-tenths {
right: 80%;
}
/**
* Sixths
*/
.pull--lap--one-sixth, .pull--lap--two-twelfths {
right: 16.666%;
}
.pull--lap--five-sixths, .pull--lap--ten-twelfths {
right: 83.333%;
}
/**
* Eighths
*/
.pull--lap--one-eighth {
right: 12.5%;
}
.pull--lap--three-eighths {
right: 37.5%;
}
.pull--lap--five-eighths {
right: 62.5%;
}
.pull--lap--seven-eighths {
right: 87.5%;
}
/**
* Tenths
*/
.pull--lap--one-tenth {
right: 10%;
}
.pull--lap--three-tenths {
right: 30%;
}
.pull--lap--seven-tenths {
right: 70%;
}
.pull--lap--nine-tenths {
right: 90%;
}
/**
* Twelfths
*/
.pull--lap--one-twelfth {
right: 8.333%;
}
.pull--lap--five-twelfths {
right: 41.666%;
}
.pull--lap--seven-twelfths {
right: 58.333%;
}
.pull--lap--eleven-twelfths {
right: 91.666%;
}
}
@media only screen and (max-width: 1023px) {
/**
* Whole
*/
.pull--portable--one-whole {
right: 100%;
}
/**
* Halves
*/
.pull--portable--one-half, .pull--portable--six-twelfths, .pull--portable--five-tenths, .pull--portable--four-eighths, .pull--portable--three-sixths, .pull--portable--two-quarters {
right: 50%;
}
/**
* Thirds
*/
.pull--portable--one-third, .pull--portable--four-twelfths, .pull--portable--two-sixths {
right: 33.333%;
}
.pull--portable--two-thirds, .pull--portable--eight-twelfths, .pull--portable--four-sixths {
right: 66.666%;
}
/**
* Quarters
*/
.pull--portable--one-quarter, .pull--portable--three-twelfths, .pull--portable--two-eighths {
right: 25%;
}
.pull--portable--three-quarters, .pull--portable--nine-twelfths, .pull--portable--six-eighths {
right: 75%;
}
/**
* Fifths
*/
.pull--portable--one-fifth, .pull--portable--two-tenths {
right: 20%;
}
.pull--portable--two-fifths, .pull--portable--four-tenths {
right: 40%;
}
.pull--portable--three-fifths, .pull--portable--six-tenths {
right: 60%;
}
.pull--portable--four-fifths, .pull--portable--eight-tenths {
right: 80%;
}
/**
* Sixths
*/
.pull--portable--one-sixth, .pull--portable--two-twelfths {
right: 16.666%;
}
.pull--portable--five-sixths, .pull--portable--ten-twelfths {
right: 83.333%;
}
/**
* Eighths
*/
.pull--portable--one-eighth {
right: 12.5%;
}
.pull--portable--three-eighths {
right: 37.5%;
}
.pull--portable--five-eighths {
right: 62.5%;
}
.pull--portable--seven-eighths {
right: 87.5%;
}
/**
* Tenths
*/
.pull--portable--one-tenth {
right: 10%;
}
.pull--portable--three-tenths {
right: 30%;
}
.pull--portable--seven-tenths {
right: 70%;
}
.pull--portable--nine-tenths {
right: 90%;
}
/**
* Twelfths
*/
.pull--portable--one-twelfth {
right: 8.333%;
}
.pull--portable--five-twelfths {
right: 41.666%;
}
.pull--portable--seven-twelfths {
right: 58.333%;
}
.pull--portable--eleven-twelfths {
right: 91.666%;
}
}
@media only screen and (min-width: 1024px) {
/**
* Whole
*/
.pull--desk--one-whole {
right: 100%;
}
/**
* Halves
*/
.pull--desk--one-half, .pull--desk--six-twelfths, .pull--desk--five-tenths, .pull--desk--four-eighths, .pull--desk--three-sixths, .pull--desk--two-quarters {
right: 50%;
}
/**
* Thirds
*/
.pull--desk--one-third, .pull--desk--four-twelfths, .pull--desk--two-sixths {
right: 33.333%;
}
.pull--desk--two-thirds, .pull--desk--eight-twelfths, .pull--desk--four-sixths {
right: 66.666%;
}
/**
* Quarters
*/
.pull--desk--one-quarter, .pull--desk--three-twelfths, .pull--desk--two-eighths {
right: 25%;
}
.pull--desk--three-quarters, .pull--desk--nine-twelfths, .pull--desk--six-eighths {
right: 75%;
}
/**
* Fifths
*/
.pull--desk--one-fifth, .pull--desk--two-tenths {
right: 20%;
}
.pull--desk--two-fifths, .pull--desk--four-tenths {
right: 40%;
}
.pull--desk--three-fifths, .pull--desk--six-tenths {
right: 60%;
}
.pull--desk--four-fifths, .pull--desk--eight-tenths {
right: 80%;
}
/**
* Sixths
*/
.pull--desk--one-sixth, .pull--desk--two-twelfths {
right: 16.666%;
}
.pull--desk--five-sixths, .pull--desk--ten-twelfths {
right: 83.333%;
}
/**
* Eighths
*/
.pull--desk--one-eighth {
right: 12.5%;
}
.pull--desk--three-eighths {
right: 37.5%;
}
.pull--desk--five-eighths {
right: 62.5%;
}
.pull--desk--seven-eighths {
right: 87.5%;
}
/**
* Tenths
*/
.pull--desk--one-tenth {
right: 10%;
}
.pull--desk--three-tenths {
right: 30%;
}
.pull--desk--seven-tenths {
right: 70%;
}
.pull--desk--nine-tenths {
right: 90%;
}
/**
* Twelfths
*/
.pull--desk--one-twelfth {
right: 8.333%;
}
.pull--desk--five-twelfths {
right: 41.666%;
}
.pull--desk--seven-twelfths {
right: 58.333%;
}
.pull--desk--eleven-twelfths {
right: 91.666%;
}
}
/*# sourceMappingURL=csswizardry-grids.css.map */
/*
COLORS
*/
/*
Strawberry
*/
/*
Inputs
*/
/*
New identity colors
*/
/*
Fonts
*/
/*
Link Text
*/
/*
Backgrounds
*/
/* Buttons */
/* Search Buttons */
/* NCC Buttons */
/*
Other
*/
/*
Breakpoints
*/
/*
Mixins
*/
/*
Extended Classes
*/
.form-step__contact-info, .form-step__summarize, .form-step__editable, .form-step__content, .form-step__header--light, .form-step__header, .form-step, .select__value, .textarea, .select, .input, .label-radio, .label-checkbox, .label--statement, .label, .page__panel, .page__wrapper {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/*
Easing animations
*/
.collapsable-mode {
overflow: hidden;
}
.collapsable-mode__content {
max-height: 0;
overflow: hidden;
transform: translateY(-100%);
transition: all 400ms ease-in-out 0s;
}
.collapsable-mode--expand .collapsable-mode__content {
max-height: 10000px;
transform: translateY(0);
}
html,
body {
font-size: 100%;
}
.page__wrapper {
margin: auto;
padding: 0 20px;
min-width: 320px;
max-width: 1280px;
}
.page__wrapper--mobile-extend {
padding: 0;
}
.page__contener {
margin: 0 auto;
padding: 0;
width: 100%;
max-width: 1280px;
min-width: 320px;
}
.page__body {
background: #fff;
margin-top: 30px;
padding: 0 10px;
}
.page__frame {
background: #fff;
margin-top: 30px;
padding: 30px 20px;
}
.page__panel {
position: relative;
display: block;
margin: 0 -20px;
}
#wizard {
padding-top: 60px;
}
body:not(.show-maintenance-mesage) .checkout-summary-page, body:not(.show-maintenance-mesage) .checkout-page, body:not(.show-maintenance-mesage) .my-page, body:not(.show-maintenance-mesage) .ff-campain-page-view, body:not(.show-maintenance-mesage) .ff-campain-page-view, body:not(.show-maintenance-mesage) .news-list, body:not(.show-maintenance-mesage) .conference-hotel, body:not(.show-maintenance-mesage) .campaign-page-container, body:not(.show-maintenance-mesage) .ff-error-page {
padding-top: 12px;
}
@media only screen and (min-width: 600px) {
body:not(.show-maintenance-mesage) .checkout-summary-page, body:not(.show-maintenance-mesage) .checkout-page, body:not(.show-maintenance-mesage) .my-page, body:not(.show-maintenance-mesage) .ff-campain-page-view, body:not(.show-maintenance-mesage) .ff-campain-page-view, body:not(.show-maintenance-mesage) .news-list, body:not(.show-maintenance-mesage) .conference-hotel, body:not(.show-maintenance-mesage) .campaign-page-container, body:not(.show-maintenance-mesage) .ff-error-page {
padding-top: 20px;
}
}
@media only screen and (min-width: 1024px) {
body:not(.show-maintenance-mesage) .checkout-summary-page, body:not(.show-maintenance-mesage) .checkout-page, body:not(.show-maintenance-mesage) .my-page, body:not(.show-maintenance-mesage) .ff-campain-page-view, body:not(.show-maintenance-mesage) .ff-campain-page-view, body:not(.show-maintenance-mesage) .news-list, body:not(.show-maintenance-mesage) .conference-hotel, body:not(.show-maintenance-mesage) .campaign-page-container, body:not(.show-maintenance-mesage) .ff-error-page {
padding-top: 52px;
}
}
@media only screen and (min-width: 481px) {
.page__panel {
margin: 0;
}
.page__panel--tab {
margin: 0 -20px;
}
}
@media only screen and (min-width: 768px) {
.page__panel {
margin: 0;
}
.page__panel--medium {
margin: 0 -20px;
}
}
@media only screen and (min-width: 1024px) {
.page__wrapper {
padding: 0 10px;
}
.page__panel--medium {
margin: 0;
}
.page__wrapper--mobile-extend {
padding: 0 10px;
}
}
@media only screen and (max-width: 480px) {
.show-on-palm {
display: block !important;
}
.hide-on-palm {
display: none !important;
}
.palm-only-50 {
width: 50%;
}
}
@media only screen {
.show-up-palm {
display: block !important;
}
}
@media only screen and (min-width:481px) and (max-width:767px) {
.show-on-tab {
display: block !important;
}
.hide-on-tab {
display: none !important;
}
.tab-only-50 {
width: 50%;
}
}
@media only screen and (min-width:481px) {
.show-up-tab {
display: block !important;
}
}
@media only screen and (min-width:0em) and (max-width:767px) {
.show-on-fablet {
display: block !important;
}
.hide-on-fablet {
display: none !important;
}
}
@media only screen and (min-width:0em) and (max-width:1023px) {
.show-on-portable {
display: block !important;
}
.hide-on-portable {
display: none !important;
}
}
@media only screen and (min-width:768px) and (max-width:1023px) {
.show-on-lap {
display: block !important;
}
.hide-on-lap {
display: none !important;
}
.lap-only-50 {
width: 50%;
}
}
@media only screen and (min-width:768px) {
.show-up-lap {
display: block !important;
}
.hide-up-lap {
display: none !important;
}
.lap-up-50 {
width: 50%;
}
}
@media only screen and (min-width:1024px) and (max-width:999999em) {
.show-on-desk {
display: block !important;
}
.hide-on-desk {
display: none !important;
}
}
@media only screen and (min-width:1024px) {
.show-up-desk {
display: block !important;
}
.hide-up-desk {
display: none !important;
}
.desk-up-50 {
width: 50%;
}
}
/* palm displays */
@media only screen {
.show-for-palm-only, .show-for-palm-up, .hide-for-lap-only, .hide-for-lap-up, .hide-for-desk-only, .hide-for-desk-up {
display: inherit !important;
}
.hide-for-palm-only, .hide-for-palm-up, .show-for-lap-only, .show-for-lap-up, .show-for-desk-only, .show-for-desk-up {
display: none !important;
}
.visible-for-palm-only, .visible-for-palm-up, .hidden-for-lap-only, .hidden-for-lap-up, .hidden-for-desk-only, .hidden-for-desk-up {
position: static !important;
height: auto;
width: auto;
overflow: visible;
clip: auto;
}
.hidden-for-palm-only, .hidden-for-palm-up, .visible-for-lap-only, .visible-for-lap-up, .visible-for-desk-only, .visible-for-desk-up {
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
}
/* lap displays */
@media only screen and (min-width:768px) {
.hide-for-palm-only, .show-for-palm-up, .show-for-lap-only, .show-for-lap-up, .hide-for-desk-only, .hide-for-desk-up {
display: inherit !important;
}
.show-for-palm-only, .hide-for-palm-up, .hide-for-lap-only, .hide-for-lap-up, .show-for-desk-only, .show-for-desk-up {
display: none !important;
}
.hidden-for-palm-only, .visible-for-palm-up, .visible-for-lap-only, .visible-for-lap-up, .hidden-for-desk-only, .hidden-for-desk-up {
position: static !important;
height: auto;
width: auto;
overflow: visible;
clip: auto;
}
.visible-for-palm-only, .hidden-for-palm-up, .hidden-for-lap-only, .hidden-for-lap-up, .visible-for-desk-only, .visible-for-desk-up {
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
}
/* desk displays */
@media only screen and (min-width:1024px) {
.hide-for-palm-only, .show-for-palm-up, .hide-for-lap-only, .show-for-lap-up, .show-for-desk-only, .show-for-desk-up {
display: inherit !important;
}
.show-for-palm-only, .hide-for-palm-up, .show-for-lap-only, .hide-for-lap-up, .hide-for-desk-only, .hide-for-desk-up {
display: none !important;
}
.hidden-for-palm-only, .visible-for-palm-up, .hidden-for-lap-only, .visible-for-lap-up, .visible-for-desk-only, .visible-for-desk-up {
position: static !important;
height: auto;
width: auto;
overflow: visible;
clip: auto;
}
.visible-for-palm-only, .hidden-for-palm-up, .visible-for-lap-only, .hidden-for-lap-up, .hidden-for-desk-only, .hidden-for-desk-up {
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
}
/* Orientation targeting */
.show-for-landscape,
.hide-for-portrait {
display: inherit !important;
}
.hide-for-landscape,
.show-for-portrait {
display: none !important;
}
/* Specific visibility for tables */
@media only screen and (orientation: landscape) {
.show-for-landscape,
.hide-for-portrait {
display: inherit !important;
}
.hide-for-landscape,
.show-for-portrait {
display: none !important;
}
/* Specific visibility for tables */
}
@media only screen and (orientation: portrait) {
.show-for-portrait,
.hide-for-landscape {
display: inherit !important;
}
.hide-for-portrait,
.show-for-landscape {
display: none !important;
}
/* Specific visibility for tables */
}
/* Touch-enabled device targeting */
.show-for-touch {
display: none !important;
}
.hide-for-touch {
display: inherit !important;
}
.touch .show-for-touch {
display: inherit !important;
}
.touch .hide-for-touch {
display: none !important;
}
/* Specific visibility for tables */
/*
Large
*/
@media only screen and (min-width: 1024px) {
.show-maintenance-mesage {
padding-top: 60px;
}
.show-maintenance-mesage.front-page {
padding-top: 60px;
}
.show-maintenance-mesage .intro-image {
margin-top: 0;
}
}
.ff-table-grid {
display: table;
}
.ff-table-row {
display: table-row;
}
.ff-table-cell {
display: table-cell;
vertical-align: middle;
}
.ff-table-cell-defoult {
display: table-cell;
}
.js-error {
display: none;
}
.main-error-message {
margin: 10px 0;
}
.ff-error {
position: relative;
margin-top: 2px;
padding: 10px;
background: #f1d8d6;
border: 1px solid #a10000;
color: #000;
font-size: 14px;
line-height: 1.2;
border-radius: 2px;
}
.ff-error .nch-icon-interjection {
position: absolute;
top: 10px;
left: 12px;
font-size: 16px;
padding: 1px;
border: 2px solid #a10000;
border-radius: 50%;
color: #a10000;
}
.ff-error .ff-error-message {
margin-left: 32px;
}
.ff-error p {
padding-left: 0.5rem;
margin: 0;
color: #000;
font-size: 16px;
font-weight: 500;
}
.ff-error--in-top {
margin: 0 0 20px 0;
}
.ff-error-separator {
margin: 10px 0;
}
.ff-error-hiden {
display: none;
}
.ff-error-visible {
display: block;
}
/*
Right alignet Error
*/
.text-right > .ff-error .ff-error-message {
text-align: left;
}
/*
Warning Style
*/
.warning.ff-error {
background: #fefbe5;
border: 1px solid #feeb72;
color: #002f3d;
}
.warning.ff-error .nch-icon-interjection {
border: 2px solid #efc75e;
color: #efc75e;
}
.warning.ff-error p {
color: #002f3d;
}
.notification {
display: none;
position: relative;
min-height: 40px;
margin: 2px 0 20px;
padding: 22px 30px 22px 16px;
line-height: 1.2;
font-size: 14px;
color: #000000;
background: #def8fb;
border-radius: 2px;
}
.notification.notification--visible {
display: block;
}
.notification-layer {
display: none;
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba(255, 255, 255, 0.5);
z-index: 1000;
}
.notification-layer--visible {
display: block;
}
.notification-layer + .notification {
z-index: 1000;
}
.notification .notification__icon {
position: absolute;
top: 27px;
left: 12px;
padding: 2px;
font-size: 18px;
border-width: 2px;
border-style: solid;
border-radius: 50%;
}
.notification .nch-icon-i {
border-color: #5adae9;
color: #5adae9;
}
.notification .nch-icon-selected {
border-color: #00AA50;
color: #00AA50;
}
.notification .nch-icon-selected:before {
position: relative;
top: -3px;
}
.notification .nch-icon-interjection {
font-size: 18px;
border-color: #F5C769;
color: #F5C769;
}
.notification .nch-icon-close-x {
position: absolute;
top: 12px;
right: 12px;
padding: 0;
text-decoration: none;
font-size: 16px;
color: #000000;
background: none;
border: 0 none;
}
.notification__message p {
color: #000000;
line-height: 24px;
font-size: 16px;
font-weight: 400;
}
.notification__message h4 {
font-family: StrawberrySansText;
font-weight: 700;
font-size: 20px;
line-height: 28px;
}
.notification__header {
margin-bottom: 10px;
word-wrap: break-word;
}
.notification__button {
max-width: 250px;
width: 100%;
display: block;
}
.notification .confirmation-info--button {
margin-top: 16px;
}
/*
Success Style
*/
.notification--success {
background: #F7F5F3;
}
.notification--success p {
color: #000000;
}
/*
Warning Style
*/
.notification--warning {
background: #FFF8D0;
border: 1px solid #FFDA3C;
}
.notification--warning p {
color: #002F3D;
}
@media only screen and (min-width: 1024px) {
.notification {
padding: 32px;
border-radius: 8px;
}
.notification .notification__icon {
top: 22px;
left: 22px;
border-width: 4px;
}
.notification .nch-icon-i {
margin: 0 20px 8px 0;
font-size: 32px;
padding: 0;
}
.notification .nch-icon-selected {
top: 20px;
height: 28px;
width: 28px;
font-size: 28px;
}
.notification .nch-icon-selected:before {
top: -10px;
left: -5px;
font-size: 34px;
}
.notification .nch-icon-interjection {
font-size: 28px;
}
.notification__header {
word-wrap: normal;
padding: 0 15px 0 0;
}
}
.maintenance-warning-message {
margin: 0;
width: 100%;
background: #F7F5F3;
padding: 15px 0;
position: relative;
color: #000;
line-height: 1.2;
z-index: 100;
border-top: 1px solid #D8D4D0;
border-bottom: 1px solid #D8D4D0;
}
.maintenance-warning-message .ff-message-icon {
padding: 0 0 0 10px;
width: 70px;
}
.maintenance-warning-message .icon-warning {
width: 34px;
height: 34px;
display: block;
border: 3px solid #efc75e;
border-radius: 100px;
color: #efc75e;
text-align: center;
}
.maintenance-warning-message .ff-close-icon {
width: 40px;
padding: 0 10px 0 0;
vertical-align: top;
position: relative;
overflow: hidden;
}
.maintenance-warning-message .ff-close-icon .nch-icon-close-x {
color: #000;
font-size: 18px;
text-decoration: none;
display: block;
margin: 3px 3px 3px 11px;
width: 18px;
}
.maintenance-warning-message .ff-close-icon .nch-icon-close-x:focus {
outline: none;
box-shadow: 0 0 0 3px #83bffc;
}
.maintenance-warning-message h1 {
display: inline;
padding: 0 20px 0 0;
}
.maintenance-warning-message p {
font-size: 14px;
line-height: 20px;
display: block;
color: #000;
}
.maintenance-warning-message li {
margin: 0 0 5px 0;
font-size: 14px;
}
.maintenance-warning-message .text-link--reverse {
display: inline-block;
}
.maintenance-warning-message .strawberry-warning {
display: flex;
width: 40px;
height: 40px;
border-radius: 40px;
background-color: #EF8E34;
align-items: center;
justify-content: center;
}
.maintenance-warning-message .strawberry-warning img {
width: 20px;
height: 20px;
}
.maintenance-warning-message span.h6 {
font-weight: 700;
font-size: 16px;
line-height: 24px;
}
.cookie-warning-message,
#upgradeMessage {
display: none;
}
@media only screen and (min-width: 1024px) {
body:not(.show-maintenance-mesage) .destination-page__content__wrapper {
padding-top: 38px;
}
.maintenance-warning-message p {
font-size: 16px;
line-height: 24px;
}
.maintenance-warning-message span.h6 {
font-size: 20px;
line-height: 28px;
}
}
@media only screen and (max-width: 481px) {
.ff-table-cell {
vertical-align: top;
}
}
.disabled {
opacity: 0.6 !important;
cursor: default !important;
}
.disabled.input-radio, .disabled.input-checkbox {
opacity: 0 !important;
}
/*
Label
*/
.label-radio, .label-checkbox, .label--statement, .label {
font-family: arial, helvetica, calibri, sans-serif;
font-size: 16px;
line-height: 1.5;
font-weight: 500;
color: #000;
margin-bottom: 6px;
}
.label {
display: block;
}
.label .require,
.label .nch-icon-info {
display: inline-block;
}
.label--second-line {
display: block;
font-size: 14px;
font-weight: 400;
}
.label--disable {
opacity: 0.5;
}
.link-in-label.text-link {
display: inline-block;
font-size: 16px;
line-height: 1.2;
}
/*
Input
*/
.textarea, .select, .input {
font-family: arial, helvetica, calibri, sans-serif;
font-size: 16px;
border: 1px solid #668C98;
border-radius: 2px;
color: #000;
background: #fff;
-webkit-text-fill-color: #000 !important;
}
.select, .input {
text-overflow: ellipsis;
white-space: nowrap;
}
.input {
display: block;
padding: 5px 10px 4px 10px;
min-height: 40px;
width: 100%;
overflow: hidden;
-webkit-appearance: none;
}
.input::-ms-clear {
display: none;
}
.input::-webkit-input-placeholder {
color: #668C98;
}
.input:-moz-placeholder { /* Firefox 18- */
color: #668C98;
}
.input::-moz-placeholder { /* Firefox 19+ */
color: #668C98;
}
.input:-ms-input-placeholder {
color: #668C98;
}
.input[type=number] {
-moz-appearance: textfield;
}
.input::-webkit-outer-spin-button, .input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
.input--half {
width: 50% !important;
}
.input--short {
width: 30% !important;
}
.input[readonly] {
background: #f9f9f9;
color: #808080;
-webkit-text-fill-color: #808080 !important;
border: 1px solid #bbb;
}
/*
Chrome autocomplete style
*/
input:-webkit-autofill:focus, textarea:-webkit-autofill:focus, select:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 4px #83bffc, 0 0 0px 1000px white inset;
box-shadow: 0 0 0 4px #83bffc, 0 0 0px 1000px white inset;
}
/*
Input Double
*/
.input-double {
position: relative;
}
.input-double__left {
width: 100%;
padding-right: 42px;
}
.input-double__right {
position: absolute;
top: 1px;
right: 1px;
width: 38px;
height: 38px;
padding: 8px 20px 4px 20px;
z-index: 2;
border-width: 1px;
border-radius: 0 2px 2px 0 !important;
border-left-color: #668C98;
}
.input-double__right .nch-icon-big-arrow-right {
position: absolute;
top: 3px;
left: 50%;
margin-left: -17px;
font-size: 33px;
}
.input-double__right .nch-icon-arrow-narrow-right {
position: absolute;
top: 7px;
left: 50%;
font-size: 22px;
margin-left: -10px;
}
/*
Input With Icon
*/
.input-with-icon--left,
.input-with-icon--right {
position: relative;
}
.input-with-icon--left [class^=nch-icon-],
.input-with-icon--left [class*=" nch-icon-"],
.input-with-icon--right [class^=nch-icon-],
.input-with-icon--right [class*=" nch-icon-"] {
position: absolute;
top: 0;
bottom: 0;
line-height: 40px;
}
.input-with-icon--left [class^=nch-icon-],
.input-with-icon--left [class*=" nch-icon-"] {
left: 4px;
}
.input-with-icon--left .input {
padding-left: 30px;
}
.input-with-icon--right [class^=nch-icon-] {
right: 4px;
}
.input-with-icon--right .input {
padding-right: 30px;
}
/*
select
*/
.select {
position: relative;
background: #fff;
padding: 0 10px;
font-size: 16px;
width: 100%;
overflow: visible;
min-height: 40px;
}
.select:before {
content: "";
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 28px;
background: #fff;
}
.select__hidden {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
min-height: 38px;
line-height: 38px;
font-size: 16px;
opacity: 0.0001;
background: #fff;
z-index: 2;
}
.select__hidden[disabled] + .select__value {
background: #f9f9f9;
color: #808080;
padding-left: 10px;
padding-right: 10px;
margin: 0 -10px;
-webkit-text-fill-color: #808080 !important;
}
.select__hidden[disabled] + .select__value + .nch-icon-arrow-narrow-down {
background: #f9f9f9;
color: #808080;
top: 0;
right: 0;
bottom: 0;
width: 28px;
line-height: 38px;
-webkit-text-fill-color: #808080 !important;
}
.select__value {
display: block;
width: 100%;
height: 38px;
padding-top: 8px;
padding-right: 25px;
padding-bottom: 6px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
line-height: 1.5;
}
.select .nch-icon-arrow-narrow-down {
font-size: 18px;
position: absolute;
top: 10px;
right: 10px;
color: #000;
}
.select.focus {
box-shadow: 0 0 0 4px #83bffc;
border-color: #222;
}
.select.masterCardReadOnly {
background: #f9f9f9;
color: #808080;
border-color: #bbb;
-webkit-text-fill-color: #808080 !important;
}
/*
Checkbox and radiobuttons
*/
.input-radio, .input-checkbox {
position: absolute;
opacity: 0.00001;
left: -99999px;
}
.input-radio:checked + .label-checkbox:after, .input-checkbox:checked + .label-checkbox:after, .input-radio:checked + .label-radio:after, .input-checkbox:checked + .label-radio:after {
display: block;
}
.input-radio:focus + .label-checkbox:before, .input-checkbox:focus + .label-checkbox:before, .input-radio:focus + .label-radio:before, .input-checkbox:focus + .label-radio:before {
box-shadow: 0 0 0 4px #83bffc;
border-color: #222;
}
.label-radio, .label-checkbox {
display: inline-block;
position: relative;
padding: 0 0 0 28px;
cursor: pointer;
}
.label-radio:before, .label-checkbox:before, .label-radio:after, .label-checkbox:after {
content: "";
position: absolute;
}
.label-radio:before, .label-checkbox:before {
width: 14px;
height: 14px;
border: 1px solid #668C98;
top: 0;
left: 0;
}
.label-radio:hover:before, .label-checkbox:hover:before {
border-color: #668C98;
}
.input-checkbox:before {
background: #fff;
}
.checkbox-expand:checked ~ .checkbox-expand-content {
display: block;
}
.checkbox-expand-content {
display: none;
margin-top: 14px;
}
.radio-inline {
display: inline-block;
margin-right: 30px;
}
.label-checkbox {
line-height: 28px;
padding-left: 30px;
}
.label-checkbox:after {
content: "";
width: 12px;
height: 12px;
top: 6px;
left: 4px;
background: #000;
border-radius: 2px;
display: none;
}
.label-checkbox:before {
background-color: #fff;
width: 20px;
height: 20px;
top: 2px;
border-radius: 2px;
box-sizing: border-box;
}
.label-checkbox--inverted {
color: #fff;
}
.label-checkbox--special {
padding: 20px 20px 20px 50px;
background: #EEFBFC;
}
.label-checkbox--special:after {
top: 26px;
left: 24px;
}
.label-checkbox--special:before {
top: 22px;
left: 20px;
}
.label-checkbox.strawberry-checkbox {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.label-checkbox.strawberry-checkbox:before {
width: 16px;
height: 16px;
border: 1px solid #000000;
border-radius: 4px;
}
.label-checkbox.strawberry-checkbox:after {
background: unset;
background-image: url("../../Images/strawberry-boxcheck.svg");
background-size: 100% 100%;
width: 16px;
height: 16px;
top: 2px;
left: 0px;
}
.label-checkbox.strawberry-checkbox a {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.label-checkbox.strawberry-checkbox.strawberry-checkbox-bold {
font-weight: 700;
}
.label-checkbox.strawberry-checkbox.strawberry-checkbox-bold a {
font-weight: 400;
}
.label-radio:before, .label-radio:after {
border-radius: 50%;
border-color: #668C98;
}
.label-radio:before {
top: -2px;
width: 20px;
height: 20px;
box-sizing: border-box;
}
.label-radio:after {
background: #000;
display: none;
width: 12px;
height: 12px;
top: 2px;
left: 4px;
}
/*
Textarea
*/
.textarea {
width: 100%;
height: 110px;
padding: 4px 10px;
display: block;
-webkit-appearance: none;
}
.textarea::-ms-clear {
display: none;
}
.textarea[readonly] {
background: #f9f9f9;
color: #808080;
-webkit-text-fill-color: #808080 !important;
border: 1px solid #bbb;
}
/*
Input with icon
*/
[class*=" input-icon--"],
[class^=input-icon--] {
position: relative;
}
[class*=" input-icon--"]:before, [class*=" input-icon--"]:after,
[class^=input-icon--]:before,
[class^=input-icon--]:after {
position: absolute;
top: 2px;
width: 25px;
height: 36px;
font-size: 18px;
line-height: 36px;
font-family: "nch-icons";
color: #222;
}
[class*=" input-icon--"]:before,
[class^=input-icon--]:before {
left: 5px;
}
[class*=" input-icon--"] .input,
[class^=input-icon--] .input {
padding-left: 30px;
}
.input-icon--dropdown {
background: #fff;
border-radius: 2px;
}
.input-icon--dropdown:after {
right: 5px;
content: "\e901";
background: #fff;
z-index: 0;
}
.input-icon--dropdown .input {
padding-right: 30px;
position: relative;
z-index: 2;
background: rgba(255, 255, 255, 0.1);
}
.input-icon--dropdown .input[type=text][readonly] {
background: #f9f9f9;
color: #808080;
}
.input-icon--search:before {
content: "\e610";
}
.input-icon--checkin:before {
content: "\e611";
}
.input-icon--guests:before {
content: "\e620";
}
.input-icon--hotel:before {
content: "\e63a";
}
.input-icon--place:before {
content: "\e635";
}
.input-icon-right .input {
padding-left: 10px;
}
/*
Required legend
*/
.required-legend {
color: #668C98;
font-size: 12px;
line-height: 1.6;
display: block;
padding: 10px 0 0;
}
.required[title] {
text-decoration: none;
border-bottom: 0 none;
}
/*
Veryfication Info
*/
.verification-info-message {
background: #4aada3;
color: #fff;
padding: 5px 10px;
border-radius: 4px;
margin: 10px 0;
font-size: 14px;
line-height: 2;
}
.verification-info-message p {
color: #fff;
margin: 0;
}
/*
Error State
*/
.is-error {
border: 1px solid #a10000;
}
.is-error + .label-radio:before, .is-error + .label-checkbox:before {
border-color: #a10000;
}
.form {
padding: 30px 10px;
}
.form__main-title {
display: block;
color: #000;
font-size: 30px;
line-height: 1.3;
padding: 0 0 10px 0;
margin: 0 0 30px 0;
border-bottom: 1px solid #BBBBBB;
}
.form__section-title {
display: block;
color: #000;
font-size: 24px;
line-height: 1.3;
font-weight: 400;
margin: 0 0 20px 0;
}
.form__section-title--underlined {
border-bottom: 1px solid #BBBBBB;
}
.form__section {
margin-bottom: 30px;
}
.form__row {
margin-bottom: 20px;
}
.form__row--separator {
margin-bottom: 20px;
padding-bottom: 8px;
border-bottom: 1px solid #BBBBBB;
}
.form__link {
display: block;
margin: 10px 0 5px;
}
.form__button-link {
display: inline-block;
line-height: 40px;
margin: 0 10px 0 0;
}
.form .h5 {
display: block;
margin: 5px 0;
}
.form__p {
font-size: 16px;
margin: 0 0 5px 0;
}
.form__hr {
margin-top: 10px;
margin-bottom: 15px;
border-color: #b9b9b9;
}
.form__captcha {
margin: 10px 0 20px 0;
}
.form__captcha .ff-error {
max-width: 300px;
}
input:focus, select:focus, textarea:focus {
outline: none;
box-shadow: 0 0 0 4px #83bffc;
border-color: #668C98;
}
input[type=button]:focus,
input[type=submit]:focus,
button:focus,
.btn:focus {
outline: none;
box-shadow: 0 0 0 4px #83bffc;
border-color: #fff;
}
@media only screen and (min-width:0em) and (max-width:767px) {
.fablet--form__row--space {
margin-bottom: 20px;
}
}
@media only screen and (min-width:0em) and (max-width:1023px) {
.portable--form__row--space {
margin-bottom: 20px;
}
}
@media only screen and (max-width: 481px) {
.palm--form__row--space {
margin-bottom: 20px;
}
}
@media only screen and (max-width: 480px) {
.form__captcha .g-recaptcha {
-webkit-transform: scale(0.8);
transform: scale(0.8);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
height: 65px;
}
}
.element-with-preloader .element-with-preloader__loader {
display: none;
}
.element-with-preloader.active {
position: relative;
}
.element-with-preloader.active .element-with-preloader__loader {
display: block;
overflow: hidden;
display: block;
white-space: nowrap;
height: 40px;
line-height: 40px;
position: absolute;
width: 100%;
z-index: 100;
border: 1px solid;
border-color: rgba(255, 255, 255, 0.5);
box-sizing: border-box;
}
.element-with-preloader.active .element-with-preloader__loader-content {
background: #fff;
overflow: hidden;
height: 38px;
text-overflow: ellipsis;
color: #c2c2c2;
}
.element-with-preloader.active .ff-loader {
display: inline-block;
margin: 0;
vertical-align: top;
height: 38px;
}
.element-with-preloader.active .ff-loader-small > div {
background-color: #c2c2c2;
}
#clubProfileRegistration .form-step__header,
#main-web-profile-form .form-step__header {
display: none;
}
.form-step {
margin: 10px 0 20px 0;
}
.form-step__header {
color: #000;
background: #F7F5F3;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding: 24px 32px;
border-radius: 8px;
font-weight: 700;
font-size: 20px;
line-height: 28px;
font-family: StrawberrySansText;
}
.form-step__header--light {
display: block;
width: 100%;
font-size: 26px;
font-weight: 500;
line-height: 1.2;
padding: 0 0 4px 0;
border-bottom: 1px solid #bbb;
}
.form-step__content {
padding: 15px 0;
margin-bottom: 20px;
}
.form-step__editable {
background: #fff;
padding: 0 10px;
margin: 0 0 20px 0;
}
.form-step__summarize {
padding: 20px;
border-bottom: 1px solid #cacaca;
margin-bottom: 20px;
}
.form-step__summarize span {
font-size: 16px;
}
.form-step__contact-info {
font-size: 16px;
line-height: 1.6;
}
.form-step__contact-info__label {
padding-right: 5px;
width: 120px;
}
.form-step__contact-info__data {
font-weight: 600;
}
.form-step h3.h5 span {
font-style: normal;
font-weight: 500;
font-size: 24px;
line-height: 32px;
letter-spacing: -0.02em;
}
.form-step.completed .form-step__header {
color: #000;
border-color: #004054;
}
.checkout-page section.form-step {
margin-top: 2rem;
border-top: 1px solid #D8D4D0;
padding-top: 32px;
}
.checkout-page section.form-step p {
font-weight: 400;
font-size: 0.875rem !important;
line-height: 1.25rem !important;
}
.checkout-page section.form-step h2 {
border-bottom: none;
font-family: StrawberrySansDisplay;
font-style: normal;
font-weight: 500;
font-size: 24px;
line-height: 32px;
letter-spacing: -0.02em;
}
.checkout-page section .btn {
width: 100%;
}
@media only screen and (min-width: 768px) {
.form-step__content {
padding: 30px 20px 10px;
}
}
@media only screen and (min-width: 481px) {
.checkout-page section.form-step {
text-align: center;
padding-top: 24px;
margin-top: 40px;
}
.checkout-page section.form-step h2 {
font-weight: 500;
font-size: 32px;
line-height: 40px;
}
}
@media only screen and (min-width: 1024px) {
.checkout-page .checkout-terms {
padding-top: 2rem;
}
}
/*
Clearfix with display: table
*/
.clearfix--table:before,
.clearfix--table:after {
content: " ";
display: table;
}
.clearfix--table:after {
clear: both;
}
.ff-social-media {
margin: 0;
padding: 0;
overflow: hidden;
}
.ff-social-media .ff-sm-icon {
display: block;
margin: 1px;
padding: 0;
width: 32px;
text-align: center;
text-decoration: none;
}
.ff-social-media [class^=nch-icon-], .ff-social-media [class*=" nch-icon-"] {
font-size: 24px;
}
.ff-sm-horisontal .ff-sm-icon {
float: left;
}
.ff-booking-code .input-double__left {
padding-right: 80px;
}
.ff-booking-code .input-double__right {
width: 80px;
margin-left: -80px;
}
/*# sourceMappingURL=GLOBAL-LAYOUT.css.map */
body {
background: #f2f2f2;
position: relative;
min-height: 100%;
}
/* Links */
a {
color: #746c43;
}
/* Quotes */
blockquote {
padding-left: 1em;
font-style: italic;
}
/* Dark HR */
hr.light {
border-color: #b4b4b4;
}
/* grid space */
.t-grid {
margin-bottom: 24px;
}
/*No-Bullets list-items*/
.noBullet {
list-style: none;
}
/* Default list */
ul.default {
list-style: none;
}
/* Link list */
ul.link-list {
list-style: none;
border-top: 1px solid #333;
}
ul.link-list li {
margin: 0;
}
ul.link-list li a {
display: block;
padding: 0 1em;
border-bottom: 1px solid #333;
}
ul.link-list li a:hover {
background: #eee;
}
ul.link-list li a:active {
background: #ccc;
}
/* Submenu */
ul.link-list ul {
list-style: none;
}
ul.link-list ul li a {
padding-left: 3em;
}
/* Definition list */
dl.datalist {
width: 100%;
}
dl.datalist dt {
font-weight: bold;
width: 30%;
clear: left;
float: left;
}
dl.datalist dd {
width: 70%;
float: left;
}
/* Tables */
table {
width: 100%;
empty-cells: hide;
}
col.colC {
width: 8em;
}
tr {
border-bottom: 1px solid #333;
}
th, td {
padding: 0.2em 1em;
text-align: left;
}
tr[valign=top] td, tr td[valign=top], tr th[valign=top] {
vertical-align: top;
}
tr[valign=middle] td, tr td[valign=middle], tr th[valign=middle] {
vertical-align: middle;
}
tr[valign=bottom] td, tr td[valign=bottom], tr th[valign=bottom] {
vertical-align: bottom;
}
tr[align=left] td, tr td[align=left], tr th[align=left] {
text-align: left;
}
tr[align=center] td, tr td[align=center], tr th[align=center] {
text-align: center;
}
tr[align=right] td, tr td[align=right], tr th[align=right] {
text-align: right;
}
table.mceItemTable {
table-layout: fixed;
}
table.mceItemTable tr td img {
max-width: 100%;
height: auto;
}
thead th {
/*border-bottom:1px solid #333;*/
padding: 0.4em 1em 0.2em;
}
thead th.table-head {
background-color: #fff;
}
tbody tr.odd th, tbody tr.odd td {
background: #dcdcdc;
}
tfoot th,
tfoot td {
/*border-top:2px solid #333;
background-color:#dcdcdc;*/
}
th.number,
td.number {
text-align: right;
min-width: 130px;
}
/* Forms */
form {
overflow: visible;
height: 100%;
}
fieldset {
position: relative;
/*background:#dcdcdc;*/
}
legend {
padding-left: 0.8em;
padding-right: 0.8em;
}
fieldset p label {
width: 98%;
}
fieldset p input {
width: 98%;
}
fieldset p select {
width: 99%;
}
fieldset.login p label {
float: left;
margin-right: 3%;
text-align: right;
width: 32%;
}
fieldset.login p input {
width: 60%;
}
fieldset.login input.button {
margin-left: 35%;
}
form p.notice {
font-weight: bold;
}
input.search.text {
width: 66%;
}
input.search.button {
width: 28%;
margin-left: 2%;
}
/* Tripadvisor */
.tr_top {
margin-bottom: 0px;
}
.tr_top h4 {
margin-bottom: 0px;
}
.tr_hr {
margin-top: 10px;
margin-bottom: 16px;
}
.tr_rate {
clear: left;
float: left;
height: 18px;
margin-bottom: 4px;
width: 82px;
}
.tr_ratinglabel {
float: left;
margin-left: 40px;
margin-top: -4px;
width: 100px;
}
.tr_post dl, .tr_post {
margin-bottom: 0px;
}
.tr_post a.button {
display: none;
margin-top: 20px;
}
.tr_previewtext {
display: none;
}
.tr_reviewcontent {
margin-bottom: 10px;
}
.tr_commentarrow {
height: 17px;
margin-left: 25px;
}
.tr_commentbody {
background-color: #282828;
color: #ffffff;
padding: 20px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.tr_commentbody h4 {
margin: 0;
}
.tr_commentbody h6 {
color: #fff !important;
margin-bottom: 15px;
font-weight: normal;
}
.tr_reviewcontent hr {
margin-top: 10px;
}
.tr_review_footer a.button {
float: left;
display: none;
}
ul.tr_pagination {
float: left;
margin-left: 30px;
list-style: none outside none;
}
ul.tr_pagination li {
width: 40px;
text-align: center;
color: #ffffff;
height: 32px;
padding-top: 8px;
float: left;
margin-left: 0px;
margin-top: 7px;
margin-bottom: 10px;
position: relative;
}
ul.tr_pagination li a {
text-decoration: none;
color: #fff;
}
ul.tr_pagination li.active {
width: 40px;
height: 37px;
text-align: center;
color: #ffffff;
padding-top: 17px;
margin-top: -4px;
background-color: #000000;
margin-bottom: 0;
}
ul.tr_pagination li.active img {
position: absolute;
top: 0;
left: -10px;
}
/* Articles */
article p.meta {
border-top: 1px solid #333;
border-bottom: 1px solid #333;
}
.text-center {
text-align: center;
}
/*Color*/
.color1 {
background-color: #6caba6;
}
.color2 {
background-color: #dcdcdc;
}
.color3 {
background-color: #b4b4b4;
}
.color4 {
background-color: #746c43;
}
.color5 {
background-color: #000;
}
.color6 {
background-color: #2e2e2e;
}
.context {
position: relative;
}
/*# sourceMappingURL=tinymce.css.map */
/*
COLORS
*/
/*
Strawberry
*/
/*
Inputs
*/
/*
New identity colors
*/
/*
Fonts
*/
/*
Link Text
*/
/*
Backgrounds
*/
/* Buttons */
/* Search Buttons */
/* NCC Buttons */
/*
Other
*/
/*
Breakpoints
*/
/*
Mixins
*/
/*
Extended Classes
*/
.footer-grid__item, .footer-logo, .footer-links, .footer__wrapper, #mainFooter {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.phone-lines-error__box, .our-hotels__independent .header__link {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/*
Easing animations
*/
.collapsable-mode {
overflow: hidden;
}
.collapsable-mode__content {
max-height: 0;
overflow: hidden;
transform: translateY(-100%);
transition: all 400ms ease-in-out 0s;
}
.collapsable-mode--expand .collapsable-mode__content {
max-height: 10000px;
transform: translateY(0);
}
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
nav ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
content: none;
}
a {
margin: 0;
padding: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
/* change colours to suit your needs */
ins {
background-color: #ff9;
color: #000;
text-decoration: none;
}
/* change colours to suit your needs */
mark {
background-color: #ff9;
color: #000;
font-style: italic;
font-weight: bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom: 1px dotted;
cursor: help;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* change border colour to suit your needs */
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #cccccc;
margin: 1em 0;
padding: 0;
}
input, select {
vertical-align: middle;
}
.clearfix:before, .clearfix:after {
content: " ";
display: block;
height: 0;
visibility: hidden;
}
.clearfix:after {
clear: both;
}
.clearfix {
zoom: 1;
}
/*
Chrome autocomplete style
*/
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 1000px white inset;
box-shadow: 0 0 0px 1000px white inset;
}
body {
font-size: 16px;
font-family: StrawberrySansText, arial, helvetica, calibri, sans-serif;
line-height: 1.5;
font-weight: 400;
color: #000;
position: relative;
background-color: #FFFFFF;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: none;
}
input, textarea {
font-size: 16px;
font-family: arial, helvetica, calibri, sans-serif;
line-height: 1.5;
color: #000;
resize: none;
}
hr {
border-style: solid;
border-width: 1px 0 0;
clear: both;
margin-top: 0;
border-color: #222222;
background-color: #FFFFFF;
color: #FFFFFF;
height: 0px; /*This causes 2px shadow in FF, 1px in Saf*/
}
/*
Headers
*/
.h1, h1,
.h2, h2,
.h3, h3,
.h4, h4,
.h5, h5,
.h6, h6 {
font-family: StrawberrySansDisplay, arial, helvetica, calibri, sans-serif;
color: #000;
font-weight: 600;
font-style: normal;
}
.h1, h1 {
font-size: 36px;
line-height: 1.35;
}
.h2, h2 {
font-size: 30px;
line-height: 42px;
}
.h3, h3 {
font-weight: 500;
font-size: 24px;
line-height: 32px;
}
.h4, h4 {
font-weight: 500;
font-size: 24px;
line-height: 32px;
}
.h5, h5 {
font-size: 18px;
line-height: 26px;
}
.h6, h6 {
font-size: 16px;
line-height: 24px;
}
.second-color {
color: #FFFFFF;
}
/*
Font Weight
*/
.regular-font-weight {
font-weight: 400 !important;
}
.medium-font-weight {
font-weight: 500 !important;
}
.bold-font-weight {
font-weight: 600 !important;
}
.ff-bold {
font-weight: 900;
}
/*
Subheaders
*/
.subheader {
color: #FFFFFF !important;
}
.small-header {
border-bottom: 1px solid #d3d3d3;
color: #148379;
font-size: 11px;
line-height: 1.4;
margin-bottom: 18px;
margin-top: 30px;
padding-bottom: 4px;
text-transform: uppercase;
color: #333;
}
/*
Base Paragraph
*/
p {
font-size: 16px;
font-weight: 400;
line-height: 1.5;
color: #000;
margin: 0 0 10px;
}
.second-paragraph {
color: #000;
}
.third-paragraph {
color: #000;
}
/*
Simple Paragraf
*/
.simple-p, .simple-i {
font-size: 14px;
line-height: 1.3;
color: #000;
margin-bottom: 10px;
}
.simple-p p, .simple-i p {
margin: 0;
}
.simple-i {
font-style: italic;
}
/*
Small Print
*/
.small, small {
font-size: 14px;
line-height: 1.45;
color: #000;
}
.second-small {
color: #222222;
}
.third-small {
color: #FFFFFF;
}
/*
Small 2x Print
*/
.small-2x {
font-size: 12px;
line-height: 1.5;
color: #000;
}
.second-small-2x {
color: #222222;
}
.third-small-2x {
color: #FFFFFF;
}
/*
Lists
*/
ul {
margin: 0;
padding: 0 0 0 20px;
list-style-type: disc;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
li {
display: list-item;
list-style: inherit;
}
ol {
margin: 0;
padding: 0 0 0 20px;
list-style-type: decimal;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/*
No bulet list
*/
.no-bullet-list, .no-bullet-list--line,
.ff-no-bullet-list-line, .no-bullet-list--ext,
.ff-no-bullet-list {
margin: 0;
padding: 0;
list-style: none;
font-size: 14px;
}
.no-bullet-list li, .no-bullet-list--line li,
.ff-no-bullet-list-line li, .no-bullet-list--ext li,
.ff-no-bullet-list li {
margin: 0;
padding: 6px 0;
line-height: 1.2;
}
.no-bullet-list:after, .no-bullet-list--line:after,
.ff-no-bullet-list-line:after, .no-bullet-list--ext:after,
.ff-no-bullet-list:after {
content: "";
display: table;
clear: both;
}
.no-bullet-list--ext li {
border-bottom: 1px solid #d3d3d3;
}
.no-bullet-list--ext li:last-child {
border: none;
}
.no-bullet-list--line li,
.ff-no-bullet-list-line li {
float: left;
margin-right: 30px;
}
.no-bullet-list--line li:last-child,
.ff-no-bullet-list-line li:last-child {
margin-right: 0;
}
/*
Links
*/
a {
font-size: 16px;
color: #000;
font-weight: 500;
text-decoration: underline;
}
a:hover, a:focus {
color: #5A0032;
}
.text-link, .text-link--color {
display: inline-block;
font-weight: 400;
font-size: 16px;
line-height: 24px;
color: #000;
cursor: pointer;
text-decoration: none;
}
.text-link:after, .text-link--color:after {
content: "";
display: block;
width: 100%;
height: 1px;
background: currentColor;
}
.text-link:hover, .text-link--color:hover, .text-link:focus, .text-link--color:focus {
text-decoration: none;
}
.text-link:hover:after, .text-link--color:hover:after, .text-link:focus:after, .text-link--color:focus:after {
background: currentColor;
}
.text-link--next-to-btn {
padding: 10px 10px 9px 10px;
}
.text-link--reverse {
color: #fff;
}
.text-link--reverse:hover, .text-link--reverse:focus {
color: #BDF0F6;
}
.text-link--color {
font-size: 16px;
}
@media only screen and (min-width:0em) and (max-width:1023px) {
.text-link, .text-link--color {
text-decoration: underline;
}
.text-link:after, .text-link--color:after {
display: none;
}
.text-link:hover, .text-link--color:hover, .text-link:focus, .text-link--color:focus {
text-decoration: underline;
}
.text-link--color {
text-decoration: none;
}
.text-link--color:after {
content: "";
display: block;
width: 100%;
height: 1px;
}
.text-link--color:hover, .text-link--color:focus {
text-decoration: none;
}
}
/*
Page Title
*/
.pageTitle {
font-size: 24px;
line-height: 1;
font-weight: 600;
color: #000;
display: block;
padding: 0 0 15px 0;
margin: 20px 0 30px 0;
border-bottom: 1px solid #d7d7d7;
}
.tinymce-box {
/*
Image inside paragraf added 12-08-2015 becouse of problem on NCC
http://swww.nordicchoicehotels.com/en/nordic-choice-club/earning-bonus-points/sokos/
*/
}
.tinymce-box p > img {
margin: 4px 4px 4px 0;
}
.push-left {
float: left !important;
}
.push-right {
float: right !important;
}
.float-left {
float: left;
}
.float-right {
float: right;
}
/*
Clear
*/
.clear-both {
clear: both !important;
}
.clear-right {
clear: right !important;
}
.clear-left {
clear: left !important;
}
.overflow {
overflow: hidden !important;
}
/*
Text style
*/
.text-right {
text-align: right !important;
}
.text-left {
text-align: left !important;
}
.text-center {
text-align: center !important;
}
.text-uppercase {
text-transform: uppercase !important;
}
.text-capitalize {
text-transform: capitalize;
}
.text-transform-none {
text-transform: none;
}
/*
Layout
*/
.visibility-hidden {
visibility: hidden !important;
}
.visibility-visible {
visibility: visible !important;
}
.indent-hide {
text-indent: -9999px;
display: block;
}
.block-hide {
position: absolute;
top: -9999px;
left: -9999px;
width: 1px;
height: 1px;
clip: rect(0, 0, 0, 0);
}
.display-none {
display: none !important;
}
.display-block {
display: block !important;
}
.width-100 {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
max-width: 100%;
display: block;
}
.width-50 {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 50%;
max-width: 50%;
display: block;
}
.display-hide {
display: none;
}
.no-margin {
margin: 0;
}
.no-padding {
padding: 0;
}
.ff-image-expand {
width: 100%;
max-width: 100%;
display: block;
margin: 0;
padding: 0;
}
/*
GS small margin
*/
.gs-margin-right {
margin-right: 10px;
}
.gs-margin-left {
margin-left: 10px;
}
/*
Position
*/
.position-relative {
position: relative;
}
@media only screen and (max-width: 1024px) {
.text-center-small-screen {
text-align: center !important;
}
}
.visually-hidden {
position: absolute;
left: -10000px;
top: auto;
width: 1px;
height: 1px;
overflow: hidden;
}
.ff-is-hidden, .is-hidden {
display: none;
}
.ff-is-visible, .is-visible {
display: block;
}
body.is-in-app {
margin-top: 0px !important;
}
body.is-in-app .search-bar {
top: 0px !important;
}
body {
margin-top: 3.25rem;
}
body.is-global-sticky-calendar:not(.show-maintenance-mesage):not(.is-in-app) {
padding-top: 80px;
}
body.show-maintenance-mesage:not(.is-in-app) {
padding-top: 1.75rem;
}
@media only screen and (min-width: 840px) {
body.is-global-sticky-calendar:not(.show-maintenance-mesage):not(.is-in-app) {
padding-top: 112px;
}
body.show-maintenance-mesage:not(.is-in-app) {
padding-top: 1.75rem;
}
}
@font-face {
font-family: Roboto;
src: url(../../font/roboto/roboto-regular.ttf);
}
@font-face {
font-family: SharpGroteskBold;
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://static.webprod.eberry.digital/fonts/SharpGroteskSmBold20-subset.woff2) format("woff2"), url(https://static.webprod.eberry.digital/fonts/SharpGroteskSmBold20-subset.zopfli.woff) format("woff");
}
@font-face {
font-family: StrawberrySansDisplay;
src: url("https://design-system.webprod.eberry.digital/fonts/StrawberrySansDisplay-Medium.woff2") format("woff2");
}
@font-face {
font-family: StrawberrySansText;
src: url("https://design-system.webprod.eberry.digital/fonts/StrawberrySansText-Regular.woff2") format("woff2");
}
@font-face {
font-family: StrawberrySansTextBold;
src: url("https://design-system.webprod.eberry.digital/fonts/StrawberrySansText-Bold.woff2") format("woff2");
}
@font-face {
font-family: StrawberrySansTextItalic;
src: url("https://design-system.webprod.eberry.digital/fonts/StrawberrySansText-RegularItalic.woff2") format("woff2");
}
@font-face {
font-family: StrawberrySansTextBoldItalic;
src: url("https://design-system.webprod.eberry.digital/fonts/StrawberrySansText-BoldItalic.woff2") format("woff2");
}
.header {
position: fixed;
height: 4.5rem;
top: 0;
left: 0;
right: 0;
z-index: 1001;
border-bottom: 1px solid #F7F5F3;
box-sizing: border-box;
transition: top 0.3s;
background: #FFFFFF;
font-family: StrawberrySansText;
}
.header li {
padding: 0;
}
.header a {
text-decoration: none;
}
.header a:focus {
outline: dotted 1px rgba(0, 0, 0, 0.85);
}
.header.scrolled-up {
top: -4.5rem;
transition: top 0.3s;
}
/*
Header navigation
*/
.search-bar.scrolled-up {
top: 0;
transition: top 0.3s;
}
.header__nav {
text-align: right;
margin: 0;
padding: 0;
}
.header__nav--element {
display: inline-block;
margin: 0;
}
.header__nav--element .ff-no-bullet-list li {
padding: 0;
}
.header-links__btn--close {
display: none;
}
.skip-links {
display: none;
}
#top-menu {
box-sizing: border-box;
height: 100%;
padding: 0 1rem;
display: flex;
justify-content: space-between;
}
#top-menu .restaurant-recommendation {
padding: 0.25rem 1rem 0.75rem 1rem;
}
#top-menu .restaurant-recommendation .restaurant-link {
transition: border-radius 0.4s ease;
display: flex;
gap: 0.75rem;
align-items: center;
text-decoration: none;
color: black;
padding: 1rem;
border: 1px solid #D8D4D0;
border-radius: 1rem;
background: #FFF;
position: relative;
}
#top-menu .restaurant-recommendation .restaurant-link.not-selectable {
pointer-events: none;
}
#top-menu .restaurant-recommendation .restaurant-link:focus-within,
#top-menu .restaurant-recommendation .restaurant-link .dismiss-button:active {
background-color: white !important;
}
#top-menu .restaurant-recommendation .restaurant-link:active {
background-color: #f7f5f3;
}
#top-menu .restaurant-recommendation .restaurant-link:focus {
outline: none;
background-color: #f7f5f3 !important;
}
#top-menu .restaurant-recommendation .restaurant-link:hover {
border-radius: 1.5rem;
cursor: pointer;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container {
display: flex;
flex: 1;
justify-content: space-between;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-info {
align-items: center;
display: flex;
gap: 0.75rem;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-info .restaurant-img {
border-radius: 1rem;
object-fit: cover;
width: 4.75rem;
height: 4.75rem;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-info .restaurant-content {
display: flex;
flex-direction: column;
gap: 0.375rem;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-info .restaurant-content .restaurant-content-info {
display: flex;
flex-direction: column;
gap: 0.25rem;
padding-left: 0;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-info .restaurant-content .restaurant-content-info .restaurant-title {
font-size: 1rem;
line-height: 1.5rem;
letter-spacing: -0.02em;
font-family: StrawberrySansTextBold;
word-break: break-word;
hyphens: auto;
white-space: normal;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-info .restaurant-content .restaurant-content-info .restaurant-body {
font-size: 0.875rem;
line-height: 1.25rem;
letter-spacing: -0.02em;
color: #403D3B;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-word;
hyphens: auto;
display: -webkit-box;
white-space: normal;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more {
display: flex;
align-items: center;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .dismiss-button {
border-radius: 6.25rem;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .dismiss-button:hover {
background-color: #f7f5f3;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .dismiss-button:active {
background-color: #d8d4d0 !important;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .dismiss-button:focus::after {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: white;
z-index: -1;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .more-button {
padding: 0.5rem 0 0.5rem 0.5rem;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .more-button .more-svg {
display: inline-flex;
background: transparent;
vertical-align: middle;
pointer-events: auto;
transition: background-color 200ms ease-in-out;
border-radius: 6.25rem;
margin-left: auto;
flex-shrink: 0;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .more-button:focus-visible {
border: 1px solid black;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .options-menu {
pointer-events: none;
position: absolute;
margin-top: 1rem;
right: 1rem;
box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.08);
border-radius: 1rem;
background-color: #FFF;
padding: 0.25rem;
width: 12.7rem;
max-height: 3rem;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .options-menu .options-menu-dismiss {
pointer-events: auto;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.4rem 0.75rem;
position: relative;
cursor: pointer;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .options-menu .options-menu-dismiss:hover {
border-radius: 0.75rem;
background-color: #F7F5F3;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .options-menu .options-menu-dismiss:active {
background-color: #EBE9E7 !important;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .options-menu .options-menu-dismiss:focus-visible {
border: 1px solid black;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .options-menu .options-menu-dismiss .remove {
margin: 0;
font-family: var(--strawberry-sans-text);
font-size: 1rem;
line-height: 1.5rem;
letter-spacing: -0.02em;
color: #C52924;
}
#top-menu .restaurant-recommendation .restaurant-link .restaurant-info-container .restaurant-more .options-menu .options-menu-dismiss .delete-svg {
display: inline-flex;
background: transparent;
vertical-align: middle;
}
#top-menu .profile-info-item {
display: flex;
align-items: center;
cursor: pointer;
gap: 0.5rem;
}
#top-menu .profile-info-item .hamburger-menu {
cursor: pointer;
}
#top-menu .profile-info-item .profile-item-menu {
cursor: pointer;
}
#top-menu .logo-container,
#top-menu .member-container {
width: 16rem;
}
#top-menu .strawberry-button {
border-radius: 0.75rem;
padding: 0.625rem 1.65rem;
font-size: 1rem;
height: 3rem;
font-family: StrawberrySansTextBold;
transition: border-radius 0.5s ease-in-out;
font-weight: 400 !important;
}
#top-menu .strawberry-button:hover {
border-radius: 1.6rem;
}
#top-menu .member-container {
display: flex;
justify-content: flex-end;
align-items: center;
}
#top-menu .top-container {
display: flex;
align-items: center;
position: relative;
padding-top: 1px;
}
#top-menu .top-container .top-menu-item a:not(.strawberry-button) {
padding: 0 1rem 0 1rem;
font-size: 0.875rem;
line-height: 20px;
color: #000;
}
#top-menu .top-container .top-menu-item a:not(.strawberry-button) span {
font-weight: 400;
}
#top-menu .top-container .top-menu-item a:not(.strawberry-button):hover {
outline: none;
background-color: #f7f5f3;
padding-top: 26px;
padding-bottom: 26px;
}
#top-menu .top-container .top-menu-item a:not(.strawberry-button):focus {
outline: none;
background-color: #f7f5f3;
padding-top: 26px;
padding-bottom: 26px;
}
#top-menu .top-container .top-menu-item a:not(.strawberry-button):active span {
font-weight: 700;
}
#top-menu .top-container .top-menu-item a span.footer-header-link__inside-selected {
font-weight: 700;
}
#top-menu .top-container .top-menu-item.more-items a {
font-family: StrawberrySansTextBold;
font-size: 0.85rem !important;
line-height: 1.5;
font-weight: 700;
padding-top: 0;
padding: 0 1rem 0 1rem;
}
#top-menu .top-container .top-menu-item.more-items a:hover {
outline: none;
background-color: #f7f5f3;
padding-top: 26px;
padding-bottom: 26px;
}
#top-menu .top-container .modal-content {
overflow-y: auto;
}
#top-menu .top-container .modal-content .top-links {
border-bottom: 1px solid #D8D4D0;
}
#top-menu .top-container .modal-content .top-desktop-links {
display: block;
}
#top-menu .top-container .modal-content .bottom-desktop-links {
display: block;
}
#top-menu .top-container .modal-content .top-mobile-links {
display: none;
}
#top-menu .top-container .modal-content .middle-mobile-links {
display: none;
}
#top-menu .top-container .modal-content .bottom-mobile-links {
display: none;
}
#top-menu .top-container .profile-menu {
opacity: 0; /* Initially hide the menu */
transition: opacity 0.2s ease; /* Transition opacity property */
right: 0;
}
#top-menu .top-container .profile-menu .modal-header {
border-bottom: 1px solid #D8D4D0;
min-height: 4.875rem;
}
#top-menu .top-container .profile-menu .modal-content {
margin-top: 5px;
}
#top-menu .top-container .profile-menu .modal-content-top {
border-bottom: 1px solid #D8D4D0;
}
#top-menu .top-container .profile-menu .top-menu-item-user {
padding: 1rem;
}
#top-menu .top-container .profile-menu .top-menu-item-user.not-selectable {
pointer-events: none;
}
#top-menu .top-container .profile-menu .modal-link {
height: 3.25rem;
padding: 0 0.475rem;
}
#top-menu .top-container .profile-menu .modal-link a {
font-size: 0.875rem;
padding-left: 0.4rem;
}
#top-menu .top-container .profile-menu .footer-header-link {
display: flex;
align-items: center;
height: 100%;
}
#top-menu .top-container .profile-menu .footer-header-link .footer-header-link__inside {
padding-left: 0.5rem;
font-weight: 400;
}
#top-menu .top-container .profile-menu .footer-header-link.not-selectable {
pointer-events: none;
}
#top-menu .top-container .profile-menu .footer-header-link:focus, #top-menu .top-container .profile-menu .footer-header-link:hover {
background: #f7f5f3;
color: #000;
border-radius: 0.5rem;
cursor: pointer;
}
#top-menu .top-container .profile-menu .footer-header-link:focus {
outline: none;
}
#top-menu .top-container .global-menu {
opacity: 0; /* Initially hide the menu */
transition: opacity 0.2s ease; /* Transition opacity property */
right: 0;
}
#top-menu .top-container .profile-bottom {
display: none;
}
#top-menu .top-container .bottom-links {
margin-top: 4px;
border-top: 1px solid #D8D4D0;
padding-bottom: 8px;
padding-top: 4px;
}
#top-menu .top-container .profile-menu.open {
opacity: 1;
}
#top-menu .top-container .global-menu.open {
opacity: 1;
}
#top-menu .top-container .global-menu .modal-header {
border-bottom: 1px solid #F7F5F3;
min-height: 4.5rem;
}
#top-menu .top-container .global-menu .modal-link {
border-bottom: 1px solid #F7F5F3;
min-height: 3.5rem;
padding: 0 0.5rem;
}
#top-menu .top-container .global-menu .modal-link a {
font-size: 1rem;
}
#top-menu .top-container .global-menu .footer-header-link {
display: flex;
align-items: center;
}
#top-menu .top-container .global-menu .footer-header-link .footer-header-link__inside {
padding-left: 0.5rem;
font-weight: 400;
}
#top-menu .top-container img.logo {
padding-top: 0.45rem;
}
#top-menu .top-menu-item-user {
display: flex;
align-items: center;
gap: 0.5rem;
}
#top-menu .profile-info.top-menu-item-user {
cursor: pointer;
}
#top-menu .profile-info.top-menu-item-user:focus-within, #top-menu .profile-info.top-menu-item-user:hover {
background-color: #F7F5F3;
border-top-left-radius: 1rem;
border-top-right-radius: 1rem;
}
#top-menu .top-menu-item-user .sign-up {
margin-right: 2rem;
}
#top-menu .modal-header .user-circle {
width: 2.625rem;
height: 2.6125rem;
}
#top-menu .top-nav-profile .profile-info-item .user-circle {
width: 2.125rem;
min-width: 2.125rem;
height: 2.125rem;
}
#top-menu .top-menu-item-menu {
display: none;
}
#top-menu .profile-item-menu {
border: none;
height: 1.5rem;
background: #fff;
padding: 0;
}
#top-menu .profile-item-menu:focus {
outline: none !important;
box-shadow: none;
}
#top-menu .hamburger-menu {
border: none;
height: 1.5rem;
background: #fff;
padding: 0;
}
#top-menu .hamburger-menu:focus {
outline: none !important;
box-shadow: none;
}
#top-menu .user-circle {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 8px;
width: 2.75rem;
height: 2.75rem;
background: #F9D9D8;
border-radius: 100px;
cursor: pointer;
}
#top-menu .user-circle.blue {
background-color: #10495E !important;
}
#top-menu .user-circle.blue .user-circle-text {
color: white !important;
}
#top-menu .user-circle.silver {
background-color: #999999 !important;
color: black;
}
#top-menu .user-circle.silver .user-circle-text {
color: black !important;
}
#top-menu .user-circle.gold {
background-color: #BDAD5E !important;
color: black;
}
#top-menu .user-circle.gold .user-circle-text {
color: black !important;
}
#top-menu .user-circle.platinum {
background-color: #58544D !important;
}
#top-menu .user-circle.platinum .user-circle-text {
color: white !important;
}
#top-menu .user-circle .user-circle-text {
width: 17px;
height: 20px;
font-style: normal;
font-weight: 700;
font-size: 0.875rem;
line-height: 20px;
color: #5A0032;
}
#top-menu .top-nav-profile {
border: solid 1px #D8D4D0;
border-radius: 6.25rem;
padding: 0.25rem 0.375rem;
}
#top-menu .top-nav-profile:hover, #top-menu .top-nav-profile:focus, #top-menu .top-nav-profile:focus-within {
background-color: #F7F5F3;
}
#top-menu .top-nav-profile:hover .profile-info-item .profile-chevron .profile-item-menu, #top-menu .top-nav-profile:focus .profile-info-item .profile-chevron .profile-item-menu, #top-menu .top-nav-profile:focus-within .profile-info-item .profile-chevron .profile-item-menu {
background-color: #F7F5F3;
}
#top-menu .points-info .header-user-name {
font-style: normal;
font-weight: 700;
font-size: 1rem;
line-height: 1.5rem;
color: #000000;
}
#top-menu .points-info .user-points {
font-family: StrawberrySansTextBold;
font-style: normal;
font-size: 0.75rem;
line-height: 1rem;
color: #000000;
letter-spacing: -0.02em;
white-space: nowrap;
}
#top-menu .points-info .user-points.spenn-font {
font-size: 0.875rem;
}
#top-menu .points-info .link-info {
font-style: normal;
font-size: 0.75rem;
line-height: 1rem;
color: #000000;
}
#top-menu .points-info .spenn {
background-image: url("../../Images/superdeals/Spenn.svg");
background-size: auto 0.8125rem;
background-repeat: no-repeat;
background-position: left center;
vertical-align: middle;
height: 0.8125rem;
width: 3.17375rem;
display: inline-block;
margin-left: 0.25rem;
}
#top-menu .profile-chevron {
display: flex;
padding-top: 3px;
padding-right: 0.438rem;
}
.modal-section {
color: #1A1A1A;
font-size: 1rem;
letter-spacing: 0;
line-height: 24px;
vertical-align: middle;
}
.modal-content .modal-user-name {
margin-top: 0px;
font-style: normal;
font-weight: 600;
font-size: 1rem;
line-height: 24px;
letter-spacing: -0.02em;
color: #000000;
}
.modal-header {
display: grid;
justify-content: space-between;
align-items: center;
}
.modal-header .modal-title {
font-family: StrawberrySansDisplay;
font-size: 1.25rem;
grid-column-start: 2;
margin: 0;
}
.modal-header .modal-close {
border: none;
background: #fff;
padding: 1rem;
margin-left: auto;
height: 3.5rem;
grid-column-start: 3;
}
.modal-header .modal-close:focus {
outline: none !important;
box-shadow: none;
}
.modal-header .user-circel {
height: 2.75rem;
width: 2.75rem;
}
.mobile-modal {
padding: 0 0;
}
.mobile-modal .modal-header {
display: none;
}
.mobile-modal .modal-footer {
padding: 1.5rem;
}
.mobile-modal .grid__item {
padding: 0 0;
}
.mobile-modal .user-circle {
margin-right: 0.37rem;
}
.mobile-modal .profile-info div:last-child {
margin-left: auto;
}
.modal-content-top {
font-family: StrawberrySansText;
}
.modal-content-top .modal-club-level {
background: #10495E;
border-radius: 1.5rem;
padding: 0.375rem 0.75rem;
font-style: normal;
font-size: 0.75rem;
font-weight: 700;
line-height: 1rem;
color: #FFFFFE;
display: inline-block;
}
.modal-content-top .modal-club-level.modal-club-level-blue {
background: #10495E;
text-transform: uppercase;
}
.modal-content-top .modal-club-level.modal-club-level-silver {
color: black;
background: #999999;
text-transform: uppercase;
}
.modal-content-top .modal-club-level.modal-club-level-gold {
color: black;
background: #BDAD5E;
text-transform: uppercase;
}
.modal-content-top .modal-club-level.modal-club-level-platinum {
background: #58544D;
text-transform: uppercase;
}
.modal-content-top .description-list {
display: grid;
grid-template-columns: 1fr 1fr;
}
.modal-content-top .description-list .description-list-item {
font-style: normal;
letter-spacing: -0.02em;
color: #000000;
}
.modal-content-top .description-list .description-list-item .description-list-key {
font-weight: 400;
font-size: 0.875rem;
line-height: 16px;
margin-top: 8px;
}
.modal-content-top .description-list .description-list-item .description-list-value {
font-weight: 600;
font-size: 1rem;
line-height: 24px;
margin-top: 8px;
}
.modal-footer {
padding: 1rem;
border-top: #D8D8D8;
border-style: solid;
border-top-width: 1px;
width: calc(100% - 3rem);
}
.modal-footer.modal-footer-no-border {
border-style: none;
}
.modal-footer .strawberry-button {
margin-top: 1rem;
}
.top-menu-item {
display: flex;
align-items: center;
height: 100%;
}
.top-menu-item.top-menu-item-wide {
min-width: 150px;
text-align: right;
}
.top-menu-item:not(.top-menu-item-user)::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
/*
Open links
*/
.header__link--open {
color: #1A1A1A;
display: inline-block;
margin: 0;
line-height: 38px;
min-width: 33px;
vertical-align: middle;
}
.header__link--open [class^=nch-icon-], .header__link--open [class*=" nch-icon-"], .header__link--open .nch-icon {
display: inline-block;
margin: 0 -5px 0 0;
}
.header__nav--element {
float: right;
}
.header__nav-mobile {
display: none;
}
.header__link--login .nch-icon-profile {
font-size: 1.5rem;
}
.on-active .header__link--login .nch-icon-profile {
font-size: 2rem;
}
.header__link--open:hover,
.header__link--open:focus,
.on-active .header__link--open {
color: #1A1A1A;
background-color: #FFFFFF;
}
.header__dropdown {
width: 22rem;
right: 0;
position: absolute;
background: #FFFFFE;
box-shadow: 0 0 0.25rem 0 rgba(0, 0, 0, 0.15);
border-radius: 1rem;
top: 4.4rem;
z-index: 2;
}
.header__dropdown-hidden {
width: 100%;
right: 0;
position: absolute;
top: 3.5rem;
height: 1rem;
}
.on-active .header__dropdown {
display: block;
}
.on-active .header__link--open [class^=nch-icon-], .on-active .header__link--open [class*=" nch-icon-"], .on-active .header__link--open .nch-icon {
position: relative;
top: -2px;
}
.on-active .header__link--open [class^=nch-icon-]:before, .on-active .header__link--open [class*=" nch-icon-"]:before, .on-active .header__link--open .nch-icon:before {
content: "\e63d";
}
/*
Header links style
*/
.header__link {
color: #1A1A1A;
font-size: 15px;
line-height: 2;
display: block;
margin: 1px;
}
.header__link:hover {
color: #1A1A1A;
}
.header__link [class^=nch-icon-], .header__link [class*=" nch-icon-"], .header__link .nch-icon {
font-size: 21px;
}
/*
Header Typography style
*/
.header__title {
display: block;
color: #1A1A1A;
font-size: 20px;
line-height: 1.2;
font-weight: 500;
margin: 20px 0 15px 0;
}
.header__text {
color: #1A1A1A;
font-size: 1rem;
margin-bottom: 10px;
}
.header__text .qualify-nights-ico {
color: #BDF0F6;
cursor: pointer;
}
.header__text--uppercase {
color: #1A1A1A;
font-size: 20px;
margin-bottom: 10px;
text-transform: uppercase;
display: block;
font-weight: 500;
}
.header__label {
color: #1A1A1A;
font-size: 1rem;
display: block;
margin-bottom: 5px;
}
.header__conf-nav {
display: none;
position: relative;
margin: 0 0 0 40px;
}
.header__conf-nav:before {
content: "";
position: absolute;
top: 15px;
left: 0;
height: 30px;
width: 0;
border-left: 1px solid #2A6775;
}
.header__conf-nav--element {
display: inline-block;
}
.register-profile .header__label {
padding-top: 30px;
}
.register-profile__icons-list {
color: #fff;
margin: 10px 0;
list-style: none;
padding: 0;
}
.register-profile__icons-list li {
margin: 0;
}
.register-profile__icon-item {
margin-bottom: 20px;
overflow: hidden;
}
.register-profile__icon,
.register-profile__icons-label {
float: left;
}
.register-profile__icons-label {
font-weight: 500;
line-height: 62px;
margin-left: 20px;
}
/*
Header dropdown
*/
.header__dropdown:before, .header__dropdown:after {
content: " ";
display: block;
height: 0;
visibility: hidden;
}
.header__dropdown:after {
clear: both;
}
.header__dropdown {
zoom: 1;
}
.header__dropdown {
display: none;
background: #FFFFFF;
text-align: left;
}
.header__dropdown .btn,
.header__dropdown .input {
border-radius: 2px;
}
.header__dropdown .btn-secondary {
margin-bottom: 20px;
border-radius: 2px;
border-color: #bbb;
font-size: 1rem;
line-height: 30px;
}
.header__dropdown .label-radio {
color: #1A1A1A;
margin: 9px 0 10px;
}
.header__dropdown .label-radio:after {
background-color: #1A1A1A;
}
.header__dropdown .label-radio:before {
border-color: #1A1A1A;
}
.header__dropdown .mobile-modal .modal-link {
/*padding: 0.75rem 0;*/
}
/*
veryfication info
*/
.verification-info {
color: #fff;
padding: 10px 0;
margin: 0;
}
.qualify-nights-modal a {
display: inline-block;
font-size: 0.875rem;
line-height: 1.5;
font-weight: 500;
color: #000;
cursor: pointer;
text-decoration: none;
}
.qualify-nights-modal a:after {
content: "";
display: block;
width: 100%;
height: 1px;
background: currentColor;
}
.qualify-nights-modal a:hover, .qualify-nights-modal a:focus {
color: #5A0032;
text-decoration: none;
}
.qualify-nights-modal a:hover:after, .qualify-nights-modal a:focus:after {
background: currentColor;
}
.qualify-nights-modal .reveal-modal__close:after {
display: none;
}
.bottom-nav {
box-sizing: border-box;
position: fixed;
height: calc(4.375rem + env(safe-area-inset-bottom));
border-top: 1px solid #F7F5F3;
background: #FFF;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 0 8.5rem calc(0.625rem + env(safe-area-inset-bottom, 0px)) 8.5rem;
transition: bottom 0.3s;
white-space: nowrap;
bottom: 0;
left: 0;
width: 100%;
z-index: 200;
}
.bottom-nav a {
text-decoration: none;
}
.bottom-nav .nav-items.nav-item-not-selected {
opacity: 0.6;
}
.bottom-nav .nav-items.nav-item-selected {
opacity: 1;
}
.bottom-nav.scrolled-up {
bottom: calc(-4.375rem - env(safe-area-inset-bottom));
transition: bottom 0.3s;
}
.bottom-nav .footer-header-link {
display: flex;
align-items: center;
flex-direction: column;
opacity: 0.7;
line-height: 0.875rem;
}
.bottom-nav .footer-header-link__inside {
font-size: 0.75rem;
color: #1A1918;
}
.bottom-nav .footer-header-link__inside-selected {
opacity: 1;
font-family: StrawberrySansTextBold;
color: black;
}
@media only screen and (min-width:0em) and (max-width:1023px) {
.qualify-nights-modal a {
text-decoration: underline;
}
.qualify-nights-modal a:after {
display: none;
}
.qualify-nights-modal a:hover, .qualify-nights-modal a:focus {
text-decoration: underline;
}
.header__link--open {
padding: 0 0.5rem 0;
}
}
.main-menu-image {
margin-bottom: -5px;
}
.signin-signup-separator {
padding-left: 8px;
padding-right: 8px;
}
@media only screen and (min-width:0em) and (max-width:767px) {
body {
margin-top: 52px;
}
body.is-global-sticky-calendar:not(.show-maintenance-mesage):not(.is-in-app) {
padding-top: 28px;
}
/*
Header navigation
*/
/*
Open links
*/
}
@media only screen and (min-width:0em) and (max-width:767px) and (min-width: 840px) {
body.is-global-sticky-calendar:not(.show-maintenance-mesage):not(.is-in-app) {
padding-top: 60px;
}
}
@media only screen and (min-width:0em) and (max-width:767px) {
.header__logo {
line-height: 60px;
height: 2.5rem;
width: 2.5rem;
}
.is-open {
margin-top: -60px;
width: 100%;
}
.header__link--customerService {
display: none;
}
.register-profile__icons-list {
display: none;
}
.top-bar {
height: 24px;
}
.top-bar-item {
margin-top: 0px;
}
.top-bar .top-bar-item.top-bar-right {
display: none;
}
.header__conf-nav--element {
display: none;
}
#top-menu .header__nav-mobile {
display: flex;
padding-left: 1.5rem;
}
body.disable-scroll {
overflow: hidden;
}
}
@media only screen and (max-width: 840px) {
#top-menu .strawberry-button {
border-radius: 0.5rem;
font-size: 0.875rem;
padding: 0.375rem 1.1rem;
height: 2.5rem;
}
}
@media only screen and (min-width: 601px) {
#top-menu .top-container img.logo-small {
display: none;
}
}
@media only screen and (max-width: 840px) {
.bottom-nav {
padding: 0 4.5rem calc(0.625rem + env(safe-area-inset-bottom, 0px)) 4.5rem;
}
}
@media only screen and (max-width: 600px) {
.bottom-nav {
padding: 0 1.25rem calc(0.625rem + env(safe-area-inset-bottom, 0px)) 1.25rem;
}
.header.scrolled-up {
top: -4rem;
}
.header {
height: 4rem;
}
#top-menu .top-container img.logo {
display: none;
}
#top-menu .top-container img.logo-small {
padding-top: 0.45rem;
}
#top-menu .top-menu-item-user .header-login-button {
height: 2.5rem;
}
#top-menu .top-container .global-menu .modal-header {
display: grid;
min-height: 4rem;
}
#top-menu .profile-menu .modal-header {
display: grid;
min-height: 4.875rem;
}
}
@media only screen and (max-width: 68.688rem) {
body.disable-scroll {
overflow: hidden;
}
#top-menu .points-info .user-points.spenn-font {
font-size: 0.75rem;
}
#top-menu .points-info .spenn {
background-image: url("../../Images/superdeals/SpennIcon.svg");
background-size: auto 0.75rem;
background-repeat: no-repeat;
background-position: left center;
vertical-align: middle;
height: 0.75rem;
width: 0.75rem;
display: inline-block;
margin-left: 0.05rem;
margin-bottom: 0.15rem;
}
#top-menu .logo-container,
#top-menu .member-container {
width: none;
}
#top-menu .modal-header .profile-info.top-menu-item-user {
width: 100%;
}
#top-menu .profile-info.top-menu-item-user:hover {
background: #fff;
color: #000;
}
#top-menu .top-container .mobile-modal a:focus {
outline: none;
}
#top-menu .top-container .mobile-modal .footer-header-link:hover {
background: #fff;
color: #000;
}
#top-menu .header__nav-desk {
display: none;
}
#top-menu .top-nav-profile .modal-content-top {
display: none;
}
#top-menu .top-nav-profile .modal-club-level {
display: none;
}
#top-menu .top-nav-profile:hover, #top-menu .top-nav-profile:focus {
background-color: #fff;
}
#top-menu .top-nav-profile:hover .profile-info-item .profile-chevron .profile-item-menu, #top-menu .top-nav-profile:focus .profile-info-item .profile-chevron .profile-item-menu {
background-color: #fff;
}
#top-menu .top-menu-item-menu {
display: flex;
align-items: center;
margin-left: 0.5rem;
}
#top-menu .mobile-modal {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
width: 100%;
top: 0;
bottom: 0;
right: 0;
position: fixed;
background-color: white;
padding: 0px;
justify-content: space-between;
}
#top-menu .mobile-modal .modal-header {
top: 0;
display: flex;
justify-content: space-between;
}
#top-menu .mobile-modal .modal-header .logo,
#top-menu .mobile-modal .modal-header .logo-small {
margin-left: 1rem;
}
#top-menu .mobile-modal .modal-club-level {
margin: 0px;
}
#top-menu .mobile-modal .grid {
margin-left: 0px;
}
#top-menu .mobile-modal .grid__item {
padding-left: 0px;
}
#top-menu .mobile-modal .modal-section {
flex: 1;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
overflow-y: scroll;
padding-right: 1rem;
}
#top-menu .mobile-modal .modal-content {
display: flex;
flex-direction: column;
height: 100%;
overflow-y: scroll;
}
#top-menu .mobile-modal .modal-content .top-desktop-links {
display: none;
}
#top-menu .mobile-modal .modal-content .top-mobile-links {
display: block;
}
#top-menu .mobile-modal .modal-content .bottom-desktop-links {
display: none;
}
#top-menu .mobile-modal .modal-content .top-mobile-links {
border-bottom: 1px solid #D8D4D0;
}
#top-menu .mobile-modal .modal-content .middle-mobile-links {
display: block;
border-bottom: 1px solid #D8D4D0;
}
#top-menu .mobile-modal .modal-content .bottom-mobile-links {
display: block;
}
#top-menu .mobile-modal .modal-content .bottom-links {
margin-top: 0;
border-top: none;
padding-bottom: 0;
padding-top: 0;
}
#top-menu .mobile-modal .modal-content .modal-content-text {
font-size: 1rem;
letter-spacing: 0;
line-height: 1.5;
}
#top-menu .mobile-modal .modal-content .modal-user-name {
margin-top: 32px;
}
#top-menu .mobile-modal .modal-content .modal-user-name.member-name {
margin-top: 0.75rem;
}
#top-menu .mobile-modal .modal-content .modal-link {
font-size: 1rem;
line-height: 1.5;
}
#top-menu .mobile-modal .modal-content .modal-link a {
width: 100%;
height: 100%;
}
#top-menu .mobile-modal .profile-bottom {
display: flex;
flex-direction: column;
justify-content: flex-end;
height: 100%;
}
#top-menu .mobile-modal .profile-bottom .profile-bottom-element {
border-top: 1px solid #D8D4D0;
}
#top-menu .mobile-modal .mobile-bottom {
display: flex;
flex-direction: column;
justify-content: flex-end;
height: 100%;
margin: 1.5rem 1rem;
}
#top-menu .mobile-modal .mobile-bottom .user-points {
font-style: normal;
font-weight: 400;
font-size: 0.75rem;
line-height: 1rem;
color: #000000;
}
#top-menu .mobile-modal .mobile-bottom .strawberry-button-primary {
margin-bottom: 0.5rem;
}
#top-menu .mobile-modal .mobile-bottom .profile-info {
border: 1px solid #D8D4D0;
border-radius: 1rem;
padding: 1rem 0.88rem;
}
#top-menu .mobile-modal .mobile-bottom .profile-label {
padding: 0.25rem 0.75rem;
color: white;
border-radius: 1.875rem;
font-size: 0.75rem;
font-weight: 700;
}
#top-menu .mobile-modal .mobile-bottom .profile-label.blue {
background: #10495E;
text-transform: uppercase;
}
#top-menu .mobile-modal .mobile-bottom .profile-label.silver {
color: black;
background: #999999;
text-transform: uppercase;
}
#top-menu .mobile-modal .mobile-bottom .profile-label.gold {
color: black;
background: #BDAD5E;
text-transform: uppercase;
}
#top-menu .mobile-modal .mobile-bottom .profile-label.platinum {
background: #58544D;
text-transform: uppercase;
}
#top-menu .mobile-modal .mobile-bottom .profile-info div:last-child {
margin-left: auto;
}
}
@media only screen and (min-width: 768px) {
/*
Header navigation
*/
body.is-global-sticky-calendar:not(.show-maintenance-mesage):not(.is-in-app) {
padding-top: 1.75rem;
}
/*
Open link
*/
.header__link--open {
padding-left: 10px;
}
.header__nav .header__link--login {
padding-left: 45px;
background-position-x: 10px;
width: auto;
text-indent: 0;
}
.header__nav .header__link--redirect {
padding-left: 8px !important;
}
.header__link--login .nch-icon-profile {
margin-right: 0;
}
.on-active .header__link--login .nch-icon-profile {
margin-right: -5px;
}
.header__link--arrow {
position: relative;
padding-right: 25px;
}
.header__link--arrow:before {
position: absolute;
top: 50%;
right: 8px;
content: "";
width: 0;
height: 0;
border: inset 5px;
border-color: rgba(255, 255, 255, 0.4) transparent transparent transparent;
border-top-style: solid;
margin-top: -1px;
}
/*
Header dropdown
*/
.on-active .header-links__btn--menu {
display: none;
}
.on-active .header-links__btn--close {
display: inline-block;
}
/*
Header navigation
*/
.header__nav {
margin-right: 8px;
}
/*
Header links style
*/
.header__link {
font-size: 14px;
}
/*
Header conference
*/
.header__conf-nav__link--active {
padding-bottom: 7px;
}
.header__conf-nav__link--active:after {
content: "";
position: relative;
display: block;
top: -5px;
width: 100%;
height: 3px;
background: #336676;
}
}
@media only screen and (min-width: 1024px) {
body.is-global-sticky-calendar {
padding-top: 150px;
}
body.show-maintenance-mesage.is-global-sticky-calendar {
padding-top: 185px;
}
body.is-global-sticky-calendar:not(.show-maintenance-mesage):not(.is-in-app) {
padding-top: 185px;
}
/*
Header dropdown
*/
.header__conf-nav {
position: absolute;
display: block;
}
.header__small-open-link {
position: relative;
background: #FFFFFF;
z-index: 2;
}
.register-profile__icon-item {
text-align: center;
}
.register-profile__icons-label {
line-height: 1.2;
margin: 10px 0 0 0;
width: 100%;
display: block;
float: none;
}
.register-profile__icon {
display: inline-block;
float: none;
}
.register-profile__icons-list {
overflow: hidden;
margin-bottom: 20px;
}
.register-profile__icons-list .register-profile__icon-item {
float: left;
margin-right: 40px;
text-align: center;
}
.register-profile__icons-list .register-profile__icon-item:last-child {
margin-right: 0;
}
}
@media only screen and (min-width: 1580px) {
#top-menu .header__dropdown {
left: 50%;
transform: translateX(-50%);
}
}
@media only screen and (min-width: 68.688rem) {
.bottom-nav {
display: none;
}
}
.our-hotels {
overflow: hidden;
}
.our-hotels li {
height: 125px;
padding: 10px 0;
}
.our-hotels img {
display: block;
}
.our-hotels__independent .header__link {
position: relative;
padding: 16px 35px 16px 15px;
border: 1px solid #BDF0F6;
max-width: 190px;
line-height: 1.5;
}
.our-hotels__independent .nch-icon-arrow-right {
position: absolute;
top: 20px;
font-size: 32px;
right: 4px;
}
.header-links .ff-no-bullet-list-line li {
margin-right: 10px;
}
.header-links__btn-close {
display: none;
}
@media only screen and (min-width: 768px) {
.header-links .ff-no-bullet-list-line li {
margin-right: 10px;
}
}
.header-login__close {
display: none;
}
.header-login {
padding: 20px 0;
}
.header-login .grid {
max-width: 1280px;
margin: 0 auto;
}
.header-login #LoginFormView {
display: none;
}
.header-login .header-login__extra-btn {
display: none;
}
.header-login .header__text {
margin-bottom: 30px;
max-width: 570px;
}
.header-login .header__block {
display: block;
margin: 8px 0;
}
.header-login .input {
margin-bottom: 10px;
}
.loginPopup #LoginFormView {
display: block;
}
#global-nav-content {
display: none;
}
@media only screen and (min-width:0em) and (max-width:767px) {
.header-login .header-login__extra-btn {
display: block;
margin-top: 20px;
}
.header-login.isPopupState {
position: fixed;
top: 0;
left: 0;
right: 0;
padding: 0;
z-index: 2000;
}
.header-login.isPopupState:before {
content: "";
background: #222;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.header-login.isPopupState .header-login__extra-btn {
display: none;
}
.header-login.isPopupState .header-login__close {
display: block;
position: absolute;
top: 0;
right: 0;
padding: 6px 15px 0px;
line-height: 38px;
color: #fff;
z-index: 1;
}
.is-popup-state {
overflow: hidden;
position: fixed;
width: 100%;
}
.is-popup-state:before {
content: "";
display: block;
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: #222;
z-index: 1;
}
.is-popup-state .header-login.isPopupState {
overflow: scroll;
height: 100%;
}
.is-popup-state .register-profile {
display: none;
}
}
@media only screen and (min-width: 768px) {
.header-login #RegisterProfile,
.header-login #LoginFormView {
display: block;
}
.header-login #RegisterProfile {
border-right: 1px solid rgba(255, 255, 255, 0.2);
margin-right: 30px;
padding-right: 30px;
}
}
@media only screen and (min-width: 1024px) {
.header-login #RegisterProfile {
margin-right: 40px;
padding-right: 40px;
}
}
.sign-in-box {
margin-top: 20px;
}
.sign-in-box .header__link {
margin: 5px 0 15px 0;
display: inline-block;
line-height: 1.5;
}
.sign-in-box:after {
content: "";
display: table;
clear: both;
}
.sign-in-box__remind-passwd .btn {
margin-top: 20px;
}
.sign-in-box .ff-error {
margin-top: -5px;
margin-bottom: 10px;
}
.sign-in-box__login .header__label {
display: table-cell;
line-height: 1.3;
vertical-align: bottom;
padding: 5px 15px 5px 0;
position: relative;
}
.sign-in-box__login .header__label .nch-icon-info {
position: absolute;
top: auto;
margin: -2px 0;
}
.sign-in-box__login .btn {
margin: 15px 0 10px 0;
}
.sign-in-box__login:after {
content: "";
display: table;
clear: both;
}
@media only screen and (min-width: 768px) {
.sign-in-box {
margin-top: 0;
}
.sign-in-box__login {
max-width: 320px;
}
}
@media only screen and (min-width: 1024px) {
.sign-in-box .header__link {
margin: 0;
}
.sign-in-box__login {
max-width: none;
}
.sign-in-box__login .btn {
margin: 45px 0 10px 0;
}
.sign-in-box__login .header__label {
padding-top: 0;
height: 40px;
}
}
/*
sign-in-box--checkout
*/
@media only screen and (min-width: 768px) {
.sign-in-box--checkout {
margin-right: 50px;
}
.sign-in-box--checkout .sign-in-box__login {
max-width: none;
}
}
.sign-in-box--checkout .header__title,
.sign-in-box--checkout .header__text,
.sign-in-box--checkout .header__label,
.sign-in-box--checkout .label-checkbox--inverted,
.sign-in-box--checkout .header__link {
color: #002F3D;
}
.sign-in-box--checkout .header__link {
display: inline-block;
line-height: 1.5;
margin: 0;
}
.sign-in-box--checkout .header__title {
margin-top: 0;
}
.sign-in-box--checkout .header__label {
font-weight: 500;
}
.sign-in-box--checkout .input {
margin-bottom: 10px;
}
.sign-in-box--checkout .header-login__colse-button {
display: none;
}
.sign-in-box--checkout .btn-secondary {
border: 1px solid #002F3D;
color: #002F3D;
}
.sign-in-box--checkout .btn-secondary:hover {
background-color: #002F3D;
color: #FFFFFF;
}
.loged-user .header__title {
margin: 0;
font-size: 0.75rem;
display: block;
text-transform: uppercase;
font-weight: 300;
}
.loged-user .header__text {
margin-bottom: 1rem;
font-size: 1rem;
display: block;
font-weight: 500;
}
.loged-user__my-page,
.loged-user__web-profile {
padding: 0 20px;
margin-top: 20px;
}
.loged-user__my-page .header__text--uppercase,
.loged-user__web-profile .header__text--uppercase {
line-height: 1.5;
margin: 5px 0 15px 0;
}
.loged-user__my-page {
padding: 0 1rem;
background: 1rem 0/40px no-repeat url("../../Images/header-icons/Icon-user.svg");
}
.loged-user__my-page.silver {
background-image: url("../../Images/header-icons/Icon-user_silver.svg");
}
.loged-user__my-page.gold {
background-image: url("../../Images/header-icons/Icon-user_gold.svg");
}
.loged-user__my-page.platinum {
background-image: url("../../Images/header-icons/Icon-user_platinum.svg");
}
.loged-user__my-page ul {
padding-left: 4rem;
}
.loged-user__my-page li {
float: none;
}
.loged-user__my-page .btn-secondary {
margin: 1rem 0;
}
.loged-user .loged-user__shortcuts {
padding: 1rem;
}
.loged-user__shortcut {
float: left;
width: 50%;
color: #fff;
text-align: center;
font-size: 0.75rem;
border-top: 1.5px solid #195365;
}
.loged-user__shortcut:nth-child(-n+2) {
border: none;
}
.loged-user__shortcut:nth-last-child(-n+2) {
border-bottom: 1.5px solid #195365;
}
.loged-user__shortcut:nth-child(2n+1) {
clear: left;
}
.loged-user__shortcut:nth-child(2n+1) .loged-user__wrap {
border-right: 1.5px solid #195365;
}
.loged-user__wrap {
margin: 10px 0;
padding: 0 10px;
box-sizing: border-box;
}
.loged-user__icon {
display: block;
margin: 0 auto 10px;
width: 32px;
height: 32px;
background-repeat: no-repeat;
background-position: center center;
background-size: 100% 100%;
}
.loged-user__icon.user {
background-image: url("../../Images/header-icons/user-light.svg");
}
.loged-user__icon.bookings {
background-image: url("../../Images/header-icons/suitcase-light.svg");
}
.loged-user__icon.bonusnight {
background-image: url("../../Images/header-icons/bed-light.svg");
}
.loged-user__icon.awards {
background-image: url("../../Images/header-icons/award-light.svg");
}
.loged-user__icon.pointshop {
background-image: url("../../Images/header-icons/shopping-bag-light.svg");
}
.loged-user__icon.settings {
background-image: url("../../Images/header-icons/cog-light.svg");
}
.loged-user__logout .btn {
margin: 20px 0 20px 0;
}
.loged-user__logout .header__title,
.loged-user__logout .header__text {
display: none;
}
@media only screen and (min-width: 768px) {
.loged-user {
padding: 1rem 0 4rem;
margin: 0;
}
.loged-user .profile {
float: none;
}
.loged-user .profile .header__title {
font-size: 1rem;
}
.loged-user .profile .header__text {
font-size: 1.375rem;
}
.loged-user li {
float: left;
margin-right: 1rem;
}
.loged-user__web-profile {
padding: 0 30px;
margin: 0 30px;
border-right: 1px solid rgba(255, 255, 255, 0.2);
border-left: 1px solid rgba(255, 255, 255, 0.2);
}
.loged-user__web-profile .btn {
max-width: 240px;
margin-top: 13px;
}
.loged-user__web-profile .header__text {
margin-bottom: 15px;
}
.loged-user__my-page {
background-size: 55px;
margin: 0;
}
.loged-user__my-page ul {
padding-left: 5.5rem;
}
.loged-user__my-page .btn {
max-width: 240px;
margin: 0 0 0 5.5rem;
}
.loged-user__logout .btn {
margin: 20px 0 0 0;
max-width: 240px;
}
.loged-user__logout .header__title,
.loged-user__logout .header__text {
display: block;
}
.loged-user__shortcuts {
float: right;
border-left: 1px solid #195365;
}
.loged-user__shortcut {
width: 33.33333%;
border: none;
}
.loged-user__shortcut:nth-child(2n+1), .loged-user__shortcut:last-child {
border: none;
clear: none;
}
.loged-user__shortcut:nth-child(2n+1) .loged-user__wrap, .loged-user__shortcut:last-child .loged-user__wrap {
border: none;
}
.loged-user__wrap {
margin: 0 0 1.5rem;
}
}
.phone-lines-error {
background: #F5A623;
color: #fff;
}
.phone-lines-error .nch-icon-interjection {
position: absolute;
top: 50%;
left: 8px;
margin-top: -11px;
font-size: 16px;
border: 2px solid #fff;
border-radius: 100px;
padding: 1px 2px;
}
.phone-lines-error .nch-icon-interjection:before {
display: inline-block;
margin: -1px -1px 0 0;
}
.phone-lines-error .phone-lines-error__text {
color: #fff;
font-size: 14px;
line-height: 18px;
padding: 0;
}
.phone-lines-error__box {
margin: auto;
max-width: 1280px;
padding: 15px 15px 10px 40px;
position: relative;
}
@media only screen and (min-width: 1024px) {
.phone-lines-error .nch-icon-interjection {
left: 10px;
}
}
.conf-basket {
position: fixed;
bottom: 0;
right: 0;
width: 0;
z-index: 1005;
transition: width 300ms linear 0s;
box-shadow: 0px -7px 16px 0px rgba(0, 0, 0, 0.11);
}
.conf-basket--has-request {
width: 100%;
}
.conf-basket--has-request .conf-basket__info--collapse {
transform: translateX(0);
}
.conf-basket .no-request {
display: none;
}
.conf-basket__info {
padding: 18px 20px 10px 20px;
background: #DAF3E5;
}
.conf-basket__info--collapse {
padding: 8px 10px 8px 50px;
transform: translateX(50vw);
transition: transform 300ms linear 0s;
}
.conf-basket__info__link {
display: block;
cursor: pointer;
overflow: hidden;
}
.conf-basket__info__icon {
float: left;
position: relative;
margin: 12px 30px 0 0;
}
.conf-basket__info__text {
font-size: 20px;
font-weight: 500;
}
.conf-basket__info__nr {
display: block;
margin: 0 32px 0 0;
font-size: 16px;
font-weight: normal;
}
.conf-basket__info__counter {
display: block;
position: absolute;
top: -12px;
right: -18px;
height: 30px;
min-width: 30px;
text-align: center;
line-height: 30px;
font-size: 18px;
color: #fff;
background: #00aa50;
border-radius: 20px;
border: 1px solid #00aa50;
}
.header .conf-basket__info__link:focus {
outline: none;
box-shadow: 0 0 0 4px #83bffc;
border: none;
border-radius: 3px;
}
@media only screen and (max-width: 768px) {
body.is-basket-visible {
overflow: hidden;
}
}
@media only screen and (min-width: 768px) {
.conf-basket {
position: relative;
box-shadow: none;
}
.conf-basket__info:before {
content: "";
position: absolute;
top: 0;
right: calc(-1 * (100vw - 1280px) / 2);
height: 60px;
width: calc((100vw - 1280px) / 2);
visibility: visible;
background: #DAF3E5;
}
.conf-basket__info--collapse {
padding: 8px 10px;
}
.conf-basket__info--collapse .conf-basket__info__text,
.conf-basket__info--collapse .conf-basket__info__nr {
display: none;
}
.conf-basket__info--expand:before {
display: none;
}
.conf-basket .reveal-modal-active {
background: none;
position: static;
}
}
.request-box {
position: fixed;
bottom: 0;
width: 100%;
z-index: 1005;
background: #fff;
}
.request-box .nch-icon-close-x {
float: left;
padding: 4px;
font-size: 18px;
font-weight: 900;
border: 0 none;
}
.request-box__list-name {
padding: 15px 20px;
margin: 0;
font-size: 20px;
font-weight: 500;
}
.request-box__loading {
position: absolute;
top: 0;
left: 0;
height: 100%;
min-height: 60px;
width: 100%;
margin: 0;
}
.request-box__wrapper {
position: relative;
max-height: calc(100vh - 230px);
min-height: 130px;
overflow-y: auto;
}
.request-box__item {
position: relative;
padding: 0 60px 0 0;
border-top: 1px solid #ececec;
overflow: hidden;
}
.request-box__item__link {
display: block;
padding: 15px 0;
overflow: hidden;
text-decoration: none;
}
.request-box__item__link:hover .request-box__item__title {
color: #5A0032;
}
.request-box__item__link:focus {
outline: none;
box-shadow: inset 0 0 0 3px #83bffc;
border-radius: 4px;
}
.request-box__item__photo {
float: left;
height: 60px;
width: 60px;
margin: 0 20px;
border-radius: 100%;
overflow: hidden;
}
.request-box__item__photo img {
display: block;
width: 100%;
}
.request-box__item .btn {
position: absolute;
top: 5px;
right: 10px;
font-size: 22px;
border: 0 none;
padding: 5px;
color: #336676;
}
.request-box__btn-add {
display: block;
padding: 10px 0 6px 0;
text-align: center;
font-size: 18px;
}
.header .request-box__item__link:focus {
outline: none;
box-shadow: inset 0 0 0 4px #83bffc;
}
@media only screen and (min-width: 768px) {
.request-box {
position: absolute;
top: 80px;
right: 0;
bottom: auto;
width: 395px;
box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);
}
.request-box__wrapper {
max-height: none;
overflow: auto;
height: 20vh;
min-height: 200px;
max-height: 400px;
}
}
.top-bar {
height: 2rem;
display: none;
background-color: #5A0032;
color: #FFF;
font-size: 0.75rem;
}
.top-bar .top-bar-item {
color: #FFF;
height: 32px;
display: flex;
align-items: center;
}
.top-bar .top-bar-item:not(:first-child) {
padding-left: 32px;
}
.top-bar .top-bar-item.push-right {
padding-left: 0px;
padding-right: 16px;
}
.top-bar .top-bar-item a {
font-weight: 400;
font-size: 0.75rem;
font-weight: 400;
font-style: normal;
}
.top-bar .top-bar-item a.top-bar-link {
color: #FFF;
}
.top-bar .top-bar-item label {
font-weight: 400;
font-style: normal;
font-size: 0.75rem;
line-height: 1rem;
}
.top-bar .top-bar-usps {
display: flex;
align-items: center;
}
.top-bar .top-bar-icon {
width: 1rem;
height: 1rem;
}
.top-bar .top-bar-usp {
padding: 0 1rem;
}
.top-bar .page__contener {
width: calc(100% - 2rem);
display: flex;
justify-content: center;
}
.top-bar .top-bar-links {
display: none;
}
.top-bar .top-bar-link {
font-size: 0.75rem;
color: #FFF;
padding: 0 0.75rem;
}
@media only screen and (min-width: 840px) {
.top-bar {
display: flex;
}
.top-bar .page__contener {
justify-content: space-between;
}
.top-bar .top-bar-links {
display: flex;
align-items: center;
}
}
.sign-box {
text-align: center;
padding: 0 20px;
margin: 0 -20px 20px;
}
.sign-box p, .sign-box .sign-box__p {
color: #FFFFFF;
font-size: 14px;
line-height: 1.5;
margin: 0 25px;
}
.sign-box .btn {
width: 100%;
border-radius: 2px;
margin-top: 20px;
margin-bottom: 30px;
padding: 7px 15px 5px 15px;
}
.sign-box .btn:hover {
text-decoration: none;
}
.sign-box .btn-secondary {
border-color: #BDF0F6;
}
.sign-box__content {
padding: 25px 0;
}
.sign-box__title {
font-size: 18px;
color: #fff;
}
@media all and (min-width: 768px) {
.sign-box {
text-align: left;
padding: 0;
margin: 0;
}
.sign-box p, .sign-box .sign-box__p {
color: #fff;
margin: 0;
max-width: 250px;
}
.sign-box .btn {
width: auto;
min-width: 160px;
}
.sign-box__content {
padding: 0;
}
}
.remind-password {
margin-top: 5px;
}
.prefooter__newsletter {
padding: 2rem 0;
}
@media screen and (min-width: 1024px) {
.prefooter__newsletter.conf-page-newsletter, .prefooter__newsletter.explore-page-newsletter {
width: 65%;
max-width: 1000px;
}
}
#mainFooter {
background: #F7F5F3;
color: #000000;
z-index: 1;
position: relative;
border-top: 1px solid #F7F5F3;
font-family: StrawberrySansText;
min-width: 320px;
}
#mainFooter .footer__wrapper {
max-width: 800px;
}
#mainFooter .h4 {
font-family: StrawberrySansText;
}
.application-version {
position: absolute;
right: 10px;
bottom: 0;
color: #F7F5F3;
z-index: 1;
clear: both;
display: block;
}
.js-group-booking-cart-visible #mainFooter {
padding-right: 260px;
}
@media only screen and (min-width: 1280px) {
.js-group-booking-cart-visible #mainFooter {
padding-right: 310px;
}
}
.footer__wrapper {
overflow: hidden;
font-size: 1em;
line-height: 1.5rem;
max-width: 1640px;
margin: 0 auto;
padding-top: 40px;
}
.footer__wrapper a {
color: #000000;
text-decoration: none;
font-size: 14px;
}
.footer__wrapper a:not(.btn):hover, .footer__wrapper a:not(.btn).hover, .footer__wrapper a:not(.btn):focus {
color: #000000;
}
.footer__wrapper a:not(.btn):focus {
border-bottom: 1px solid rgba(255, 255, 255, 0.7);
}
.footer__wrapper .footer-links--horisontal a:focus {
border: none;
}
.footer__wrapper .footer-links--horisontal a:focus .footer-links__icon {
outline: dotted 1px rgba(255, 255, 255, 0.7);
}
.footer__wrapper .main-page-link:focus img {
outline: dotted 1px rgba(255, 255, 255, 0.7);
outline-offset: 2px;
}
.footer__wrapper .footer-header-link:hover {
text-decoration: none;
}
.footer__wrapper p, .footer__wrapper address, .footer__wrapper pre {
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.footer__wrapper img {
vertical-align: middle;
}
.footer__wrapper .footer-social-icon img {
width: 24px;
height: 24px;
}
.footer__wrapper .h1, .footer__wrapper .h2, .footer__wrapper .h3, .footer__wrapper .h4, .footer__wrapper .h5, .footer__wrapper .h6 {
margin-bottom: 10px;
line-height: 1.75rem;
color: #000000;
}
.footer__wrapper .menu-inside-title {
padding: 0;
font-size: 16px;
}
.footer__wrapper .footer__title-desktop {
display: none;
}
.footer__wrapper .footer-links:not(.footer-links-expanded) {
display: none;
}
.footer__wrapper .accordion-open {
display: inline-block;
}
.footer__wrapper .accordion-close {
display: none;
}
.footer__wrapper .accordion-link {
padding-top: 16px;
padding-bottom: 16px;
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 1.75rem;
width: 100%;
}
.footer__wrapper .accordion-link img {
float: right;
}
.footer__wrapper :target .accordion-open {
display: none;
}
.footer__wrapper :target .accordion-close {
display: inline-block;
}
.footer__wrapper :target .footer-links:not(.footer-links-minimized) {
display: block;
}
.footer__wrapper .footer-links {
padding-bottom: 2rem;
}
.footer__wrapper .footer-links li:nth-child(5n) {
clear: both;
}
.footer__wrapper .footer-links .footer-links__icon {
margin: 12px 12px 12px 0;
}
.footer__wrapper .footer-links .footer-links__icon:hover {
text-decoration: none;
}
.footer-links {
list-style: none;
margin: 0;
padding: 0 0 0 1px;
overflow: hidden;
}
.footer-links li {
padding-top: 4px;
padding-bottom: 4px;
}
.footer-links a {
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 24px;
}
.footer-links [class^=nch-icon-], .footer-links [class*=" nch-icon-"] {
font-size: 24px;
}
.footer-links--horisontal li {
float: left;
margin-bottom: 10px;
}
.footer__wrapper.sticky {
width: 100%;
position: absolute;
bottom: 0;
}
.footer-logo-img {
width: 160px;
height: 21px;
}
.footer__title {
display: block;
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 1.75rem;
}
/*
Footer Grid
*/
.footer-grid {
overflow: hidden;
padding-bottom: 1rem;
}
.footer-grid__item {
float: left;
padding: 0 16px;
}
.footer-grid__item-1,
.footer-grid__item-2,
.footer-grid__item-3,
.footer-grid__item-4 {
width: 100%;
}
@media all and (min-width: 600px) {
.footer-grid {
padding-bottom: 2rem;
}
}
@media all and (min-width: 840px) {
.footer__title.footer__title-desktop {
display: block;
}
.footer__title-mobile {
display: none;
}
.footer__wrapper {
padding-top: 72px;
}
.footer__wrapper .footer-links {
display: block !important;
padding: 0px 0px 0px 0px;
}
.footer__wrapper.under-bottom {
padding-top: 0px;
}
.footer-grid__item {
padding: 0 16px;
}
.footer-grid__item-1 {
width: 100%;
}
.footer-grid__item-2 {
width: 50%;
}
.footer-grid__item-3 {
width: 33.3333333333%;
}
.footer-grid__item-4 {
width: 25%;
}
}
@media all and (min-width: 1024px) {
#mainFooter .footer__wrapper {
max-width: 1280px;
}
.footer__wrapper .navigation-links .navigation-links__icon {
margin: 5px 1px;
}
}
/*--------------------------------*/
/* Footer bottom */
.footer-bottom-separator {
border-top: 1px solid #D8D4D0;
}
.footer-under-bottom {
width: calc(100% - 2rem);
margin: 1.5rem 1rem;
}
.footer-under-bottom .footer-under-bottom-left {
margin-top: 1rem;
}
.footer-under-bottom .footer-copyright {
margin-top: 1rem;
}
.footer-under-bottom .language-icon {
width: 24px;
margin-right: 2px;
}
.footer-under-bottom .language-icon-chevron {
width: 12px;
margin-left: 8px;
}
.footer__wrapper.under-bottom {
padding-top: 0px;
}
.footer-bottom {
width: calc(100% - 2rem);
margin: 0 1rem;
padding: 1.5rem 0 2rem;
overflow: hidden;
flex-wrap: nowrap;
}
.footer-bottom .footer-bottom-column {
text-align: center;
padding: 16px 0px 32px 0px;
}
.footer-bottom__item {
display: block;
text-align: center;
}
.tripadvisor-logo img {
width: 140px;
height: 21px;
}
.tripadvisor-logo-intro {
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
margin-bottom: 12.5px;
}
.footer-mlink {
display: block;
margin: 0 0 20px 0;
}
.footer-copyright {
margin-top: 15px;
}
.footer-copyright p {
color: #000;
}
.language-selector {
border: 1px solid #D8D4D0;
padding: 0.65rem 0.75rem;
border-radius: 6.25rem;
font-size: 0.75rem;
font-weight: 700;
}
.language-selector a.current-language {
display: flex;
align-items: center;
margin-left: 3px;
}
.language-selector:focus-within, .language-selector:hover {
border: 1px solid black !important;
}
.tracking-img {
position: absolute;
}
@media all and (min-width: 600px) {
.footer-bottom__item {
margin: 0;
text-align: right;
}
}
@media all and (min-width: 352px) {
.footer-under-bottom {
display: flex;
justify-content: space-between;
}
.footer-under-bottom .language-selector {
order: 2;
}
.footer-bottom__item {
margin: 0;
}
.footer-logo {
width: 50%;
}
.footer-logo {
float: left;
text-align: left;
}
.footer-policy {
width: 100%;
clear: both;
padding: 10px 0;
}
}
@media all and (min-width: 600px) {
.footer-bottom {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: calc(100% - 2rem);
margin: 0 1rem;
align-items: center;
}
.footer-bottom .footer-bottom-column {
flex: 33.33%;
padding: 0px;
}
.footer-bottom .footer-bottom-column:first-child {
text-align: left;
}
.footer-bottom .footer-social-icon {
padding-left: 12px;
padding-right: 12px;
}
.footer-bottom .footer-social-icon:last-child {
padding-right: 0;
}
.footer-bottom .footer-social-icon:first-child {
padding-left: 0;
}
.tripadvisor-logo {
width: 100%;
}
.footer-policy {
float: right;
clear: none;
padding: 0;
margin: 16px 0;
}
}
@media only screen and (max-width: 480px) {
.footer-links--horisontal {
max-width: 280px;
margin: 0 auto -15px;
}
.footer-links--horisontal li {
width: 25%;
text-align: center;
}
.footer-links [class^=nch-icon-],
.footer-links [class*=" nch-icon-"] {
font-size: 26px;
}
}
.newsletter-banner {
padding: 1.5rem;
margin: 0 10px;
background: #F7F5F3;
color: #000000;
border-radius: 24px;
}
.newsletter-banner__header {
padding: 0 0 0 0;
}
.newsletter-banner__header__title {
margin: 0 auto 1rem auto;
font-family: StrawberrySansDisplay;
font-weight: 500;
font-size: 1.5rem;
text-align: center;
}
.newsletter-banner__header__input {
margin: 0 auto;
font-size: 0.875rem;
font-family: Roboto;
border: none;
border-radius: 16px;
padding-left: 1rem;
}
.newsletter-banner__header input {
background: #fff !important;
}
.newsletter-banner__terms {
border-top: 1px solid #ECF3F5;
padding: 1rem 0;
}
.newsletter-banner__terms__text {
text-align: left;
vertical-align: top;
line-height: 24px;
font-family: StrawberrySansTextBold;
font-weight: 600;
font-size: 0.75rem;
}
.newsletter-banner__terms .strawberry-button {
width: 100%;
padding-top: 1rem;
padding-bottom: 1rem;
}
.newsletter-banner__terms .ff-error {
text-align: left;
}
.newsletter-banner .ff-error {
margin: 10px auto;
}
@media only screen and (min-width: 481px) {
.newsletter-banner__header__title {
font-size: 1.75rem;
}
.newsletter-banner__header__input {
width: 100%;
}
.newsletter-banner__header__input {
width: 100%;
}
.newsletter-banner__terms__text {
width: calc(100% - 8rem);
padding-right: 0;
}
.newsletter-banner__terms .strawberry-button {
width: unset;
float: right;
}
.newsletter-banner__terms .strawberry-button {
width: unset;
}
.newsletter-banner__terms__btn {
width: auto;
}
.newsletter-banner__terms .ff-error {
width: calc(100% - 8rem);
padding-left: 0;
padding-right: 0;
margin-left: 0;
margin-right: 0;
}
}
@media only screen and (min-width: 1024px) {
.newsletter-banner__header__title {
font-size: 2rem;
}
.newsletter-banner__terms__text {
max-width: auto;
}
.newsletter-banner__terms .ff-error {
max-width: auto;
}
}
.breadcrumb {
display: block;
overflow: hidden;
}
.breadcrumb__list {
list-style: none;
display: inline-block;
padding: 0;
margin: 0;
}
.breadcrumb__list li {
display: inline-block;
}
.breadcrumb__link {
display: inline-block;
font-size: 14px;
line-height: 20px;
font-family: StrawberrySansText;
font-weight: 400;
padding: 12px 0 20px 0;
position: relative;
cursor: pointer;
}
@media only screen and (max-width: 480px) {
.breadcrumb__link {
padding: 10px 0;
}
}
.breadcrumb__link--active {
font-weight: 700;
cursor: auto;
}
.breadcrumb__link--active:hover {
text-decoration: none !important;
}
.breadcrumb__link:hover {
text-decoration: underline;
}
.breadcrumb__divider {
padding: 0 5px 0 5px;
font-size: 14px;
line-height: 20px;
font-family: StrawberrySansText;
font-weight: 400;
}
@media only screen and (min-width:0em) and (max-width:767px) {
.breadcrumb__divider, .breadcrumb__link--active {
display: none;
}
.breadcrumb__list li {
display: none;
}
.breadcrumb__list li:last-child {
display: block;
}
.breadcrumb__list li:last-child:before {
content: "<";
display: inline-block;
}
}
.explorer__link {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
text-decoration-line: underline;
display: inline-block;
font-size: 16px;
line-height: 24px;
margin-top: 8px;
}
@media only screen and (min-width: 481px) {
.explorer__link {
padding-left: 20px;
font-size: 20px;
line-height: 28px;
margin-top: 24px;
}
}
.mdm-icon {
width: 32px;
height: 32px;
fill: #000;
}
.mdm-icon.large {
width: 64px;
height: 64px;
}
body a.strawberry-button, span.strawberry-button, button.strawberry-button, input.strawberry-button {
box-sizing: border-box;
display: inline-block;
padding: calc(0.75rem - 2px) 1.5rem;
border-radius: 0.75rem;
background: #FFF;
color: #000000;
border: 2px #000 solid;
font-size: 1rem;
height: 3rem;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
line-height: 24px;
width: 100%;
font-family: StrawberrySansText;
font-weight: 700 !important;
}
body a.strawberry-button.strawberry-button-primary, span.strawberry-button.strawberry-button-primary, button.strawberry-button.strawberry-button-primary, input.strawberry-button.strawberry-button-primary {
background: #FC5E58;
color: #000;
border-style: none;
font-family: StrawberrySansText;
}
body a.strawberry-button.strawberry-button-secondary, span.strawberry-button.strawberry-button-secondary, button.strawberry-button.strawberry-button-secondary, input.strawberry-button.strawberry-button-secondary {
background: #F9D9D8;
color: #5A0032;
border-style: none;
font-family: StrawberrySansText;
}
body a.strawberry-button.strawberry-button-ghost, span.strawberry-button.strawberry-button-ghost, button.strawberry-button.strawberry-button-ghost, input.strawberry-button.strawberry-button-ghost {
color: #000;
border-style: solid;
border-width: 1.5px;
border-color: #000;
font-family: StrawberrySansText;
}
body a.strawberry-button span, span.strawberry-button span, button.strawberry-button span, input.strawberry-button span {
text-align: center;
margin-left: auto;
margin-right: auto;
}
body a.strawberry-button.disabled, body a.strawberry-button[disabled], span.strawberry-button.disabled, span.strawberry-button[disabled], button.strawberry-button.disabled, button.strawberry-button[disabled], input.strawberry-button.disabled, input.strawberry-button[disabled] {
background: #D8D4D0;
border-style: none;
color: #403D3B !important;
opacity: 0.5;
}
body a.strawberry-button.strawberry-button-wide, span.strawberry-button.strawberry-button-wide, button.strawberry-button.strawberry-button-wide, input.strawberry-button.strawberry-button-wide {
min-width: 188px;
}
body a.strawberry-button.strawberry-button-narrow, span.strawberry-button.strawberry-button-narrow, button.strawberry-button.strawberry-button-narrow, input.strawberry-button.strawberry-button-narrow {
width: 276px;
}
body a.strawberry-button.strawberry-button-minimal, span.strawberry-button.strawberry-button-minimal, button.strawberry-button.strawberry-button-minimal, input.strawberry-button.strawberry-button-minimal {
display: inline-block;
width: unset;
line-height: 1.75rem;
}
@media only screen and (min-width: 481px) {
body a.strawberry-button.strawberry-button-narrow-on-big-screen, span.strawberry-button.strawberry-button-narrow-on-big-screen, button.strawberry-button.strawberry-button-narrow-on-big-screen, input.strawberry-button.strawberry-button-narrow-on-big-screen {
width: 276px;
}
}
body a.strawberry-button.strawberry-button-align-right, span.strawberry-button.strawberry-button-align-right, button.strawberry-button.strawberry-button-align-right, input.strawberry-button.strawberry-button-align-right {
margin-left: auto;
}
body a.strawberry-button.strawberry-button-center, span.strawberry-button.strawberry-button-center, button.strawberry-button.strawberry-button-center, input.strawberry-button.strawberry-button-center {
margin-left: auto;
margin-right: auto;
}
.select.strawberry-select {
background: #F7F5F3;
padding-left: 14px;
border-radius: 16px;
border-style: none;
font-family: StrawberrySansText;
font-weight: 400;
font-size: 14px;
line-height: 20px;
background-image: url(../../Images/strawberry-dropdown-down.svg);
background-repeat: no-repeat;
background-position-x: calc(100% - 14px);
background-position-y: 15px;
height: 56px;
display: flex;
align-items: center;
}
.select.strawberry-select.focus {
background-image: url(../../Images/strawberry-dropdown-up.svg);
}
.select.strawberry-select::before {
display: none;
}
.select.strawberry-select .nch-icon-arrow-narrow-down {
display: none;
}
.select.strawberry-select .nch-icon-arrow-narrow-down::before {
display: none;
}
.strawberry-combobox .strawberry-combobox-input {
padding-left: 16px;
}
.strawberry-combobox .select {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 1rem;
gap: 0.5rem;
height: 56px;
background: #F7F5F3;
border-radius: 16px;
border: none;
margin-right: 16px;
font-size: 1rem;
}
.strawberry-combobox .select:before {
display: none;
}
.strawberry-combobox .select .nch-icon-arrow-narrow-down {
background-image: url(../../Images/strawberry-dropdown-down.svg);
display: inline-block;
width: 24px;
height: 24px;
top: 18px;
}
.strawberry-combobox .select .nch-icon-arrow-narrow-down:before {
display: none;
}
.strawberry-combobox input {
flex-direction: row;
align-items: center;
padding: 16px;
gap: 8px;
/*width: 488px;*/
height: 56px;
background: #F7F5F3;
border: none;
border-radius: 16px;
}
.strawberry-combobox .phone-select__country-nr {
background: none;
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
height: 56px;
top: 0px;
display: flex;
align-items: center;
left: 16px;
}
.strawberry-form .form__row, .strawberry-form .form__section {
margin-bottom: 16px;
}
.strawberry-form .nch-icon-info {
background-image: url(../../Images/strawberry-info.svg);
width: 20px;
height: 20px;
}
.strawberry-form .nch-icon-info:before {
display: none;
}
.strawberry-form .select__value {
text-align: left;
}
.strawberry-form input, .strawberry-form textarea {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
color: #403D3B;
}
.strawberry-form input[type=text], .strawberry-form input[type=email], .strawberry-form input[type=number], .strawberry-form input[readonly] {
padding: 16px;
background: #F7F5F3;
border-radius: 16px;
border: none;
height: 56px;
}
.strawberry-form textarea {
padding: 16px;
gap: 8px;
background: #F7F5F3;
border-radius: 12px;
border: none;
}
.strawberry-form .label {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 14px;
text-align: left;
}
.strawberry-form .label-radio {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 700;
font-size: 12px;
line-height: 16px;
}
.strawberry-form div.special-request-limit {
text-align: left;
font-family: StrawberrySansText;
font-style: normal;
font-weight: 700;
font-size: 12px;
line-height: 16px;
margin-top: 8px;
}
.notification.strawberry-info {
border: 1px solid #D8D4D0;
border-radius: 8px;
background-color: #fff;
padding: 24px;
color: #000;
text-align: left;
}
.notification.strawberry-info .notification__message {
position: relative;
}
.notification.strawberry-info .notification__message h3 {
font-family: StrawberrySansDisplay;
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 20px;
letter-spacing: -0.02em;
padding-right: 48px;
}
.notification.strawberry-info .notification__message p {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.notification.strawberry-info .notification__message .strawberry-icon-close-x {
background-image: url(../../Images/strawberry-close.svg);
width: 13.5px;
height: 13.5px;
position: absolute;
top: 5px;
right: 0px;
}
.strawberry-form .ff-error, .ff-error.strawberry-error {
background-color: #FFFFFF;
border: 1px solid #C52924;
border-radius: 4px;
margin-top: 4px;
padding: 8px;
text-align: left;
}
.strawberry-form .ff-error .nch-icon-interjection, .ff-error.strawberry-error .nch-icon-interjection {
background-image: url(../../Images/strawberry-error.svg);
width: 19.5px;
height: 19.5px;
display: block;
border: none;
background-size: cover;
padding: 0;
top: 8px;
left: 8px;
}
.strawberry-form .ff-error .nch-icon-interjection:before, .ff-error.strawberry-error .nch-icon-interjection:before {
display: none;
}
.strawberry-form .ff-error.strawberry-error-info .nch-icon-interjection, .ff-error.strawberry-error.strawberry-error-info .nch-icon-interjection {
background-image: url(../../Images/strawberry-error-info.svg);
}
.strawberry-form .ff-error .ff-error-message, .ff-error.strawberry-error .ff-error-message {
margin-left: 27.5px;
}
.strawberry-form .ff-error .ff-error-message p, .ff-error.strawberry-error .ff-error-message p {
color: #C52924;
font-family: StrawberrySansText;
font-style: normal;
font-weight: 700;
font-size: 14px;
line-height: 20px;
}
#refunder-extension {
display: none;
}
@media only screen and (min-width: 768px) {
.notification.strawberry-info .notification__message h3 {
font-size: 20px;
line-height: 24px;
}
}
/*# sourceMappingURL=GLOBAL-BASE.css.map */
@font-face {
font-family: "nch-icons";
src: url("../../font/nch-icons.woff") format("woff"), url("../../font/nch-icons.svg#nch-icons") format("svg");
font-weight: normal;
font-style: normal;
}
[class^=nch-icon-], [class*=" nch-icon-"], .nch-icon {
font-family: "nch-icons";
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
vertical-align: middle;
font-size: 32px;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.nch-icon {
display: inline-block;
}
/*
Various Sizes
*/
[class^=nch-icon-].small, [class*=" nch-icon-"].small, .nch-icon.small {
font-size: 24px;
}
[class^=nch-icon-].big, [class*=" nch-icon-"].big, .nch-icon.big {
font-size: 48px;
}
/*
Various states
*/
[class^=nch-icon-].gold, [class*=" nch-icon-"].gold, .nch-icon.gold {
color: #6a5f36;
}
[class^=nch-icon-].negative, [class*=" nch-icon-"].negative, .nch-icon.negative,
.selected .nch-icon {
color: #fff;
}
[class^=nch-icon-].brand, [class*=" nch-icon-"].brand, .nch-icon.brand {
color: #00AA50;
}
[class^=nch-icon-].separator,
[class*=" nch-icon-"].separator {
padding-left: 5px;
border-left: 1px solid #fff;
}
/* update from 06.03.2107 */
.nch-icon-chat-closed:before {
content: "\e919";
}
.nch-icon-chat-start:before {
content: "\e91a";
}
/* update from 01.03.2017 */
.nch-icon-expand-light:before {
content: "\e917";
}
.nch-icon-collapse:before {
content: "\e918";
}
/* update from 10.02.2017 */
.nch-icon-hotelroom_double:before {
content: "\e911";
}
.nch-icon-Icon_Seating_Auditorium:before {
content: "\e912";
}
.nch-icon-roomsize:before {
content: "\e913";
}
.nch-icon-seating:before {
content: "\e914";
}
.nch-icon-smallergroups:before {
content: "\e915";
}
.nch-icon-standing:before {
content: "\e916";
}
/* update from 09.02.2017 */
.nch-icon-cross-filled-bold:before {
content: "\e90d";
}
.nch-icon-cross-filled:before {
content: "\e90e";
}
.nch-icon-plus-filled:before {
content: "\e90f";
}
.nch-icon-plus-filled-bold:before {
content: "\e910";
}
/*
update from 31.01.2017
*/
.nch-icon-circle-checked:before {
content: "\e90a";
}
.nch-icon-request:before {
content: "\e90b";
}
.nch-icon-check:before {
content: "\e90c";
}
/*
update from 03.01.2017
*/
.nch-icon-gallery:before {
content: "\e908";
}
.nch-icon-small-gallery:before {
content: "\e909";
}
/*
update from 21.12.2016
*/
.nch-icon-arrow-down-filled:before {
content: "\e904";
}
.nch-icon-arrow-up-filled:before {
content: "\e905";
}
.nch-icon-chevron-left:before {
content: "\e906";
}
.nch-icon-chevron-right:before {
content: "\e907";
}
/*
update form 19-10-2016
*/
.nch-icon-i:before {
content: "\e903";
}
/*
update from 05-05-2015
*/
.nch-icon-arrow-narrow-down:before {
content: "\e901";
}
.nch-icon-arrow-narrow-up:before {
content: "\e902";
}
/* update from 26-10-2015*/
.nch-icon-close-x:before {
content: "\e900";
}
/*
Second name of icon class is depreciated, please use icon class with .nch-icon- *
*/
/* update from 10-07-2015
fix icon 20-08-2015 */
.nch-icon-snapchat:before {
content: "\e667";
}
/* update from 11-05-2015*/
.nch-icon-chat:before {
content: "\e666";
}
/* update from 26-03-2015*/
.nch-icon-document:before {
content: "\e664";
}
.nch-icon-link:before {
content: "\e665";
}
/* update from 16-12-2014*/
.nch-icon-star:before {
content: "\e663";
}
/* update from 11-12-2014*/
.nch-icon-fill-minus:before {
content: "\e65f";
}
.nch-icon-fill-plus:before {
content: "\e660";
}
.nch-icon-select-down:before {
content: "\e661";
}
.nch-icon-select-up:before {
content: "\e662";
}
/* update from 08-12-2014*/
.nch-icon-default:before, .nch-icon.default:before {
content: "";
}
.nch-icon-table:before, .nch-icon.meetingroom:before {
content: "\e659";
}
.nch-icon-breakfast:before, .nch-icon.breakfast:before {
content: "\e65a";
}
.nch-icon-hand:before, .nch-icon.pointing:before {
content: "\e65b";
}
.nch-icon-interjection:before {
content: "\e65c";
}
.nch-icon-pdf:before, .nch-icon.print:before {
content: "\e65d";
}
.nch-icon-play:before {
content: "\e65e";
}
/*update from 19-11-2014*/
.nch-icon-icon-blog:before {
content: "\e658";
}
/*update from 22-10-2014*/
.nch-icon-arrow-narrow-left:before {
content: "\e656";
}
.nch-icon-arrow-narrow-right:before {
content: "\e657";
}
/*update from 02-10-2014*/
.nch-icon-phone:before {
content: "\e654";
}
.nch-icon-code:before {
content: "\e655";
}
/*---------------------*/
/*update from 09-09-2014*/
.nch-icon-g-plus:before {
content: "\f067";
}
.nch-icon-g-minus:before {
content: "\f068";
}
/*--------------------*/
/*update from 09-09-2014*/
.nch-icon-selected:before {
content: "\e653";
}
/*------*/
/*update from 04-09-2014*/
.nch-icon-circle-arrow-left:before {
content: "\e648";
}
.nch-icon-circle-arrow-right:before {
content: "\e649";
}
.nch-icon-error:before {
content: "\e64a";
}
.nch-icon-signup:before {
content: "\e64b";
}
.nch-icon-social-facebook:before, .nch-icon.facebook:before {
content: "\e64c";
}
.nch-icon-social-googleplus:before {
content: "\e64d";
}
.nch-icon-social-instagram:before {
content: "\e64e";
}
.nch-icon-social-linkedin:before, .nch-icon.linkedin:before {
content: "\e64f";
}
.nch-icon-social-pinterest:before {
content: "\e650";
}
.nch-icon-social-twitter:before {
content: "\e651";
}
.nch-icon-social-youtube:before {
content: "\e652";
}
/*----*/
.nch-icon-cross-small:before {
content: "\e63e";
}
.nch-icon-profile:before {
content: "\e645";
}
.nch-icon-speech:before {
content: "\e646";
}
.nch-icon-heartfilled:before {
content: "\e647";
}
.nch-icon-twinbed2:before {
content: "\e63f";
}
.nch-icon-kingsize2:before {
content: "\e640";
}
.nch-icon-doublebed2:before {
content: "\e641";
}
.nch-icon-singebed:before {
content: "\e642";
}
.nch-icon-restaurant:before, .nch-icon.restaurant:before {
content: "\e643";
}
.nch-icon-conference:before, .nch-icon.conference:before {
content: "\e600";
}
.nch-icon-swim:before {
content: "\e601";
}
.nch-icon-training:before, .nch-icon.gym:before {
content: "\e602";
}
.nch-icon-coffee:before, .nch-icon.coffee:before {
content: "\e603";
}
.nch-icon-golf:before, .nch-icon.golf:before {
content: "\e604";
}
.nch-icon-children:before, .nch-icon.children:before {
content: "\e605";
}
.nch-icon-spa:before, .nch-icon.spa:before {
content: "\e606";
}
.nch-icon-skiiing:before, .nch-icon.ski:before {
content: "\e607";
}
.nch-icon-support:before, .nch-icon.call:before {
content: "\e608";
}
.nch-icon-heart:before, .nch-icon.favorite:before {
content: "\e609";
}
.nch-icon-mail:before, .nch-icon.message:before {
content: "\e60a";
}
.nch-icon-minus:before, .nch-icon.collapse:before {
content: "\e60b";
}
.nch-icon-add:before, .nch-icon.expand:before {
content: "\e60c";
}
.nch-icon-sound-full:before, .nch-icon.audio-high:before {
content: "\e60d";
}
.nch-icon-sound-medium:before, .nch-icon.audio-med:before {
content: "\e60e";
}
.nch-icon-sound-low:before, .nch-icon.audio-low:before {
content: "\e60f";
}
.nch-icon-search:before, .nch-icon.search:before, .nch-icon.zoom-in:before {
content: "\e610";
}
.nch-icon-calendar:before, .nch-icon.calendar:before {
content: "\e611";
}
.nch-icon-info:before, .nch-icon.info:before {
content: "\e612";
}
.nch-icon-arrow-left:before, .nch-icon.direction-left:before {
content: "\e613";
}
.nch-icon-arrow-right:before, .nch-icon.direction-right:before {
content: "\e614";
}
.nch-icon-big-arrow-right:before, .nch-icon.arrow-right:before {
content: "\e615";
}
.nch-icon-big-arrow-left:before, .nch-icon.arrow-left:before {
content: "\e616";
}
.nch-icon-big-arrow-up:before, .nch-icon.arrow-up:before {
content: "\e617";
}
.nch-icon-big-arrow-down:before, .nch-icon.arrow-down:before {
content: "\e618";
}
.nch-icon-a:before, .nch-icon.location-a:before {
content: "\e619";
}
.nch-icon-b:before, .nch-icon.location-b:before {
content: "\e61a";
}
.nch-icon-car:before, .nch-icon.drive:before {
content: "\e61b";
}
.nch-icon-walk:before, .nch-icon.walk:before {
content: "\e61c";
}
.nch-icon-done:before, .nch-icon.checked:before {
content: "\e61d";
}
.nch-icon-pluss:before, .nch-icon.add:before {
content: "\e61e";
}
.nch-icon-minus-outline:before, .nch-icon.subtract:before {
content: "\e61f";
}
.nch-icon-family:before, .nch-icon.family:before {
content: "\e620";
}
.nch-icon-city:before, .nch-icon.city:before {
content: "\e621";
}
.nch-icon-mountain:before, .nch-icon.fjords:before {
content: "\e622";
}
.nch-icon-expand:before, .nch-icon.maximize:before {
content: "\e623";
}
.nch-icon-minimize:before, .nch-icon.minimize:before {
content: "\e624";
}
.nch-icon-up:before, .nch-icon.direction-top:before, .nch-icon.direction-up:before {
content: "\e625";
}
.nch-icon-down:before, .nch-icon.direction-bottom:before, .nch-icon.direction-down:before {
content: "\e626";
}
.nch-icon-close:before, .nch-icon.close:before {
content: "\e627";
}
.nch-icon-rss:before, .nch-icon.wifi:before {
content: "\e628";
}
.nch-icon-cocktail:before, .nch-icon.bar:before {
content: "\e629";
}
.nch-icon-dog:before, .nch-icon.animal:before {
content: "\e62a";
}
.nch-icon-bath:before, .nch-icon.relax:before {
content: "\e62b";
}
.nch-icon-suit:before, .nch-icon.business-meeting:before {
content: "\e62c";
}
.nch-icon-service:before, .nch-icon.roomservice:before {
content: "\e62d";
}
.nch-icon-dollar:before, .nch-icon.budget:before {
content: "\e62e";
}
.nch-icon-flipper:before, .nch-icon.game-room:before {
content: "\e62f";
}
.nch-icon-bath-indoor:before, .nch-icon.pool-inside:before {
content: "\e630";
}
.nch-icon-eatanddrink:before, .nch-icon.evening-meal:before {
content: "\e631";
}
.nch-icon-meal:before, .nch-icon.kitchen:before {
content: "\e632";
}
.nch-icon-parking:before, .nch-icon.outdoor-parking:before {
content: "\e633";
}
.nch-icon-handicap:before, .nch-icon.handicap:before {
content: "\e634";
}
.nch-icon-place:before {
content: "\e635";
}
.nch-icon-indoorparking:before, .nch-icon.indoor-parking:before {
content: "\e636";
}
.nch-icon-print:before {
content: "\e637";
}
.nch-icon-refresh:before {
content: "\e638";
}
.nch-icon-calculator:before {
content: "\e639";
}
.nch-icon-home:before {
content: "\e63a";
}
.nch-icon-NCH_cross-simple:before {
content: "\e63d";
}
.nch-icon-NCH_plus-filled:before {
content: "\e63b";
}
.nch-icon-NCH_grid:before {
content: "\e63c";
}
/* Overrides */
.nch-icon-info, .nch-icon.info {
position: relative;
top: -1px;
font-size: 22px;
margin: 0 4px;
}
/*# sourceMappingURL=nch-icons.css.map */
/*
COLORS
*/
/*
Strawberry
*/
/*
Inputs
*/
/*
New identity colors
*/
/*
Fonts
*/
/*
Link Text
*/
/*
Backgrounds
*/
/* Buttons */
/* Search Buttons */
/* NCC Buttons */
/*
Other
*/
/*
Breakpoints
*/
/*
Mixins
*/
/*
Extended Classes
*/
.search-bar {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/*
Easing animations
*/
.collapsable-mode {
overflow: hidden;
}
.collapsable-mode__content {
max-height: 0;
overflow: hidden;
transform: translateY(-100%);
transition: all 400ms ease-in-out 0s;
}
.collapsable-mode--expand .collapsable-mode__content {
max-height: 10000px;
transform: translateY(0);
}
datepicker {
display: inline-block;
background-color: white;
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}
datepicker table {
table-layout: fixed;
width: 100%;
border-collapse: separate;
border-spacing: 2px;
}
datepicker td,
datepicker th {
height: 35px;
box-sizing: border-box;
padding: 0;
text-align: center;
}
datepicker .is-empty {
height: 0;
}
datepicker .pika-lendar {
display: inline-block;
}
datepicker .pika-lendar + .pika-lendar {
margin-left: 5px;
}
datepicker .pika-day {
background-color: #edfafb;
color: #003343;
font-weight: 500;
width: 100%;
height: 100%;
border: none;
cursor: pointer;
overflow: hidden;
box-sizing: border-box;
position: relative;
padding: 0;
}
datepicker [data-nch-hovered] button {
border: 1px solid #000;
}
datepicker [data-nch-hovered].is-disabled button {
outline-width: 0;
}
datepicker .is-disabled .pika-day {
cursor: not-allowed;
background-color: #edfafb;
color: #c3d7db;
}
datepicker [data-nch-datepicker-type=arrival] .is-today .pika-day {
background-color: #def8fb;
color: #003343;
font-weight: bold;
}
datepicker [data-nch-datepicker-type=arrival] [data-nch-style=arrival] .pika-day {
background-color: #59d9e8;
color: #003343;
}
datepicker [data-nch-datepicker-type=departure] [data-nch-style=arrival] .pika-day,
datepicker [data-nch-datepicker-type=departure] [data-nch-style=between] .pika-day {
background-color: #003242;
color: #fff;
}
datepicker [data-nch-datepicker-type=departure] [data-nch-style=departure] .pika-day {
background-color: #59d9e8;
color: #003343;
}
datepicker .with-restrictions[data-nch-datepicker-type=departure] [data-nch-style=arrival] .pika-day,
datepicker .with-restrictions[data-nch-datepicker-type=departure] [data-nch-style=between] .pika-day,
datepicker .with-restrictions[data-nch-datepicker-type=departure] [data-nch-style=departure] .pika-day {
background-color: #59d9e8;
color: #003343 !important;
}
datepicker .pika-select-month,
datepicker .pika-select-year,
datepicker .pika-prev,
datepicker .pika-next {
display: none;
}
datepicker .pika-title {
text-align: center;
}
datepicker .pika-label {
display: inline-block;
margin: 0 4px;
line-height: 40px;
font-size: 18px;
color: #003343;
}
datepicker .previous-month,
datepicker .next-month {
position: absolute;
top: 10px;
cursor: pointer;
}
datepicker .previous-month {
left: 10px;
}
datepicker .next-month {
right: 10px;
}
datepicker .previous-month,
datepicker .next-month {
font-size: 16px;
padding: 5px;
}
datepicker .datepicker-wrapper abbr {
cursor: default;
border-bottom-width: 0;
color: #336676;
font-weight: normal;
}
datepicker button {
font-family: inherit;
}
datepicker [data-nch-restriction=available] .pika-day {
color: #fff;
background: #003242;
}
datepicker [data-nch-restriction=available].is-disabled .pika-day {
color: #c3d7db !important;
background: #edfafb;
}
datepicker [data-nch-restriction=available].is-disabled .pika-day:after {
display: none;
}
datepicker [data-nch-restriction=available] .pika-day:after, datepicker [data-nch-restriction=available].is-disabled[data-nch-style=arrival] .pika-day:after {
content: "";
display: block;
border: 6px solid;
border-color: transparent transparent #003242 #003242;
position: absolute;
bottom: 0;
z-index: 1;
left: 0;
}
datepicker [data-nch-restriction=available][data-nch-hovered] .pika-day:after {
border-width: 4px;
bottom: 2px;
left: 2px;
}
.campaignCalendar datepicker .pika-day {
background-color: #fff;
border: 1px solid #FFFFFF;
border-radius: 39px;
font-weight: 400;
font-size: 16px;
line-height: 24px;
max-width: 35px;
}
.campaignCalendar datepicker .is-disabled .pika-day {
background-color: #fff;
color: #c3d7db;
}
.campaignCalendar datepicker [data-nch-hovered] button {
border: none;
}
.campaignCalendar datepicker [data-nch-datepicker-type=arrival] .is-today .pika-day {
background-color: inherit;
color: inherit;
font-weight: inherit;
}
.campaignCalendar datepicker [data-nch-datepicker-type=arrival] [data-nch-style=arrival] .pika-day {
background-color: #F9D9D8;
color: #000;
font-weight: 700;
}
.campaignCalendar datepicker [data-nch-datepicker-type=arrival] [data-nch-style=arrival]:not(.is-disabled) .pika-day {
background-color: #F9D9D8;
color: #000;
}
.campaignCalendar datepicker [data-nch-datepicker-type=departure] [data-nch-style=arrival] .pika-day,
.campaignCalendar datepicker [data-nch-datepicker-type=departure] [data-nch-style=between] .pika-day,
.campaignCalendar datepicker [data-nch-datepicker-type=departure] [data-nch-style=departure] .pika-day {
background-color: #fff;
color: #000;
}
.campaignCalendar datepicker .with-restrictions[data-nch-datepicker-type=departure] [data-nch-style=arrival]:not([data-nch-restriction=unavailable]) .pika-day,
.campaignCalendar datepicker .with-restrictions[data-nch-datepicker-type=departure] [data-nch-style=between]:not([data-nch-restriction=unavailable]) .pika-day,
.campaignCalendar datepicker .with-restrictions[data-nch-datepicker-type=departure] [data-nch-style=departure]:not([data-nch-restriction=unavailable]) .pika-day {
background-color: #F9D9D8;
color: #000 !important;
font-weight: 700;
}
.campaignCalendar datepicker .with-restrictions[data-nch-datepicker-type=departure] [data-nch-style=between][data-nch-restriction=unavailable] .pika-day {
border-width: 1.5px;
border-color: #C52924;
font-weight: 400;
}
.campaignCalendar datepicker .with-restrictions[data-nch-datepicker-type] [data-nch-style][data-nch-restriction=unavailable] button.pika-day {
color: #c3d7db !important;
background: #fff;
cursor: not-allowed;
}
.campaignCalendar datepicker [data-nch-restriction=available] .pika-day {
color: #000;
background: #fff;
}
.campaignCalendar datepicker [data-nch-restriction=available].is-disabled .pika-day {
color: #c3d7db !important;
background: #fff;
}
.campaignCalendar datepicker [data-nch-restriction=available] .pika-day:after, .campaignCalendar datepicker [data-nch-restriction=available].is-disabled[data-nch-style=arrival] .pika-day:after {
display: none;
}
.campaignCalendar datepicker [data-nch-restriction=available][data-nch-hovered] .pika-day:after {
display: none;
}
.datepicker-legend {
list-style: none;
padding: 0;
margin: 5px 0;
text-align: center;
display: none;
}
.datepicker-legend li {
display: inline-block;
}
.datepicker-legend__color {
display: inline-block;
width: 13px;
height: 13px;
margin: 0 4px -2px;
}
.datepicker-legend__color.campaign {
background: #003242;
}
.datepicker-legend__color.selected {
background: #59d9e8;
}
.datepicker-legend__name {
line-height: 1;
font-size: 14px;
display: inline-block;
}
.dropdown__box .datepicker-legend {
display: block;
}
.price-list > ul {
overflow: visible;
}
.price-list > ul > li {
font-size: 16px;
padding: 0;
display: block;
}
.price-list .label-radio .small {
display: block;
font-size: 14px;
font-weight: 400;
color: #969696;
}
.price-list__button {
background: none;
border: none;
font-size: 16px;
line-height: 24px;
display: block;
padding: 10px 0 4px 0;
}
.price-list__details-box {
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.price-list__details {
max-height: 800px;
}
.price-list__details li {
padding: 0;
line-height: 20px;
}
.price-list .nch-icon-NCH_plus-filled {
margin-right: -5px;
margin-left: -10px;
color: #000;
font-size: 36px;
}
/*
price list table
*/
.price-list__table__benefit {
width: 35%;
}
.price-list__table__list {
width: 65%;
background: #F7F5F3;
border-radius: 12px;
}
.price-list__table {
vertical-align: top;
padding: 8px;
}
@media only screen and (min-width:0em) and (max-width:767px) {
.price-list__table__list,
.price-list__table__benefit {
width: 100%;
display: block;
}
.price-list__table {
display: block;
}
}
/*
price list benefit
*/
.price-list__details-benefit {
background: #d3f8fb;
font-size: 14px;
padding: 12px 20px;
}
.price-list__details-benefit li {
padding: 2px 0;
}
.price-list__details-benefit-list {
list-style: none;
margin: 0;
padding: 0;
}
.price-list__details-benefit-list__icon {
background: #00d8e9;
width: 20px;
height: 20px;
padding: 1px;
border-radius: 50%;
box-sizing: border-box;
display: inline-block;
vertical-align: middle;
}
.price-list__details-benefit-list__dsc {
display: inline-block;
font-weight: 500;
vertical-align: sub;
padding: 0 0 0 2px;
}
@media only screen and (min-width:768px) {
.priceList .dropdown__box {
min-width: 400px;
}
.scroll__container {
height: 400px;
}
}
.ff-add-room-button {
display: block;
padding: 6px 14px 6px 0;
color: #333;
font-size: 14px;
text-decoration: none;
margin: 0 0 10px 0;
}
.ff-add-room-button .nch-icon-NCH_plus-filled {
color: #00AA50;
}
.ff-add-room-button .nch-icon-NCH_plus-filled {
display: inline-block;
margin: -4px -4px 0 -8px;
}
.guest-rooms-conf--error {
margin: 10px -20px;
}
.guest-rooms-conf--error .ff-error {
border-radius: 0;
}
.room {
margin-bottom: 10px;
}
.room .room__title.h4 {
line-height: 40px;
border-bottom: 1px solid #E5E5E5;
margin-bottom: 15px;
text-transform: capitalize;
}
.room .small {
line-height: 40px;
text-decoration: underline;
}
.room .ff-add-room-button {
color: #222;
}
.room--footer {
padding: 20px;
margin: 0 -20px -20px -20px;
}
.search-bar {
background-color: #FFFFFF;
position: relative;
border-bottom: 1px solid #EAEAEA;
font-family: StrawberrySansText;
font-style: normal;
/*#searchField:focus {
box-shadow: 0 0 0 4px #83bffc inset;
outline: none;
}*/
}
.search-bar .search-cointainer-from {
padding-right: 4px;
}
.search-bar .search-cointainer-to {
padding-left: 4px;
}
.search-bar .nch-icon-cross-small {
color: #000;
}
.search-bar .dropdown__input {
display: flex;
align-items: center;
}
.search-bar .dropdown .dropdown__box {
border: none;
background: #FFFFFF;
box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.25);
border-radius: 8px;
z-index: 300;
}
.search-bar .dropdown .dropdown__box:before {
display: none;
}
.search-bar .dropdown .dropdown__box .dropdown__item:not(.no-hover):hover {
background-color: #F7F5F3;
}
.search-bar datepicker {
font-family: StrawberrySansText;
font-style: normal;
}
.search-bar datepicker [data-nch-style] {
border: none;
}
.search-bar datepicker [data-nch-style] .pika-day {
background-color: #fff;
color: #000;
border-radius: 8px;
border-radius: 39px;
font-weight: 400;
font-size: 16px;
line-height: 24px;
max-width: 35px;
}
.search-bar datepicker .is-disabled .pika-day {
color: #D8D4D0;
}
.search-bar datepicker [data-nch-style=between] .pika-day, .search-bar datepicker [data-nch-style=departure] .pika-day, .search-bar datepicker [data-nch-style=arrival] .pika-day {
background-color: #F9D9D8;
border: 1px solid #FFFFFF;
}
.search-bar datepicker .pika-select option {
font-weight: 700;
font-size: 14px;
line-height: 20px;
}
.search-bar datepicker .pika-table abbr {
font-weight: 400;
font-size: 14px;
line-height: 20px;
color: #403D3B;
text-decoration: none;
}
.search-bar .input {
border: none;
padding: 1rem;
background: #F5F5F5;
color: #1A1918;
font-weight: 400;
font-size: 14px;
line-height: 20px;
height: 3.5rem;
border-radius: 16px;
}
.search-bar .input::-webkit-input-placeholder {
color: #1A1918 !important;
}
.search-bar .input::-moz-placeholder {
color: #1A1918 !important;
}
.search-bar .input:-ms-input-placeholder {
color: #1A1918 !important;
}
.search-bar .dropdown-wrapper {
margin-bottom: 0.5rem;
}
.search-bar .ff-custom {
border-radius: 1rem;
text-transform: uppercase;
margin: 0;
font-family: inherit;
}
.search-bar .ff-custom.search-button {
margin: 0;
font-weight: 700;
font-size: 16px;
line-height: 24px;
background: #FC5E58;
border: 0px;
color: #000;
font-weight: 500;
text-transform: none;
padding: 1rem;
}
.search-bar .ff-custom::-moz-focus-inner {
padding: 0;
border: 0;
}
.search-bar .dropdown__box {
margin-top: 2px;
}
.search-bar custom-dropdown {
min-height: 40px;
margin-bottom: 0.5rem;
}
.search-bar .ff-error {
margin-top: -10px;
margin-bottom: 5px;
}
.ff-global-search + ul {
margin: 0;
}
.ff-global-search.searchSelected {
background: transparent;
}
.ff-global-search .nch-icon-close-x {
font-size: 19px;
position: absolute;
top: 1.2rem;
right: 1rem;
cursor: pointer;
display: none;
}
.ff-global-search.sended .nch-icon-close-x {
display: block;
color: #aaa;
}
.global-calendar--wide .search-bar .input {
border-radius: 0;
}
/*
Small only
*/
@media only screen and (max-width: 480px) {
.search-bar .search-bar__calendars {
overflow: hidden;
}
.search-bar .search-bar__calendars__left {
float: left;
}
.search-bar .search-bar__calendars__right {
float: right;
}
#AdvancedRoomsConfigurationModal .reveal-modal {
overflow-y: visible;
height: initial;
}
}
@media only screen and (min-width: 481px) {
.search-bar .search-cointainer-guests {
padding-left: 5px;
}
}
@media only screen and (min-width: 768px) {
.search-bar .ff-custom.search-button {
margin-left: 5px;
}
}
@media only screen and (max-width: 768px) {
.search-bar {
z-index: 300;
}
}
/*
Medium
*/
@media only screen and (min-width: 1024px) {
.search-bar .search-cointainer-location, .search-bar .search-cointainer-from, .search-bar .search-cointainer-to, .search-bar .search-cointainer-guests {
padding-left: 0px;
padding-right: 1px;
}
.search-bar .input {
border-radius: 0px;
}
.search-bar .search-cointainer-location .input {
border-radius: 16px 0px 0px 16px;
}
.search-bar .search-cointainer-guests .input {
border-radius: 0px 16px 16px 0px;
}
.search-bar .ff-custom.search-button {
margin-left: 0px;
border-top-right-radius: 16px;
border-bottom-right-radius: 16px;
}
.search-bar .dropdown__box {
width: 280px;
}
.global-calendar--sticky .search-bar {
height: 90px;
}
.global-calendar--sticky .search-bar .rabatcode {
opacity: 0;
}
.global-calendar--sticky .search-bar .ff-global-search {
margin-bottom: 0px;
}
.global-calendar--sticky .search-bar:hover, .global-calendar--sticky .search-bar:focus {
height: 120px;
}
.global-calendar--sticky .search-bar:hover .rabatcode, .global-calendar--sticky .search-bar:focus .rabatcode {
opacity: 1;
}
.search-bar {
position: fixed;
top: 4rem;
right: 0;
left: 0;
z-index: 999;
-webkit-transition: background 400ms, height 400ms;
transition: background 400ms, height 400ms;
}
.search-bar .input {
margin-bottom: 0;
}
.search-bar .rabatcode {
padding: 0.75rem 0 0;
text-align: center;
}
.search-bar .dropdown-wrapper {
margin-bottom: 0;
}
/*
FRONT PAGE
*/
.global-calendar--wide .search-bar {
top: 60px;
position: absolute;
margin-top: 90px;
background: transparent;
}
.global-calendar--wide .search-bar .input {
padding: 10px 15px;
}
.global-calendar--wide .search-bar .ff-custom {
line-height: 42px;
}
.global-calendar--wide .search-bar .input,
.global-calendar--wide .search-bar .ff-custom {
height: 60px;
font-size: 20px;
line-height: 40px;
}
.global-calendar--wide .search-bar .rabatcode {
top: 85px;
opacity: 1;
}
.global-calendar--wide .ff-global-search .input {
padding-right: 40px;
}
.global-calendar--wide .ff-global-search .nch-icon-close-x {
top: 20px;
right: 15px;
}
}
.front-page .search-bar .ff-custom {
background: #FC5E58;
border: 1px solid #FC5E58;
color: #002F3D;
font-weight: 500;
}
/* animation for collapse expand */
.is-search-bar-collapse .search-bar-collapse {
display: block;
}
.is-search-bar-collapse .search-bar-expanded {
display: none;
}
@media only screen and (min-width: 1024px) {
.is-search-bar-collapse.not-collapsed-on-load-for-desktop .search-bar-collapse {
display: none;
}
.is-search-bar-collapse.not-collapsed-on-load-for-desktop .search-bar-expanded {
display: block;
}
}
.search-bar-expanded {
min-height: 93px;
}
@media only screen and (max-width: 1024px) {
.search-bar-expanded {
min-height: 150px;
}
}
@media only screen and (max-width: 768px) {
.search-bar-expanded {
min-height: 231px;
}
}
@media only screen and (max-width: 481px) {
.search-bar-expanded {
min-height: 295px;
}
}
.search-bar-collapse {
display: none;
}
.search-bar-expanded {
display: block;
padding: 1rem;
max-width: 80rem;
margin: 0 auto;
}
/*
Medium
*/
.search-bar-collapse {
padding: 0.75rem 1rem;
overflow: hidden;
font-family: Roboto;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 24px;
text-align: center;
color: #000;
}
.search-bar-collapse__heading {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 700;
font-size: 14px;
line-height: 20px;
color: #000;
margin: 0;
padding-top: 1px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.search-bar-collapse__body {
display: -webkit-flex;
display: flex;
width: 100%;
line-height: 1.4;
}
.search-bar-collapse__data {
vertical-align: middle;
-webkit-flex: 1;
flex: 1;
overflow: hidden;
text-align: left;
}
.search-bar-collapse__data div {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 16px;
color: #403D3B;
}
.search-bar-collapse__data > div {
max-width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.search-bar-collapse__button {
text-align: right;
vertical-align: middle;
-webkit-align-self: center;
align-self: center;
}
.search-bar-collapse__edit {
display: inline-block;
background: transparent;
border-radius: 8px;
border: 1.5px solid #000;
color: #000;
padding: 0.5rem 1rem;
font-size: 1rem;
line-height: 1.5rem;
margin-left: 10px;
font-family: StrawberrySansText;
font-style: normal;
font-weight: 700;
font-size: 14px;
line-height: 20px;
}
.ie9 .search-bar-collapse:after {
content: "";
display: block;
clear: both;
}
.ie9 .search-bar-collapse__data {
width: 75%;
float: left;
}
.ie9 .search-bar-collapse__button {
width: 25%;
float: right;
margin-top: 3px;
}
.rabatcode {
padding: 0 0 5px;
color: #000;
margin-top: -7px;
}
.rabatcode div span, .rabatcode div a {
font-family: StrawberrySansText;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.rabatcode .btn-link-icon-secondary {
color: #000;
padding: 0px;
font-family: Roboto;
font-style: normal;
}
.rabatcode .remove-code-link:hover {
text-decoration: underline;
}
.rabatcode__link, .rabatcode__code {
color: #000;
display: inline-block;
}
.rabatcode__link:hover, .rabatcode__link:focus {
color: #000;
}
.rabatcode__code {
margin: 0 10px;
opacity: 0.8;
text-decoration: underline;
}
/*
Only for mobile sizes
*/
@media only screen and (min-width:0em) and (max-width:767px) {
.rabatcode {
padding: 15px 0;
}
}
[data-search-match=true] ~ .empty-search-message {
display: none;
}
/*
Small only
*/
@media only screen and (max-width: 480px) {
.campaignCalendar .campaign__calendars {
overflow: hidden;
}
.campaignCalendar .campaign__calendars__left {
float: left;
}
.campaignCalendar .campaign__calendars__right {
float: right;
}
}
.price-formatted {
font-family: StrawberrySansText, arial, helvetica, calibri, sans-serif;
line-height: 1rem;
font-weight: 700;
font-size: 0.75rem;
text-decoration: none;
}
.contact-us strong {
font-weight: 500;
}
.contact-us__title {
display: block;
font-size: 24px;
line-height: 1.3;
font-weight: 400;
margin: 0 0 20px 0;
}
.contact-us__form {
padding-right: 20px;
}
.contact-us__submit {
padding: 10px 0 30px 0;
border-bottom: 1px solid #c7c7c7;
}
.contact-us__details {
background: #EEFBFC;
padding: 20px;
}
.contact-us__details:after {
content: "";
border-bottom: 1px solid #668C98;
display: block;
padding-top: 20px;
}
.contact-us__details:last-child:after {
border: none;
}
.contact-us__details .footer__icon {
padding: 10px;
margin-left: -10px;
text-decoration: none;
}
.contact-us__details-link {
display: block;
line-height: 2;
box-sizing: border-box;
text-decoration: none;
}
.contact-us__details-link [class^=nch-icon-], .contact-us__details-link [class*=" nch-icon-"], .contact-us__details-link .nch-icon {
position: relative;
top: -2px;
font-size: 26px;
}
.contact-us__details-link .text-link {
line-height: 1.2;
}
.contact-us__details-link .nch-icon-link {
font-size: 18px;
padding-right: 6px;
}
.contact-us__details-link.btn-bordered {
padding: 7px 10px 5px;
line-height: 1.4;
float: right;
font-size: 16px;
}
.contact-us__details-link.group-booking {
max-width: none !important;
width: auto !important;
}
.contact-us__details-link--inactive {
margin: 0 0 5px 0;
border: 1px solid #97B4BB;
}
.contact-us__details-link + .ff-error {
clear: both;
overflow: hidden;
}
.contact-us__social-header {
padding-bottom: 16px;
}
/*
Small
*/
@media only screen and (max-width: 480px) {
.contact-us__extra-desc {
margin-top: 30px;
}
.contact-us__details-link.btn-bordered {
margin-top: 15px;
}
}
.password-change {
max-width: 350px;
margin: 40px 20px;
}
.password-change__intro {
margin-bottom: 20px;
}
.password-change__terms {
font-size: 14px;
margin-bottom: 20px;
}
.password-change__terms .text-link {
font-weight: normal;
}
@media only screen and (min-width:768px) {
#changePasswordModal .reveal-modal.small {
max-width: 560px;
margin-left: -280px;
}
}
.password-indicator__show {
position: absolute;
top: 10px;
right: 10px;
border: none;
padding: 0 5px;
color: #336676;
font-weight: normal;
}
.password-indicator .input {
padding-right: 70px;
}
.password-indicator__left-characters {
display: inline-block;
font-size: 14px;
margin: 5px 0;
}
.password-indicator__strngth {
display: inline-block;
font-size: 14px;
margin: 5px 0;
}
.password-indicator__strngth ul {
list-style: none;
margin: 0;
padding: 0;
display: inline-block;
overflow: hidden;
}
.strength__item {
float: left;
width: 5px;
height: 5px;
margin-right: 5px;
border-radius: 50%;
}
.strength__null .strength__item {
background: #ccd9dd;
}
.strength__poor {
background: #d0021b;
}
.strength__weak {
background: #f5a623;
}
.strength__nice {
background: #f5d123;
}
.strength__good {
background: #f8e71c;
}
.strength__perfect {
background: #00ab4c;
}
.strength__0 .strength__weak,
.strength__0 .strength__nice,
.strength__0 .strength__good,
.strength__0 .strength__perfect {
background: #ccd9dd;
}
.strength__1 .strength__nice,
.strength__1 .strength__good,
.strength__1 .strength__perfect {
background: #ccd9dd;
}
.strength__2 .strength__good,
.strength__2 .strength__perfect {
background: #ccd9dd;
}
.strength__3 .strength__perfect {
background: #ccd9dd;
}
.checkout-autocomplete {
position: relative;
z-index: 1;
}
.checkout-autocomplete .ui-autocomplete {
padding: 10px 0;
margin: 8px 0 0;
list-style: none;
background: #fff;
border: 1px solid #c3c3c3;
position: static !important;
}
.checkout-autocomplete .ui-menu-item {
padding-left: 0;
padding: 0;
margin: 0 0 2px;
border-bottom: 1px solid #bbb;
}
.checkout-autocomplete .ui-menu-item:last-child {
border: none;
}
.checkout-autocomplete .ui-state-focus {
background: #EEFBFC;
}
.checkout-autocomplete a {
text-decoration: none;
padding: 2px 10px;
font-weight: 400;
display: block;
}
@media only screen and (min-width: 481px) {
.checkout-autocomplete {
overflow: hidden;
position: absolute;
}
}
/*# sourceMappingURL=grouped-components.css.map */