.container { width: auto; max-width: 1266px; } /*** GLOBAL: colors ***/ :root{ --HEADLINE_COLOR: #000; --TEXT_COLOR: #53565A; --TEXT2_COLOR: #647280; --TEXT3_COLOR: #202020; --GREY_COLOR: #92979C; --GREY2_COLOR: #ddd; --GREY3_COLOR: #eee; --BORDER_COLOR: #ddd; --BLACK_COLOR: #000; --WHITE_COLOR: #fff; --BRAND_COLOR: #382245; --BRAND2_COLOR: #54336A; --BRAND3_COLOR: #c62525; --BRAND4_COLOR: #9e0918; --BRAND5_COLOR: #29343d; --LINK_COLOR: #c20808; --BG_COLOR: #fff; --RED_COLOR: var(--BRAND3_COLOR); --GREEN_COLOR: #09b92c; --LIGHT_COLOR: #f7f7f8; } /*** GLOBAL: styles ***/ body { font-size: .875rem; line-height: 1.3; background: var(--BG_COLOR); color: var(--TEXT_COLOR); font-family: NotoSans,'Open Sans',Arial,Helvetica,sans-serif; overflow-x: hidden; -webkit-font-smoothing: antialiased; } /*** 16px = 1rem 15px = .9375rem 14px = .875rem 13px = .8125rem 12px = .75rem 11px = .6875rem ***/ *::-moz-selection { background-color: var(--BRAND_COLOR); color: var(--WHITE_COLOR); } :focus { outline: /*1px dotted*/none; } .device-mobile :focus { outline: none; } .clear { clear: both; height: 0; line-height: 0; display: block; } body .data { display: none; font-size: 10px; } body.data .data { display :block; word-wrap: break-word; width: 100px; text-align: left; margin: auto; } body.show-overlay:after { background: rgba(31,33,43, .4); top: 0; left: 0; z-index: 1000; position: fixed; width: 100%; height: 100%; display: block; content:""; } .above-overlay { z-index: 10001; } #skip2content { position: absolute; top: -20px; left: 0; float: left; line-height: 20px; font-size: 10px; text-transform: uppercase; color: #fff; background: var(--TEXT_COLOR); padding: 0 10px; z-index: 1000; } #skip2content:hover, #skip2content:focus { top: 0; text-decoration: none; } #hereiscontent { color: transparent; display: block; height: 20px; margin-bottom: -20px; outline: none; text-indent: -9999px; text-align: left; } .with-shadow { -webkit-box-shadow: rgba(0,0,0, .5) 0 1px 5px; -moz-box-shadow: rgba(0,0,0, .5) 0 1px 5px; box-shadow: rgba(0,0,0, .5) 0 1px 5px; } .with-border { border: 1px solid var(--BORDER_COLOR); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .with-border:hover, .with-border:focus { border-color: var(--GREY_COLOR); -webkit-box-shadow: rgba(0,0,0, .2) 0 1px 5px; -moz-box-shadow: rgba(0,0,0, .2) 0 1px 5px; box-shadow: rgba(0,0,0, .2) 0 1px 5px; } .only-mobile { display: none; } .wow { visibility: hidden; } .device-desktop .desktop-show, .device-mobile .nondesktop-show { visibility: visible; } .device-desktop .nondesktop-show, .device-mobile .desktop-show { visibility: hidden; } /*** GLOBAL: transition effect ***/ a, button, input:focus, input[type="button"], input[type="reset"], input[type="submit"], textarea:focus, .btn:not(.regions-block-trigger), .with-border, .header-trigger.with-dropdown em, #user-trigger:after, .voucher-item .voucher-tc .voucher-tc-link:after, .claimpoints-step.passed *, .box-btns a:after, #user-missingpoints h2 button em, #help-faqs .tab-pane h4:after { -webkit-transition: all 0.05s ease-in-out; -moz-transition: all 0.05s ease-in-out; -ms-transition: all 0.05s ease-in-out; -o-transition: all 0.05s ease-in-out; transition: all 0.05s ease-in-out; } /*** CONTENT > TYPOGRAPHY ***/ a, a:visited { color: var(--LINK_COLOR); cursor: pointer; } a:hover, a:focus { color: var(--BRAND2_COLOR); text-decoration: underline; } p { line-height: 1.4; margin-bottom: 20px; } strong { font-weight: bold; } h1, h2, h3, h4, h5, h6 { color: var(--HEADLINE_COLOR); line-height: 1; font-weight: normal; } h1 { font-size: 2.25rem; } h2 { font-size: 2rem; margin-bottom: 20px; } h3 { font-size: 1.75rem; } .lead { font-size: 1.5rem; font-weight: normal; } /*** GLOBAL > BTN: rewritten bootstrap styles ***/ .btn-as-link { border: none; background: transparent; padding: 0; width: 100%; } .btn, .btn:visited { font-size: 1rem; line-height: 1.3; padding: 12px 30px; font-weight: 700; text-transform: uppercase; background: var(--BRAND_COLOR); border-width: 2px; border-color: var(--BRAND_COLOR); text-decoration: none !important; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .btn-sm, .btn-sm:visited { font-size: .875rem; padding: 8px 30px; } .btn-primary, .btn-primary:visited { color: var(--WHITE_COLOR); background: var(--BRAND_COLOR); border-color: var(--BRAND_COLOR); --bs-btn-active-bg: var(--BRAND2_COLOR); --bs-btn-active-border-color: var(--BRAND2_COLOR); } .btn-primary:hover, .btn-primary:focus { color: var(--WHITE_COLOR); background: var(--BRAND2_COLOR); border-color: var(--BRAND2_COLOR); } .btn-primary.btn-transparent, .btn-primary.btn-transparent:visited { color: var(--BRAND_COLOR); background: var(--WHITE_COLOR); border-color: var(--BRAND_COLOR); } .btn-primary.btn-transparent:hover, .btn-primary.btn-transparent:focus { color: var(--WHITE_COLOR); background: var(--BRAND2_COLOR); border-color: var(--BRAND2_COLOR); } .btn-secondary, .btn-secondary:visited { color: var(--WHITE_COLOR); background: var(--BRAND5_COLOR); border-color: var(--BRAND5_COLOR); --bs-btn-active-bg: var(--BRAND5_COLOR); --bs-btn-active-border-color: var(--BRAND5_COLOR); } .btn-secondary:hover, .btn-secondary:focus { color: var(--WHITE_COLOR); background: var(--BRAND5_COLOR); border-color: var(--BRAND5_COLOR); } .btn-secondary.btn-transparent, .btn-secondary.btn-transparent:visited { color: var(--BRAND5_COLOR); background: var(--WHITE_COLOR); border-color: var(--BRAND5_COLOR); } .btn-secondary.btn-transparent:hover, .btn-secondary.btn-transparent:focus { color: var(--WHITE_COLOR); background: var(--BRAND5_COLOR); border-color: var(--BRAND5_COLOR); } .btn-lg, .btn-lg:visited { padding: 15px 70px; } .btn:active, .btn.clicked { position: relative; top: 1px; } /*** rhg-font-icon ***/ .with-rhg-icon span { display: flex; flex-direction: row; justify-content: center; align-items: baseline; gap: 8px; } .with-rhg-icon big { font-size: inherit; display: inline-flex; } .with-rhg-icon em[class*="rhg-font-icon-"] { font-size: 1rem; display: inline-flex; } /*** STRUCTURE > HEADER ***/ #header { min-height: 100px; color: var(--TEXT_COLOR); background: var(--BG_COLOR); border-bottom: 1px solid var(--BORDER_COLOR); } #header > .container { position: relative; } #logo { float: left; width: 250px; margin: 31px 0 30px; overflow: hidden;} #header-top > .container, #header > .container, #mainmenu > .container { max-width: 100%; padding: 0 50px; } /*** STRUCTURE > HEADER: header-top ***/ #header-top { min-height: 24px; display: block; background: var(--BG_COLOR); } #header-top .mainsite-link { float: left; } .mainsite-link { font-size: .8125rem; padding: 8px 0 0; } .mainsite-link a, .mainsite-link a:visited { text-decoration: none; font-weight: bold; } .mainsite-link a:hover, .mainsite-link a:focus { text-decoration: underline; } /*** HEADER TOP > ADDITIONAL MENU ***/ #header-top-additional-menu { float: right; height: 35px; } #header-top-additional-menu ul { padding: 5px 0 0; } #header-top-additional-menu a, #header-top-additional-menu a:visited { line-height: 25px; padding: 0 15px; border: 1px solid var(--BRAND_COLOR); color: var(--WHITE_COLOR); background: var(--BRAND2_COLOR); font-weight: 500; display: block; text-decoration: none; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } #header-top-additional-menu a:hover, #header-top-additional-menu a:focus { color: var(--WHITE_COLOR); background: var(--BRAND_COLOR); } /*** HEADER TOP > REGIONS + LANGS ***/ #regions-block { float: right; padding: 30px 0 0 15px; } #regions-block-trigger { font-size: .8125rem; color: var(--BRAND_COLOR); height: 40px; padding: 0 12px; text-transform: uppercase; border: 2px solid var(--BRAND_COLOR); } #regions-block-trigger.hover, #regions-block-trigger.focus { color: var(--WHITE_COLOR); border: 2px solid var(--BRAND5_COLOR); } #regions-block-trigger:after { clear: both; display: block; content:""; } #regions-block-trigger img { width: 13px; float: right; margin: 6px 10px 0 0; } #regions-block-trigger span { float: right; } #regions-block-trigger span:after { display: none; font-size: .75rem; font-weight: normal; top: 0; } #regions-block-trigger region { display: inline-block; line-height: 36px; } #regions-block-trigger language { display: inline-block; line-height: 36px; padding: 0 0 0 40px; margin-left: 10px; background: url("../images/icon-language.svg") no-repeat 15px 9px / 17px auto; position: relative; } #regions-block-trigger language:before { display: block; width: 0; height: 22px; position: absolute; top: 7px; left: 0; border-left: 1px solid var(--BRAND_COLOR); content:""; } #regions-block-trigger.hover language, #regions-block-trigger.focus language { background-image: url("../images/icon-language-white.svg"); } #regions-block-trigger.hover language:before, #regions-block-trigger.focus language:before { border-color: var(--WHITE_COLOR); } #regions-dropdown { width: 260px; padding: 20px; position: absolute; top: 80px; right: 5px; } #regions-dropdown .form-group { margin-bottom: 30px; } #regions-dropdown label { font-size: .9375rem; margin-bottom: 8px; font-weight: 700; } #regions-dropdown .form-submit .btn { width: 100%; } .region-switcher, .lang-switcher { position: relative; } .region-switcher:before, .lang-switcher:before { display: block; width: 25px; height: 25px; position: absolute; top: 35px; left: 10px; background: transparent url(../images/icon-globe.svg) no-repeat 0 center / 25px auto; z-index: 1; content:""; } .lang-switcher:before { top: 37px; background-image: url(../images/icon-language.svg); background-size: 21px auto; } .region-switcher select, .lang-switcher select { padding-left: 40px; } .select-css { display: block; font-size: 1.125rem; font-family: inherit; font-weight: normal; color: var(--TEXT_COLOR); line-height: 1.3; padding: 7px 15px; margin: 0; width: 100%; max-width: 100%; box-sizing: border-box; border: 1px solid var(--BORDER_COLOR); box-shadow: none; border-radius: 0; -moz-appearance: none; -webkit-appearance: none; appearance: none; background-color: #fff; background-image: url(../images/angle-down-regular.svg); background-repeat: no-repeat, repeat; background-position: right .7em top 50%, 0 0; background-size: .8em auto, 100%; position: relative; } .select-css::-ms-expand { display: none; } .select-css:hover { border-color: none; } .select-css:focus { border-color: var(--GREY_COLOR); box-shadow: none; box-shadow: none -moz-mac-focusring; color: var(--TEXT_COLOR); outline: none; /*background-image: url(images/angle-up-regular.svg);*/ } .select-css option { font-size: 1rem; font-weight: normal; padding: 0; } /*** STRUCTURE > HEADER: mobile buttons ***/ #mobile-triggers, #menu-trigger, #user-mobile-trigger { display: none; } #mobile-triggers { float: right; position: relative; margin-right: -.75rem; margin-right: 10px; } #search-trigger { font-size: 1.375rem; width: 50px; height: 100px; color: var(--BRAND_COLOR); float: left; } #search-trigger img { width: 24px; } #search-trigger.open { color: var(--GREY3_COLOR); } #menu-trigger, #user-mobile-trigger { font-size: 1.375rem; width: 50px; height: 50px; float: left; color: var(--BRAND_COLOR); margin-left: -12px; } #user-mobile-trigger { font-size: 1rem; } #mainmenu-trigger { color: var(--WHITE_COLOR); font-size: 1.375rem; position: absolute; top: 0; left: 0; height: 50px; width: 50px; z-index: 1000; /* border-left: 1px solid rgba(255,255,255,0.2); border-bottom: 1px solid rgba(255,255,255,0.2); */ background: url(../images/icn_menu_reverse.svg) no-repeat center center / 22px auto; } #menu-trigger em, #user-mobile-trigger em, #mainmenu-trigger em { line-height: 50px; } /*** SEARCH: ICON *** copied from responsive styles to show search ICON from start. It was in 1155px reolution ***/ #mobile-triggers { display: block; } #header #search-wrapper { display: none; } #user-block { padding-left: 18px; } #loggedin-box, #mobile-triggers { margin-right: 0; } #fav-block { margin-right: 5px; } .logged-in #header #search-wrapper { padding-right: 0; } /*** HEADER: top menu ***/ #header-topmenu { float: left; position: relative; top: 42px; margin-left: 40px; } #header-topmenu li { padding: 0 10px; } #header-topmenu a, #header-topmenu a:visited { color: var(--TEXT3_COLOR); line-height: 1.3; font-weight: 700; text-decoration: none; } #header-topmenu a:hover, #header-topmenu a:focus { text-decoration: underline; } .topmenu-more { position: relative; } #topmenu-more-dropdown { position: absolute; width: 200px; left: 0; top: 30px; margin: 0; padding: 10px 20px; } #header-topmenu #topmenu-more-dropdown a, #header-topmenu #topmenu-more-dropdown a:visited { font-size: .875rem; } #topmenu-more-dropdown li { padding: 5px 0; } #topmenu-more-dropdown li.hidden { display: none; } #topmenu-more-trigger span:after { font-size: 12px; top: -1px; } .langES #header-topmenu, .langDE #header-topmenu { margin-left: 40px; } .langDE #header-topmenu .topmenu-5 { display: none; } .langDE #header-topmenu #topmenu-more-dropdown .topmenu-5 { display: block; } /*** STRUCTURE > HEADER: nav ***/ #mainmenu { height: 50px; padding: 0; color: var(--TEXT3_COLOR); background: var(--WHITE_COLOR); border-bottom: 1px solid var(--BORDER_COLOR); position: relative; } #mainmenu ul { margin: 0; } #mainmenu ul li a, #mainmenu ul li a:visited { font-size: 1rem; line-height: 50px; font-weight: 700; margin: 0 2px; padding: 0 20px; color: var(--TEXT3_COLOR); text-decoration: none; display: block; } #mainmenu ul li a:hover, #mainmenu ul li a:focus { color: var(--BRAND_COLOR); } #mainmenu ul li.active a, #mainmenu ul li.active a:visited { color: var(--BRAND_COLOR); } #mainmenu ul li:last-child a, #mainmenu ul li:last-child a:visited { margin-right: 0; } /*** subcategories ***/ #header-categories { padding: 20px 0 30px; width: 100%; position: absolute; top: 50px; border-top: 4px solid var(--TEXT_COLOR); background: rgba(83,86,90, .95); -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #header-categories h3 { font-size: 1.5rem; color: var(--TEXT_COLOR); padding: 0 0 15px; margin: 0 0 15px; border-bottom: 1px solid var(--BORDER_COLOR); } #header-categories ol { margin: 0 0 0 15.2%; padding: 0; list-style: none; -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } #header-categories ol li { } #header-categories ol li a, #header-categories ol li a:visited { font-size: .875rem; padding: 8px 0; color: var(--WHITE_COLOR); text-decoration: none; display: block; text-transform: none; } #header-categories ol li a:hover, #header-categories ol li a:focus { color: var(--WHITE_COLOR); text-decoration: underline; } #header-categories ol li.active a, #header-categories ol li.active a:visited { color: var(--WHITE_COLOR); font-weight: bold; text-decoration: none; cursor: default; } .submenu-categories--toplevel { margin-bottom: 5px; } .submenu-categories--toplevel a { font-weight: bold; } /*** HEADER > header-trigger - element with dropdown list ***/ .header-dropdown { display: none; background: var(--WHITE_COLOR); z-index: 1001; padding: 20px 0; position: relative; clear: both; width: 100%; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .header-dropdown .dropdown-close { display: none; font-size: 24px; color: var(--TEXT_COLOR); top: 5px; right: 5px; position: absolute; padding: 5px 10px; line-height: 1; } body.browser-Internet.Explorer .header-dropdown .dropdown-close { right: 15px; } /*** > ***/ .header-trigger { position: relative; display: block; white-space: nowrap; } .header-trigger.with-dropdown span:after { font-size: 13px; padding-left: 5px; position: relative; top: -1px; display: inline-block; width: 10px; height: 10px; font-weight: bold; content:"\f054"; font-family: "Font Awesome 5 Pro"; } .header-trigger.with-dropdown.open span:after { content:"\f078"; } /* MENU > bottom LINE we show only for desktop because on ipad an action to open dropdown menu needs 2 clicks */ .is-desktop #mainmenu ul.nav > li > a > span { display: inline-block; display: block; position: relative; } .is-desktop #mainmenu ul.nav > li > a > span:before { background: var(--BRAND_COLOR); width: 0px; height: 2px; position: absolute; bottom: 0; left: 50%; display: block; content:""; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); } .is-desktop #mainmenu ul.nav > li > a:hover > span:before, .is-desktop #mainmenu ul.nav > li > a:focus > span:before, .is-desktop #mainmenu ul.nav > li.active > a > span:before, .is-desktop #mainmenu ul.nav > li > a.open > span:before { width: 100%; } .is-desktop #mainmenu ul.nav > li.active > a > span:before { background: var(--LINK_COLOR); } /*** HEADER > SEARCH ***/ #header #search-wrapper { float: right; padding-right: 22px; margin: 30px 0 0 0; } #header #search-wrapper form { width: 165px; position: relative; } #search-wrapper #s, #mobile-s { font-size: .875rem; width: 100%; height: 35px; font-weight: 700; padding: 10px 0 10px 35px; color: var(--BLACK_COLOR); background: transparent; border: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #search-wrapper #s { border-bottom: 1px solid transparent; } #search-wrapper #s.focus, #mobile-s:focus { border-color: var(--TEXT_COLOR); } #search-wrapper label { display: block; top: 8px; left: 5px; position: absolute; } #search-wrapper button { font-size: 18px; width: 30px; height: 36px; top: 0; left: 0; position: absolute; padding-bottom: 5px; visibility: hidden; } .logged-in #header #search-wrapper { border: none; margin-right: 0; padding-right: 10px; } /*** placeholder ***/ #search-form .form-control:-webkit-input-placeholder { color: var(--BLACK_COLOR) !important; /* Chrome/Opera/Safari */ } #search-form .form-control::-webkit-input-placeholder { color: var(--BLACK_COLOR) !important; /* Chrome/Opera/Safari */ } #search-form .form-control:-moz-placeholder { color: var(--BLACK_COLOR) !important; /* Firefox 18- */ } #search-form .form-control::-moz-placeholder { color: var(--BLACK_COLOR) !important; /* Firefox 19+ */ } #search-form .form-control:-ms-input-placeholder { color: var(--BLACK_COLOR) !important; /* IE 10+ */ } /*** HEADER > SEARCH: search on mobile ***/ #search-mobile-wrapper { display: none; position: absolute; top: 100px; padding: 0; background: var(--WHITE_COLOR); -moz-box-shadow: rgba(0,0,0, .2) 0 1px 5px; box-shadow: rgba(0,0,0, .2) 0 1px 5px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #search-wrapper .navbar-form fieldset { width: 100%; } #search-wrapper #mobile-s { font-size: 1rem; color: var(--TEXT_COLOR); height: 50px; padding: 20px 65px 20px 15px; } #search-mobile-wrapper #search-close { display: none; } #search-mobile-wrapper #search-wrapper { margin: 0; float: none; width: auto; position: relative; top: auto; left: 0;} #search-mobile-wrapper #search-wrapper .navbar-form button { width: 50px; height: 50px; padding-bottom: 0; background-color: var(--BRAND_COLOR); left: auto; right: 0; visibility: visible; } #search-mobile-wrapper #search-wrapper .navbar-form button img { width: 22px; } #search-mobile-wrapper #search-wrapper .navbar-form button em { height: 50px; line-height: 50px; } #search-mobile-wrapper #search-wrapper .navbar-form label { display: none; } /*** HEADER > SEARCH: search on mobile > placeholder ***/ #search-mobile-wrapper .form-control:-webkit-input-placeholder { color: var(--TEXT_COLOR) !important; /* Chrome/Opera/Safari */ } #search-mobile-wrapper .form-control::-webkit-input-placeholder { color: var(--TEXT_COLOR) !important; /* Chrome/Opera/Safari */ } #search-mobile-wrapper .form-control:-moz-placeholder { color: var(--TEXT_COLOR) !important; /* Firefox 18- */ } #search-mobile-wrapper .form-control::-moz-placeholder { color: var(--TEXT_COLOR) !important; /* Firefox 19+ */ } #search-mobile-wrapper .form-control:-ms-input-placeholder { color: var(--TEXT_COLOR) !important; /* IE 10+ */ } /*** HEADER > SEARCH: autocomplete ***/ .autocomplete-suggestions { font-size: .875rem; margin-top: 1px; z-index: 1001 !important; border-color: var(--BORDER_COLOR); -webkit-box-shadow: rgba(0,0,0, .2) 0 1px 15px; -moz-box-shadow: rgba(0,0,0, .2) 0 1px 15px; box-shadow: rgba(0,0,0, .2) 0 1px 15px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .autocomplete-suggestion { font-size: .8125rem; padding: 5px 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; cursor: pointer; } .autocomplete-suggestion:hover, .autocomplete-suggestion:focus { background: var(--BG_COLOR); } .autocomplete-suggestion strong { color: var(--RED_COLOR); font-weight: normal; } .autocomplete-suggestion:last-child {border-top: 1px solid var(--BORDER_COLOR); padding: 7px; } .autocomplete-suggestion:last-child:after { font-size: .875rem; width: 100px; margin: auto; padding: 5px 20px; color: var(--WHITE_COLOR); border: 1px solid var(--BRAND_COLOR); background: var(--BRAND_COLOR); font-weight: normal; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } /*** STRUCTURE > HEADER: header-blocks ***/ #header-blocks { float: right; } /*** HEADER > USER BLOCK ***/ #user-block { position: relative; float: left; padding-left: 17px; } #user-block:before { border-left: 1px solid var(--BORDER_COLOR); height: 40px; position: absolute; top: 30px; left: 0; width: 0; content:""; } /*** HEADER > USER BLOCK: logged OUT ***/ #loggedout-box a { font-size: .75rem; line-height: 36px; padding: 0 16px; display: inline-block; text-decoration: none; white-space: nowrap; text-transform: uppercase; } #loggedout-box .link-login { } #loggedout-box .link-register { margin-left: 10px; padding: 0 20px; } /*** HEADER > USER BLOCK: logged IN ***/ #loggedin-box { margin-right: 5px; } #loggedin-box:after { clear: both; display: block; width: 100%; content:''; } #loggedout-box { padding-top: 30px; } #user-block .usertitle, #user-block .userpoints { float: left; white-space: nowrap; } #user-block .usertitle { padding-left: 38px; background: url(../images/icon-profile.svg) no-repeat 0px center / 30px auto; } #user-block .usertitle span { display: block; font-size: .8125rem; line-height: 1.2; } #user-block .usertitle span.username { font-size: .875rem; text-transform: uppercase; font-weight: 700; display: block; max-width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #user-block .userpoints { margin-right: 20px; position: relative; } #user-block .userpoints strong { font-size: 1.0625rem; color: var(--BRAND_COLOR); font-weight: 700; display: block; text-align: right; line-height: 1.3; } #user-block .userpoints span { font-size: .6875rem; color: var(--BRAND_COLOR); display: block; line-height: 1.1; text-align: right; top: -2px; position: relative; } #user-block .userpoints span, .user-welcome { opacity: 1; } /* i */ #user-block .userpoints em { font-size: .5625rem; top: 4px; right: -15px; width: 12px; height: 12px; background: var(--TEXT_COLOR); color: var(--WHITE_COLOR); display: block; line-height: 11px; font-style: normal; text-align: center; position: absolute; font-weight: 600; cursor: help; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } #user-trigger { color: var(--TEXT3_COLOR); height: 100px; text-align: left; position: relative; padding-right: 20px; } #user-trigger:after { font-size: 1.0625rem; display: block; transform: rotate(-90deg); text-align: right; position: absolute; top: 48px; right: 0; left: auto; width: 20px; height: 20px; content:"\f078"; font-family:'Font Awesome 5 Pro'; } #user-trigger.open:after { transform: rotate(0); } #user-trigger.with-dropdown span:after { display: none; } /*** HEADER > USER BLOCK: dropdown ***/ #userlinks { position: absolute; top: 0; right: 0; z-index: 1001; } #submenu-user, #favblock-dropdown { border: none; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } #submenu-user, #favblock-dropdown { top: 78px; width: 180px; font-size: .875rem; background: var(--BRAND5_COLOR); position: absolute; left: -20px; margin: 0; padding: 0; text-align: left; z-index: 10001; overflow: hidden; } #submenu-user { border-bottom: none; width: 280px; right: 0; left: auto; background: var(--TEXT_COLOR); } #submenu-user ul, #submenu-user-mobile ul { margin: 0; padding: 0; } #submenu-user ul li, #submenu-user-mobile ul li { list-style: none; padding: 0; margin: 0; border-bottom: 1px solid var(--WHITE_COLOR); } #submenu-user ul li:last-of-type, #submenu-user-mobile ul li:last-of-type { border: none; } #submenu-user a, #submenu-user a:visited { font-size: .9375rem; color: var(--WHITE_COLOR); line-height: 1.3; padding: 16px 20px; position: relative; display: block; font-weight: 700; text-decoration: none; } #submenu-user a:hover, #submenu-user a:focus { color: var(--WHITE_COLOR); text-decoration: underline; } #submenu-user a em, #submenu-user-mobile a em { display: none; position: absolute; top: 9px; right: 15px; } #user-block #submenu-user.dropdown-menu .divider { background: rgba(0,0,0,0.2); margin: 8px 0 3px; } #user-block #submenu-user .usermenu-summary { display: none; color: var(--WHITE_COLOR); padding: 24px 20px; } #user-block #submenu-user .usermenu-summary .username { font-size: 1rem; max-width: 220px; text-transform: uppercase; font-weight: 700; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #user-block #submenu-user .usermenu-summary .userpoints { float: none; margin: 0; } #user-block #submenu-user .usermenu-summary .userpoints strong { color: var(--WHITE_COLOR); text-align: inherit; display: inline; } #user-block #submenu-user .usermenu-summary .userpoints span { font-size: .875rem; color: var(--WHITE_COLOR); text-align: inherit; display: inline; top: auto; } .user-details-logout { background: #efefef; color: var(--TEXT_COLOR); border-top: 1px solid #d8d8d8; overflow: hidden; padding: 5px 0px; margin-top: 10px; } /*** HEADER > FAV-block ***/ #fav-block { position: relative; float: left; width: 50px; margin: 0 10px 0 0; } #fav-trigger { width: 100%; height: 100px; display: block; } #fav-trigger span { position: relative; display: block; height: 100%; } /*#fav-trigger span:after { display: none !important; }*/ #fav-trigger .fa-heart { font-size: 26px; color: var(--RED_COLOR); line-height: 100px; display: block; position: relative; top: auto; left: auto; right: auto; } #fav-number { font-size: 11px; top: 26px; right: 0; line-height: 18px; min-width: 18px; padding: 1px 5px 1px; font-weight: 400; color: var(--WHITE_COLOR); background: var(--RED_COLOR); position: absolute; text-align: center; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } #fav-block div.more { border: none; text-align: right; } #fav-block .more a, #fav-block .more a:visited { font-size: .8125rem; color: var(--WHITE_COLOR); padding: 15px; display: block; text-decoration: none; } #fav-block .more a:hover, #fav-block .more a:focus { text-decoration: underline; } #fav-block .more a em { display: none; } /*** fav block ***/ #favblock-dropdown { width: 260px; padding: 0; } #fav-block .merchants-list { display: block; margin: 0; padding: 0; } #fav-block .item { display: none !important; float: none; width: auto; height: auto !important; margin: 0px !important; padding: 0; } #fav-block .item:nth-child(1), #fav-block .item:nth-child(2), #fav-block .item:nth-child(3) { display: block !important; } #fav-block .merchant-item { padding: 10px 55px 10px 15px; background: transparent; text-align: left; border: none; border-bottom: 1px solid var(--WHITE_COLOR); -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #fav-block .merchant-item:hover, #fav-block .merchant-item:focus { background: rgba(255,255,255, .05); -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } #fav-block .merchant-banner, #fav-block .merchant-icons, #fav-block .merchant-rates-was { display: none; } #fav-block .merchant-title .merchant-link, #fav-block .merchant-rates, #fav-block .fav-remove { color: var(--WHITE_COLOR); } #fav-block .merchant-title { font-size: .8125rem; display: block; max-height: auto; min-height: auto; height: auto; margin: 0; font-weight: normal; } #fav-block .merchant-rates { display: block; margin-bottom: 0; } #fav-block .fav-remove { position: absolute; top: 3px; right: 0; height: 44px; line-height: 44px; width: 44px; text-align: center; padding: 0; } #fav-block .fav-remove:hover, #fav-block .fav-remove:focus { color: var(--RED_COLOR); background: rgba(255,255,255, .1); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #fav-block .fav-remove em { line-height: 42px; } #fav-block .fav-remove em:before { font-size: 1.25rem; content:"\f00d"; font-weight: 300; } #favblock-content .nomerchants { padding: 15px; } /*** fav block in NAV ***/ #mainmenu #fav-block { float: left; width: auto; height: 64px; margin: 0; } #mainmenu #fav-block #fav-trigger { color: var(--TEXT_COLOR); line-height: 64px; padding: 0 25px; white-space: nowrap; } #mainmenu #fav-trigger .fa-heart { display: none; } #mainmenu #fav-number { display: none; font-size: 11px; top: 9px; right: -20px; background: #fff; border: 1px solid #b1b2ba; color: var(--RED_COLOR); line-height: 15px; } .logged-in #mainmenu #fav-number { display: block; } /*** CAROUSEL > OWL ***/ .owl-dots, .owl-theme .owl-nav.disabled + .owl-dots { bottom: 0; text-align: center; margin-top: 5px; } .owl-theme .owl-nav { margin-top: 20px; } .owl-dots .owl-dot { display: inline-block; } .owl-theme .owl-dots .owl-dot span { background: var(--GREY_COLOR); width: 8px; height: 8px; margin: 0 3px; display: block; position: relative; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .owl-theme .owl-dots .owl-dot.active span { background: var(--BRAND_COLOR); } .owl-nav { margin: 0; text-align: center; margin-top: 20px; margin-bottom: 0; width: auto; } .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next { opacity: 1; font-size: 1.5rem; color: var(--BRAND2_COLOR); width: 36px; height: 36px; margin: 0 10px; border: 2px solid var(--BRAND_COLOR); background: var(--WHITE_COLOR); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: rgba(0,0,0, .2) 0 1px 5px; -moz-box-shadow: rgba(0,0,0, .2) 0 1px 5px; box-shadow: rgba(0,0,0, .2) 0 1px 5px; } .owl-nav button em { font-weight: 400; background: transparent; line-height: 32px; } .owl-nav button.owl-prev em { margin-left: -3px; } .owl-nav button.owl-next em { margin-left: 3px; } .owl-carousel .owl-nav button.owl-prev:hover, .owl-carousel .owl-nav button.owl-next:hover { opacity: 1; color: var(--WHITE_COLOR); background: var(--BRAND2_COLOR); border-color: var(--BRAND_COLOR); } .owl-carousel .owl-nav button.owl-prev.clicked, .owl-carousel .owl-nav button.owl-next.clicked { opacity: 1; left: -2px; position: relative; background: var(--TEXT_COLOR); border-color: var(--TEXT_COLOR); } .owl-carousel .owl-nav button.owl-next.clicked { left: 2px; } .carousel-2-rows .owl-nav { margin-top: 0; } .owl-carousel .owl-stage-outer { padding-left: 1px; } .with-carousel .owl-carousel .owl-stage-outer { padding-bottom: 5px; } /*** fix to equal height of cells inside a carousel ***/ .owl-stage { display: flex; } .owl-stage .owl-item { float: none; } .owl-stage .owl-item .column { height: 100%; } .owl-stage .owl-item .column .merchant-item { height: calc(50% - 24px) !important; } .box .owl-stage .owl-item { padding: 0 1px; } /* fix to show border of cells */ /*** CAROUSEL: ARROWS on left+right sides ***/ .carousel-left-right-arrows .owl-nav { position: relative; bottom: 0; text-align: left; } .carousel-left-right-arrows .owl-carousel .owl-nav button.owl-prev, .carousel-left-right-arrows .owl-carousel .owl-nav button.owl-next { top: -170px; left: -20px; position: absolute; margin: 0; padding: 0; } .carousel-left-right-arrows .owl-carousel .owl-nav button.owl-next { left: auto; right: -18px; } .carousel-left-right-arrows .owl-carousel .owl-nav button.owl-prev.clicked { margin-left: -2px; } .carousel-left-right-arrows .owl-carousel .owl-nav button.owl-next.clicked { margin-right: -2px; margin-left: 0; } .carousel-2-rows.carousel-left-right-arrows .owl-carousel .owl-nav button.owl-prev, .carousel-2-rows.carousel-left-right-arrows .owl-carousel .owl-nav button.owl-next { top: -310px; } #box-vouchers.carousel-left-right-arrows .owl-carousel .owl-nav button.owl-prev, #box-vouchers.carousel-left-right-arrows .owl-carousel .owl-nav button.owl-next { top: -220px; } /*** BANNER > TOP ***/ .banner-results { position: relative; text-align: center; -webkit-box-shadow: rgba(0,0,0, .2) 2px 1px 2px; -moz-box-shadow: rgba(0,0,0, .2) 2px 1px 2px; box-shadow: rgba(0,0,0, .2) 2px 1px 2px; } .banner-results img { margin: auto; } .banner-results .btn-close { font-size: 22px; color: #fff; width: 24px; height: 24px; position: absolute; top: 2px; right: 2px; z-index: 1; } .banner-results .btn-close em { text-align: center; line-height: 24px; display: block; } /*** BANNER > PAGE (PRIMARY) ***/ .img-fluid { width: 100%; display: block; } .banner-item { overflow: hidden; position: relative; } .banner-block .banner-frame { opacity: 0; position: absolute; top: 0; left: 0; padding: 40px 0 0; } .banner-block.owl-loaded .banner-frame { opacity: 1; } .promomerch { width: 420px; padding: 30px 25px; background: rgba(255,255,255, .9); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .orientation-right .promomerch { float: right; } .promomerch .promomerch-banner { margin: 0 0 15px; text-align: left; } .promomerch .promomerch-banner img { margin: 0; width: 120px; height: 60px; } .promomerch-title { font-size: 1.75rem; line-height: 1.1; margin-bottom: 10px; font-weight: 700; } .promomerch-text { margin-bottom: 10px; } .promomerch-rates { font-size: 1.375rem; line-height: 1.1; margin-bottom: 10px; color: var(--BRAND_COLOR); font-weight: 700; } .promomerch-rates-was { font-size: .75rem; margin-bottom: 2px; text-transform: lowercase; } .promomerch-expdate { font-size: .75rem; } .promomerch-cta { padding: 25px 0 0; } .promomerch-cta .btn { padding: 12px 50px; font-weight: bold; } .promomerch-cta .btn em { font-size: 90%; padding-left: 10px; } /*** BANNER > SECONDARY **********/ .banner-secondary { margin: 0 0 50px; padding: 20px 0 0; } .banner-secondary-link, .banner-secondary-link:visited { color: var(--WHITE_COLOR); text-shadow: 0 1px 5px rgba(0,0,0, .4); text-decoration: none; display: block; } .banner-secondary-link:hover, .banner-secondary-link:focus { color: var(--WHITE_COLOR); } .banner-secondary .banner-secondary-img { display: block; } .banner-secondary .banner-frame { padding: 0; } .banner-secondary-link .container { display: block; } .banner-secondary-link .banner-secondary-content { display: table; width: 100%; height: 100%; } .banner-secondary-link .banner-secondary-content > span { display: table-cell; vertical-align: middle; text-align: center; } .banner-secondary-link .banner-secondary-text1 { font-size: 3.125rem; margin-bottom: 5px; line-height: 1.1; display: block; text-transform: uppercase; } .banner-secondary-link .banner-secondary-text2 { font-size: 1.25rem; display: block; } .orientation-left .banner-secondary-link { text-align: left; } .orientation-right .banner-secondary-link { text-align: right; } /*** BANNER > SECONDARY on home page with assigned merchant **********/ #page-home #page-inner .banner-secondary .banner-frame { padding: 0; } #page-home #page-inner .banner-secondary .banner-frame .container { height: 100%; } #page-home #page-inner .banner-secondary .promomerch { display: table; width: 100%; height: 100%; padding: 0; margin: 0; background: none; } #page-home #page-inner .banner-secondary .promomerch-cnt { display: table-cell; vertical-align: middle; height: 100%; } #page-home #page-inner .banner-secondary .promomerch .promomerch-banner, #page-home #page-inner .banner-secondary .promomerch .promomerch-rates, #page-home #page-inner .banner-secondary .promomerch .promomerch-rates-was, #page-home #page-inner .banner-secondary .promomerch .promomerch-expdate { display: none; } #page-home #page-inner .banner-secondary .promomerch-title, #page-home #page-inner .banner-secondary .promomerch-text { color: var(--WHITE_COLOR); text-shadow: 0 1px 5px rgba(0,0,0, .4); text-decoration: none; } #page-home #page-inner .banner-secondary .promomerch-title { font-size: 2.5rem; margin-bottom: 5px; line-height: 1.1; display: block; } #page-home #page-inner .banner-secondary .promomerch-text { font-size: 1.25rem; display: block; } /*** BANNER > SECONDARY: inside CAMPAIGN pages with MERCHANT ***/ .banner-secondary .promomerch { margin-left: 20px; } #page-inner .banner-block .banner-frame { padding-top: 15px; } #page-inner .banner-block .promomerch { padding: 20px 25px; margin-left: 20px; } #page-inner .banner-block .banner-has-specialoffer .promomerch-text { display: none; } #page-inner .banner-block .promomerch-cta { padding-top: 15px; } /*** BANNER > WITHOUT SHITE WRAPPER ***/ .banner-wo-promomerch-wrapper .promomerch { width: 60%; padding: 20px 0 0; background: none; } .banner-wo-promomerch-wrapper .promomerch .promomerch-title, .banner-wo-promomerch-wrapper .promomerch .promomerch-text { color: var(--WHITE_COLOR); text-shadow: 0 1px 5px rgba(0,0,0, .4); } .banner-wo-promomerch-wrapper .promomerch .promomerch-title { font-size: 2.75rem; font-weight: 700; margin-bottom: 30px; } .banner-wo-promomerch-wrapper .promomerch .promomerch-text { font-size: 1.5rem; } .banner-wo-promomerch-wrapper.orientation-right .promomerch { text-align: right; } /*** CONTENT > PAGE GENERIC ***/ #page-inner { padding: 50px 0 80px; } #page-header { margin-bottom: 50px; } #page-header h1 { text-align: center; margin: 0; } .page-static #page-header h1, .page-user #page-header h1 { text-align: left; } #page-content { } .box { margin-bottom: 60px; } .box-hdr { margin: 0 0 40px; position: relative; } .box-hdr h1, .box-hdr h2 { font-size: 2.25rem; margin-bottom: 0; } .hdr-w-right-part h1, .hdr-w-right-part h2 { padding-right: 100px; } .box-cnt { } .box-btns { padding: 20px 0 0; } .box-btns a { font-size: 1.125rem; color: var(--BRAND_COLOR); font-weight: 700; text-transform: uppercase; text-decoration: none; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px } .box-btns a:hover, .box-btns a:focus { text-decoration: underline; } .box-btns a:after { font-size: .8125rem; top: -1px; position: relative; display: inline-block; margin: 0 0 0 7px; font-weight: 600; content:"\f061"; font-family:'Font Awesome 5 Pro'; } .box-btns a:hover:after { margin-left: 10px; } .box-btns a.btn-sm { font-size: .75rem; padding: 8px 20px; margin: 0 auto; display: inline-block; } .box-btns a.btn-sm:after { display: none; } .box-hdr .right-part { text-align: right; position: absolute; top: 2px; right: 0; } .box-hdr a.link-more, .box-hdr a.link-more:visited { font-size: .75rem; padding: 8px 20px; } .box-hdr a.link-more:hover, .box-hdr a.link-more:focus { } .carousel-2-rows .box-btns { padding-top: 0; } /*** CONTENT > PAGE GENERIC: filters ***/ #filters { padding: 15px 0 0; border-bottom: 1px solid var(--BORDER_COLOR); background: var(--WHITE_COLOR); z-index: 0; } #filters .dropdown-toggle { display: none; } #filters .dropdown-menu { width: 40%; padding: 0; display: flex; flex-direction: row; margin: auto; position: relative; border: none; } #filters .dropdown-menu li { border: 1px solid var(--BORDER_COLOR); padding: 0; text-align: center; border-right-width: 0; } #filters .dropdown-menu li:last-of-type { border-right-width: 1px; } /* #filters .dropdown-menu li:first-of-type { -webkit-border-top-left-radius: 5px; -moz-border-top-left-radius: 5px; border-top-left-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px; } #filters .dropdown-menu li:last-of-type { border-right-width: 1px; -webkit-border-top-right-radius: 5px; -moz-border-top-right-radius: 5px; border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-bottom-right-radius: 5px; border-bottom-right-radius: 5px; } */ #filters .dropdown-menu li.active { background: var(--BRAND2_COLOR); border-color: var(--BRAND2_COLOR); } #filters li a, #filters li a:visited { font-size: .875rem; padding: 10px; color: var(--TEXT_COLOR); background: var(--WHITE_COLOR); text-decoration: none; display: block; /*-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;*/ } #filters li a:hover, #filters li a:focus { text-decoration: underline; } #filters li.active a, #filters li.active a:visited, #filters li.active a:hover, #filters li.active a:focus { color: var(--WHITE_COLOR); background: var(--BRAND2_COLOR); text-decoration: none; cursor: default; } /*** AZ: filters ***/ #filter-sortby, #filter-az { margin-bottom: 15px; } #page-az #filters .dropdown-menu { width: 100%; } #page-az #filters li a, #page-az #filters li a:visited { padding-left: 8px; padding-right: 8px; white-space: nowrap; } #filters #filter-az .dropdown-menu li { border-left-width: 0px; } #filters #filter-az .dropdown-menu li:first-of-type { border-left-width: 1px; } /*** CONTENT > MERCHANTS LIST ***/ .merchants-list { margin-bottom: 0; padding: 0; list-style: none; } .merchants-list .item, .owl-carousel .merchant-item { margin-bottom: 1.5rem; } .merchant-item { padding: 50px 10px 35px; text-align: center; background: var(--WHITE_COLOR); position: relative; } .merchant-banner { margin-bottom: 20px; text-align: center; display: block; } .merchant-banner img { width: 120px; height: 60px; margin: auto; display: block; overflow: hidden; } .merchant-title { min-height: 40px; margin-bottom: 6px; } .merchant-title .merchant-link { color: var(--TEXT_COLOR); text-decoration: none; } .merchant-rates { font-size: 1rem; color: var(--BRAND_COLOR); margin-bottom: 10px; font-weight: 700; } .merchant-rates-was { font-size: .875rem; color: var(--TEXT2_COLOR); text-decoration: line-through; } .merchant-item .merchant-rates-was { margin-bottom: -10px; } .merchant-rates-was .label-earn { text-transform: lowercase; } .owl-carousel .merchant-banner img { width: 120px; height: 60px; } .region105 .merchant-rates { font-size: .9375rem; } /*** card visual style - link covers whole parent content ***/ .merchant-item a.merchant-link:after { content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; } /*** icons ***/ .merchant-icons .ico { margin-left: 0; width: 25px; height: 24px; display: block; } .merchant-icons .ico em { line-height: 21px; display: block; width: 100%; } .merchant-icons .ico img { display: block; } .icons-incorner { top: -2px; left: -2px; margin: 0; overflow: hidden; position: absolute; -webkit-border-top-left-radius: 6px; -moz-border-top-left-radius: 6px; border-top-left-radius: 6px; } .icons-incorner:before { content:""; display: block; width: 0; height: 0; border-style: solid; border-width: 50px 50px 0 0; border-color: var(--BRAND_COLOR) transparent transparent transparent; } .icons-incorner .ico { font-size: .875rem; top: 3px; left: 3px; color: var(--WHITE_COLOR); width: 24px; height: 24px; line-height: 1; display: block; text-align: center; position: absolute; } .icons-inrow { position: absolute; top: 6px; right: 10px; } .logged-in .icons-inrow { right: 36px; } /*** MERCHANTS LIST > ADD/REMOVE FAV ***/ .merchant-favorites { position: absolute; top: 5px; right: 9px; } .merchant-favorites button { display: inline-block; width: 21px; height: 21px; font-size: 19px; color: var(--RED_COLOR); background: none; border: none; padding: 0; } .merchant-favorites button:hover, .merchant-favorites button:focus { color: var(--RED_COLOR); outline: 1px dotted var(--TEXT_COLOR); } .merchant-favorites .fav-remove, .favorite .merchant-favorites .fav-add { display: none; } .favorite .merchant-favorites .fav-remove { color: var(--RED_COLOR); display: inline-block !important; } .marked-favorite { -webkit-animation-name: heartBeat; animation-name: heartBeat; -webkit-animation-duration: 1.3s; animation-duration: 1.3s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } .unmarked-favorite { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: headShake; animation-name: headShake; } /*** CONTENT > PANELS LIST ***/ .panels-list .panel-with-altimage .panel-item { padding: 0 30px 25px; text-align: left; overflow: hidden; } .panels-list .panel-with-altimage .panel-banner { margin: 0 -30px 25px; } .panels-list .panel-with-altimage .merchant-banner { float: left; } .panels-list .panel-with-altimage .merchant-summary { margin-left: 150px; } .panels-list .panel-with-altimage .merchant-title { margin-bottom: 2px; min-height: 30px; } .panels-list .panel-with-altimage .merchant-rates { font-size: 1.125rem; } .panels-list .panel-with-altimage .merchant-rates, .panels-list .panel-with-altimage .merchant-rates-was { margin: 0; } .panel-description { font-size: .75rem; clear: both; padding-top: 10px; } #offers800x500 { margin-bottom: 40px; } #offers800x500 .panels-list .panel-description { display: block; } #offers800x500 .merchant-icons, #offers800x500 .merchant-favorites { display: none; } /*** CONTENT > VOUCHERS LIST ***/ .vouchers-list { margin-bottom: 0; padding: 0; list-style: none; } .vouchers-list .item { margin-bottom: 1.5rem; } .voucher-item { padding: 25px 15px 15px; text-align: center; background: var(--WHITE_COLOR); position: relative; } .voucher-item .item-txt { margin-bottom: 20px; } .voucher-item .voucher-txt { font-size: 1rem; margin-bottom: 10px; min-height: 65px; font-weight: 500; } .voucher-item .voucher-expdate { font-size: .75rem; } .voucher-item .voucher-button { padding-bottom: 30px; } .voucher-item .voucher-tc { font-size: .6875rem; padding: 10px 0 0; text-align: left; border-top: 1px solid var(--BORDER_COLOR); } .voucher-item .voucher-tc .voucher-tc-link { color: var(--BRAND_COLOR); text-align: left; } .voucher-item .voucher-tc .voucher-tc-text { padding: 0; margin-top: 10px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .voucher-item .voucher-tc .voucher-tc-link:after { transform: rotate(180deg); display: inline-block; margin: 0 5px; font-weight: 400; content:"\f078"; font-family:'Font Awesome 5 Pro'; } .voucher-item .voucher-tc .voucher-tc-link.collapsed:after { transform: rotate(0deg); } /*** CONTENT > AJAX LOADER ***/ .ajaxloader { text-align: center; padding: 20px 0 0; } .ajaxloader .ajaxloader-text { font-size: .75rem; color: var(--TEXT_COLOR); margin-bottom: 5px; } .ajaxloader-progress { display: none; max-width: 400px; margin: 0 auto 20px; } .with-ajaxloader .ajaxloader-progress { display: block; } .progress { height: 4px; background: var(--GREY2_COLOR); overflow: inherit; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .progress-bar { background: var(--BRAND_COLOR); overflow: inherit; position: relative; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .progress-bar:after { width: 8px; height: 8px; background: var(--BRAND_COLOR); top: -2px; right: -2px; position: absolute; display: block; content:""; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .ajaxloader-totalnumber { font-size: .75rem; text-align: center; margin: 0 0 20px; } .spinner-border { opacity: 0; width: 0; height: 0; margin: auto; } .ajaxloader.loading .spinner-border { opacity: 1; width: 32px; height: 32px; margin-bottom: 15px; } .ajaxloader.loading .loadmore, .ajaxloader.loading .loadmore-account { display: none; } /*** CONTENT > HOME ***/ #bannersx2 .banner-link { margin-bottom: 24px; display: block; overflow: hidden; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } #box-clickrecovery { padding-bottom: 20px; } #box-clickrecovery .box-hdr, #box-clickrecovery .box-hdr h2 { margin-bottom: 10px; } #box-clickrecovery .lead { margin-bottom: 30px; } #box-popular .merchant-item { min-height: 249px; } #box-popular.with-banners .owl-nav { margin-right: -52%; } #box-new .owl-nav { display: block !important; } #box-new .without-nav .owl-nav { display: none !important; } .box-with-top-nav .owl-nav { position: absolute; top: -73px; right: 0; margin-top: 0; } #box-offers.without-nav { padding-top: 0; } #box-offers.with-box-above .owl-nav { top: -50px; } #box-vouchers { margin-bottom: 0; } /*** CONTENT > PAGE AZ ***/ #page-az #page-inner h2 { color: var(--TEXT_COLOR); text-align: center; font-size: 1.125rem; position: relative; margin-bottom: 30px; } #page-az #page-inner h2 span { background: var(--BG_COLOR); padding: 0 20px; display: inline-block; position: relative; } #page-az #page-inner h2:before { position: absolute; top: 12px; left: 0; width: 100%; height: 0; border-bottom: 1px solid var(--TEXT_COLOR); display: block; content:""; } /*** FORM ***/ .form-control { font-size: .875rem; background: var(--WHITE_COLOR); color: var(--TEXT_COLOR); border: 1px solid var(--BORDER_COLOR); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; /*-webkit-box-shadow: rgba(0, 0, 0, 0.075) 0 1px 1px inset; -moz-box-shadow: rgba(0, 0, 0, 0.075) 0 1px 1px inset; box-shadow: rgba(0, 0, 0, 0.075) 0 1px 1px inset;*/ } .form-control:focus { border-color: var(--TEXT_COLOR); -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; /*-webkit-box-shadow: rgba(0,0,0,0.1) 0 0 3px; -moz-box-shadow: rgba(0,0,0,0.1) 0 0 3px; box-shadow: rgba(0,0,0,0.1) 0 0 3px;*/ } textarea { margin-bottom: 5px; } .form-select { font-size: .875rem; height: 50px; border-color: var(--BORDER_COLOR); --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23232b38' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); } /*** placeholder ***/ .form-control:-webkit-input-placeholder { color: #888 !important; /* Chrome/Opera/Safari */ } .form-control::-webkit-input-placeholder { color: #888 !important; /* Chrome/Opera/Safari */ } .form-control:-moz-placeholder { color: #888 !important; /* Firefox 18- */ } .form-control::-moz-placeholder { color: #888 !important; /* Firefox 19+ */ } .form-control:-ms-input-placeholder { color: #888 !important; /* IE 10+ */ } .form-check-input { margin-top: .1rem; width: 1rem; height: 1rem; border-color: var(--TEXT_COLOR); } .form-check-input:checked { background-color: var(--BRAND_COLOR); border-color: var(--BRAND_COLOR); } .form-check-input.is-valid ~ .form-check-label, .was-validated .form-check-input:valid ~ .form-check-label { color: var(--TEXT_COLOR); } /*** MERCHANT SINGLE PAGE ***/ #merchant-card { max-width: 300px; margin: 0 0 0 12px; padding: 40px 20px; text-align: center; background: var(--WHITE_COLOR); z-index: 1000; align-self: flex-start; top: 0; overflow-y: auto; /* fix for sticky position inside flexbox */ -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #page-merchant.with-banner #merchant-card { margin-top: -350px; } #merchant-main-col { width: calc(100% - 300px - 12px); margin-left: 20px; position: relative; } #merchant-card .merchant-rates { font-size: 1.25rem; text-decoration: none; } #merchant-card .merchant-offer-expdate { font-size: .75rem; margin: 10px 0 20px; } #merchant-card-with-shopnow { padding: 15px 0 30px; } #merchant-card-with-shopnow .btn { padding-left: 10px; padding-right: 10px; display: block; } #merchant-card-with-calculator button { font-size: 1rem; } #merchant-card-with-calculator button:hover { color: var(--LINK_COLOR); text-decoration: underline; } #merchant-card-with-calculator button em { font-style: normal; padding: 2px 0 2px 35px; background: url(../images/icon-calculator.svg) no-repeat 0 0 / 24px auto; display: inline-block; } .merchant-purchase-conditions, #merchant-description, .merchant-tiers-rates, .awardtime-steps, #merchant-images { margin-bottom: 50px; } main .section { padding: 30px; background: var(--WHITE_COLOR); border: 1px solid var(--WHITE_COLOR); margin-bottom: 30px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } /*** instore buy ***/ #merchant-single #instore_link2login { margin: 20px 0 5px; width: 100%; } #merchant-single #instore-buy { margin: 20px 0 10px; text-align: center; } #merchant-single #instore-buy .instore-text { padding: 15px 10px 0; border: 1px solid var(--BLUE_COLOR); margin-bottom: 15px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #merchant-single #instore-buy h3 { margin: 0 0 10px 0; font-size: 22px; letter-spacing: -1px; } #merchant-single #instore-buy a.link2cards { font-size: 15px; text-decoration: none; display: block; line-height: 32px; } #merchant-single #instore-buy a.link2cards:after { line-height: 44px; font-size: 20px; } .card-icons { margin-bottom: 18px; } .card-icons img { max-width: 42px; height: auto; margin: 0 3px 5px; } #merchant-single .instore-label { font-size: 18px; background: #efefef; padding: 15px 0; margin: 0 -30px 15px; text-align: center; display: block; } #merchant-single .attention-message { font-size: 14px; margin: 10px 0; background: #f2f2f2; padding: 7px 10px; text-align: center; } #merchant-delivery { display: block; } #box-merchant-vouchers { margin-bottom: 40px; } .video-container { margin-bottom: 20px; } .video-container iframe { width: 100%; } /*** promocode ***/ .box-promocode { background: var(--GREY2_COLOR); padding: 15px; text-align: center; color: var(--TEXT_COLOR); } .box-promocode .form-submit { display: none; } .box-promocode label { color: #595959; display: block; margin-bottom: 5px; padding: 0; font-weight: normal; width: auto; } .promocode-success { font-size: 13px; color: var(--BRAND_COLOR); text-align: center; padding: 3px 0 0; } .promocode-success strong { font-size: 15px; font-weight: normal; display: block; margin-bottom: 15px; } #merchant-description .more-less { color: var(--TEXT_COLOR); display: none; width: auto; padding-top: 1rem; } #merchant-description .more-less.collapsed .readmore, #merchant-description .more-less .readless { display: inline-block; } #merchant-description .more-less.collapsed .readless, #merchant-description .more-less .readmore { display: none; } #merchant-description .collapse { height: 39px !important; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; } #merchant-description .collapse.show { height: auto !important; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; } #merchant-description .collapsing { min-height: 39px !important; } #merchant-description.longtext .more-less { display: inline-block; } /*** MERCHANT SINGLE PAGE > TIERS rates ***********************/ .merchant-tiers-rates { margin: 20px 0 40px; display: table; width: 100%; border-top: 1px solid var(--BORDER_COLOR); } .merchant-tiers-rates .tiers-item { display: table-row; position: relative; } .merchant-tiers-rates .tiers-item .tiers-col { display: table-cell; padding: 20px 30px 20px 0; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--BORDER_COLOR); } .merchant-tiers-rates .tiers-item:last-of-type .tiers-col { border: none; } .merchant-tiers-rates .tiers-item .tiers-col-rates { width: 20%; } .merchant-tiers-rates .tiers-item .tiers-col.tiers-col-shopnow { width: 10%; padding-right: 0; } .merchant-tiers-rates .tiers-item .tiers-col.tiers-col-shopnow .btn { font-size: .875rem; white-space: nowrap; height: auto; line-height: 1.3; } a.link-tiers-shopnow, a.link-tiers-shopnow:visited { color: var(--TEXT_COLOR); text-decoration: none; } .tiers-item .merchant-rates { font-size: 1.125rem; margin: 0 0 5px; text-align: left; white-space: nowrap; } .tiers-item .tiers-title { font-size: 1rem; line-height: 1.2; } .tiers-item .tiers-period { font-size: .75rem; white-space: nowrap; display: block; } /*** MERCHANT SINGLE PAGE > awardtime ***/ #merchant-awardtime h2 { margin-bottom: 20px; } .awardtime-item { position: relative; padding-right: 40px; margin-right: 3%; } .awardtime-item big { font-size: 1rem; display: block; margin-bottom: 5px; white-space: nowrap; font-weight: bold; } .awardtime-item small { font-size: 1rem; color: var(--TEXT_COLOR); } .awardtime-item em { font-size: 1.25rem; color: var(--TEXT_COLOR); position: absolute; top: 3px; right: 0; } .awardtime-item i { font-size: .625rem; display: inline-block; width: 19px; line-height: 19px; color: var(--TEXT_COLOR); margin: 0 0 0 5px; position: relative; top: -2px; text-align: center; font-style: normal; cursor: help; } .awardtime-item:last-of-type { padding-right: 0; margin-right: 0; } .tooltip-inner { font-size: .75rem; line-height: 1.3; color: var(--WHITE_COLOR); background: var(--TEXT_COLOR); } .bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow:before, .bs-tooltip-bottom .tooltip-arrow:before { border-bottom-color: var(--TEXT_COLOR); } .bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow:before, .bs-tooltip-bottom .tooltip-arrow:before { border-top-color: var(--TEXT_COLOR); } .bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow:before, .bs-tooltip-bottom .tooltip-arrow:before { border-left-color: var(--TEXT_COLOR); } .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow:before, .bs-tooltip-bottom .tooltip-arrow:before { border-right-color: var(--TEXT_COLOR); } /*** MERCHANT SINGLE PAGE > merchant-images ***/ #merchant-images { } #merchant-images .item { /*opacity: 0;*/ } #merchant-images .item a { color: var(--TEXT_COLOR); display: block; text-decoration: none; } #merchant-images .item a img { display: block; overflow: hidden; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } #merchant-images .item a span { padding: 10px 0 0; display: block; line-height: 1.3; } #merchant-images.owl-loaded .item { opacity: 1; } #merchant-images .owl-controls { position: relative; } #merchant-images .owl-dots { background: none; padding: 10px 0; text-align: center; } #merchant-images .owl-controls { bottom: auto;} #merchant-images.carousel-has-1-items .owl-controls, #merchant-images.carousel-has-2-items .owl-controls, #merchant-images.carousel-has-3-items .owl-controls { display: none; } /*** USER > ACCOUNT **********************/ .page-user #page-header { margin-bottom: 30px; } .page-user #page-header h1 { font-size: 2.5rem; } .points-stats { overflow: hidden; margin-bottom: 25px; } .points-stats .points-box { background: #efefef; padding: 10px; color: var(--TEXT_COLOR); font-size: 22px; line-height: 1.3; text-align: center; border: 1px solid var(--BORDER_COLOR); margin-bottom: 5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .points-stats .points-box big { font-size: 150%; color: var(--TEXT_COLOR); font-weight: normal; } .legends { overflow: hidden; margin-bottom: 20px; } .legends ul { list-style: none; margin: 0; padding: 0;} .legends ul.legend li { float: left; padding: 0 20px 0 0; line-height: 24px; } .legends ul.legend li:before,.legend-status-1:before, .legend-status-2:before, .legend-status-3:before, .legend-status-4:before, .legend-status-5:before { line-height: 24px; font-family:'Font Awesome 5 Pro'; font-size: 18px; padding-right: 5px; top: 1px; position: relative; color: var(--BRAND_COLOR); } .legend-status-1:before { content:"\f111"; font-weight: 400; } .legend-status-2:before, .legend-status-5:before, .legend-paid:before { content:"\f111"; font-weight: 900; } .legend-status-3:before, .legend-status-4:before { content:"\f00d" !important; } .legends .right-part { float: right; line-height: 20px; text-align: right; } #contact-form .legends { float: right; margin-bottom: 0; } #user-transactions .alert-info { background: var(--GREY3_COLOR); color: var(--TEXT_COLOR); border-color: var(--BORDER_COLOR); } #user-missingpoints { margin-bottom: 20px; } /*** USER > user-table ***/ .user-table { margin-bottom: 20px; clear: both; margin-top: 20px; border: 1px solid var(--BORDER_COLOR); } table { width: 100%; border: none; background: var(--WHITE_COLOR); } th, td { padding: .9375rem; font-size: .875rem; color: var(--TEXT_COLOR); } th { font-size: .9375rem; border-bottom: 1px solid var(--BORDER_COLOR); padding: 20px 15px; background: var(--WHITE_COLOR); white-space: nowrap; } th span { display: none; } td { border-top: 1px solid var(--BORDER_COLOR); } /*tr.even td { background: #f2f2f2; }*/ .user-table table { border-right: none; border-left: none; } .user-table table th { font-weight: bold; color: var(--WHITE_COLOR); background: var(--BRAND_COLOR); } .user-table table th, .user-table table td { text-align: center; border: none; border-top: 1px solid var(--BORDER_COLOR); } .user-table table th:first-of-type, .user-table table td:first-of-type { border-left: none; } .user-table table tr.odd td { } .user-table .trans-date { } .user-table .trans-merchant a { font-size: .75rem; } .user-table td.trans-status { text-align: left; white-space: nowrap; } .user-table td.trans-points { text-align: center; color: var(--TEXT_COLOR); font-weight: bold; } .user-table td.trans-spend { } .user-table td.trans-purchaseid { } .user-table .trans-details { display: none; } .user-table .trans-status span:before { line-height: 24px; font-family: 'Font Awesome 5 Pro'; font-size: 16px; color: var(--BRAND_COLOR); } .user-table .clickid { } .user-table big { font-size: inherit; } .user-table .merchant-banner img { max-width: 120px; margin: 0 auto 5px; display: block; } .trans-cancel-reason { font-size: 80%; opacity: .7; } .user-link-to-merchant { color: var(--TEXT_COLOR); } .user-table .trans-merchant .merchant-banner { margin-bottom: 0; } .user-table .additional-data { display: none; padding-top: 10px; font-size: 85%; } /*** user table: i ***/ .user-table .tooltip-sign { font-size: 13px; background: #fff; color: var(--TEXT_COLOR); border: 1px solid var(--TEXT_COLOR); width: 16px; height: 16px; line-height: 14px; margin: 0 0 0 2px; position: relative; top: -2px; text-align: center; font-style: normal; font-family: 'Times Mew Roman'; cursor: help; display: inline-block; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .tooltip-inner:first-letter { text-transform: uppercase; } #where-are-my-points { margin-bottom: 30px; } #user-missingpoints h2 { margin-bottom: 10px; font-size: 22px; } #user-missingpoints h2 button { position: relative; padding-right: 25px; outline: none; text-decoration: none; width: auto; text-transform: uppercase; } #user-missingpoints h2 button em { font-size: 20px; color: var(--TEXT_COLOR); position: absolute; top: 2px; right: 0; } #user-missingpoints h2 button.collapsed em { transform: rotate(-90deg); } /*** USER > FILTERS ***/ .filter-form label, .filter-form .form-select, .filter-form .form-group { display: inline-block; width: auto; margin-right: 10px; } .filter-form label, .filter-form .btn-submit { display: none; } #page-account .filter-block { padding-top: 20px; } /*** STRUCTURE > TABS ***/ .tabs .dropdown-toggle { display: none; } .tabs .dropdown-menu { background: var(--BG_COLOR); padding: 0; margin: auto; position: relative; border: none; display: block; z-index: 1; } .tabs .dropdown-menu li { padding: 0; margin-bottom: 10px; white-space: inherit; } .tabs .dropdown-menu li.active { background: var(--BRAND_COLOR); border-color: var(--BRAND_COLOR); } .tabs li a, .tabs li a:visited { font-size: 1rem; padding: 10px; color: var(--TEXT_COLOR); background: var(--BG_COLOR); text-decoration: none; display: block; } .tabs li a:hover, .tabs li a:focus { background: var(--GREY3_COLOR); } .tabs li.active a, .tabs li.active a:visited, .tabs li.active a:hover, .tabs li.active a:focus { color: var(--TEXT3_COLOR); font-weight: bold; } /*** USER > SUBSCRIBE (profile) ***/ #subscription-form .form-group { margin-bottom: 20px; } #subscription-form .form-group label { font-weight: bold; margin-bottom: 5px; } #subscription-form input[type="text"], #subscription-form input[type="email"] { width: 40%; } /*** USER > FAVORITES *********/ #page-favorites #user-favorites .box-cnt h2 { font-size: 20px; margin-bottom: 15px; } .fav-steps { overflow: hidden; padding: 20px 0 0; } .fav-steps .fav-heart { margin: 0 0 20px; width: 150px; text-align: center; float: left; } .fav-steps .fav-heart em { font-size: 2.5rem; color: var(--RED_COLOR); width: 80px; height: 80px; line-height: 80px; display: block; border: 2px solid var(--RED_COLOR); background: var(--WHITE_COLOR); margin: 0 auto 20px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; } .fav-steps .fav-steps-arrow em { font-size: 30px; color: var(--TEXT_COLOR); line-height: 80px; display: block; padding: 0 10px 0 35px; } .fav-steps .fav-steps-arrow { float: left; } .fav-steps .fav-heart.item-1 { width: 80px; } /*** PAGE STATIC ***********************/ .page-static .section h2 { border-bottom: 1px solid var(--TEXT_COLOR); padding-bottom: 10px; margin-top: 10px; } copy { } .copy h1, .copy h2 { margin-bottom: 15px; letter-spacing: inherit;} .copy .section h2 { font-size: 2rem; } .copy .section h3 { font-size: 1.25rem; line-height: 1.3; } .copy h4 { margin-bottom: 20px; } .copy ul, .copy ol, .copy p, #help-faqs .tab-content ul { margin-bottom: 25px; } .copy ol { padding-left: 20px; } .copy ul, #help-faqs .tab-content ul { list-style: none; margin-left: 0; padding-left: 15px; } .copy ul li, #help-faqs .tab-content ul li { padding: 2px 0 5px 10px; position: relative; margin-bottom: 5px; } .copy ul li:before, #help-faqs .tab-content ul li:before { font-size: 6px; color: var(--TEXT_COLOR); font-weight: bold; content:"\f111"; font-family:'Font Awesome 5 Pro'; width: 15px; display: inline-block; position: absolute; top: 7px; left: -7px; } .copy ol li, #help-faqs .tab-content ol li { list-style: decimal; margin-left: 20px; padding: 2px 0 3px 5px; margin-bottom: 15px; } .copy ol li li { margin-top: 10px; margin-bottom: 5px; } .copy .section { margin: 0 0 10px; padding: 10px 0; } .copy ol li ul { margin-bottom: 5px; } .copy ol li ul li { list-style: disc; } .copy ol li ul li:before { display: none; } .copy ol li ul li ul { margin: 10px 0; } .copy ol li ul li ul li { list-style: circle; } .copy ul li ul { margin: 10px 0 10px 30px; } .copy ul li ul li { margin-bottom: 0; } .copy strong { color: var(--BLACK_TEXT); } .copy dl { } .copy dl dt {margin-bottom: 5px; color: var(--BLACK_TEXT); } .copy dl dd { margin: 0 0 20px 0px; } .copy a { text-decoration: underline; } .copy a.btn { text-decoration: none; } /*** PAGE STATIC > HIW ***/ #pagebanner-hiw { margin-bottom: 30px; } #page-hiw #page-header { margin-bottom: 0; } #page-hiw #page-header h1, #page-hiw .section > h2 { font-size: 2rem; margin-bottom: 10px; font-weight: 700; border: none; } #page-hiw .section > h3 { font-size: 1.25rem; margin-bottom: 30px; line-height: 1.3; } #pagebanner-hiw .hiw-steps { padding: 0; } .hiw-step { padding: 30px 25px; text-align: center; height: 100%; background: rgba(255,255,255, .95); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .hiw-step .hiw-step-title { font-size: 1.75rem; padding: 0 0 15px; line-height: 1.3; text-transform: uppercase; } .hiw-step .hiw-step-image { width: 155px; line-height: 155px; font-size: 60px; color: var(--WHITE_COLOR); margin: 0 auto 15px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .hiw-step .hiw-step-text { font-size: 1.125rem; padding: 0; line-height: 1.3; margin: auto; } .pagebanner-hiw-instore .hiw-step .hiw-step-text { width: 100%; } #page-hiw .copy ol>li, #page-hiw-instore .copy ol>li { margin-bottom: 20px; color: var(--TEXT_COLOR); } #page-hiw .copy ol>li p, #page-hiw-instore .copy ol>li p { color: var(--TEXT_COLOR); margin-bottom: 15px; } #page-hiw .copy ol>li, #page-hiw .copy ol>li h4, #page-hiw-instore .copy ol>li, #page-hiw-instore .copy ol>li h4 { font-size: 1rem; font-weight: 700; } #page-hiw .copy ol li li, #page-hiw .copy ol li p, #page-hiw-instore .copy ol li p { font-size: .875rem; font-weight: normal; } .important { background: var(--GREY3_COLOR); padding: 15px 20px 10px; margin-bottom: 20px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .important h3 { margin: 10px 0 20px; } .important p { margin-bottom: 10px; } .important-inverse { background: var(--BLACK_COLOR); border-color: var(--TEXT_COLOR); color: var(--WHITE_COLOR); } .important-inverse h1, .important-inverse h2, .important-inverse h3, .important-inverse h4, .important-inverse p, .important-inverse a { color: var(--WHITE_COLOR); } .important-inverse a { text-decoration: underline; } .section .important { background: var(--GREY3_COLOR); } /*** PAGE STATIC > TERMS ***/ #page-terms .important h3 { margin-top: 0; } /*** PAGE STATIC > COOKIES ***/ .copy .section h3 { font-size: 1.125rem; line-height: 1.3; } /*** message *******************/ .msg { margin-bottom: 20px; padding: 5px 10px; border: 1px solid var(--BORDER_COLOR); background: var(--GREY2_COLOR); font-size: 11px; } /*** PAGE STATIC > FAQS ****/ #help-faqs h2 { margin-bottom: 20px; } #help-faqs #faqs-list { margin-bottom: 30px; } #help-faqs .tab-content { border-left: 1px solid var(--BORDER_COLOR); padding: 0 20px 0 5%; } #faqs-dropdown-trigger { display: none; } #faqs-dropdown-menu { background: var(--BG_COLOR); display: block; position: relative; } #faqs-list ul { border: none; } #faqs-list ul li { float: none; display: block; width: 100%; margin-bottom: 5px; } #faqs-list ul li a, #faqs-list ul li a:visited { font-size: 1.125rem; color: var(--BRAND_COLOR); padding: 10px 0 10px 25px; font-weight: 700; display: block; text-decoration: none; background: transparent; border: none; position: relative; text-align: left; } #faqs-list ul li a:hover, #faqs-list ul li a:focus { color: var(--BRAND2_COLOR); background: transparent; border: none; } #faqs-list ul li a:before { font-size: 2rem; font-weight: 300; position: absolute; top: 3px; left: 0; content:"\f105"; font-family:'Font Awesome 5 Pro'; } #faqs-list ul li a.active, #faqs-list ul li a.active:visited, #faqs-list ul li a.active:hover, #faqs-list ul li a.active:focus { color: var(--HEADLINE_COLOR); } #faqs-list ul li a.active:before { color: var(--BRAND_COLOR); } #help-faqs .tab-pane { } #help-faqs .tab-pane h3 { font-size: 1.25rem; padding-top: 15px; margin: 0 0 20px; color: var(--HEADLINE_COLOR); font-weight: 700; } #help-faqs .tab-pane h4, #help-faqs .tab-pane .text { padding-left: 25px; } #help-faqs .tab-pane h4 { font-size: .9375rem; color: var(--TEXT_COLOR); border-top: 1px solid var(--BORDER_COLOR); font-weight: bold; line-height: 1.3; padding-top: 23px; padding-bottom: 15px; padding-right: 50px; position: relative; cursor: pointer; text-transform: none; -webkit-user-select: none !important; -moz-user-select: none !important; user-select: none !important; } #help-faqs .tab-pane h3:first-letter, #help-faqs .tab-pane h4:first-letter { text-transform: uppercase; } #help-faqs .tab-pane h4:after { font-size: 1rem; color: var(--BRAND_COLOR); display: block; font-weight: 400; position: absolute; top: 21px; left: 0; content: "\f078"; font-family: 'Font Awesome 5 Pro'; } #help-faqs .tab-pane h4.collapsed:after { color: var(--TEXT_COLOR); top: 23px; left: 2px; transform: rotate(-90deg); } #help-faqs .tab-pane h4:first-of-type { border: none; padding-top: 15px; } #help-faqs .tab-pane h4:first-of-type:after { top: 15px; } .help-faqs-text { margin-bottom: 30px; } #page-faqs .toptext, #page-faqs-instore .toptext { padding-bottom: 10px; margin-bottom: 30px; border-bottom: 1px solid var(--BORDER_COLOR); position: relative; } /*** PAGE > CAMPAIGN ****************/ #page-campaign .copy .panels-list { padding: 0; margin-left: calc(-.5 * var(--bs-gutter-x)); margin-right: calc(-.5 * var(--bs-gutter-x)); } #page-campaign .copy .panels-list li { padding-top: 0; padding-bottom: 0; padding-left: calc(var(--bs-gutter-x) * .5); padding-right: calc(var(--bs-gutter-x) * .5); } #page-campaign .copy .panels-list li:before { display: none; } #page-campaign .copy .panels-list .panel-description, #page-campaign .copy .panels-list .panel-wo-altimage .panel-description { display: none; } #page-campaign .copy .panels-list .merchant-icons, #page-campaign .copy .panels-list .panel-description { display: block; } #page-campaign .copy .panels-list .panel-with-altimage .merchant-icons { display: none; } .banner-secondary .banner-frame { padding-top: 20px; } /*** CLAIMPOINT > CONTACT FORM ******************************************************/ #page-claimpoints .success { font-size: 1rem; border-top: 1px solid var(--TEXT_COLOR); padding-top: 20px; } #page-claimpoints .success img { width: 300px; margin-top: 20px; } .claimpoints-step { padding: 20px 20px 13px; margin: 0 0 10px 0; background: var(--WHITE_COLOR); border-left: 7px solid var(--GREY3_COLOR); -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .claimpoints-step.active { margin-top: 30px; background: var(--WHITE_COLOR); border-left-color: var(--BRAND_COLOR); } .claimpoints-step.passed * { opacity: .8; -webkit-filter: grayscale(100%); filter: grayscale(100%); } .claimpoints-step.passed:hover *, .claimpoints-step.passed:focus * { opacity: 1; -webkit-filter: grayscale(0%); filter: grayscale(0%); } #contact-form .form-select { height: 44px; } #contact-form .user-table { padding: 0; margin: 20px 0; overflow: hidden; } #contact-form .user-table table { border: none; background: var(--LIGHT_COLOR); } #contact-form .user-table tr:last-of-type td { border: none; } #contact-form h3 { font-size: 1rem; margin: 5px 0 25px; } #contact-form .form-group { margin-bottom: 20px; } #contact-form .form-submit { padding-bottom: 10px; } #contact-form label { margin-bottom: 10px; font-weight: bold; } #contact-form .fieldset-currency-amount select { height: 35px; } #contact-form small ul { margin-left: 0; padding-left: 10px; } #contact-form .copy p, #contact-form .copy ul { margin-bottom: 15px; } #contact-form .copy ul li { margin-bottom: 0; } .error { color: red; font-size: 11px; clear: both; margin-top:5px;} div.error { margin-top:5px;} /*** DATEPICKER: CALENDAR ***/ .datepicker { font-size: .75rem; } .datepicker th, .datepicker td { font-size: .8125rem; padding: 7px; min-width: 30px; } .datepicker th { border: 1px solid #fff; } .datepicker th.datepicker-switch:hover, .datepicker th.prev:hover, .datepicker th.next:hover { background: var(--HEADLINE_COLOR); } .datepicker table tr td.active.active { color: #fff; background: var(--LINK_COLOR); } /*** POPUP ***/ .popup-loggedout { display: none; } .modal-content { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .modal-header { border: none; padding-bottom: 0; } .modal-header h3 { margin: 0; } .modal-header .btn-close { margin: 0; top: 10px; right: 10px; position: absolute; z-index: 1; } .modal-text { padding: 0 30px; } .popup-ajax-loader { margin: auto; width: 32px; height: 32px; margin-bottom: 10px; } .popup-ajax-loader img { display: block; width: 100%; } /*** MODAL: bootstrap ***/ .modal-loggedout { --bs-modal-width: 360px; } .modal-loggedout .modal-btns { padding: 10px 0; } /*** POPUP > fancybox ***/ .fancybox-content { padding: 0; max-width: 670px; overflow: hidden; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .popup-content { padding: 30px; background: var(--WHITE_COLOR); } .popup-sm .fancybox-content { max-width: 300px; width: 100%; } .popup-md .fancybox-content { max-width: 670px; width: 100%; } .popup-lg .fancybox-content { max-width: 800px; width: 100%; } .popup-xl .fancybox-content { max-width: 1140px; width: 100%; } .fancybox-close-small, .fancybox-slide--html .fancybox-close-small { color: var(--TEXT_COLOR); opacity: .5; width: 34px; height: 34px; top: 15px; right: 15px; padding: 2px; /*border: 1px solid #8b8f92; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;*/ } .fancybox-close-small:hover, .fancybox-close-small:focus { opacity: 1; background: var(--GREY2_COLOR); } /*** POPUP > tracking ***/ .fancybox-popup-tracking .fancybox-content { max-width: 670px; } #page-tracking { max-width: 670px; text-align: center; overflow-y: hidden; margin: auto;} #page-tracking h1 { font-size: 1.5rem; margin: 0 0 20px; } #page-tracking .merchant-rate { font-size: 2rem; color: var(--BRAND_COLOR); font-weight: bold; margin-bottom: 10px; } #page-tracking .tracking-congratulations { font-size: .9375rem; } #page-tracking .tracking-text { font-size: .75rem; margin-bottom: 20px; padding: 15px 30px 5px; background: var(--GREY2_COLOR); } #page-tracking .tracking-text p { margin-bottom: 0; padding-bottom: 10px; } #page-tracking .form-submit { padding: 20px 0 0; } #page-tracking .form-submit .btn { width: 100%; max-width: 200px; display: block; margin: auto; } #page-tracking .form-links { font-size: .75rem; opacity: .5; } #page-tracking .form-links .apply { margin-bottom: 2px; } #page-tracking .vcode { font-size: 1rem; font-weight: bold; margin: 0 0 10px; padding: 8px 10px 7px; text-align: center; background: #fff url(../images/voucher-bg.png); border: 1px solid #ccc; -moz-box-shadow: inset 0 0 3px #ccc; -webkit-box-shadow: inset 0 0 3px #ccc; box-shadow: inset 0 0 3px #ccc; } #page-tracking .voucher-description { font-size: .8125rem; padding: 5px; margin-bottom: 15px; } #page-tracking .voucher-description:after { display: block; margin: 10px 0 0; height: 1px; background: var(--GREY_COLOR); content:""; } #page-tracking .tracking-limited { padding-top: 20px; } #page-tracking .tracking-limited .alert { margin-bottom: 0; } /*** POPUP > calculator ***/ #calculator-popup label { font-weight: bold; } #calculator-text { font-size: .75rem; margin-bottom: 20px; } #calculator-result { display: none; text-align: center; } #calculator-init .form-group { margin: 0 0 20px; } #calculator-init .form-group-amount { width: 75%; margin-left: auto; margin-right: auto; } #calculator-init .input-group-text { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .calculator-result-text { margin-bottom: 20px; } #calculator-cashback { font-size: 1.25rem; font-weight: bold; } #calculator-popup .form-submit { text-align: center; margin-bottom: 10px; } #calculator-popup.with-tiers .modal-dialog { --bs-modal-width: 600px; } #calculator-popup.with-tiers label { display: block; margin-bottom: 5px; } #calculator-popup.with-tiers #calculator-init .btn { min-width: 100%; } #calculator-popup.with-tiers select { width: 100%; height: 38px; border: 1px solid var(--TEXT_COLOR); -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #calculator-init .form-group-amount { width: auto; } /*** POPUP > app awarding ***/ #appawarding-popup { text-align: center; } #appawarding-popup .modal-img img { margin: 10px auto 30px; max-width: 200px; } #appawarding-popup .modal-content u { color: var(--RED_COLOR); } /*** CONTENT > COUNTDOWN ***/ #countdown-block { padding: 0; background: var(--RED_COLOR); color: var(--WHITE_COLOR); } #countdown-block a { text-decoration: none; } #countdown { margin: 0 -12px; padding: 5px 12px 7px; overflow: hidden; display: flex; flex-direction: row; justify-content: center; } #countdown-title { height: 42px; line-height: 42px; font-size: 17px; padding: 0 20px 0 0; } #countdown-digits { height: 42px; } .countdown-item { display: inline-block; position: relative; padding-right: 10px; } .countdown-item big { font-size: 1.75rem; line-height: 1.1; display: block; text-align: center; width: 45px; } .countdown-item small { font-size: .5rem; line-height: 1; text-transform: uppercase; display: block; text-align: center; } .countdown-item:after { font-size: 1.75rem; line-height: 1.1; content:":"; position: absolute; top: 0; right: 0; display: block; } #countdown-s:after { display: none; } /*** ERROR PAGE ***/ .error-page .info { width: 100%; max-width: 800px; margin: 0 auto; border: 1px dashed var(--BORDER_COLOR); padding: 20px 50px; text-align: left; margin-top: 50px; } /*** ERROR PAGE > 404 ***/ #page-404 #contents { text-align: center; padding: 80px 0; } #page-404 #contents h1 { margin-bottom: 15px; } #page-404 #contents .error404-text { font-size: 1rem;} #page-404 #search-wrapper { border: none; margin-right: 0; padding-right: 0; } #error404-search-block { width: 100%; max-width: 500px; margin: 20px auto; border-top: 1px solid var(--BORDER_COLOR); padding: 25px 0 0; } #error404-search-block h3 { font-size: 1.5rem; margin-top: 0; margin-bottom: 20px; } #error404-search-block form { position: relative; margin: auto; } #error404-search-block form .form-control { height: 50px; font-size: 1rem; padding-right: 70px; } #error404-search-block form .btn { font-size: 1.5rem; color: var(--WHITE_COLOR); position: absolute; top: 0; right: 0; width: 60px; height: 50px; padding: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } /*** STRUCTURE > FOOTER ***/ #footer { color: var(--WHITE_COLOR); background: var(--BRAND5_COLOR); } #footer .section { padding: 24px 0; border-top: 1px solid rgba(238, 238, 239, 0.3); } #footer-nav .section { border: none; } #footer-nav a, #footer-nav a:visited { font-size: 1rem; color: var(--WHITE_COLOR); margin: 0 4% 10px 0; text-decoration: none; display: inline-block; } #footer-nav a:hover, #footer-nav a:focus { color: var(--WHITE_COLOR); text-decoration: underline; } #footer-bottom { padding: 30px 0; } #copyright { font-size: .75rem; color: rgba(238,238,239, .6); } .footer-section { font-size: .875rem; color: var(--WHITE_COLOR); } .footer-section h4 { font-size: 1rem; padding: 0; margin-bottom: 8px; border-bottom: 1px solid rgba(238, 238, 239, 0.3); line-height: 1.2; } .footer-section h4 a, .footer-section h4 a:visited, .footer-section h4 a:hover, .footer-section h4 a:focus { padding: 8px 0; display: block; position: relative; text-decoration: none; cursor: default; } .footer-section h4 a em { font-size: 1.5rem; position: absolute; top: 5px; right: 0; } .footer-section p { margin-bottom: 15px; } .footer-section a, .footer-section a:visited { color: var(--WHITE_COLOR); text-decoration: none; } .footer-section a:hover, .footer-section a:focus { text-decoration: underline; } .footer-column { margin-bottom: 50px; } .footer-column-media { margin-bottom: 10px; } #footer-destinations .footer-column { margin-bottom: 0; } .footer-section ul { margin: 0; padding: 0; list-style: none; } .footer-section .footer-column ul li { padding: 3px 0; margin: 0; } #footer .footer-section .footer-column ul { padding: 0; } #footer-media--column-1 ul { overflow: hidden; } #footer-media--column-1 li { float: left; margin: 0 15px 10px 0; } #footer-media--column-1 li a { display: block; font-size: 1.5rem; height: 24px; line-height: 1; } #footer-media--column-1 li.twitter a { font-size: 1rem; line-height: 1.5; } #footer-media--column-2 .row { margin: 0 -5px; } #footer-media--column-2 .col { padding: 0 5px; } #footer-media--column-2 p { margin-bottom: 25px; } #footer-media--column-2 img { max-width: 110px; } #footer-destinations { } #footer-destinations h4 { border: none; margin-bottom: 20px; } #footer-destinations ul { display: flex; flex-wrap: wrap; } #footer-destinations ul li { margin: 0 1rem 1rem 0; } #footer-destinations ul li a { display: inline-block; border: 1px solid var(--WHITE_COLOR); background-color: transparent; padding: 8px 12px; text-decoration: none; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } #footer-destinations ul li a:hover, #footer-destinations ul li a:focus { color: var(--BRAND_COLOR); background: var(--WHITE_COLOR); } .footer-section h4 a em { display: none; font-size: 1.5rem; position: absolute; top: 15px; right: 0; } .footer-section h4 a em:before { content: '\f269'; } .footer-section h4 a.collapsed em:before { content: '\f2e1'; } /*** DEBUG ***********************/ #debug-block { position: fixed; top: 0; left: 0; z-index: 100000; } #debug-responsive { border: 1px solid var(--TEXT_COLOR); height: 10px; width: 10px; opacity: 1; background: #fff; float: left; } #debug-resolution { font-size: 10px; line-height: 1; padding: 0 3px; background: rgba(255,255,255,0.9); float: left; } #debug-bodyclass { display: none; width: 80%; color: #fff; font-size: 9px; line-height: 1; padding: 1px 3px; background: rgba(0,0,0,0.9); float: left; }