/* Minification failed. Returning unminified contents. (141,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary-lst-1' (1454,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (1458,36): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary-lt' (1458,75): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary-lt' (1611,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (1612,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (1616,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (1643,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (2544,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (2554,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (2925,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2926,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2927,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2930,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2931,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2932,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2933,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2934,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2935,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2936,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2939,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2940,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2943,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2944,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2945,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2946,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2947,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2948,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2951,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2953,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2955,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2956,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2957,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2958,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2959,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2960,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2961,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2964,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2965,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2966,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2968,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2969,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2975,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2978,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2981,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2984,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2987,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2990,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2993,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2996,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (2999,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3002,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3005,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3008,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3023,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary-lst-1' (3024,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-color' (3095,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (3202,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (3401,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (3440,27): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (3465,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (3494,21): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (3499,26): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (3510,96): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary-lt' (3787,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (3824,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4042,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4131,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-color' (4135,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4249,26): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4258,69): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary-lt' (4564,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4566,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4589,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary-lst-1' (4743,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4823,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4825,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4892,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4930,34): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4949,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (4953,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (5223,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary-ltr' (5224,54): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (5224,74): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary-ltr' (5332,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5365,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5369,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (5379,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (5429,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5440,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5442,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-color' (5459,27): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5467,20): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5506,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5520,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5521,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5525,33): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary-rgb' (5526,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5535,17): run-time error CSS1039: Token not allowed after unary operator: '-bs-body-color' (5538,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-tint-4' (5545,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-tint-2' (5546,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5551,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5564,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5567,32): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5571,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5766,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary' (5781,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (5792,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5793,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5799,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5812,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (5837,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (5918,33): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary-rgb' (5919,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (5923,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-tertiary' (6157,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (6226,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (6287,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (6816,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (6880,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (6894,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (6898,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7000,53): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7003,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7009,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7016,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7043,65): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7073,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7083,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7089,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7096,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7101,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7116,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7119,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7131,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7135,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7171,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7559,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (7612,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (8443,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (8622,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9254,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9265,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9562,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-primary-lst-1' (9763,22): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9812,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9867,29): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9871,56): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary-lt' (9876,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9880,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9888,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9894,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (9994,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10001,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10391,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10392,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10397,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10398,24): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10415,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10438,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10559,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10575,28): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10601,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10612,56): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10853,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (10965,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-ntrl-min' (10978,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' (11016,17): run-time error CSS1039: Token not allowed after unary operator: '-clr-secondary' */ .access-denied { padding: 1rem; } /* Accordion Card */ .accordion .acc-card:not(:last-child) { margin-bottom: 10px; } /* Accordion Header */ .accordion .acc-header { background: #F2F2F2; padding: .75rem 1.25rem; } .accordion .acc-header .btn { color: #2A405E; padding: .375rem 0; white-space: normal; text-align: left; } .accordion .acc-header .btn:hover, .accordion .acc-header .btn:active, .accordion .acc-header .btn:visited, .accordion .acc-header .btn:focus { text-decoration: none; color: inherit; } .accordion .acc-header i { margin-right: 10px; } /* Accordion Body */ .accordion .acc-body { padding: 1.25rem; border: solid 1px #E0E0E0; } .accordion .acc-body p:last-child { margin: 0; } /* My Account Link */ #dropdownMenuLink { display: flex; align-items: center; } /* Dropdown Menu */ .account-menu { box-shadow: 0 3px 14px rgba(0,0,0,.1); border: none; margin: .5rem 0 0; } /*.dropdown-menu:before { top: -23px; bottom: auto; left: 9%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; border-color: transparent; border-bottom-color: #FFFFFF; border-width: 12px; margin-left: -12px; }*/ @media(max-height:616px) { .account-menu { height: calc(100vh - 5em); overflow-y: auto; } } /* Dropdown Header */ .account-menu .dropdown-header { color: #4C4C4C; font-weight: 600; } .account-menu .dropdown-header .welcome { display: block; font-family: "Lato", sans-serif; font-weight: 600; font-size: 1.1rem; } /* Dropdown-Item */ .account-menu .dropdown-item-wrapper { position: relative; } .account-menu .dropdown-item { padding: .5rem 1.5rem; color: #4C4C4C !important; display: flex; justify-content: space-between; align-items: center; } .account-menu .dropdown-item:hover { background: none; color: #22B154 !important; } .account-menu .dropdown-item.active { background: none; color: #22B154 !important; } .account-menu .dropdown-item:active { background: none; color: #22B154 !important; } @media(max-width: 991.98px) { .account-notification-ct .notifications { position: absolute; left: -10px; top: -19px; } } /* Badge Notifications */ @media(min-width: 992px) { .my-account .notifications { display: flex; margin-left: 10px; } } /* Dropdown Divider */ .account-menu .dropdown-divider { border-color: #E0E0E0; } /* Notification Container */ .notification { position: fixed; top: 0; background: #4C4C4C; width: 100%; font-weight: 600; text-align: center; z-index: 9999; } .notification { -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); } .notification > a, .notification > span { display: block; color: #FFFFFF; } .notification > a:hover { background: rgba(0,0,0,0.2); } .notification > a, .notification > span { padding: 16px; } /* Notification animation */ .notification.open { animation: slideDown 5s 0s 1 ease-in-out; -webkit-animation: slideDown 5s 0s 1 ease-in-out; -moz-animation: slideDown 5s 0s 1 ease-in-out; } @keyframes slideDown { 0%, 100% { transform: translateY(-100%); } 5%, 95% { transform: translateY(0px); } } @-webkit-keyframes slideDown { 0%, 100% { -webkit-transform: translateY(-100%); } 5%, 95% { -webkit-transform: translateY(0px); } } @-moz-keyframes slideDown { 0%, 100% { -moz-transform: translateY(-100%); } 5%, 95% { -moz-transform: translateY(0px); } } @-ms-keyframes slideDown { 0%, 100% { -ms-transform: translateY(-100%); } 5%, 95% { -ms-transform: translateY(0px); } } /* Font Awesome Icon within Notifcations */ .notification i { margin-right: 10px; } /* Alert Secondary */ .alert-secondary { background-color: var(--clr-primary-lst-1); border-color: transparent; } /* Alert Danger */ .alert-danger { color: #AE262D; } .alert-danger h2 { color: #AE262D; font-weight: 600; } /* SKU Notification */ .sku-notification { position: absolute; z-index: 1; display: flex; align-items: center; width: auto !important; right: 100%; top: 50%; transform: translateY(-50%); margin-right: 10px; white-space: nowrap; pointer-events: none; background: #22B154; color: #FFFFFF; border: 2px solid #22B154; opacity: 0; padding: 3px 10px; font-size: 0.8rem; border-radius: 4px; box-shadow: 2px 2px 2px rgba(0,0,0,0.1); font-weight: 600; } .sku-notification i { color: #FFFFFF; } .sku-notification::after { width: 0; height: 0; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 4px solid #22B154; content: ''; position: absolute; right: 1px; top: 50%; transform: translateY(-50%); margin-right: -6px; } /*.sku-notification .sku-notification-message { position: relative; padding: 5px 10px; display: block; }*/ /*.sku-notification .sku-notification-message::after { width: 0; height: 0; border-top: 18px solid transparent; border-bottom: 18px solid transparent; border-left: 20px solid rgb(34, 177, 84); content: ''; position: absolute; right: -20px; top: 0; }*/ .sku-notification.show { animation: fadeOut 2.5s 0s 1 ease-in-out; -webkit-animation: fadeOut 2.5s 0s 1 ease-in-out; -moz-animation: fadeOut 2.5s 0s 1 ease-in-out; } @keyframes fadeOut { 100%{ opacity: 0; } 0%, 95% { opacity: 1; } } @-webkit-keyframes fadeInOut { 100%{ opacity: 0; } 0%, 95% { opacity: 1; } } @-moz-keyframes fadeInOut { 100%{ opacity: 0; } 0%, 95% { opacity: 1; } } @-ms-keyframes fadeInOut { 100%{ opacity: 0; } 0%, 95% { opacity: 1; } } /* Site Maintenance */ .site-maintenance-alert { padding: 2rem; } .site-maintenance-alert i.site-maintenance-icon { font-size: 3rem; } .associated-items { padding: 1rem; background-color: rgba(255,255,255,0.5); border-radius: .25rem; } .associated-items .row { margin-bottom: -.5rem; } @media(min-width: 992px) { .associated-items { padding: 1.5rem; } .associated-items .row { margin-bottom: -1.5rem; } } .associated-item { background-color: #FFFFFF; border: 1px solid #BBBBBB; border-bottom-width: 1px; border-left-color: #BBBBBB !important; border-right-color: #BBBBBB !important; border-top-color: #BBBBBB !important; font-family: "Lato", sans-serif; border-radius: 0.25rem; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; position: relative; display: flex; padding: 8px; } @media(max-width: 767.98px) { .associated-item { border-bottom-color: #BBBBBB !important; } } @media(min-width: 768px) { .associated-item { flex-direction: column; padding: 0; border-bottom-width: 3px; } } .associated-item .content-body { display: flex; flex-flow: column; padding: 0; min-width: 0; } @media(min-width: 768px) { .associated-item .content-body { padding: 0 1rem 1rem 1rem; } } .associated-item .rank { border-radius: 50%; color: #FFFFFF; display: block; width: 35px; height: 35px; position: absolute; top: -10px; left: -10px; font-size: 0.85rem; font-weight: bold; z-index: 1; } .associated-item .image { padding: 1rem; background: #FFFFFF; overflow: hidden; position: relative; border-radius: .25rem .25rem 0 0; } @media (max-width: 767.98px) { .associated-item .image { width: 25%; display: flex; align-items: center; justify-content: center; margin-right: 15px; flex-shrink: 0; padding: 0; } } @media (max-width: 575.98px) { .associated-item .image { width: 20%; } } @media(min-width: 768px) { .associated-item .image .image-wrapper { width: 100%; padding-top: 60%; position: relative; } .associated-item .image img { max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); transition: ease-in-out .4s; } } @media(max-width: 767.98px) { .associated-item .image img { max-height: 70px; padding: 0 !important; max-width: 100%; height: auto; width: auto; } } .associated-item .item-info { display: flex; align-items: center; flex-grow: 1; } @media(min-width: 768px) { .associated-item .item-info { flex-direction: column; align-items: flex-start; } } .associated-item .item-info .title-wrapper { word-break: break-word; min-width: 0px; } @media(min-width: 768px) { .associated-item .item-info .title-wrapper { width: 100%; } } .associated-item .item-info .title-wrapper a { display: block; } .associated-item .item-info .title-wrapper .breadcrumb-link { font-size: 0.75rem; font-weight: 400; margin-bottom: 5px; line-height: 1.2; } .associated-item .item-info .title-wrapper .date-added { display: block; font-size: 0.875rem; font-weight: 400; margin-bottom: 5px; } .associated-item .item-info .title-wrapper .item-title { font-weight: 600; line-height: 1.2rem; } @media(max-width: 767.98px) { .associated-item .item-info .title-wrapper .item-title { font-size: 12px; line-height: 1.2; } } .associated-item .hazardous-icon i.fa { text-align: center; width: 1.25em; } .associated-item .stock { font-size: 0.75rem; line-height: 1.2em; align-self: end; } @media(min-width: 768px){ .associated-item .stock { margin-left: 1.5rem; } } .associated-item .alternatives { font-size: 0.75rem; text-decoration: underline; } .associated-item .item-info .item-description { font-size: 0.875rem; position: relative; flex-grow: 1; } .associated-item .item-info .item-description.fade-description { max-height: 50px; overflow: hidden; } .associated-item .item-info .item-description.fade-description:after { pointer-events: none; content: ''; height: 40px; background-image: linear-gradient(to bottom, rgba(242,242,242,0), rgba(242,242,242,1)); position: absolute; bottom: 0px; left: 0px; right: 0px; } .associated-item .price-info { margin-left: auto; width: 100px; flex-shrink: 0; } @media(min-width: 768px) { .associated-item .price-info { margin-left: 0px; width: 100%; margin-top: auto; } } .associated-item .price-info .price-uom { font-weight: 700; } @media(min-width: 768px) { .associated-item .price-info .price-uom { white-space: nowrap; } } .associated-item .price-info .price-uom .price-wrapper { display: block; } @media(min-width: 768px) { .associated-item .price-info .price-uom .price-wrapper { display: inline-block; } } .associated-item .price-info .price-uom .from, .associated-item .price-info .price-uom .to { font-weight: normal; } .associated-item .price-info .price-uom .price { font-size: 1.25rem; line-height: 1.2rem; flex-grow: 1; } @media(max-width: 575.98px) { .associated-item .price-info .price-uom .price { font-size: 1rem; } } .associated-item .price-info .price-uom .uom { font-size: 0.65rem; color: #8D8D8D; margin-top: 0px; } /* Hazardous Item */ .associated-item .hazardous-icon { visibility: visible !important; position: absolute; bottom: -3px; left: 50%; transform: translateX(-50%); } .associated-item .hazardous-icon .fa-triangle { text-shadow: -1px -1px 0px #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF; } .associated-item .hazardous-icon.invisible > div { visibility: hidden; } .associated-item .hazardous-icon .hazardous-label .haz-ous { display: none !important; } /* Attribute Search Pages */ body.attribute-search-page .associated-items { display: none !important; } body.attribute-search-page .associated-items.show { display: block !important; } body.attribute-search-page #recentlyViewedSection, body.filter-page #recentlyViewedSection { display: none !important; } body.attribute-search-page #recentlyViewedSection.show, body.filter-page #recentlyViewedSection.show { display: block !important; } /* New Items - Using same CSS as associated items */ .associated-item.new-item .img-price-wrapper { margin-right: 15px; } @media(max-width: 575.98px) { .associated-item.new-item .img-price-wrapper { width: 35%; } } @media (max-width: 767.98px) { .associated-item.new-item .img-price-wrapper { width: 25%; } .associated-item.new-item .item-info .item-description { display: none; } } @media(min-width: 768px) { .associated-item.new-item .item-info .title-wrapper { border-bottom: 1px solid rgba(0,0,0,.1); padding-bottom: 10px; margin-bottom: 10px; flex-grow: 0; } .associated-item .image .image-wrapper { padding-top: 75%; } .associated-item.new-item .image { padding: 5px; } } @media(min-width: 992px) { .associated-item.new-item .img-price-wrapper { width: 40%; flex-shrink: 0; } } .associated-item.new-item .image { width: 100%; } @media(min-width: 992px) { .associated-item .price-info .price-uom { margin-right: 0; } .associated-item.new-item .price-info { margin: 0; padding: 0; border: none; } } .associated-item.new-item { padding: 10px; } /* Search Filter */ .attribute-search-filter { flex-grow: 1; } /* Required Filter */ .attribute-search-filter .filter-required { display: inline-block; color: #A01A21; align-self: center; font-size: 0.75rem; } @media(min-width: 992px) { .attribute-search-filter .filter-required { margin-left: 10px; margin-top: 0; } } .attribute-search-filter.mandatory h3 { color: #A01A21; word-break: keep-all; } .attribute-search-filter.mandatory.invalid .dropdown-toggle { outline: 2px solid #A01A21; outline-offset: -2px; color: #A01A21; } .attribute-search-filter.mandatory.invalid h3 { font-weight: bold; } .attribute-search-filter.mandatory.invalid .filter-options { background: #FFFFFF; } /* Filter Options */ .attribute-search-filter .filter-options { height: 150px; overflow-y: scroll; font-size: 0.875rem; padding-right: 1.25rem; } .attribute-search-filter .filter-options .custom-radio .custom-control-label::before, .attribute-search-filter .filter-options .custom-radio .custom-control-label::after { height: 0.875rem; width: 0.875rem; } .attribute-search-filter .filter-options-wrapper { padding: 12px; background-color: #FFFFFF; } .attribute-search-filter .filter-options-wrapper .most-popular { margin-bottom: 15px; display: block; font-size: 0.8rem; text-transform: uppercase; border-bottom: 1px solid rgba(0,0,0,0.15); padding-bottom: 5px; } .attribute-search-filter .description-search-ct { padding: 0 8px; } .attribute-search-filter .dropdown-menu > .lookup { background-color: #ECECEC; } .attribute-search-filter .description-search-ct > .lookup { margin: 10px 0; } .attribute-search-filter .description-search-ct input { border: solid 1px #4C4C4C; font-size: 0.85rem; } .attribute-search-filter .description-search-ct .input-group-append { border-left: solid 1px #4C4C4C; margin-left: 10px; } .attribute-search-filter .description-search-ct .btn { color: #4C4C4C; } .attribute-search-filter .dropdown-menu { border-radius: 0; border-color: rgba(0,0,0,0.25); background-color: #F2F2F2; padding: 0; right: -5px; left: -5px !important; margin-top: -56px; padding-top: 50px; z-index: 1; transform: translate3d(0px, 50px, 0px) !important; } .attribute-search-filter .dropdown-menu .custom-control { border-bottom: solid 1px rgba(0,0,0,0.15); margin-bottom: 10px; padding-bottom: 10px; } .attribute-search-filter .dropdown-toggle { font-weight: 400; font-size: 0.85rem; padding: .75rem 1rem !important; z-index: 2; position: relative; } /* Selected Attribute Values */ .selected-att-values .badge { white-space: normal; font-size: 0.85rem; } /* Open State */ .attribute-search-filter .filter { position: relative; } .attribute-search-filter .filter.show { z-index: 99; } .attribute-search-filter .filter .attribute-name { font-weight: 600; } /* Instructions */ .attribute-search-instructions { margin: 30px 0px 20px 0px; text-align: center; font-size: 0.9rem; } @media(min-width: 768px){ .attribute-search-instructions { font-size: 1.5rem; } } /* Availability Checker */ .availability-checker { background-color: #2A405E !important; border-bottom: 1px solid rgba(255,255,255,0.2); padding: 1rem 0; border-top: none; margin-top: auto; } .availability-checker-content h2 { color: #FFFFFF; text-transform: uppercase; font-weight: 900; font-size: 1rem; } .availability-checker-content .checker-input { border: none; } /* Availability search box for medium to large screens */ @media(min-width: 768px) { .availability-search { flex-grow: 1; } } /* Availability search box for medium to large screens */ @media(min-width: 768px) and (max-width: 1199px) { .availability-checker-content h2 { font-size: 1.5rem; } } /* Availability Checker Result */ .availability-checker-result { background: #3e5370; padding: 1.25rem; margin-top: 10px; position: relative; color: #FFFFFF; } .availability-checker-result:before { border-bottom: 12px solid transparent; border-left: 12px solid transparent; border-top: 12px solid #2A405E; content: ""; left: 25px; margin-top: 10px; position: absolute; top: -10px; border-right: 12px solid transparent; } .availability-checker-result .item-availability { color: #FFFFFF; } .availability-checker-result a { display: flex; color: #FFFFFF; } .availability-checker-result .sku-thumb { width: 35px; height: 35px; display: block; margin-right: 15px; } .availability-checker-result p { margin: 0; } /* Footer Logos */ #footerLogos a:not(:first-child) { margin-left: 25px; } #footerLogos a.anniversary img { max-height: 55px; } #footerLogos a.cousins-logo img { height: 25px; } /* Page Header */ .index-container header { text-align: center; } /* AZ Result Cards */ .index-results-ct.content-card:not(:last-child) { margin-bottom: 20px; } /* AZ Results Body */ .index-results-ct .content-body { padding: 1.25rem 1.75rem; font-size: 0.875rem; } /* Index Results Header */ .index-results-ct .card-header { display: flex; justify-content: space-between; align-items: center; } /* Selected Letter */ .index-results-ct .index-letter { font-size: 1.313rem; line-height: 1.1em; } /* Category Counter */ .index-results-ct .cat-count { font-size: 0.875rem; } .index-results-ct .cat-count .number { font-size: 0.875rem; font-weight: 600; color: #22B154; } /* Department List */ .index-results-ct .department-list { column-gap: 30px; } /* Department Group */ .index-results-ct .department-group { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; } .index-results-ct .department-group:not(:last-child) { margin-bottom: 30px; } /* Department Name */ .index-results-ct .department-group .name { font-weight: 600; color: #2A405E; margin-bottom: 5px; display: block; position: relative; } .index-results-ct .department-group .name::before { content: ''; position: absolute; height: 15px; left: -8px; top: 50%; transform: translateY(-50%); border-width: 1px; border-style: solid; } /* Category Name */ .index-results-ct .category-ct { padding-left: 10px; } @media(min-width: 576px) { /* Department List */ .index-results-ct .department-list { column-count: 2; } } @media(min-width: 992px) { /* Our Catalogues Page */ .index-container h1 { font-size: 2.75rem; } } @media(min-width: 1200px) { /* Department List */ .index-results-ct .department-list { column-count: 3; column-gap: 50px; } } /* Badges */ .badge { color: #FFFFFF; } .badge:hover { color: #FFFFFF; } /* Primary Badge */ .badge-primary { background: #22B154; } .badge-primary:hover { background: #192C46; color: #FFFFFF; } /* Green Badge */ .badge-success { background: #22B154; } .badge-success:hover { background: #1FA84F; color: #FFFFFF; } /* Red Warning */ .badge-warning { background: #A01A21; } .badge-warning:hover { background: #AE262D; color: #FFFFFF; } /* Badge Light */ .badge-light { background: #E0E0E0; color: inherit; } .badge-light:hover { background: #F8F8F8; color: inherit; } /* Badge Transparent White */ .badge-trans-w { background: rgba(255,255,255,0.2); color: inherit; } .badge-trans-w:hover { background: rgba(255,255,255,0.3); color: #FFFFFF; } .badge-trans-b { background: rgba(0,0,0,0.25); color: #FFFFFF; } .badge-trans-b:hover { background: rgba(0,0,0,0.3); color: #FFFFFF; } /* Red Warning */ .badge-danger { background: #A01A21; } .badge-danger:hover { background: #AE262D; color: #FFFFFF; } /*************************************************** Bank Transfer Popup ***************************************************/ .bank-transfer-confirmation { text-align: left; } .bank-transfer-confirmation .payment-details .total { font-size: 2.8rem; font-weight: bold; color: #22B154; } .bank-transfer-confirmation .payment-details .transfer-reference-ct { position: relative; } .bank-transfer-confirmation .payment-details .transfer-reference-ct:before { border-bottom: 10px solid #D4EDDA; border-left: 10px solid transparent; border-right: 10px solid transparent; content: ""; position: absolute; top: -10px; left: 15px; } .bank-transfer-confirmation .payment-details .transfer-reference .emphasis { font-size: 1.9rem; font-weight: bold; display: block; margin: 0.25rem 0; } .bank-transfer-confirmation .cousins-bank-details button { width: 100%; } /* Bank Trasnfer Details */ @media (min-width: 580px) { .bank-transfer-confirmation dl { display: flex; flex-wrap: wrap; } .bank-transfer-confirmation dt { width: 33%; } .bank-transfer-confirmation dd { width: 66%; } } /* Bank Transfer Instructions */ .bank-transfer-instructions { margin-top: 20px; padding-top: 20px; border-top: solid 1px #E0E0E0; } /* Basket Tabs */ .basket-tabs { margin-top: 30px; } /* Empty Basket */ .empty .basket-summary { display: none; } .empty .empty-basket { display: none; } /* Basket Tabs */ @media (max-width: 768.98px) { .basket-tabs.alt-tabs .nav-tabs .nav-link i { margin-right: 5px; display: inline-block; } } /* Saving discount per SKU */ .saving-discount { color: #22b154; margin-top: 5px; display: inline-block; } /* Fixed Price */ .fixed-price { color: #22b154; margin-top: 5px; display: block; font-size: 0.75rem; text-transform: uppercase; } /* Stock Quantity */ .sku-stock-status { margin-top: 5px; display: block; font-size: 0.75rem; } /* Weight */ .sku-weight { margin-bottom: 5px; display: block; font-size: 0.75rem; font-weight: bold; } /* Accepted Payment Cards */ .payment-cards { display: flex; flex-wrap: wrap; margin-bottom: 50px; justify-content: flex-end; align-items: center; } .payment-cards img, .payment-cards a { margin: 0 5px 0 0; } .payment-cards img { height: 35px; } /* Delivery Address Confirmation */ #deliveryAddressConfirmation { text-align: center; } #deliveryAddressConfirmation h4 { font-size: 1.05rem; margin-bottom: 8px; font-weight: bold; } #deliveryAddressConfirmation .alert { padding: 15px 30px; margin: 0px; background: rgba(31, 168, 79, 0.1); border: none; color: #4c4c4c; } /* Backorder Items Message */ #backorderItemsMessage { color: #4C4C4C; font-size: 12.8px; line-height: 1rem; } #backorderItemsMessage h4 { font-size: 1.05rem; margin-bottom: 8px; font-weight: bold; color: #A01A21 } #backorderItemsMessage .status-message { text-transform: uppercase; font-weight: 600; } /* Basket Order Buttons */ .saved-cards { display: flex; flex-direction: column; align-items: center; } .saved-card { display: flex; align-items: center; position: relative; opacity: 0.65; padding: 10px; border: 2px solid transparent; border-radius: 10px; } .saved-card:hover { cursor: pointer; opacity: 1; } .saved-card img { width: 60px; } .saved-card[data-card-brand='jcb'] img { border: 1px solid rgba(0,0,0,0.2); } .saved-card .last-4-digits { margin-left: 10px; font-family: 'Courier New', monospace; font-size: 0.9rem; user-select: none; } /* Saved Card Selected State */ .saved-card.selected { opacity: 1; border-color: #22b154; } @media (max-width: 369.98px ) { .basket-order-buttons .change-card { margin-top: 10px; } } /* Basket Summary */ .basket-summary .row > [class*="col"] { padding-top: 0px !important; margin-top: 30px; } /* Additional Fee Notice */ .additional-fee-notice { text-align: left; } @media only screen and (min-width: 576px) { .additional-fee-notice { text-align: right; } } /* Basket Section Refresh */ .basket-section { position: relative; } .basket-section .refresh-icon { display: none; align-items: center; justify-content: center; font-size: 2.5rem; text-align: center; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; background: rgba(255,255,255,0.9); z-index: 2; } .basket-section.loading .refresh-icon { display: flex; } @media (min-width: 768px ) { #basketDeliveryMethod { border-left: solid 1px #E0E0E0; } } @media (min-width: 1200px ) { #basketConfirm { border-left: solid 1px #E0E0E0; } } /* Terms & Conditions Modal */ .terms { height: 400px; overflow-y: scroll; border: 1px solid #E0E0E0; } /* Move to Basket */ #basketItems .move-to-basket { display: none; } /* Saved for Later Items */ #savedForLaterItems .save-for-later { display: none !important; } #savedForLaterItems .saving-discount { display: none !important; } #savedForLaterItems .btx-required { display: none !important; } /* Empty Sections */ .show-when-empty { display: none; } .empty > .show-when-empty { display: block; } .empty > .hide-when-empty { display: none; } /* Confirmation Popup - New Card (Worlpay Template Overrides) */ #paymentSection { width: 100%; overflow: hidden; } #paymentSection #token_container_holder { display: block !important; } #paymentSection iframe { width: 100% !important; } /* Choose Payment Method */ .basket-payment-selection:not(:last-child) { margin-bottom: 20px; padding-bottom: 20px; border-bottom: solid 1px #E0E0E0; } .basket-payment-selection h4 { color: #22b154; } .basket-payment-selection .row > [class*="col"] { margin-top: 10px; } .basket-payment-selection .row:not(.footer-container) { margin-top: -10px; } .pay-options .btn { padding: 0.8rem !important; } .choose-payment-method { background: #F8F8F8 !important; opacity: 0.5; } .choose-payment-method:hover { opacity: 1; } .choose-payment-method.active { background: #F8F8F8; outline: 2px solid #22B154; outline-offset: -2px; opacity: 1; } .choose-payment-method i { display: none; } .choose-payment-method.active i { display: inline-block; } /* Stock/Pricing Container */ @media(max-width: 575.98px) { #basketItems .stock-pricing-ct { margin-top: 10px; } /* Hazardous Label */ #basketItems .sku-item .sku-icons .hazardous-icon { text-align: center; } #basketItems .sku-item .sku-icons .hazardous-icon .hazardous-label { display: block !important; } } /**********************************************************************************************/ /* Payment Modal */ #paymentModal .modal-body { position: relative; } #paymentModal .close-button { background: none; border: none; padding: 0px; font-size: 2rem; line-height: 1rem; position: absolute; top: 1rem; right: 1rem; } #paymentModal .close-button:hover { cursor: pointer; } #paymentModal .close-button i { color: initial; } #paymentModal .close-button:hover i { color: #A01A21; } #paymentModal #paymentModalSummary { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px dotted rgba(0,0,0,0.25); } #paymentModal #paymentModalSummary span { display: block; } #paymentModal #paymentModalSummary .total-label { font-size: 1.25rem; } #paymentModal #paymentModalSummary .total-amount { font-size: 2rem; font-weight: 600; line-height: 1.8rem; } #paymentModal #paymentModalSummary #paymentModalExchangeRateAlert { margin-top: 1rem; margin-bottom: 0px; } #paymentModal #paymentForm.disabled{ opacity: 0.5; pointer-events: none;} #paymentModal #paymentMessage { color: #A01A21; } #paymentModal #payNowButton { position: relative; } #paymentModal #payNowButton .spinner { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); display: inline-block; } @media(min-width: 768px){ #paymentModal .modal-content { min-width: 580px; } } /* Payment Failure Reasons */ #paymentFailureAlert { margin-top: 1rem; font-size: 0.75rem; } #paymentFailureAlert h3 { font-size: 1.1em; font-weight: bold; color: #A01A21; } #paymentFailureAlert ul { padding: 0px; margin-left: 15px; } /* Duty Modal */ #itemBreakdownModalBody { padding: 15px; } #itemBreakdownModalBody .pricing-ct { min-width: 100px; } #itemBreakdownModalBody .pricing-ct:last-child { margin: 0px; } #itemBreakdownModalBody .sku-list-quantity-container { order: 0 !important; flex: 0 0 100px; } @media(min-width: 768px){ #itemBreakdownModalBody .sku-list-quantity-container { margin-right: 30px; align-items: center; } #itemBreakdownModalBody .pricing-ct { justify-content: flex-start; text-align: left; } } @media(min-width: 1200px){ #itemBreakdownModalBody .sku-item .pricing-ct { flex: 0 1 80px; } } /* Container Overrides */ @media(max-width: 991.98px) { .container { width: 100%; max-width: 100%; } } @media(min-width: 992px) { .container { max-width: 992px; } } @media(min-width: 1200px) { .container { max-width: 1200px; } } @media(min-width: 1366px) { .container { max-width: 1336px; } } @media(min-width: 768px) and (min-height: 768px) { .navbar-expand-topnav { -ms-flex-flow: row nowrap; flex-flow: row nowrap; -ms-flex-pack: start; justify-content: flex-start; } } /* Breadcrumb Content */ .breadcrumb-content { display: flex; align-items: center; } .breadcrumb-content a { font-size: 0.75rem; color: inherit; } .breadcrumb-content a:hover { text-decoration: underline; } /* Back Button */ .breadcrumb-content #breadcrumbBackBtn { display: none; } .breadcrumb-content #breadcrumbBackBtn:hover, .breadcrumb-content #breadcrumbBackBtn:active, .breadcrumb-content #breadcrumbBackBtn:focus { text-decoration: none !important; } /* Breadcrumb items */ .breadcrumb.fade { opacity: 0.2; } .breadcrumb { background: none; margin: 0; font-weight: 600; } .breadcrumb-item + .breadcrumb-item { padding: 0px; } .breadcrumb-item + .breadcrumb-item::before { content: '\f053'; font-family: 'FontAwesome'; font-weight: bold; font-size: 0.75rem; padding: 0px; margin-right: 0.5rem; opacity: 0.5; } .breadcrumb .breadcrumb-item { display: none; display: flex !important; align-items: center; } .breadcrumb .breadcrumb-item:not(:last-child) { margin-right: 0.5rem; } .breadcrumb .back-crumb { display: block; } @media (min-width: 768px) { .breadcrumb .breadcrumb-item { display: block; } .breadcrumb .back-crumb { display: none; } } /* Microsoft Edge Browser 12+ (All) - @supports method */ @media(max-width: 767.98px) { .breadcrumb-ct { display: block; } @supports (-ms-ime-align:auto) { .breadcrumb-ct { top: 54px; } } } .breadcrumb-ct { position: relative; } .breadcrumb-ct .close { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); display: none; } .breadcrumb-ct .breadcrumb { padding: 0px; } .breadcrumb-ct.dept-background .breadcrumb { } .breadcrumb-ct.dept-background .breadcrumb-item + .breadcrumb-item::before { color: #FFFFFF; } .breadcrumb-ct.dept-background .breadcrumb-content { padding: 0.5rem; } .breadcrumb-ct.dept-background .breadcrumb-content #breadcrumbBackBtn { border: 2px solid #FFFFFF; color: #FFFFFF; background: none; display: block; } .breadcrumb-ct.dept-background .breadcrumb-content #breadcrumbBackBtn:hover, .breadcrumb-ct.dept-background .breadcrumb-content #breadcrumbBackBtn:active, .breadcrumb-ct.dept-background .breadcrumb-content #breadcrumbBackBtn:focus { background: rgba(255,255,255,0.15); color: #FFFFFF; text-decoration: none !important; } .breadcrumb-ct.dept-background .breadcrumb-content a { color: #FFFFFF; } @media(max-width: 767.98px) { .breadcrumb-ct.dept-background .breadcrumb-content { padding: 0.5rem 1rem; } .breadcrumb-ct.dept-background .breadcrumb-content #breadcrumbBackBtn { display: none; flex-grow: 1; } } .modal-body .breadcrumb-ct { margin-left: -1.75rem; margin-right: -1.75rem; margin-top: -1.75rem; } .modal-body .breadcrumb-ct .close { display: block; } .modal-body .breadcrumb-ct .breadcrumb-content { padding: 1rem 1.75rem; } /* Bulk Savings Wrapper */ .bulk-savings-popover { z-index: 3; } .bulk-savings-wrapper { background: #FFFFFF; position: absolute; top: 130%; right: 0; z-index: 100; border: solid 2px #22b154; } /* Bulk Savings Overlay */ .bulk-savings-overlay { position: relative; } .bulk-savings-overlay::before { border-top: 12px solid transparent; border-left: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid #22b154; content: ""; height: 0; right: 24px; top: -25px; margin-left: -12px; position: absolute; width: 0; } @media(min-width: 992px) { .bulk-savings-wrapper { top: 170%; } .bulk-savings-overlay::before { right: 40px; } } @media(min-width: 1200px) { .bulk-savings-wrapper { top: 106%; left: auto; } .bulk-savings-overlay::before { right: 50px; } } /* Bulk Savings Overlay Details */ .bulk-savings-overlay .bulk-savings-title { background: #22b154; padding: 0.75rem 0.75rem; position: relative; } .bulk-savings-overlay .bulk-savings-title h4 { margin: 0; color: #FFFFFF; font-size: 1.25rem; } .bulk-savings-overlay .close-bulk-savings { position: absolute; right: 10px; top: calc(50% - 12px); color: #FFFFFF; } .bulk-savings-overlay .close-bulk-savings .fa-times { color: #FFFFFF; } .bulk-savings-overlay table { margin: 0; } /* Bulk Savings Quantity Boxes */ .bulk-savings-ct .qty-input .input-group-text { border-color: #22B154; } .bulk-savings-ct .qty-input input, .bulk-savings-ct .qty-input input:focus { border-color: #22B154 !important; } .bulk-savings-ct .qty-discounts-view-offer { position: relative; background: #22B154; color: #FFFFFF; text-transform: uppercase; font-size: 8px; width: 100%; padding: 1px 2px; font-weight: 700; letter-spacing: -.2px; text-align: center; border-radius: 0 0 .25rem .25rem; display: block; margin-top: -2px; cursor: pointer; } @media(min-width: 992px) { .bulk-savings-ct .qty-discounts-view-offer { position: absolute; left: 50%; transform: translateX(-50%); bottom: -12px; padding: 2px 2px; line-height: 1.1em; width: 56px; } } .bulk-savings-ct .qty-discounts-sign { position: absolute; left: 0; top: 0px; background: #22B154; color: #FFFFFF; text-transform: uppercase; font-size: 8.5px; padding: 1px 2px; font-weight: 700; text-align: center; border-radius: 0 0 .25rem 0; } /* Bulk Savings Card */ .bulk-saving-card { border: solid 2px #22b154; } .bulk-saving-card .bulk-saving-header { background: #22b154; padding: .75rem .75rem; } .bulk-saving-card .bulk-saving-header h4 { color: #FFFFFF; margin-bottom: 0; } /* Button Groups */ .button-group-sml { display: flex; align-items: flex-start; flex-wrap: wrap; margin-bottom: 1rem; } .button-group-sml a:not(:last-of-type) { margin-right: 0.5rem; margin-bottom: 0.75rem; } .button-group-lg { display: flex; align-items: flex-start; flex-wrap: wrap; margin-bottom: 1rem; } .button-group-lg a:not(:last-of-type) { margin-right: 1.875rem; margin-bottom: 1rem; } .button-group-sml a:hover, .button-group-lg a:hover { text-decoration: none; } /* Buttons */ button:not(.btn) { border: none; } .btn { color: #FFFFFF; font-weight: 700; border: solid 1px transparent; } .btn:hover { cursor: pointer; color: #FFFFFF; } .btn:not(.btn-sm):not(.btn-link) { padding: .375rem 1.5rem; } .btn-cou1, .btn-cou1:visited { background: #2A405E; } .btn-cou1:hover, .btn-cou1:active, .btn-cou1:focus { background: #192C46; } .btn-cou2, .btn-cou2:visited { background: #192C46; } .btn-cou2:hover, .btn-cou2:active, .btn-cou2:focus { background: #2A405E; } .btn-cou3, .btn-cou3:visited { background: var(--clr-secondary); } .btn-cou3:hover, .btn-cou3:active, .btn-cou3:focus { background: var(--clr-secondary-lt); border-color: var(--clr-secondary-lt) !important; } .btn-cou4, .btn-cou4:visited { background: #A01A21; } .btn-cou4:hover, .btn-cou4:active, .btn-cou4:focus { background: #AE262D; } .btn-cou5, .btn-cou5:visited { background: #EBEBEB; color: #2A405E; } .btn-cou5:hover, .btn-cou5:active, .btn-cou5:focus { background: #F8F8F8; color: #2A405E; } .btn-cou6, .btn-cou6:visited { background: rgba(255,255,255,0.2); } .btn-cou6:hover, .btn-cou6:active, .btn-cou6:focus { background: rgba(255,255,255,0.3); } .btn-cou7, .btn-cou7:visited { background: #E0E0E0; color: #4C4C4C; } .btn-cou7:hover, .btn-cou7:active, .btn-cou7:focus { background: #F8F8F8; color: #4C4C4C; } .btn-cou8, .btn-cou8:visited { background: #22B154; color: #FFFFFF; } .btn-cou8:hover, .btn-cou8:active, .btn-cou8:focus { background: #1FA84F; color: #FFFFFF; } .btn-cou8:disabled { background: #22B154; border-color: transparent; } .btn-cou8-alt, .btn-cou8-alt:visited { background: #FFFFFF; border: 1px solid #22B154; color: #22B154; } .btn-cou8-alt:hover, .btn-cou8-alt:active, .btn-cou8-alt:focus { background: #FFFFFF; border: 1px solid #1FA84F; color: #1FA84F; } .btn-cou9, .btn-cou9:visited { background: #FFFFFF; color: inherit; border: solid 1px #E0E0E0; } .btn-cou9:hover, .btn-cou9:active, .btn-cou9:focus { background: #FFFFFF; color: #2A405E; } .btn-cou10, .btn-cou10:visited { background: none; color: inherit; border: solid 1px #4C4C4C; } .btn-cou10:hover, .btn-cou10:active, .btn-cou10:focus { background: none; color: #4C4C4C; border: solid 1px #4C4C4C; } .btn-active, .btn-active:visited { background: #2A405E; color: #FFFFFF; } .btn-active:hover, .btn-active:active, .btn-active:focus { background: #192C46; color: #FFFFFF; } /* Button Link */ .btn-link { color: #4C4C4C; background-color: transparent; } .btn-link:hover { color: #4C4C4C; text-decoration: underline; } /* XL Buttons */ .btn-xl { padding: 0.85rem 3rem; font-size: 1.6rem; line-height: 1.5; border-radius: 0.3rem; } /* Loading Buttons */ .btn .loading-icon { display: none; } .btn.loading .loading-icon { display: inline-block; } /* Checkbox Buttons */ .button-checkbox { background: #FFF; border: solid 1px #E0E0E0; color: #5c5c5c; border-radius: .25em; display: inline-block; padding: 0 !important; margin-right: 15px; } .button-checkbox:hover { color: inherit; } .button-checkbox:last-of-type { margin-right: 0; } .button-checkbox .text { padding: .5rem 1rem; display: inline-block; border-left: solid 1px #E0E0E0; font-weight: 700; } @media(max-width: 767.98px) { .button-checkbox { font-size: 78%; } } /* Checkbox Buttons Icons */ .button-checkbox .icon-container { padding: 0 1rem; } .button-checkbox i { color: #A01A21; } .button-checkbox .fa-check { display: none; } /* Checkbox Buttons Icons - Active States */ .button-checkbox.active i { color: #6e9808; } .button-checkbox.active .fa-check { display: inline-block; } .button-checkbox.active .fa-times { display: none; } /* Homepage Buttons */ .hp-buttons .btn:not(.btn-sm):not(.btn-link) { padding: .375rem 1rem; } /* Card Authorisation */ .iframe-container iframe { margin: 0; border: 0; overflow: auto; width: 100%; height: inherit; } /* iFrame height change dpeneidng on size of browser */ .iframe-container #autoIframe { height: 810px; } @media (min-width: 639px) { .iframe-container #autoIframe { height: 640px; } } @media (min-width: 768px) { .iframe-container #autoIframe { height: 650px; } } @media (min-width: 992px) { .iframe-container #autoIframe { height: 800px; } } @media (min-width: 1366px) { .iframe-container #autoIframe { height: 640px; } } /* iFrame fallback box */ .iframe-container #iframeFallback { background: #F2F2F2; padding: 1.25rem; } .iframe-container #iframeFallback form button { padding: 0; border: none; font-weight: bold; color: #22B154; } .iframe-container #iframeFallback form button:hover { cursor: pointer; color: #4EC176; } /* Instruction Items */ .instruction-container .instruction-item:not(:last-of-type) { margin-bottom: 30px; } .instruction-container .heading { background-color: #E0E0E0; font-weight: 600; padding: 10px; } /* Cards */ .card { border: none; margin-bottom: 30px; color: inherit; } .card:hover { text-decoration: none; } .card-img-top { border-radius: 0; } .card-header.cou1 { background-color: #2a405e; color: #FFFFFF; } .card.w-bdr { border: solid 1px #E0E0E0; } /* Feature Card */ .card.feature-card .card-header { background-color: var(--clr-primary); color: var(--clr-ntrl-min); } .card.feature-card .card-header .title { color: var(--clr-ntrl-min); font-weight: 700; text-transform: uppercase; font-size: 1rem; margin-bottom: 0; } @media(min-width: 576px) { .card.feature-card .card-header .title { font-size: 1.25rem; } } /* Homepage Carousel */ .hp-carousel { background: #0C1828; color: #FFFFFF; text-align: center; } .hp-carousel a { color: #FFFFFF; } .hp-carousel h1 { text-transform: uppercase; font-size: 1.75rem; line-height: 1.2em; } .hp-carousel h1 strong { display: block; color: #FFFFFF; font-size: 2.5rem; font-weight: 800; } .hp-carousel p:last-of-type { margin-bottom: 0; } @media(min-width: 768px) { .hp-carousel h1 { font-size: 2.125rem; line-height: 1.6em; } .hp-carousel h1 strong { font-size: 5.5rem; } } /* Generic (Cousins Gold) */ .hp-carousel .cg .subtitle strong { color: var(--clr-secondary); } /* Batteries Department - Orange */ .hp-carousel .dept-1 .subtitle strong { color: #E53123; } /* Books and Catalogues Department - Grey */ .hp-carousel .dept-9 .subtitle strong { color: #6D6B76; } /* Clockparts - Beige */ .hp-carousel .dept-8 .subtitle strong { color: #C0A86C; } /* Consumables - Pink */ .hp-carousel .dept-7 .subtitle strong { color: #CA176B; } /* Ear Piercing - Green */ .hp-carousel .dept-3 .subtitle strong { color: #6E9808; } /* Equipment - Teal */ .hp-carousel .dept-5 .subtitle strong { color: #287482; } /* Jewellery, Findings, Chains & Solders - Purple */ .hp-carousel .dept-2 .subtitle strong { color: #754C78; } /* Tools - Green */ .hp-carousel .dept-6 .subtitle strong { color: #287482; } /* Watch Movements - Light Brown */ .hp-carousel .dept-12 .subtitle strong { color: #7E6B4C; } /* Watch Parts/ Watch Glasses - Brown */ .hp-carousel .dept-4 .subtitle strong { color: #704F26; } /* Watch Straps, Bracelets & Fittings - Orange */ .hp-carousel .dept-10 .subtitle strong { color: #FE8415; } /* Clearance - Mint */ .hp-carousel .dept-14 .subtitle strong { color: #1EC988; } /* Document Downloads - Blue */ .hp-carousel .documentdownloads .subtitle strong { color: #39308D; } .catalogue-overview-banner { background-repeat: no-repeat; background-size: 300% !important; background-position: 82% !important; background-repeat: no-repeat !important; margin-bottom: 20px; background: #FFFFFF; position: relative; z-index: 4; } .catalogue-overview-banner h1 { margin-bottom: 0.25rem; } .catalogue-overview-banner .catalogue-item-description { font-size: 0.85rem; line-height: 1.1rem; } @media(min-width: 576px) { .catalogue-overview-banner { background-size: 125% !important; background-position: center !important; } } @media(min-width: 768px) { .catalogue-overview-banner { background-size: cover !important; } } @media(min-width: 992px) { .catalogue-overview-banner ul { list-style-type: none; margin: 0px; padding: 0px; } } .catalogue-item-overview.content-card { border: none; } .catalogue-item-overview.content-card:not(:last-child) { margin-bottom: 0.5rem; } /* Catalogue Item Overview Body Container */ .catalogue-item-overview .content-body .content-body-inner { display: flex; flex-direction: column-reverse; position: relative; } @media (min-width: 768px) { .catalogue-item-overview .content-body .content-body-inner { flex-direction: row; text-align: left; } } /* Catalogue Item Overview Description & Title */ @media (min-width: 768px) { .catalogue-item-overview .catalogue-overview-content { flex: 1 0 50%; margin-right: 40px; } } /* Heading */ .catalogue-item-overview .title-ct{ display: flex; align-items: flex-start; margin-bottom: 1.5rem; } .catalogue-item-overview h1 { margin-bottom: 0px; } @media(min-width: 768px) { .catalogue-overview-content h1 { font-size: 1.7rem; } } /* Contextual Search */ .catalogue-item-overview .title-ct .search-filter-ct { margin-left: 1.5rem; } /* Add to Favourites */ .catalogue-item-overview .add-to-favourites { margin: 0px; } /* Catalogue Item Overview Image */ .catalogue-item-overview .show-gallery { cursor: pointer; } .catalogue-item-overview .catalogue-item-images { position: relative; flex: 0 1 47%; } .catalogue-category .catalogue-item-overview .catalogue-item-images { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #E0E0E0; } @media(min-width: 768px) { .catalogue-category .catalogue-item-overview .catalogue-item-images { margin-bottom: 0px; padding-bottom: 0px; border-bottom: none; } } .catalogue-item-primary-image { position: relative; display: flex; align-items: flex-start; justify-content: center; } /* Catalogue Item Overiew Additional Images */ .catalogue-item-additional-images { margin: 20px auto 0; max-width: 220px; } .catalogue-item-additional-images ul { padding: 0; margin: 0px; } @media(max-width: 767.98px) { .catalogue-item-additional-images ul .slick-list { height: auto !important; max-height: 226px; } } .catalogue-item-additional-images li { cursor: pointer; padding: 0px; } @media(min-width: 768px) { .catalogue-item-additional-images li { padding: 0 5px; } } .catalogue-item-additional-images .catalogue-item-thumb { border: solid 1px #E0E0E0; padding: 2px; margin: 0 auto; } .catalogue-item-additional-img-item { padding: 4px; border: solid 1px #E0E0E0; } .catalogue-item-additional-img-item div { padding-top: 100%; width: 100%; background-size: contain; background-repeat: no-repeat; background-position: center center; } @media (max-width: 767.98px) { .catalogue-item-additional-images { max-width: 60px; margin: 15px 0 15px 0; } .catalogue-item-overview .catalogue-item-primary-image { width: 100%; } .catalogue-item-overview .catalogue-item-primary-image img { max-height: 180px; } .catalogue-item-additional-images .slick-prev, .catalogue-item-additional-images .slick-next { left: 50%; transform: translateX(-50%) rotate(90deg); } .catalogue-item-additional-images .slick-prev { top: -25px; } .catalogue-item-additional-images .slick-next { top: auto; bottom: -25px; } } @media (min-width: 768px) { .catalogue-item-primary-image img { max-height: 600px; } .catalogue-item-images { margin-bottom: 0px; } .catalogue-item-images:not(.multiple-images) { align-self: center; } .catalogue-item-images:not(.multiple-images) .catalogue-item-images-inner .catalogue-item-primary-image img { max-height: 420px; } .catalogue-item-images.multiple-images .catalogue-item-primary-image { padding-top: 390px; } .catalogue-item-images.multiple-images .catalogue-item-primary-image img { -ms-flex: none; position: absolute; top: 50%; left: 50%; max-width: 100%; max-height: 100%; transform: translate(-50%, -50%); } .catalogue-item-additional-images { max-width: 240px; } } @media (min-width: 992px) { .catalogue-item-additional-images { max-width: 360px; } } @media (min-width: 1200px) { .catalogue-item-additional-images { max-width: 310px; } } @media (min-width: 1500px) { .catalogue-item-additional-images { max-width: 354px; } } .modal-body .catalogue-item-additional-images { max-width: 60px; } @media (min-width: 768px) { .modal-body .catalogue-item-additional-images { max-width: 240px; } } @media (min-width: 992px) { .modal-body .catalogue-item-additional-images { max-width: 360px; } } @media (min-width: 1200px) { .modal-body .catalogue-item-additional-images { max-width: 300px; } } @media (min-width: 1500px) { .modal-body .catalogue-item-additional-images { max-width: 354px; } } /* Catalogue Item Resources */ /*.catalogue-item-overview .catalogue-item-resources { display: flex; flex-wrap: wrap; justify-content: center; } .catalogue-item-overview .catalogue-item-resources a { font-weight: 500; font-size: 0.875rem; } .catalogue-item-overview .catalogue-item-resources .catalogue-item-document { margin-right: 0.5rem; margin-bottom: 15px; } @media (min-width: 359px) { .catalogue-item-overview .catalogue-item-resources .catalogue-item-document { margin-bottom: 0px; } } @media (min-width: 507px) { .catalogue-item-overview .catalogue-item-resources .cat-item-video { margin-right: 20px; } }*/ .catalogue-item-overview .catalogue-item-resources:not(:last-child) { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: solid 1px #E0E0E0; } @media (min-width: 768px) { .catalogue-item-overview .catalogue-item-resources { justify-content: start; } .catalogue-item-overview .catalogue-item-resources .btn { padding: 0.25rem 0.5rem; font-size: .875rem; line-height: 1.5; border-radius: 0.2rem; } } /* Collapsable Sections */ .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section { font-size: 0.85rem; line-height: 1.1rem; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section:not(:last-child) { margin-bottom: 4px; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls { background: #FFFFFF; padding: 1rem; display: flex; align-items: center; font-size: 0.9rem; font-weight: 600; color: #4C4C4C; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls i { margin-left: auto; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls:hover { cursor: pointer; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content { } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content .collapsable-section-content-inner { padding: 1rem; background: #FFFFFF; border-top: 1px solid rgba(0,0,0,0.25); } /* Catalogue Item Resources */ .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content .catalogue-item-resources { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px dotted rgba(0,0,0,0.25); } /* Collapsable Sections */ .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section { font-size: 0.85rem; line-height: 1.1rem; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section:not(:last-child) { margin-bottom: 4px; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls { background: #FFFFFF; padding: 1rem; display: flex; align-items: center; font-size: 0.9rem; font-weight: 600; color: #4C4C4C; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls i { margin-left: auto; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls:hover { cursor: pointer; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content { } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content .collapsable-section-content-inner { padding: 1rem; background: #FFFFFF; border-top: 1px solid rgba(0,0,0,0.25); } /* Catalogue Item Resources */ .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content .catalogue-item-resources { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px dotted rgba(0,0,0,0.25); } /* Catalogue Item Description */ .catalogue-item-overview .catalogue-item-description { line-height: 1.2rem; font-size: 0.85rem; } .catalogue-item-overview .catalogue-item-description ul.normal-list:not(:last-child) { margin-bottom: 1rem; } @media(min-width: 768px) { .catalogue-item-overview .catalogue-item-description { font-size: 1rem; } } /* Collapsable Sections */ .catalogue-item-overview-wrapper { margin-bottom: 1rem; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section { font-size: 0.85rem; line-height: 1.1rem; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section:not(:last-child) { margin-bottom: 4px; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls { background: #FFFFFF; padding: 1rem; display: flex; align-items: center; font-size: 0.9rem; font-weight: 600; color: #4C4C4C; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls i { margin-left: auto; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-controls:hover { cursor: pointer; } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content { } .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content .collapsable-section-content-inner { padding: 1rem; background: #FFFFFF; border-top: 1px solid rgba(0,0,0,0.25); } /* Catalogue Item Resources */ .catalogue-item-overview-wrapper .collapsable-sections .collapsable-section .collapsable-section-content .catalogue-item-resources { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px dotted rgba(0,0,0,0.25); } @media(min-width: 768px) { .catalogue-item-overview-wrapper .collapsable-sections { display: none; } } /* Zoom Link (Images) */ .catalogue-item-overview .zoom-link { display: none; } @media(min-width: 768px) { .catalogue-item-overview .zoom-link { display: block; } } .more-info-wrapper .add-to-favourites { font-size: 0.875rem; } /************************** CATEGORY PAGES **************************/ /* Title */ .catalogue-category .catalogue-overview-content h1 { display: none; } @media(min-width: 768px) { .catalogue-category .catalogue-overview-content h1 { display: block; } } /* Favourites */ .catalogue-category .catalogue-overview-content .add-to-favourites { display: none; } @media(min-width: 768px) { .catalogue-category .catalogue-overview-content .add-to-favourites { display: block; font-size: 0.75rem; } } @media(min-width: 992px) { .catalogue-category .catalogue-overview-content .add-to-favourites { display: block; font-size: 0.875rem; } } /* More Info Control */ .catalogue-category .more-info-wrapper { display: none; } /* More Info Content */ @media(min-width: 768px) { .catalogue-category #catalogueItemMoreInfoContent { display: block; } .catalogue-category[data-template='2'] #catalogueItemMoreInfoContent { display: none; } } /* Catalogue Item Resources */ .catalogue-item-resources { display: none; } .has-resources .catalogue-item-resources { display: block; } @media(min-width: 768px) { .catalogue-item-resources:not(.has-resources) { display: block; } } /* Nested Collapsable */ .catalogue-category #nestedMoreInfoCollapseContent { display: block; } /************************** PRODUCT PAGES **************************/ /* Images */ .catalogue-product .catalogue-item-images { margin-bottom: 1rem; } /* Title */ .catalogue-product .catalogue-overview-content h1 { text-align: center; } @media(min-width: 768px) { .catalogue-product .catalogue-overview-content h1 { text-align: left; } } /* Catalogue Item Resources */ .catalogue-product .catalogue-item-resources .add-to-favourites { display: none; } @media(min-width: 768px) { .catalogue-product .catalogue-item-resources .add-to-favourites { display: block; } } /* Negate Revealer */ @media(max-width: 767px) { .catalogue-item-overview.revealer { height: auto !important; } .catalogue-item-overview.revealer a.reveal { display: none; } } /* Collapsable Content Inner */ .catalogue-product #nestedMoreInfoCollapseContent .collapse-content-inner { margin-top: 1rem; padding-top: 1rem; border-top: 1px dotted rgba(0,0,0,0.25); } @media(min-width: 768px) { .catalogue-product #nestedMoreInfoCollapseContent .collapse-content-inner { margin-top: 0; padding-top: 0; border-top: none; } } /* Header */ .catalogue-item-overview-header { color: #FFFFFF; position: relative; overflow: hidden; display: flex; align-items: center; border-radius: 0.25rem; margin-bottom: 1rem; } .catalogue-item-overview-header .search-filter-ct form { flex-grow: 1; } /* Title */ .catalogue-item-overview-header .title-wrapper { padding: .75rem; width: 100%; } .catalogue-item-overview-header .title-wrapper h1 { margin-bottom: 0px; font-size: 14px; font-weight: 600; text-shadow: 1px 1px 1px rgba(0,0,0,0.25); } .catalogue-item-overview-header .title-wrapper #breadcrumbBack { color: #FFFFFF; } .department-page .catalogue-item-overview-header .title-wrapper h1 { display: none; } @media(min-width: 768px) { .department-page .catalogue-item-overview-header .title-wrapper h1 { display: block; } } /* More Information */ .catalogue-item-overview-header .more-info-control { font-size: 0.75rem; border: none; } /* Add to Favourites */ .catalogue-item-overview-header .add-to-favourites { margin: 0px; font-size: 0.85rem; } .catalogue-item-overview-header .add-to-favourites a { color: #FFFFFF; } .catalogue-item-overview-header .add-to-favourites i { color: #FFFFFF; } .catalogue-item-overview-header .add-to-favourites .off { opacity: 1; } /* Search Filter */ .search-filter-ct { width: 100%; flex-shrink: 0; } .search-filter { position: relative; border-radius: 4px; background: #FFFFFF; } .search-filter .search-icon, .search-filter .clear-search { position: absolute; top: 50%; right: 0.75rem; transform: translateY(-50%); } .search-filter .clear-search { background: none; padding: 0px; cursor: pointer; } .search-filter .clear-search .clear-icon { color: inherit !important; } .search-filter .search-filter-input { padding: 0.5rem 2.5rem 0.5rem 0.6rem; background: none; font-size: 0.85rem; } .search-filter .search-filter-input::placeholder { color: rgba(0,0,0,0.5); font-size: 0.85rem; } .search-filter.empty .search-icon { display: block; } .search-filter.empty .clear-search { display: none; } .search-filter:not(.empty) .search-icon { display: none; } .search-filter:not(.empty) .clear-search { display: block; } .catalogue-item-overview-header .search-filter { background: rgba(255,255,255,0.2); border: none; } .catalogue-item-overview-header .search-filter .search-icon { color: #FFFFFF; } .catalogue-item-overview-header .search-filter .clear-search .clear-icon { color: #FFFFFF !important; } .catalogue-item-overview-header .search-filter .search-filter-input { color: #FFFFFF; border: 2px solid rgba(255,255,255,0.5); } .catalogue-item-overview-header .search-filter .search-filter-input::placeholder { color: #FFFFFF; text-shadow: 1px 1px 1px rgba(0,0,0,0.1); } @media(min-width: 768px) { .search-filter-ct { width: 40%; } } @media(min-width: 992px) { .search-filter-ct { width: auto; min-width: 450px; } } /* Collapsable Sections */ .catalogue-item-overview-2 .collapsable-sections .collapsable-section { font-size: 0.85rem; line-height: 1.1rem; } .catalogue-item-overview-2 .collapsable-sections .collapsable-section:not(:last-child) { margin-bottom: 4px; } .catalogue-item-overview-2 .collapsable-sections .collapsable-section .collapsable-section-controls { background: #FFFFFF; padding: 1rem; display: flex; align-items: center; font-size: 0.9rem; font-weight: 600; color: #4C4C4C; } .catalogue-item-overview-2 .collapsable-sections .collapsable-section .collapsable-section-controls i { margin-left: auto; } .catalogue-item-overview-2 .collapsable-sections .collapsable-section .collapsable-section-controls:hover { cursor: pointer; } .catalogue-item-overview-2 .collapsable-sections .collapsable-section .collapsable-section-content { } .catalogue-item-overview-2 .collapsable-sections .collapsable-section .collapsable-section-content .collapsable-section-content-inner { padding: 1rem; background: #FFFFFF; border-top: 1px solid rgba(0,0,0,0.25); } /* Catalogue Item Resources */ .catalogue-item-overview-2 .collapsable-sections .collapsable-section .collapsable-section-content .catalogue-item-resources { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px dotted rgba(0,0,0,0.25); } /* Catalogue Item Description */ .catalogue-item-overview-2 .catalogue-item-description { line-height: 1.2rem; } .catalogue-item-overview-2 .catalogue-item-description ul.normal-list { margin-bottom: 0px; } @media(min-width: 768px) { .catalogue-item-overview-2 .catalogue-item-overview-header.has-background { min-height: 120px; } .catalogue-item-overview-2 .catalogue-item-overview-header .title-wrapper h1 { font-size: 1.7rem; text-shadow: 1px 1px 1px rgba(0,0,0,0.25); } .catalogue-item-overview-2 .add-to-favourites { top: 20px; right: 20px; } .catalogue-item-overview-2 .collapsable-sections .collapsable-section .collapsable-section-controls { font-size: 1rem; } .catalogue-item-overview-2 .collapsable-sections .collapsable-section { font-size: 1rem; } .catalogue-item-overview-2 .catalogue-item-description { line-height: 1.35rem; } } @media(min-width: 1200px) { .catalogue-item-overview-2 .catalogue-item-overview-header.has-background { min-height: 160px; } .catalogue-item-overview-2 .catalogue-item-overview-header .title-wrapper h1 { font-size: 1.7rem; } .catalogue-item-overview-2 .add-to-favourites { font-size: 1.2rem; } } .catalogue-category .catalogue-item-grid { margin-bottom: -0.5rem; } @media(min-width: 768px) { .catalogue-category .catalogue-item-grid { margin-bottom: -1.5rem; } } .catalogue-category .catalogue-item-overview-header + .catalogue-items { border-radius: 0.25rem; } /* 'No Search Results' message */ .no-search-results { font-size: 1rem; } .filter-items-container .no-search-results { padding: 2rem 0.75rem; } @media(min-width: 768px){ .no-search-results { min-height: 550px; } } .no-search-results h1 { font-weight: 600; } @media(min-width: 768px){ .no-search-results h1 { font-size: 1.5rem; } } .no-search-results ul { margin: 0 0 0 1.1rem; padding: 0px; } .no-search-results h4 { font-size: 1.2rem; } @media(min-width: 768px){ .no-search-results h4 { font-size: 1.25rem; } } .no-search-results a { font-weight: 600; text-decoration: underline; } /* Abstract Product Categories */ @media(min-width: 768px) and (max-width: 991px){ .catalogue-category[data-template='2'] .catalogue-item-overview-header { display: block !important; } } /* Catalogue Item Preview Card */ .catalogue-item-card-wrapper { display: flex; flex-direction: column; } .catalogue-item-card { padding: 0 !important; margin-bottom: 0px !important; flex-grow: 1; overflow: hidden; } .catalogue-item-card .delete-button { position: absolute; top: 10px; right: 10px; z-index: 2; font-size: 0.6rem; } .catalogue-item-card .delete-button i { color: #FFFFFF; } .catalogue-item-card > a { display: flex; flex-direction: column; height: 100%; } .catalogue-item-card .offer-flag { top: 5px; left: 5px; } .catalogue-item-card .prod-image { position: relative; margin: 10px 0px; overflow: hidden; padding: 0; padding-top: calc(2 / 3 * 100%) !important; } .catalogue-item-card .prod-image img { position: absolute; object-fit: contain; top: 0; background: #FFFFFF; left: 0; padding: 0.25rem; height: 100%; width: 100%; } @media(min-width: 992px) { .catalogue-item-card .prod-image img { padding: 0.5rem; } } .catalogue-item-card .catalogue-item-details { padding: .5rem; margin: 0px; display: flex; flex-direction: column; flex-grow: 1; border-top: 1px solid #E0E0E0; } .catalogue-item-card .catalogue-item-details .title-description:not(:last-child) { margin-bottom: 10px; } .catalogue-item-card .catalogue-item-details .title { margin: 0px; font-size: .75rem; } .catalogue-item-card .catalogue-item-details .description { color: #4C4C4C; margin-top: 20px; line-height: 1rem; display: none; } @media (min-width: 1200px) { .catalogue-item-card .catalogue-item-details .description { display: block; } } .catalogue-item-card.truncate .catalogue-item-details .title, .catalogue-item-card.truncate .catalogue-item-details .description { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; } .catalogue-item-card.truncate .catalogue-item-details .title { -webkit-line-clamp: 2; } .catalogue-item-card.truncate .catalogue-item-details .description { -webkit-line-clamp: 4; } .catalogue-item-card .catalogue-item-details .price { font-family: "Lato", sans-serif; margin-top: auto; } .catalogue-item-card .catalogue-item-details .price .price-prefix { font-weight: normal; font-size: 0.75rem; text-transform: uppercase; } .catalogue-item-card .catalogue-item-card-footer { background: rgba(0,0,0,0.1); font-family: "Lato", sans-serif; font-size: 0.65rem; font-weight: 600; padding: 10px; text-transform: uppercase; } @media(min-width: 768px) { .catalogue-item-card .catalogue-item-details { padding: .5rem; } } @media(min-width: 1200px) { .catalogue-item-card .catalogue-item-details { padding: 1.25rem; } .catalogue-item-card .catalogue-item-details .title { font-size: 1rem; } } /* Date Added */ .catalogue-item-card-wrapper .date-added { text-align: center; font-size: 0.75rem; margin-top: 10px; } /* Simple Link */ .catalogue-item-card .simple-link { display: flex; height: 100%; align-items: center; justify-content: center; padding: 10px; font-size: 0.6rem; position: relative; line-height: 1.3; } .catalogue-item-card .simple-link:before { content: ""; display: block; padding-top: 40%; } /* Force min-height to make square items */ .catalogue-item-card .simple-link span { font-family: "Lato", sans-serif; text-transform: uppercase; } .catalogue-item-card .simple-link span i { color: var(--clr-secondary); display: block; margin-top: 10px; display: none; } /* Simple Link Loader */ .catalogue-item-card .simple-link-loader { display: flex; background: rgba(255, 255, 255, 0.85); position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; align-items: center; justify-content: center; z-index: 2; } .catalogue-item-card .simple-link-loader i { font-size: 1.5rem; color: var(--clr-secondary); } @media(min-width: 425px) { .catalogue-item-card .simple-link:before { padding-top: 25%; } /* Force min-height to make square items */ } @media(min-width: 992px) { .catalogue-item-card .simple-link { font-size: 0.75rem; } } @media(min-width: 1200px) { .catalogue-item-card .simple-link { } } @media (min-width: 576px) { .filter-page { background-image: none !important; } } /* Catalogue Item */ .content-card.catalogue-item { padding: 8px; flex-direction: row; } @media(max-width: 767.98px) { .content-card.catalogue-item { align-items: center; min-height: 70px; max-height: 86px; border-color: #BBBBBB !important; } } @media(min-width: 768px) { .content-card.catalogue-item { padding: 0px; border-bottom: solid 3px; border-radius: .25rem .25rem 0 0; flex-direction: column; border-left-color: #BBBBBB !important; border-right-color: #BBBBBB !important; border-top-color: #BBBBBB !important; } } .catalogue-item { flex-grow: 1; position: relative; } /* Details */ .catalogue-item .content-body { padding: 0; display: flex; align-items: center; flex-grow: 1; } @media(min-width: 768px) { .catalogue-item .content-body { margin-top: .5rem; padding: 1rem; border-top: solid 1px #BBBBBB; } } /* Delete Item */ .catalogue-item .delete-item { position: absolute; top: 8px; right: 8px; z-index: 2; } /* Zoom Icon */ .catalogue-item .zoom-item { position: absolute; bottom: 15px; right: 15px; z-index: 2; color: #2A405E; width: 23px; height: 23px; align-items: center; justify-content: center; border-radius: 50%; border: 2px solid #2A405E; background: #FFFFFF; box-shadow: -1px -1px 3px rgba(0,0,0,0.05); font-size: 0.8rem; } /* Ensure hovered trigger element cannot be obscured */ .zoom-image:hover { z-index: 1061; } /* Zoom Image Popover */ .zoom-img-popover { max-width: none !important; border: 1px solid rgba(0,0,0,0.2) !important; background: #FFFFFF !important; border-radius: 0px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); } .zoom-img-popover .popover-body { padding: 10px; } .zoom-img-popover img { display: block; } /* Product Thumb Popover */ .product-thumb-popover img { max-height: 400px; width: auto; } /* Catalogue Item list */ .catalogue-item-list li a { padding: 0.5rem 1rem; position: relative; margin-bottom: 5px; display: block; font-weight: 600; color: inherit; } .catalogue-item-list a:before { font-family: "FontAwesome"; content: "\f0da"; padding-right: 10px; } @media (min-width:768px) { .catalogue-item-list { column-count: 2; column-gap: 30px; } } @media (min-width:1200px) { .catalogue-item-list { column-count: 3; column-gap: 30px; } } /* Subcategory List */ .catalogue-item-list li { page-break-inside: avoid; display: flex; } .catalogue-item-list li a { display: block; width: 100%; } .catalogue-item-details { display: flex; justify-content: space-between; flex-grow: 1; align-items: center; height: 100%; } /* Catalogue Details */ .catalogue-item .content { flex-grow: 1; display: flex; flex-direction: column; } @media (min-width:768px) { .catalogue-item .content { height: 100%; } } /* Catalogue Image */ .catalogue-item-img-ct { position: relative; } @media(max-width: 767.98px) { .catalogue-item-img-ct { width: 20%; display: flex; align-items: center; justify-content: center; margin-right: 15px; flex-shrink: 0; } } @media (min-width:768px) { .catalogue-item-img-ct { padding-top: calc(2 / 3 * 100%); overflow: hidden; } } @media (max-width:767.98px) { .catalogue-item-img-ct img { max-height: 70px; padding: 0 !important; max-width: 100%; height: auto; width: auto; } } @media (min-width:768px) { .catalogue-item-img-ct img { position: absolute; object-fit: contain; top: 0; background: #FFFFFF; transform: translateX(-50%); left: 50%; padding: 1.25rem; transition: ease-in-out .4s; } } .catalogue-item img { padding: 1rem; border-radius: .25em .25em 0 0; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .catalogue-item-img-ct { background: #FFFFFF; } } /* Catalogue Item Headings */ .catalogue-item h5 { margin: 0 0 1rem 0; font-weight: 700; color: #4C4C4C; } @media (max-width: 767.98px) { .catalogue-item h5 { font-size: 14px; margin-bottom: 5px; } } .catalogue-item h6 { font-weight: 700; flex-grow: 1; line-height: 1.2em; } @media (max-width:767.98px) { .catalogue-item h6 { font-size: 14px; margin-bottom: 0px; margin-top: 1px; } } @media(min-width: 576px) { .catalogue-item h6 { line-height: 1.3em; margin-top: 2px; } } @media(min-width: 768px) { .catalogue-item h6 { margin-bottom: 0.25rem; margin-top: 0px; line-height: 1.1em; } } /* Catalogue Price */ .catalogue-item-price .price-wrapper { display: inline-block; } @media(min-width: 768px){ .catalogue-item-price .price-wrapper { display: block; } } @media(min-width: 1200px){ .catalogue-item-price .price-wrapper { display: inline-block; } } .catalogue-item-price { font-size: 0.9rem; font-weight: 700; flex-grow: 1; margin-top: 5px; } .catalogue-item-price .from, .catalogue-item-price .to { font-weight: normal; } /* Catalogue View More */ .catalogue-item-view-more { margin: 0.5rem 0 0 0; text-decoration: underline; } /* Catalogue Item Footer */ .catalogue-item .cat-footer { display: flex; justify-content: space-between; align-items: center; padding: 0; flex-grow: 1; } @media (min-width:768px) { .catalogue-item .cat-footer { padding: 1rem; } .catalogue-item .cat-footer .content { margin-right: 1rem; } .catalogue-item .cat-footer .content h6 { margin-bottom: 0; } } /* Catalogue product spacing for admin users */ @media (min-width: 520px) { .admin-user .catalogue-category { padding-top: 1.5rem; } } .product-item-group:not(:last-child) { margin-bottom: 1.5rem; } /* Choose Payment Card */ .saved-cards .payment-card { position: relative; } .saved-cards .card-image { height: 40px; } @media (max-width: 768.98px) { .saved-cards .card-image { height: 25px; } } .saved-cards .remove-payment-card { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); } /* Close Icons */ .close { font-size: 2rem; color: #FFFFFF; text-shadow: none; } .close:focus, .close:hover { color: #FFFFFF; } .modal-header .close { color: inherit; } .modal-header .close:focus, .modal-header .close:hover { color: inherit; } /* CSS Variables */ :root { /* Body text / Background */ --bs-body-color: #4C4C4C; --clr-base: #4C4C4C; --clr-base-dk: #272F34; /* Primary brand color */ --clr-primary: #2A405E; --clr-primary-dk: #192C46; --clr-primary-lt: #55667E; --clr-primary-ltr: #8897AC; --clr-primary-ltn: #828A93; --clr-primary-lst: #E1E9F4; --clr-primary-lst-1: #EEF1F6; /* Secondary brand color */ --clr-secondary: #DB9F27; --clr-secondary-lt: #E6AC39; /* Tertiary brand color */ --clr-tertiary-rgb: 40,116,130; --clr-tertiary: #287482; --clr-tertiary-lt: #308494; --clr-tertiary-ltr: #3A999F; --clr-tertiary-lst: #D5E3E6; --clr-tertiary-faint: #F4F7F8; /* Neutral */ --clr-ntrl-min: #FFFFFF; --clr-ntrl-max: #000000; --clr-ntrl-tint-0: #818181; --clr-ntrl-tint-1: #F8F8F8; --clr-ntrl-tint-2: #F5F5F5; --clr-ntrl-tint-3: #F2F2F2; --clr-ntrl-tint-4: #DDDDDD; --clr-ntrl-tint-5: #A7A7A7; --clr-ntrl-tint-6: #8D8D8D; /* Utility Names */ --bs-danger-text-emphasis: #A01A21; --clr-warning: #A01A21; --clr-warning-lt: #AE262D; --clr-success: #287482; --clr-success-dk: #308494; /***** Department Colours *****/ /* Batteries Department - Orange */ --clr-dept-1: #FF800D; /* Jewellery, Findings, Chains & Solders - Purple */ --clr-dept-2: #754C78; /* Ear Piercing - Green */ --clr-dept-3: #6E9808; /* Watch Parts/ Watch Glasses - Brown */ --clr-dept-4: #704F26; /* Equipment - Teal */ --clr-dept-5: #287482; /* Equipment - Teal */ --clr-dept-6: #287482; /* Consumables - Pink */ --clr-dept-7: #CA176B; /* Clockparts - Beige */ --clr-dept-8: #C0A86C; /* Books and Catalogues Department - Grey */ --clr-dept-9: #6D6B76; /* Watch Straps, Bracelets & Fittings - Orange */ --clr-dept-10: #FE8415; /* Watch Movements - Light Brown */ --clr-dept-12: #7E6B4C; /* Clearance - Mint */ --clr-dept-14: #1EC988; } .three-columns { column-gap: 3rem; columns: 3; page-break-inside: auto; } @media(max-width: 991.98px) { .three-columns { columns: 2; } } @media(max-width: 767.98px) { .three-columns { columns: 1; } } /* Body Styling */ body { font-family: "Arial",Segoe UI,Helvetica Neue,Helvetica,Verdana,sans-serif; background: var(--clr-primary-lst-1); color: var(--bs-body-color); min-height: calc(100vh + 49px); display: flex; flex-direction: column; } /* Main Site Container */ .site-container { display: flex; flex-direction: column; flex-grow: 1; } .site-container.fixed-nav { margin-top: 57px; } .admin-user .site-container.fixed-nav { margin-top: 117px; } .logged-in.user-emulation .top-nav-wrapper.fixed-top { margin-top: 48px; } .logged-in.user-emulation .site-container.fixed-nav { margin-top: 105px; } @media(min-width: 768px) { .site-container.fixed-nav, .admin-user .site-container.fixed-nav { margin-top: 57px; } } @media(min-width: 992px) { .site-container.fixed-nav, .admin-user .site-container.fixed-nav { margin-top: 176px; } .logged-in.user-emulation .site-container.fixed-nav { margin-top: 198px; } } @media(min-width: 1200px) { .site-container.fixed-nav, .admin-user .site-container.fixed-nav { margin-top: 164px; } .logged-in.user-emulation .site-container.fixed-nav { margin-top: 204px; } } @media(min-width: 1365px) { .logged-in.user-emulation .site-container.fixed-nav { margin-top: 213px; } } @media(min-width: 1500px) { .site-container.fixed-nav, .admin-user .site-container.fixed-nav { margin-top: 182px; } .logged-in.user-emulation .site-container.fixed-nav { margin-top: 231px; } } /* Sections */ section { padding: 1rem 0; } @media(min-width: 992px) { section { padding: 2.5rem 0; } } /* Links */ a { text-decoration: none; color: #2A405E; } a:hover { color: inherit; text-decoration: none; } p a:not(.btn) { color: #22B154; text-decoration: underline; } p a:not(.btn):hover { color: #4EC176; } /* Paragraphs */ p:last-child { margin-bottom: 0; } /* Back To Top Button */ a.backtotop-floater { position: fixed; right: 10px; bottom: 10px; z-index: 3; text-decoration: none; color: var(--clr-secondary); } a.backtotop-floater:before { padding: 0px; } /* Overlay */ .site-overlay { background: rgba(0,0,0,0.75); position: fixed; display: none; top: 0; left: 0; right: 0; height: 100%; z-index: 10 } /* Site Logo */ .site-logo img { width: 220px; } /* Page Descriptions */ .page-description { margin-bottom: 1.5rem; } /* Go Back button */ .go-back { display: block; margin-bottom: 10px; } /*HR */ hr { border-color: #E0E0E0; } /* Line Break */ .line-break { line-height: 0.3rem; } /* Remove Blue Outline in Browsers */ a:focus, button:focus, input:focus, textarea:focus, li:focus { box-shadow: none !important; border-color: #E0E0E0 !important; outline: none; } /* Margin between columns (to cater for stacked columns) */ .row:not(.bs-row) { margin-top: -30px; } .row:not(.bs-row) > [class*="col"], .row:not(.bs-row) > .slick-list { padding-top: 30px; } .row.row-sm:not(.bs-row) { margin-top: -16px; } .row.row-sm:not(.bs-row) > [class*="col"], .row.row-sm:not(.bs-row) > .slick-list { padding-top: 16px; } .row.row-xs:not(.bs-row) { margin-top: -8px; } .row.row-xs:not(.bs-row) > [class*="col"], .row.row-xs:not(.bs-row) > .slick-list { padding-top: 8px; } .content-card:not(:last-child) { margin-bottom: 30px; } [class*="col"] > .content-card:only-child { margin-bottom: 0px; } /* Website Tutorial Links */ .web-tutorial p { font-size: 0.75rem; font-weight: normal !important; } .web-tutorial a { font-weight: bold; } /* Anchor */ .anchor-link { position: absolute; margin-top: -80px; } @media(min-width: 992px) { .anchor-link { margin-top: -160px; } } /* Bootstrap Gutters */ .xs-gutters { margin-right: -4px; margin-left: -4px; } .xs-gutters .col, .xs-gutters [class*="col-"] { padding-right: 4px; padding-left: 4px; } .sm-gutters { margin-right: -8px; margin-left: -8px; } .sm-gutters .col, .sm-gutters [class*="col-"] { padding-right: 8px; padding-left: 8px; } /* Fifty Year Logo */ .fifty-years-logo { height: 72px; } .fifty-years .main-title { font-family: "Lato", sans-serif; font-size: 1rem; color: #2A405E; text-transform: uppercase; font-weight: 900; display: block; } .fifty-years .sub-title { font-family: "Lato", sans-serif; font-size: 0.8rem; color: #B4B4B4; font-weight: 700; display: block; } @media(min-width: 768px) { .fifty-years .main-title { font-size: 1.5rem; } .fifty-years .sub-title { font-size: 1rem; line-height: 0.8rem; } } .service-block { text-align: center; color: #2A405E; flex-grow: 1; } .service-title { display: block; margin-top: 20px; font-weight: 600; line-height: 1.3; } /* Contact Page */ .contact h1 { font-size: 1.7rem; } @media(min-width: 768px) { .contact h1 { font-size: 2.5rem; } } /* Contact Options */ .contact-option h4 { font-weight: 600; color: var(--clr-secondary); } .contact .contact-option { display: flex; flex-direction: column; height: 100%; } .contact .contact-option .cta { margin-top: auto; } /* Contact Modal */ @media(min-width: 992px){ .support-answer .contact-option{ display: flex; flex-direction: row; align-items: center; } .support-answer .contact-option > div:first-child { margin-right: 3rem; } .support-answer .contact-option .cta { margin-left: auto; } .support-answer .contact-option .cta .btn { width: 230px; } } .support-answer .contact-option h4 { font-size: 1.2rem; margin-bottom: 0.5rem; } .support-answer .contact-option:not(:last-child) { margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px dotted rgba(0,0,0,0.25); } /* Technical Advice */ .contact .technical-advice { border-top: 1px dotted rgba(0,0,0,0.25); border-bottom: 1px dotted rgba(0,0,0,0.25); } .contact .management-team .member { text-align: center; } .contact .management-team .member:not(:last-child) { margin-right: 1.25rem; } @media(min-width: 576px){ .contact .management-team .member:not(:last-child) { margin-right: 1.5rem; } } @media(min-width: 1200px){ .contact .management-team .member:not(:last-child) { margin-right: 2.5rem; } } .contact .management-team .member .image-ct { width: 70px; height: 70px; border: solid 3px #EBEBEB; border-radius: 50%; background-color: #FFFFFF; position: relative; overflow: hidden; margin-bottom: 5px; margin: 0 auto; } @media(min-width: 992px) { .contact .management-team .member .image-ct { width: 90px; height: 90px; } } @media(min-width: 1200px) { .contact .management-team .member .image-ct { width: 110px; height: 110px; } } .contact .management-team .member .image-ct img { margin-top: 8px; } .contact .management-team .member .name { font-size: 0.7rem; font-weight: 400; } @media(min-width: 992px){ .contact .management-team .member .name { font-size: 1rem; font-weight: 600; } } .content-card { position: relative; background: #FFFFFF; border: solid 1px #E0E0E0; border-radius: .25em; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; width: 100%; } .content-card-grey { background-color: #F2F2F2; } [class*="col"] .content-card:only-child { height: 100%; } .content-img { height: 100%; width: 100%; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .content-img { height: auto; max-height: 100%; width: auto; max-width: 100%; } } .content-body { flex: 1 1 auto; padding: 1.25rem; } .content-header { padding: .75rem 1.25rem; background-color: #2A405E; color: #FFFFFF; font-weight: 700; } .content-footer { padding: 1.25rem 1rem; border-radius: 0 0 .25em .25em; } @media( min-width: 1500px) { .content-footer { padding: 1.25rem; } } /* Card Margin */ .card-margin { margin-bottom: 30px; } .cookie-notice { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,0.2); text-align: center; } @media(min-width: 992px){ .cookie-notice { text-align: left; } } @media(min-width: 992px){ .cookie-notice { padding-bottom: 60px; } } @media(min-width: 1301px){ .cookie-notice { padding-bottom: 0; } } @media(min-width: 1366px){ .cookie-notice { padding-bottom: 60px; } } @media(min-width: 1467px){ .cookie-notice { padding-bottom: 0; } } @media(min-width: 1500px){ .cookie-notice { padding-bottom: 60px; } } @media(min-width: 1601px){ .cookie-notice { padding-bottom: 0; } } .cookie-notice h3 { font-size: 1rem; color: var(--clr-secondary); font-weight: 600; margin: 0px; } .cookie-notice p { font-size: 0.85rem; } /*********************************** Custom Scrollbar ***********************************/ .custom-scroll { position: relative; } .custom-scroll.initialised { display: block; } .custom-scroll .scroller-arrows { display: none; position: absolute; right: 0px; top: -53px; padding-bottom: 10px; z-index: 11; pointer-events: none; } .custom-scroll .scroller-arrows .scroll-arrow { cursor: pointer; font-size: 1rem; pointer-events: auto; display: flex; justify-content: center; align-items: center; } .custom-scroll .scroller-arrows .scroll-arrow i { opacity: 0.5; } .custom-scroll .scroller-arrows .scroll-arrow:hover i { opacity: 1; } .custom-scroll .scroller-arrows .scroll-arrow-left { margin-right: 10px; } .custom-scroll .scroller-arrows .scroll-arrow-right { margin-left: auto; } @media (min-width: 992px) { .custom-scroll .scroller-arrows { display: flex; } } @media (min-width: 1700px) { .custom-scroll .scroller-arrows { left: -60px; right: -60px; top: 50%; transform: translateY(-50%); padding-bottom: 0px; } .custom-scroll .scroller-arrows .scroll-arrow { font-size: 2rem; } } .custom-scroll .scrollable { position: relative; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; scrollbar-width: none; z-index: 2; } .custom-scroll .scrollable-items { display: flex; flex-wrap: nowrap; position: relative; } .custom-scroll .scrollable::-webkit-scrollbar { display: none; } .custom-scroll .scrollable.scrollbar { scrollbar-color: var(--clr-secondary) #E0E0E0; scrollbar-width: thin; padding-bottom: 15px; -ms-overflow-style: auto; } .custom-scroll .scrollable.scrollbar::-webkit-scrollbar { display: unset; } @media (min-width: 768px) { .custom-scroll .scrollable { -webkit-overflow-scrolling: unset; } .custom-scroll .scrollable.scrollbar { padding-bottom: 30px; } } /* Let's get this party started */ .custom-scroll .scrollable.scrollbar::-webkit-scrollbar { height: 6px; } /* Track */ .custom-scroll .scrollable.scrollbar::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); -webkit-border-radius: 4px; border-radius: 4px; } /* Handle */ .custom-scroll .scrollable.scrollbar::-webkit-scrollbar-thumb { -webkit-border-radius: 4px; border-radius: 4px; background: var(--clr-secondary); } .custom-scroll .scrollable.scrollbar::-webkit-scrollbar-thumb:window-inactive { background: rgba(183,150,73,0.4); } .custom-scroll .scrollable.scrollbar::-webkit-scrollbar-track-piece { background: #E0E0E0; } /* Adjust width of scrollable items responsively */ .custom-scroll .scrollable-item { width: calc((100% - 24px)/2.5); flex-shrink: 0; } .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } @media (min-width: 576px) { .custom-scroll .scrollable-item { width: calc((100% - 48px)/4.5); } .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } } @media (min-width: 768px) { .custom-scroll .scrollable-item { width: calc((100% - 72px)/6.5); } .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } } @media (min-width: 1500px) { .custom-scroll .scrollable-item { width: calc((100% - 140px)/7.5); } .custom-scroll .scrollable-item:not(:last-child) { margin-right: 20px; } } /* Department Menu */ @media (max-width: 1699px) { .custom-scroll .scroller-arrows .scroll-arrow i { color: var(--clr-ntrl-min); } #departmentHotlinks .custom-scroll .scroller-arrows { left: -20px !important; right: -20px !important; top: 50%; transform: translateY(-50%); padding-bottom: 0px; } #departmentHotlinks .custom-scroll .scroller-arrows .scroll-arrow { background: var(--clr-secondary); color: #FFFFFF; width: 40px; height: 40px; border: 2px solid #FFFFFF; box-shadow: 2px 2px 2px rgba(0,0,0,0.3); border-radius: 50%; } #departmentHotlinks .custom-scroll .scroller-arrows .scroll-arrow i { opacity: 1; } #departmentHotlinks .custom-scroll .scroller-arrows .scroll-arrow:hover { background: var(--clr-secondary-lt); } } #departmentHotlinks .custom-scroll .scrollable-item { width: calc((100% - 45px)/3.5); } #departmentHotlinks .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } @media (min-width: 576px) { #departmentHotlinks .custom-scroll .scrollable-item { width: calc((100% - 60px)/4.5); } #departmentHotlinks .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } } @media (min-width: 768px) { #departmentHotlinks .custom-scroll .scrollable-item { width: calc((100% - 48px)/5.5); } #departmentHotlinks .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } } @media (min-width: 1200px) { #departmentHotlinks .custom-scroll .scrollable-item { width: calc((100% - 120px)/7.5); } #departmentHotlinks .custom-scroll .scrollable-item:not(:last-child) { margin-right: 20px; } } @media (min-width: 1500px) { #departmentHotlinks .custom-scroll .scrollable-item { width: calc((100% - 160px)/8.5); } #departmentHotlinks .custom-scroll .scrollable-item:not(:last-child) { margin-right: 20px; } } /* Offers Promotions & New Items */ @media (min-width: 768px) { #offersPromotionsNewItems .custom-scroll .scrollable-item { width: calc((100% - 48px)/4.5); } #offersPromotionsNewItems .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } } @media (min-width: 1200px) { #offersPromotionsNewItems .custom-scroll .scrollable-item { width: calc((100% - 100px)/5.5) !important; } #offersPromotionsNewItems .custom-scroll .scrollable-item:not(:last-child) { margin-right: 20px; } } @media (min-width: 1500px) { #offersPromotionsNewItems .custom-scroll .scrollable-item { width: calc((100% - 120px)/6.5) !important; } #offersPromotionsNewItems .custom-scroll .scrollable-item:not(:last-child) { margin-right: 20px; } } /* Simple Links */ .simple-links .custom-scroll .scrollable-item { width: calc((100% - 48px)/3.5) !important; } .simple-links .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } @media (min-width: 576px) { .simple-links .custom-scroll .scrollable-item { width: calc((100% - 48px)/4.5) !important; } .simple-links .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } } @media (min-width: 768px) { .simple-links .custom-scroll .scrollable-item { width: calc((100% - 72px)/6.5) !important; } .simple-links .custom-scroll .scrollable-item:not(:last-child) { margin-right: 12px; } } @media (min-width: 1200px) { .simple-links .custom-scroll .scrollable-item { width: calc((100% - 140px)/7.5) !important; } .simple-links .custom-scroll .scrollable-item:not(:last-child) { margin-right: 20px; } } .delivery-address { flex-grow: 1; border: solid 1px #E0E0E0; } .delivery-address:hover { cursor: pointer; } /* Delivery Address Body */ .delivery-address .content-body { padding: 1rem; } /* Delivery Detail Groups */ .delivery-address .detail-group { margin-bottom: 20px; } /* Delivery Spans */ .delivery-address .detail-group span { display: block; } /* Font Awesome Icons for Contact Details */ .delivery-address .contact-details i { color: #22b154; } /* Address Telephone Number */ .delivery-address .address-telephone { margin-bottom: 5px; } /* Delivery Methods */ .delivery-choice-content .form-check { margin-bottom: 2rem; } .delivery-choice-content .form-check label { flex-direction: column; } @media(min-width: 400px) { .delivery-choice-content .form-check { margin-bottom: 1.5rem; } .delivery-choice-content .form-check label { flex-direction: row; } .delivery-choice-content .carrier-logo { margin: 0px 15px; } } .delivery-choice-content .form-check .form-check-input:hover, .delivery-choice-content .form-check label:hover { cursor: pointer; } .delivery-choice-content .carrier-logo { width: 65px; align-self: flex-start; flex-shrink: 0; text-align: center; margin-bottom: 10px; } .delivery-choice-content .carrier-logo img { max-width: 65px; } .delivery-choice-content .carrier-description { line-height: 1.3rem; display: block; } /* Delivery Address Name */ .delivery-address .name .address-name { font-weight: 600; } /* Delivery Address Marker */ .delivery-address .marker { display: none !important; } /* Default Delivery Address */ .selected-address { border: solid 1px #22B154; background-color: #E1ECD7 } .selected-address .marker { display: block !important; color: #FFFFFF; position: absolute; width: 0; height: 0; border-style: solid; border-width: 0 30px 30px 0; border-color: transparent #22B154 transparent transparent; right: 0; } .selected-address .marker .fa-check { color: #FFFFFF; position: absolute; left: 14px; top: 1px; font-size: 0.8rem; } /* Delivery Address Block */ .delivery-address-modal .delivery-address { margin-bottom: 30px !important; } /* Delivery Address Footer */ .address-footer { width: 100%; margin: 0px !important; } .address-footer .btn { padding: 0.375rem 1rem !important; } .address-footer .btn.cancel-button { padding: 0.375rem 0 !important; } .address-footer .btn.back-button { padding: 0.375rem 0 !important; } .address-footer .use-cancel-ct { display: flex; justify-content: space-between; flex-grow: 1; margin-left: auto; } /* Delivery Address Radio Buttons */ .delivery-address .checkmark-ct { position: relative; width: 18px; margin-top: 3px; } .delivery-address .checkmark { position: absolute; top: 0; left: 0; height: 18px; width: 18px; background-color: #EEEEEE; border-radius: 50%; } /* On mouse-over, add a grey background color */ .delivery-address .checkmark { background-color: #CCCCCC; } /* When the radio button is checked, add a blue background */ .delivery-address.selected-address .checkmark.checked { background-color: #22B154; } /* Create the indicator (the dot/circle - hidden when not checked) */ .delivery-address .checkmark:after { content: ""; position: absolute; display: none; } /* Show the indicator (dot/circle) when checked */ .delivery-address .checkmark:after { display: block; } /* Style the indicator (dot/circle) */ .delivery-address.selected-address .checkmark.checked:after { top: 50%; left: 50%; transform: translate(-50%, -50%); width: 7px; height: 7px; border-radius: 50%; background: #FFFFFF; } /* Add New Delivery Address */ .add-address-ct .default-address-options { text-align: center; max-width: 70%; margin: 0 auto; } .add-address-ct .default-address-options .buttons-ct { position: relative; } .add-address-ct .default-address-options .saving-message { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); white-space: nowrap; } .add-address-ct .default-address-options .saving-message .loading-icon { margin-right: 0.5rem; } /* Mobile Department Navigation */ #mobileNav { background: #FFFFFF; } #mobileNav .department-ct { width: 100%; overflow: auto; border-bottom: solid 1px #E0E0E0; -ms-overflow-style: none; scrollbar-width: none; } #mobileNav .department-ct::-webkit-scrollbar { display: none; } #mobileNav .department-ct ul { white-space: nowrap; margin: 0px; padding: 0px; display: flex; } #mobileNav .department-ct ul li { text-transform: uppercase; font-weight: 900; font-size: 0.85rem; font-family: "Lato", sans-serif; margin: 0px; padding: 0px; } #mobileNav .department-ct ul li a { display: block; padding: 15px; } #mobileNav .department-ct ul li a:hover { color: var(--clr-secondary); } /* Department Block */ .department-block { position: relative; display: flex; flex-direction: column; line-height: 1.3; font-family: "Lato", sans-serif; } /* Department Content Block */ .department-block .content { display: flex; flex-grow: 1; justify-content: space-between; font-weight: bold; align-items: center; padding: 0.5rem .8rem; min-height: 42px; border-radius: 0 0 .25rem .25rem; } /* Department Block Icon */ .ad-cyo .department-block i { display: block; color: #FFFFFF; margin-left: 7px; } /* All Department Blocks */ .ad-cyo .department-block { font-size: 0.7rem; } @media(max-width: 991.98px) { .ad-cyo .department-block { font-size: 0.563rem; } .ad-cyo .department-block .content { padding: 0.5rem; } .ad-cyo .department-block i { display: none; } } /* Department Image Zoom */ .department-block img { height: auto; transition: ease-in-out .4s; } /* Department Image Container */ .department-img-ct { overflow: hidden; border-radius: .25rem .25rem 0 0; max-height: 75px; } /* AZ Index Item */ .department-block.az-index { color: #FFFFFF; background: #2a405e; display: block; border: none; border-radius: 0px; min-height: 52px; } .department-block.az-index:hover { background: #2a405e; } .department-block.az-index:hover .az-ct { background: rgba(255,255,255,0.2); } .department-block.az-index .az-content { width: 100%; flex-direction: column; } .department-block.az-index span { margin: 0px; } .department-block.az-index .az-ct { padding: 5px 20px; } .department-block.az-index .letter { font-size: 2.5rem; font-weight: bold; color: var(--clr-secondary); line-height: 1.8rem; } .department-block.az-index .to { margin: 0px 2px; font-size: 1.3rem; } .department-block.az-index .index { font-size: 1.5rem; text-transform: uppercase; font-weight: bold; } /* Department Colours */ .dept-background:not(.tint) { color: #FFFFFF; } /* Batteries Department - Red */ .dept-1.dept-background, .dept-1 .dept-background { background-color: #E53123; } .dept-1.dept-background.tint, .dept-1 .dept-background .tint { background-color: #F7C1BD; } .dept-1.dept-text, .dept-1 .dept-text { color: #E53123; } .dept-1.dept-bar:before { border-color: #E53123; } .dept-1.tint.dept-bar:before { border-color: #F7C1BD; } .dept-1.dept-border, .dept-1 .dept-border { border-color: #E53123; } .dept-1.tint.dept-border { border-color: #F7C1BD; } .dept-1.tint-dept-border-btm::after { border-bottom-color: #F7C1BD; } .dept-1.dept-text-bf:before { color: #E53123; } /* Books and Catalogues Department - Grey */ .dept-9.dept-background, .dept-9 .dept-background { background-color: #6D6B76; } .dept-9.dept-background.tint, .dept-9 .dept-background .tint { background-color: #D3D2D6; } .dept-9.dept-text, .dept-9 .dept-text { color: #6D6B76; } .dept-9.dept-bar:before { border-color: #6D6B76; } .dept-9.tint.dept-bar:before { border-color: #D3D2D6; } .dept-9.dept-border, .dept-9 .dept-border { border-color: #6D6B76; } .dept-9.tint.dept-border { border-color: #D3D2D6; } .dept-9.tint-dept-border-btm::after { border-bottom-color: #D3D2D6; } .dept-9.dept-text-bf:before { color: #6D6B76; } /* Clockparts - Beige */ .dept-8.dept-background, .dept-8 .dept-background { background-color: #C0A86C; } .dept-8.dept-background.tint, .dept-8 .dept-background .tint { background-color: #ECE5D3; } .dept-8.dept-text, .dept-8 .dept-text { color: #C0A86C; } .dept-8.dept-bar:before { border-color: #C0A86C; } .dept-8.tint.dept-bar:before { border-color: #ECE5D3; } .dept-8.dept-border, .dept-8 .dept-border { border-color: #C0A86C; } .dept-8.tint.dept-border { border-color: #ECE5D3; } .dept-8.tint-dept-border-btm::after { border-bottom-color: #ECE5D3; } .dept-8.dept-text-bf:before { color: #C0A86C; } /* Consumables - Pink */ .dept-7.dept-background, .dept-7 .dept-background { background-color: #CA176B; } .dept-7.dept-background.tint, .dept-7 .dept-background .tint { background-color: #EFB9D2; } .dept-7.dept-text, .dept-7 .dept-text { color: #CA176B; } .dept-7.dept-bar:before { border-color: #CA176B; } .dept-7.tint.dept-bar:before { border-color: #EFB9D2; } .dept-7.dept-border, .dept-7 .dept-border { border-color: #CA176B; } .dept-7.tint.dept-border { border-color: #EFB9D2; } .dept-7.tint-dept-border-btm::after { border-bottom-color: #EFB9D2; } .dept-7.dept-text-bf:before { color: #CA176B; } /* Ear Piercing - Green */ .dept-3.dept-background, .dept-3 .dept-background { background-color: #6E9808; } .dept-3.dept-background.tint, .dept-3 .dept-background .tint { background-color: #D3E0B4; } .dept-3.dept-text, .dept-3 .dept-text { color: #6E9808; } .dept-3.dept-bar:before { border-color: #6E9808; } .dept-3.tint.dept-bar:before { border-color: #D3E0B4; } .dept-3.dept-border, .dept-3 .dept-border { border-color: #6E9808; } .dept-3.tint.dept-border { border-color: #D3E0B4; } .dept-3.tint-dept-border-btm::after { border-bottom-color: #D3E0B4; } .dept-3.dept-text-bf:before { color: #6E9808; } /* Equipment - Teal */ .dept-5.dept-background, .dept-5 .dept-background { background-color: #287482; } .dept-5.dept-background.tint, .dept-5 .dept-background .tint { background-color: #BED5D9; } .dept-5.dept-text, .dept-5 .dept-text { color: #287482; } .dept-5.dept-bar:before { border-color: #287482; } .dept-5.tint.dept-bar:before { border-color: #BED5D9; } .dept-5.dept-border, .dept-5 .dept-border { border-color: #287482; } .dept-5.tint.dept-border { border-color: #BED5D9; } .dept-5.tint-dept-border-btm::after { border-bottom-color: #BED5D9; } .dept-5.dept-text-bf:before { color: #287482; } /* Jewellery, Findings, Chains & Solders - Purple */ .dept-2.dept-background, .dept-2 .dept-background { background-color: #754C78; } .dept-2.dept-background.tint, .dept-2 .dept-background .tint { background-color: #D5C9D6; } .dept-2.dept-text, .dept-2 .dept-text { color: #754C78; } .dept-2.dept-bar:before { border-color: #754C78; } .dept-2.tint.dept-bar:before { border-color: #D5C9D6; } .dept-2.dept-border, .dept-2 .dept-border { border-color: #754C78; } .dept-2.tint.dept-border { border-color: #D5C9D6; } .dept-2.tint-dept-border-btm::after { border-bottom-color: #D5C9D6; } .dept-2.dept-text-bf:before { color: #754C78; } /* Tools - Green */ .dept-6.dept-background, .dept-6 .dept-background { background-color: #287482; } .dept-6.dept-background.tint, .dept-6 .dept-background .tint { background-color: #BED5D9; } .dept-6.dept-text, .dept-6 .dept-text { color: #287482; } .dept-6.dept-bar:before { border-color: #287482; } .dept-6.tint.dept-bar:before { border-color: #BED5D9; } .dept-6.dept-border, .dept-6 .dept-border { border-color: #287482; } .dept-6.tint.dept-border { border-color: #BED5D9; } .dept-6.tint-dept-border-btm::after { border-bottom-color: #BED5D9; } .dept-6.dept-text-bf:before { color: #287482; } /* Watch Movements - Light Brown */ .dept-12.dept-background, .dept-12 .dept-background { background-color: #7E6B4C; } .dept-12.dept-background.tint, .dept-12 .dept-background .tint { background-color: #D8D2C9; } .dept-12.dept-text, .dept-12 .dept-text { color: #7E6B4C; } .dept-12.dept-bar:before { border-color: #7E6B4C; } .dept-12.tint.dept-bar:before { border-color: #D8D2C9; } .dept-12.dept-border, .dept-12 .dept-border { border-color: #7E6B4C; } .dept-12.tint.dept-border { border-color: #D8D2C9; } .dept-12.tint-dept-border-btm::after { border-bottom-color: #D8D2C9; } .dept-12.dept-text-bf:before { color: #7E6B4C; } /* Watch Parts & Watch Glasses - Brown */ .dept-4.dept-background, .dept-4 .dept-background { background-color: #704F26; } .dept-4.dept-background.tint, .dept-4 .dept-background .tint { background-color: #D4CABD; } .dept-4.dept-text, .dept-4 .dept-text { color: #704F26; } .dept-4.dept-bar:before { border-color: #704F26; } .dept-4.tint.dept-bar:before { border-color: #D4CABD; } .dept-4.dept-border, .dept-4 .dept-border { border-color: #704F26; } .dept-4.tint.dept-border { border-color: #D4CABD; } .dept-4.tint-dept-border-btm::after { border-bottom-color: #D4CABD; } .dept-4.dept-text-bf:before { color: #704F26; } /* Watch Straps, Bracelets & Fittings - Orange */ .dept-10.dept-background, .dept-10 .dept-background { background-color: #FE8415; } .dept-10.dept-background.tint, .dept-10 .dept-background .tint { background-color: #FFDAB8; } .dept-10.dept-text, .dept-10 .dept-text { color: #FE8415; } .dept-10.dept-bar:before { border-color: #FE8415; } .dept-10.tint.dept-bar:before { border-color: #FFDAB8; } .dept-10.dept-border, .dept-10 .dept-border { border-color: #FE8415; } .dept-10.tint.dept-border { border-color: #FFDAB8; } .dept-10.tint-dept-border-btm::after { border-bottom-color: #FFDAB8; } .dept-10.dept-text-bf:before { color: #FE8415; } /* Clearance - Mint */ .dept-14.dept-background, .dept-14 .dept-background { background-color: #1EC988; } .dept-14.dept-background.tint, .dept-14 .dept-background .tint { background-color: #A5E9CF; } .dept-14.dept-text, .dept-14 .dept-text { color: #1EC988; } .dept-14.dept-bar:before { border-color: #1EC988; } .dept-14.tint.dept-bar:before { border-color: #A5E9CF; } .dept-14.dept-border, .dept-14 .dept-border { border-color: #1EC988; } .dept-14.tint.dept-border { border-color: #A5E9CF; } .dept-14.tint-dept-border-btm::after { border-bottom-color: #A5E9CF; } .dept-14.dept-text-bf:before { color: #1EC988; } .mainindex.dept-background, .mainindex .dept-background { background-color: #192C46; } .mainindex.dept-border { border-color: #192C46; } .mainindex.dept-background.tint, .mainindex .dept-background .tint { background-color: #BABFC7; } /* Document Downloads - Blue */ .documentdownloads.dept-background, .documentdownloads .dept-background { background-color: #39308D; } .documentdownloads.dept-background.tint, .documentdownloads .dept-background .tint { background-color: #C3C0DD; } .documentdownloads.dept-text, .documentdownloads .dept-text { color: #39308D; } .documentdownloads.dept-border, .documentdownloads .dept-border { border-color: #39308D; } .documentdownloads.tint.dept-border:before { border-color: #C3C0DD; } .documentdownloads.dept-text-bf:before { color: #39308D; } /* Generic */ .generic.dept-background, .generic .dept-background { background-color: #192C46; } .generic.dept-background.tint, .generic .dept-background .tint { background-color: #BABFC7; } /* Tint Hover States */ a.dept-background.tint { position: relative; } a.dept-background.tint:not(.catalogue-item):hover:after { content: ''; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background-color: rgba(0,0,0,0.05); } /* Cousins Gold */ .cg .dept-text { color: var(--clr-secondary) } /* Document Downloads Wrapper */ @media(max-width: 767.98px) { .document-downloads-wrapper { border-top: solid 1px #E0E0E0; padding-top: 20px; margin-top: 20px; } } /* Select Category Blocks */ .document-download-departments .catalogue-nav-link a { display: flex; align-items: center; justify-content: center; text-align: center; height: 125px; padding: 1.25rem; transition: all 1.2s ease; color: #FFFFFF; font-weight: 600; } .document-download-departments .catalogue-nav-link:hover a { background: rgba(0,0,0,.5); } .document-download-departments .catalogue-nav-link:hover span { display: none; } .document-download-departments .catalogue-nav-link i { display: none; font-size: 1.7rem; } .document-download-departments .catalogue-nav-link:hover i { display: block; } /* Document Download Item list */ .downloads-item-list li a { padding: 0.5rem 1rem; position: relative; margin-bottom: 5px; display: block; font-weight: 600; color: inherit; } .downloads-item-list a:before { font-family: "FontAwesome"; content: "\f0da"; padding-right: 10px; } .downloads-item-list .selected:hover:before { color: #FFFFFF; } /* Icon Change for Departments */ .document-browse-departments .downloads-item-list:not(.more-downloads) a:before { content: "\f0c8"; } /* Document Available in Category */ .document-list li { display: block; align-items: center; margin: 5px 0; border: solid 1px #E0E0E0; padding: 0.75rem; font-weight: 600; } .document-list li .pdf:before { font-family: "FontAwesome"; content: "\f1c1"; padding-right: 10px; color: #A01A21; font-weight: 500; } .document-list li span { padding-right: 10px; display: block; margin-bottom: 10px; } @media (min-width: 576px) and (max-width: 767.98px) { .document-list li { display: flex; justify-content: space-between; } .document-list li span { margin-bottom: 0; } } @media (min-width: 992px) { .document-list li { display: flex; justify-content: space-between; } .document-list li span { margin-bottom: 0; } } /* Document Downloads Breadcrumb */ .document-downloads-container .breadcrumb .breadcrumb-item { display: block; } /* Document Downloads Categories */ @media (min-width:768px) { .downloads-items { column-count: 2; column-gap: 30px; } } @media (min-width:1200px) { .downloads-items { column-count: 3; column-gap: 30px; } } /* Subcategory List */ .downloads-items li { page-break-inside: avoid; -ms-overflow-x: hidden; } /* Documents Modal */ .sku-documents-wrapper .sku-documents { } .sku-documents-wrapper p { display: none; } .sku-documents-wrapper .sku-documents ul { margin: 0px; padding: 0px; list-style-type: none; } .sku-documents-wrapper .sku-documents ul li { margin: 0 0 0.5rem 0; padding: 0px; } .sku-documents-wrapper .sku-documents .sku-document { border: 1px solid #E0E0E0; padding: 1rem; align-items: center; } .sku-documents-wrapper .sku-documents .sku-document i { margin-right: 0.5rem; } .sku-documents-wrapper .sku-documents .sku-document .document-title { font-weight: 600; font-size: 0.8rem; margin-right: 1rem; } .sku-documents-wrapper .sku-documents .sku-document:not(:last-child) { margin-bottom: 5px; } @media(min-width: 768px){ .sku-documents-wrapper .sku-documents .sku-document i { display: block; } } @media(min-width: 992px){ .sku-documents-wrapper .sku-documents .sku-document .document-title { font-size: 1rem; } } .sku-documents-wrapper .document-downloads-link { text-align: center; margin: 30px 0px; } .sku-documents-wrapper .document-downloads-link a { font-weight: 600; text-decoration: underline; } .sku-details .sku-documents-wrapper { margin: 1.5rem 0 0 0; padding: 1.5rem 0; border-top: 1px solid #E0E0E0; border-bottom: 1px solid #E0E0E0; } .sku-details .sku-documents-wrapper p { display: block; } .sku-details .sku-documents-wrapper .sku-documents ul li { margin-bottom: 0.5rem; } .sku-details .sku-documents-wrapper .sku-documents .sku-document { border: none; padding: 0px; text-decoration: underline; } .sku-details .sku-documents-wrapper .sku-documents .sku-document:hover { text-decoration: none; } .sku-details .sku-documents-wrapper .sku-documents .sku-document:not(:last-child) { margin-bottom: 0.5rem; } .sku-details .sku-documents-wrapper .sku-documents .sku-document i { display: block; } .sku-details .sku-documents-wrapper .sku-documents .sku-document .document-title { font-size: 0.8rem; margin-right: 0px; } .sku-details .sku-documents-wrapper .sku-documents .sku-document .btn { display: none; } .sku-details .sku-documents-wrapper .document-downloads-link { text-align: left; } @media(min-width: 768px){ .sku-details .sku-documents-wrapper { padding-bottom: 0; border-bottom: none; } } .dropdown-item, .dropdown-item { color: var(--bs-body-color); } .dropdown-item:focus, .dropdown-item:hover { color: var(--clr-secondary); background-color: transparent; } /* Image Uploader */ .edrive-uploader .loading-spinner { vertical-align: middle; margin-right: 10px; } .edrive-uploader .message { vertical-align: middle; display: block; font-size: 0.9em; } .edrive-uploader .message.upload-error { color: #A01A21; font-weight: 600; margin-bottom: 0.75rem; } .edrive-uploader.pre-upload .loading-spinner { display: none; } .edrive-uploader.uploading .loading-spinner { display: inline-block; } .edrive-uploader.uploading .message { display: inline-block; } .edrive-uploader.uploading .image-upload { display: none; } .edrive-uploader.uploaded .loading-spinner { display: none; } .edrive-uploader.uploaded .message { display: block; } .edrive-uploader.uploaded .message:before { content: "\f00c"; font-family: "FontAwesome"; margin-right: 0.25rem; color: #22B154; } .edrive-uploader.uploaded .image-upload { display: none; } .edrive-uploader-form { display: none; } /* edrive uploader sequences */ .uploader-sequence:not(:last-child) .uploaded { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted #C0C0C0; } @media (min-width: 992px) and (max-width: 1699px) { #myFavourites #dropdownFavouritesLink { margin-right: 50px; } } /* History of Cousins Banner */ .feature-messages-ct .slick-slide .feature-message.image-only { min-height: unset; } .feature-messages-ct .slick-slide .feature-message.image-only img { max-width: 100%; height: auto; } /*@media(max-width: 1559.98px) { .feature-messages-ct { margin: 0 35px 30px 35px; } }*/ .feature-message { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: space-between; text-align: center; border-radius: 8px; border: solid 1px #E0E0E0; overflow: hidden; } .feature-message.solid { background: #FFFFFF; padding: 0.75rem; } @media(min-width: 992px) { .feature-message.solid { padding: 1rem;} } @media(min-width: 1200px) { .feature-message.solid { flex-direction: row; text-align: left; } } .feature-message:hover { text-decoration: none; } /* Feature Message Info */ .feature-message-info { order: 1 } .feature-message .title { font-size: 1rem; font-weight: 700; margin-bottom: 5px; } .feature-message .description { font-size: 0.75rem; margin: 0; } .feature-message.image-only { position: relative; background-repeat: no-repeat; background-position: center center; } .feature-message.anniversary { background-image: url('https://www.cousinsuk.com/content/common/images/layout/50-years-bg.jpg'); } .feature-message.anniversary img { max-height: 120px; position: absolute; top: -10px; } @media(min-width: 992px) { .feature-message-info { margin-top: 0; width: 100%; } .feature-message .title { font-size: 1.25rem; } } @media(min-width: 1200px) { .feature-message-info { order: 0; margin-right: 10px; } } @media(min-width: 1200px) and (max-width: 1499.98px) { .feature-message .title { font-size: 1rem; } } @media(min-width: 1500px) { .feature-message .title { margin-bottom: 15px; } } /* Feature Message Icon Container */ .feature-message .feature-icon { margin-bottom: 5px; } @media(min-width: 992px) { .feature-message .feature-icon { margin-bottom: 15px; } } @media(min-width: 1200px) { .feature-message .feature-icon { margin-bottom: 0; } } /* Feature Message Icon */ .feature-message i { color: #8D8D8D; } @media(max-width: 991.98px) { .feature-message i { font-size: 2em; } } @media(min-width: 1200px) and (max-width: 1499.98px) { .feature-message i { font-size: 2em; } } #featureMessagesCarousel .slick-list { margin: 0px -7px; } #featureMessagesCarousel .slick-track .slick-slide { margin: 0px 7px; } #featureMessagesCarousel .slick-track .slick-slide > div { display: flex; } #featureMessagesCarousel .slick-track .slick-slide > div:not(:last-child) { margin-bottom: 1rem; } #featureMessagesCarousel .slick-track .slick-slide img { width: 100%; } /* Scroll Arrows */ #featureMessagesCarousel .scroll-arrow { position: absolute; display: flex; justify-content: center; align-items: center; z-index: 3; top: 50%; transform: translateY(-50%); } @media (max-width: 1699px) { #featureMessagesCarousel .scroll-arrow.scroll-arrow-left { left: -20px; } #featureMessagesCarousel .scroll-arrow.scroll-arrow-right { right: -20px; } #featureMessagesCarousel .scroll-arrow { background: var(--clr-secondary); color: #FFFFFF; width: 40px; height: 40px; border: 2px solid #FFFFFF; box-shadow: 2px 2px 2px rgba(0,0,0,0.3); border-radius: 50%; } #featureMessagesCarousel .scroll-arrow i { opacity: 1; } #featureMessagesCarousel .scroll-arrow:hover { background: var(--clr-secondary-lt); } } @media (min-width: 1699px) { #featureMessagesCarousel .scroll-arrow.scroll-arrow-left { left: -50px; } #featureMessagesCarousel .scroll-arrow.scroll-arrow-right { right: -50px; } #featureMessagesCarousel .scroll-arrow { font-size: 2rem; } #featureMessagesCarousel .scroll-arrow i { opacity: 0.5; } #featureMessagesCarousel .scroll-arrow:hover i { opacity: 1; } } .filter-sections-ct { overflow-y: auto; background: #FFFFFF; } @media(min-width: 992px) { .filter-sections-ct { overflow-y: unset; } } #filterPanel .offcanvas-header { position: sticky; top: 0; z-index: 1; } #filterPanel .offcanvas-footer { position: sticky; bottom: 0; z-index: 1; } /* Swipe in filter panel */ .filter-swipe-in { background: #FFFFFF; position: fixed; top: 0px; transform: translateX(-100%); width: 100%; height: 100%; z-index: 9999; transition: all 0.3s ease-in-out; } .filter-swipe-in.in { transform: translateX(0); } .filter-swipe-in .filter-wrapper { overflow: hidden; } .filter-swipe-in .filter-ct .filter-header { background: #2A405E; color: #FFF; border-bottom: none; margin: 0; padding: 15px; position: relative; z-index: 2; } .filter-swipe-in .filter-ct .filter-header .fa-times { color: #FFFFFF; } .filter-swipe-in .filter-items { display: block; position: absolute; z-index: 1; top: 81px; right: 0; bottom: 0; left: 0; margin: 0 auto; height: auto; overflow-y: auto; padding-bottom: 300px; } .filter-swipe-in .filter-ct .title-ct { padding: 20px 15px; } .filter-swipe-in .filter-options { padding: 20px; } /* Filter Footer */ .filter-swipe-in .filter-ct .filter-footer { background: #FFFFFF; position: absolute; bottom: 0; left: 0px; right: 0px; z-index: 99; padding: 20px; border-top: 1px solid #E0E0E0; } .filter-swipe-in .filter-toggle { position: absolute; right: 15px; font-size: 1.25rem; top: 15px; margin: 0; } .filter-swipe-in .filter-toggle i { color: #FFFFFF; } .filter-swipe-in .button-ct { padding: 20px 15px; } .filter-swipe-in .filter-ct .filter-header .title { font-weight: 600; color: #FFFFFF; } /* Filter Container */ @media(min-width: 992px) { .filter-ct { padding: 1.5rem; border: solid 1px #E0E0E0; } } /* Filter Header */ .filter-ct .filter-header { border-bottom: solid 1px #E0E0E0; margin-bottom: 10px; padding-bottom: 10px; } .filter-ct .filter-header .title { font-weight: 600; } /* Reset Filters */ .filter-ct .filter-header .close-filters, .filter-ct .filter-header .reset-filters { color: inherit; } /* Checkboxes */ .filter .custom-checkbox { margin-bottom: 12px; } .filter .custom-control-label { font-weight: normal; } .filter .custom-checkbox:last-child { margin-bottom: 15px; } /* Filter Section Headers */ .filter-section .filter-header { position: relative; } /* Checkboxes */ .filter-section .custom-checkbox { margin-bottom: 0px; min-height: unset !important; } .filter-section .custom-control-label { font-weight: normal; } /* Mobile */ @media(max-width: 991.98px) { /* Mobile Filters Open */ body.filters-open { overflow: hidden; } body.filters-open .filter-swipe-in { height: 100%; } } #filterPanel { border: none; } @media(min-width: 992px) { #filterPanel { position: sticky; max-height: calc(100vh - 315px); overflow-y: scroll; top: 195px; z-index: 11; scrollbar-width: thin; scrollbar-color: rgba(0,0,0,0.25); scrollbar-track-color: rgba(0,0,0,0.1); } #filterPanel::-webkit-scrollbar { width: 4px; } #filterPanel::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,0.25); } #filterPanel::-webkit-scrollbar-track { background-color: rgba(0,0,0,0.1); } } @media(min-width: 1093px) { #filterPanel { max-height: calc(100vh - 270px); } } @media(min-width: 1200px) { #filterPanel { max-height: calc(100vh - 300px); top: 183px; } } @media(min-width: 1301px) { #filterPanel { max-height: calc(100vh - 265px); } } @media(min-width: 1366px) { #filterPanel { max-height: calc(100vh - 300px); } } @media(min-width: 1467px) { #filterPanel { max-height: calc(100vh - 260px); } } @media(min-width: 1500px) { #filterPanel { top: 202px; max-height: calc(100vh - 320px); } } @media(min-width: 1601px) { #filterPanel { max-height: calc(100vh - 280px); } } #filterPanel .offcanvas-body { height: calc(100% - 77px); padding: 0px; } /* Filter Search */ .filter-sections-ct .filter-search { padding: 1rem; } .filter-sections-ct .filter-search .search-header { border: solid 1px #E0E0E0; border-radius: .25rem; } .filter-sections-ct .filter-search .search-header input { border: none; } /* Filter Header */ .filter-sections-ct .filter-header { display: block; } .filter-sections-ct .filter-header .filter-title { font-family: "Lato", sans-serif; letter-spacing: 0.25px; display: block; line-height: 1.3rem; padding-right: 1.5rem; } .filter-sections-ct .filter-header .selected-filter-count-ct { font-size: 0.7rem; color: var(--clr-secondary); font-weight: 600; border: 2px solid var(--clr-secondary); display: flex; width: 22px; height: 22px; border-radius: 50%; align-items: center; justify-content: center; margin-left: 0.5rem; } #filterPanel .filter-sections-ct .filter-header .selected-filter-count-ct { display: none !important; } .filter-sections-ct .filter-header .clear-filters { flex-shrink: 0; margin-left: 5px; } /* Filter Section */ .filter-sections-ct .filter-context { margin: 1rem; padding: 1rem; background: var(--clr-primary-lst-1); font-size: 0.85rem; text-align: center; } .filter-sections-ct .filter-context .context-title { font-weight: bold; font-size: 1rem; letter-spacing: -0.25px; color: #2A405E; margin-bottom: 0.25rem; } .filter-sections-ct .filter-context p { margin: 0px; } .filter-sections-ct .filter-context a { margin: 0px; } .filter-sections-ct .filter-section { position: relative; } .filter-context + .filter-section { border-top: solid 1px #E0E0E0; } .filter-sections-ct .filter-section:not(:last-child) { border-bottom: solid 1px #E0E0E0; } /* Filter Section Header */ .filter-sections-ct .filter-section .filter-header { padding: 1rem; } /* Filter Options */ .filter-sections-ct .filter-options { padding: 0 1rem 1rem 1rem; } .filter-sections-ct .filter-options .custom-checkbox { font-size: 0.85rem; } /* Collapse Filters */ .filter-sections-ct .filter-header .collapse-icon { display: flex; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); padding: 5px; transition: 0.3s ease-in-out; font-size: 10px; } .filter-sections-ct .filter-section.closed .collapse-icon { transform: rotate(180deg) translateY(50%); } /* Filter Results Button */ .filter-results-btn-ct { z-index: 4; position: relative; margin-bottom: 15px; } .filter-results-btn-ct .btn { justify-content: center; } .filter-options .custom-control-input:checked + .custom-control-label { font-weight: bold; } .filter-form { flex-grow: 1; overflow-y: auto; } #results { position: relative; } .catalogue-items.filterable #results { min-height: 500px; } #results.loading::before { content: ""; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background: #E1E9F4; opacity: 0.9; z-index: 3; } /* Alphabet Box */ .filter-sections-ct .alphabet-box, .filter-sections-ct .alphabet-box:focus { background-color: #F5F5F5; border-radius: .25em; border: 1px solid #E0E0E0; padding: 4px; display: block; width: 100%; text-align: center; } .filter-sections-ct .alphabet-box.active { background-color: #E1E9F4; border-color: #2B405F; } .filter-sections-ct .alphabet-box[disabled] { opacity: 0.5; } .filter-sections-ct .alphabet-box:not([disabled]):hover { border: 1px solid #2A405E; cursor: pointer; } .selected-filters { white-space: nowrap; flex-wrap: wrap; padding: 1rem; background: #FFFFFF; } .selected-filters:not(:last-child) { margin-bottom: 15px; } .selected-filters .selected-filters-content { position: relative; } @media(min-width: 992px) { .selected-filters .selected-filters-content { justify-content: flex-end; padding: 0px; } } .selected-filters .filter-item-count-ct { font-size: 0.85rem; font-weight: 600; color: var(--clr-secondary); } .selected-filters .selected-filters-title { display: block; font-weight: 600; font-size: 0.85rem; color: #2A405E; } .selected-filters .selected-filters-ct { display: flex; flex-wrap: wrap; margin-bottom: -0.25rem; } .selected-filters .selected-filter { font-size: 0.75rem; background: #2A405E; color: #FFFFFF; border-radius: 0.25rem; padding: 3px 7px; margin-bottom: 0.25rem; cursor: pointer; } .selected-filters .selected-filter.clear-all { background: #FFFFFF; border: 2px solid #2A405E; color: #2A405E; } .selected-filters .filter-action { background: none; padding: 0px; font-size: 0.8rem; font-weight: 600; color: #2A405E; border-bottom: 1px solid #2A405E; } #filterPanel .refine { display: none; } .selected-filters .selected-filter:not(:last-child) { margin-right: 0.25rem; } .selected-filters .selected-filter i { margin: 0 0 0 0.25rem; color: inherit; } .selected-filters.loading .selected-filters-content::before { content: ""; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background: #FFFFFF; opacity: 0.9; z-index: 3; } .sticky-sub-nav .selected-filters { border-top: 1px solid #2A405E; border-bottom: 1px solid #2A405E; padding-top: 10px; padding-bottom: 10px; background: none; } .sticky-sub-nav .selected-filter { border: 2px solid #FFFFFF; background: #2A405E; } .sticky-sub-nav .selected-filter.clear-all.clear-all { border: 2px solid var(--clr-secondary); background: #2A405E; color: var(--clr-secondary); } .sticky-sub-nav .selected-filters .refine { color: #FFFFFF; } .sticky-sub-nav .selected-filters.loading .selected-filters-content::before { background: rgba(42,64,94,0.95); } /* Checkboxes */ .filter-sections-ct .custom-control.custom-checkbox { padding-left: 1.5rem; line-height: initial; } .filter-sections-ct .custom-checkbox .custom-control-label::before, .filter-sections-ct .custom-checkbox .custom-control-label::after { width: 15px; height: 15px; left: -1.3rem; } /* Mobile Filter Sections */ #mobileFilterSections { margin-bottom: 20px; } #mobileFilterSections .filter-sections-ct .filter-section .filter-header { padding: 0.75rem; } #mobileFilterSections .filter-sections-ct .filter-header .filter-title { font-size: 0.9rem; } /* Sticky Sub Nav */ .sticky-sub-nav .clear-all-filters { text-decoration: underline; font-size: 0.8rem; } /* Footer Links */ footer a { color: #FFFFFF; } footer li a:hover { text-decoration: underline; } /* Footer Container */ .footer-menu { background: #2A405E; color: #FFFFFF; padding: 0.5rem 0 1rem 0; } @media(min-width: 992px) { .footer-menu { padding: 1rem 0; } } /* Footer Menu Items */ .footer-menu-item ul li { margin: 5px 0; } .footer-menu-item i.fa { display: none; color: #FFFFFF; } .footer-menu-item.focus .title h5 { text-transform: uppercase; } .footer-menu-item .title { text-transform: uppercase; font-weight: 900; font-family: "Lato", sans-serif; letter-spacing: 0.25px; color: var(--clr-secondary); } @media(max-width: 575.98px) { .footer-menu-item .title { font-size: 0.8rem; } .footer-menu-item ul li { font-size: 0.8rem; } } @media (max-width: 991px) { .footer-menu-item ul { display: none; } .footer-menu-item .title { padding-top: 0.75rem; } .footer-menu-item .title:not(:last-of-type) { padding-bottom: 0.75rem; border-bottom: solid 1px rgba(255,255,255,0.1); display: flex; justify-content: space-between; cursor: pointer; align-items: center; } .footer-menu-item .title:last-of-type { border-bottom: none; } .footer-menu-item.focus .title { border-bottom: none; } .footer-menu-item.focus .footer-menu-wrapper > ul { display: block; border-bottom: solid 1px rgba(255,255,255,0.1); margin-bottom: 0; padding-bottom: 1rem; } } @media (min-width: 992px) { .footer-menu-item:not(:last-child) .footer-menu-wrapper { margin-right: 25px; } } @media (min-width: 1366px) { .footer-menu-item:not(:last-child) .footer-menu-wrapper { margin-right: 50px; } } /* Sub Footer */ .sub-footer { text-transform: uppercase; font-family: "Lato", sans-serif; } .sub-footer ul { display: flex; flex-wrap: wrap; margin-bottom: 0; font-size: 0.8rem; } .sub-footer li a { font-weight: 900; } @media (max-width: 991.98px) { .sub-footer { text-align: center; } .sub-footer ul { justify-content: center; } } .sub-footer li { border-right: solid 1px var(--clr-secondary); padding-right: 0.875rem; margin-right: 0.875rem; } .sub-footer li:last-of-type { border-right: none; margin-right: 0; padding-right: 0; } .sub-footer .small-link { font-size: 0.7rem; } @media (min-width: 992px) { .sub-footer .small-links { display: flex; align-items: center; } .sub-footer .small-links br { display: none; } .sub-footer .small-link { display: flex; align-items: center; } .sub-footer .small-link:not(:last-child)::after { content: ""; font-family: FontAwesome; content: ''; font-weight: normal; font-style: normal; font-size: 0.25rem; margin: 0px 10px; } } /* Company Messages */ .company-messages .company-message { display: flex; align-items: center; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.025); padding: 15px; font-size: 0.8rem; } .company-messages .company-message:not(:last-child) { margin-bottom: 10px; } .company-messages i { color: var(--clr-secondary); } .company-messages .title { font-family: "Lato", sans-serif; color: var(--clr-secondary); text-transform: uppercase; font-weight: 900; display: block; } .company-messages img { margin-top: 5px; } .company-messages p { line-height: 0.9rem; } @media(min-width: 576px) { .company-messages .title { font-size: 1rem; line-height: 1.4rem; } } /* Host Information */ .host-info { font-size: 0.8rem; } .host-info .host-ip { display: none; } html:not(.admin-user) .host-info { display: none; } @media (min-width: 992px) and (max-width: 1199px) { .footer-menu-item:not(:last-child) .footer-menu-wrapper { margin-right: 0px; } .footer-menu-item ul li { font-size: 0.8rem; } } #availabilityChecker .trading-approved, footer .trading-approved { height: 55px; } /* Form Containers - Used On Registration */ .form-ct { background: #F2F2F2; padding: 1.25rem; margin-bottom: 30px; } .form-ct h2 { margin-bottom: 20px; } /* Form Groups */ .form-group { margin-bottom: 1rem; } /* Input Groups */ .input-group-text { background: #FFFFFF; border-color: #CACACA; } /* Checkbox containers */ .form-check { margin-bottom: 8px; } /* Form Control */ .form-control { border-color: #CACACA; color: #4C4C4C; } .form-control:focus { color: #4C4C4C; } /* Form Labels */ form label { font-weight: 600; margin-bottom: .25rem; } /* Radio Buttons */ .custom-radio { margin-bottom: 5px; } .custom-radio .custom-control-input:checked ~ .custom-control-label:before { background-color: #2A405E; } /* Checkboxes */ .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before { background-color: #2A405E; } .custom-checkbox .custom-control-label::before, .custom-checkbox .custom-control-label::after { width: 22px; height: 22px; left: -1.85rem; top: 0; } .custom-control.custom-checkbox { min-height: 1.85rem; padding-left: 1.85rem; } .grid-view-switcher { display: flex; justify-content: space-between; align-items: center; } .grid-view-switcher:not(:last-child) { margin: 0 0 1rem 0; } .grid-view-switcher .switcher-status { font-weight: 700; margin-right: 10px; } .grid-view-switcher h3 { margin-right: 1rem; } .grid-view-switcher .total-items { width: 100%; } @media(min-width: 1200px) { .grid-view-switcher .total-items { width: auto; } } @media(max-width: 1199.98px) { .grid-view-switcher .switcher-icons { display: none; } } /* Header Section */ header { margin-bottom: 25px; } header h1 { margin-bottom: 0; } header .page-description { margin-top: 0.75rem; margin-bottom: 0; } /* Generic styling for all headers */ h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: "Lato", sans-serif; letter-spacing: -0.25px; } /* Colour Amends for headings */ h2, .h2, h3, .h3, h4, .h4 { color: #192C46; } /* H1 Headings */ h1, .h1 { font-weight: 700; margin-bottom: 1rem; font-size: 1.7rem; } .h1 { font-size: 2rem; } @media (max-width: 767.98px) { h1, .h1 { font-size: 1.7rem; } } @media (max-width: 575.98px) { h1, .h1 { font-size: 1.35rem; } } /* H2 Headings */ .h2, h2 { margin-bottom: 1em; font-size: 1.4rem; } @media (max-width: 767.98px) { h2, .h2 { font-size: 1.3rem; } } @media (max-width: 575.98px) { h2, .h2 { font-size: 1.15rem; } } /* H3 Headings */ .h3, h3 { margin-bottom: 0.75rem; } /* H4 Headings */ h4, .h4 { margin-bottom: 1rem; } /* Master Heading - To Make other heading tags looks like an H1 tag */ .mtr-head { font-weight: 700; color: #4C4C4C; font-size: 2rem; } @media (max-width: 767.98px) { .mtr-head { font-size: 1.45rem; } } @media (max-width: 575.98px) { .mtr-head { font-size: 1.25rem; } } /* Feature Heading */ .feature-header { border-bottom: solid 2px #E0E0E0; padding-bottom: 0.5rem; margin-bottom: 2rem; } /* Feature Title */ .feature-title { position: relative; margin-bottom: 1rem; border-bottom: solid 2px rgba(0,0,0,0.1); display: flex; } .feature-title h2, .feature-title .title { display: inline-flex; align-items: center; background: #F2F2F2; color: #4C4C4C; padding: 0.7rem 1.75rem; position: relative; font-weight: 700; margin-bottom: 0; } .feature-title .title { font-size: 1rem; display: inline-block; } .feature-title:before { z-index: 2; content: ""; border-left-style: solid; border-left-width: 8px; position: absolute; left: 0; bottom: -2px; height: 51px; border-color: #2A405E; border-radius: 0.25rem 0 0 0.25rem; } .feature-title:after { position: relative; display: inline-block; top: 0px; right: 0px; content: ''; border-left: 0px solid transparent; border-right: 50px solid transparent; border-bottom: 50px solid #F2F2F2; } /* Feature Title SM */ .feature-title.sm { margin-bottom: .5rem; } .feature-title.sm .title { padding: 0.25rem 1.5rem; } .feature-title.sm:before { height: 37px; } .feature-title.sm:after { border-right-width: 35px; border-bottom-width: 35px; } /* Grey Title */ .grey-title { color: #4C4C4C; } /* Here To Help */ #supportContainer { position: relative; } #supportContainer .card { background-color: var(--clr-tertiary-ltr); /* For browsers that do not support gradients */ background-image: linear-gradient(to right, var(--clr-primary), var(--clr-tertiary-ltr)); padding-bottom: 100px; } #supportContainer .img-position { margin: 0 -20px -20px 20px; margin-left: auto !important; } #supportContainer .support-img-ct { position: absolute; bottom: 0px; right: 0px; border-bottom-right-radius: 0.25rem; overflow: hidden; } #supportContainer .support-img-ct { width: 100%; } #supportContainer .support-img-ct img { position: relative; } @media(min-width: 400px) { #supportContainer .card { padding-bottom: 125px; } } @media(min-width: 576px) { #supportContainer .card { padding-bottom: 150px; } #supportContainer .support-img-ct { width: 576px; max-width: 100%; } } @media(min-width: 768px){ #supportContainer .card { padding-bottom: 200px; } #supportContainer .support-img-ct { width: 100%; max-width: 800px; } } @media(min-width: 992px){ #supportContainer .card { padding-bottom: 0; } #supportContainer .support-img-ct { width: 100%; max-width: 950px; } #supportContainer .support-img-ct img { right: -550px; } } @media(min-width: 1200px){ #supportContainer .support-img-ct img { right: -374px; } } @media(min-width: 1400px) { #supportContainer .support-img-ct { max-width: 910px; } #supportContainer .support-img-ct img { right: -180px; } } @media(min-width: 1500px) { #supportContainer .support-img-ct img { right: 0; } } @media(max-width: 991.98px) { #supportContainer .support-img-ct { transform: translateX(-50%); left: 50%; } } #supportContainer .content-ct { color: var(--clr-ntrl-min); } #supportContainer .here-to-help-intro { text-align: center; font-size: 0.85rem; } @media(min-width: 768px){ #supportContainer .here-to-help-intro { font-size: 1rem; } } @media(min-width: 992px){ #supportContainer .here-to-help-intro { text-align: left; } } #supportContainer .here-to-help-intro .intro-text { font-weight: 600; font-size: 1.1rem; line-height: 1.2; } @media(min-width: 992px) { #supportContainer .here-to-help-intro .intro-text { font-size: 1.2rem; } } #supportContainer .content-ct h3 { color: var(--clr-ntrl-min); font-weight: 900; text-transform: uppercase; font-size: 1.75rem; color: var(--clr-secondary); } @media(min-width: 768px){ #supportContainer .content-ct h3 { font-size: 2.5rem; } } #supportContainer .support-key .icon { color: var(--clr-secondary); } /* Search Input */ #supportContainer .support-search { position: relative; margin-left: -10px; margin-right: -10px; } #supportContainer .support-search input { border: none; padding: .5rem 0; font-size: 1rem; } @media(min-width: 1200px) { #supportContainer .support-search { width: 95%; } } @media(min-width: 1500px) { #supportContainer .support-search { width: 90%; } } #supportContainer .support-search input::placeholder { font-size: .65rem; } @media(min-width: 450px) { #supportContainer .support-search input::placeholder { font-size: .85rem; } } #supportContainer .support-search .input-group-text .icon { font-size: 1.25rem; } #supportContainer .support-search .input-group-text { border: none; padding: .75rem; } #supportContainer .support-search .input-group .clear-search { color: var(--clr-tertiary); line-height: 1em; } #supportContainer .support-search .input-group .clear-search:hover .text { text-decoration: underline; } /* Search Results */ #supportContainer .search-results { position: absolute; background-color: var(--clr-ntrl-min); padding: .5rem; color: var(--bs-body-color); font-size: 0.875rem; z-index: 3; width: 100% !important; left: 0 !important; border-radius: .25rem; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; display: flex; } #supportContainer .search-results .result-items { overflow-y: scroll; -ms-overflow-style: none; /* IE and Edge */ width: 100%; padding-right: 0.5rem; /* Firefox */ scrollbar-color: var(--clr-tertiary) #F1F1F1; } #supportContainer .search-results .result-items::-webkit-scrollbar-track { background: #F1F1F1; } #supportContainer .search-results .result-items::-webkit-scrollbar-thumb { background: var(--clr-tertiary); } #supportContainer .search-results .result-items.searching { opacity: 0.25; } #supportContainer .search-results .result-items .no-search-results { min-height: unset; display: none; } #supportContainer .search-results .result-items .no-search-results h1 { font-size: 1rem; text-transform: none; } #supportContainer .search-results .result-items .no-search-results h4 { display: none; } #supportContainer .search-results .result-items .no-search-results ul { font-size: 0.8rem; } #supportContainer .support-search.drop-up .search-results { padding-bottom: 100px; bottom: 0; } #supportContainer .support-search.drop-down .search-results { padding-top: 100px; top: 0; } #supportContainer .support-search .input-group { z-index: 4; width: auto !important; border: solid 2px transparent; background-color: var(--clr-ntrl-min); border-radius: .25rem; } #supportContainer .support-search .support-search-header { padding: 10px; } #supportContainer .support-search .support-search-header .input-validation-error { background: none !important; } #supportContainer .support-search.open .support-search-header .input-group, #supportContainer .support-search.open.support-search-header .input-group { border: solid 2px var(--clr-tertiary); background-color: var(--clr-ntrl-min); } #supportContainer .search-results .group .title { background-color: rgba(var(--clr-tertiary-rgb), 0.2); color: var(--clr-tertiary); padding: 10px 15px; font-size: 0.875rem; text-transform: uppercase; font-weight: 700; display: block; } #supportContainer .search-results .group .item { color: var(--bs-body-color); display: block; padding: .5rem; border: solid 1px var(--clr-ntrl-tint-4); border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; } #supportContainer .search-results .group .item:hover { background-color: var(--clr-ntrl-tint-2); border: solid 1px var(--clr-tertiary); border-radius: .25rem; } #supportContainer .search-results .group .item:hover .content .icon { color: var(--clr-tertiary); } #supportContainer .search-results .group .item .content { display: flex; align-items: baseline; } #supportContainer .search-results .group .item .content .icon { margin-right: 5px; } #supportContainer .something-else { color: var(--clr-tertiary); margin-top: 15px; padding-top: 15px; border-top: solid 2px var(--clr-tertiary); } #supportContainer .something-else .item { color: var(--clr-tertiary); } #supportContainer .something-else .item:hover .text { text-decoration: underline; } @media(min-width: 768px) { #supportContainer .search-results { padding: 1rem; } #supportContainer .search-results .group .item { padding: 1rem; } #supportContainer .support-search input { font-size: 1.25rem; } #supportContainer .support-search input::placeholder { font-size: 1.15rem; } } @media(min-width: 992px) { #supportContainer .img-position { margin: 0 -20px -20px 45px; } } @media(min-width: 1200px) { #supportContainer .img-position { margin: 0 -20px -20px 75px; } } /* Headings */ .homepage h1, .homepage .h1 { font-size: 0.85rem; color: #2A405E; text-transform: uppercase; margin-bottom: 0.5rem; } /* Sections */ @media(min-width: 768px) { .homepage h1, .homepage .h1 { font-size: 1.5rem; } } /* My Favourites */ /* Sections */ .homepage .page-content section { padding: 1.5rem 0 1.5rem 0; border: none; } .homepage .page-content section > section { border: none; } .homepage .page-content section > section:first-child { padding-top: 0px !important; } .homepage .page-content section > section:last-child { padding-bottom: 0px !important; } .homepage .page-content section:last-child { margin-bottom: 0px; } .homepage .page-content section h3.section-title { text-align: center; font-weight: 600; font-size: 1.3rem; } @media(min-width: 768px) { .homepage .page-content section h3.section-title { text-align: left; font-size: 1.75rem; } } /* Nested Link Section */ section.nested-link-section { padding: 1rem 0 !important; } section.nested-link-section section { padding: 0 0 1rem 0 !important; } section.nested-link-section section:last-child { padding-bottom: 0px !important; } /* Simple (Secondary) Links */ .homepage #secondaryLinks { background: rgb(25,38,56); background: linear-gradient(45deg, rgba(25,38,56,1) 0%, rgba(42,64,94,1) 100%); padding: 1rem !important; border-radius: .25rem; } .homepage #secondaryLinks:last-child { margin-bottom: 0px; } .homepage #secondaryLinks h1 { color: #FFFFFF; } @media(min-width: 768px) { .homepage #secondaryLinks h1 { font-size: 1rem; margin-bottom: 0.5rem; } section.nested-link-section { padding: 1.5rem !important; } section.nested-link-section section { padding: 0 0 1.5rem 0 !important; } } .homepage #secondaryLinks .catalogue-item-card.simple { background: rgba(255,255,255,0.1); border: none; } .homepage #secondaryLinks .catalogue-item-card.simple .simple-link span { color: #FFFFFF; } @media(min-width: 992px) { .homepage #secondaryLinks { padding: 1.5rem !important; } } /* Feature Messages */ section#featureMessages { padding: 0px; } /* Department Nav - Mobile */ .homepage #mobileNav .department-ct { display: none; } /* Search */ .homepage .search-dropdown { display: none; } .homepage .header-search { display: none !important; } .homepage .scrolled { display: block !important; } @media(max-width: 991.98px) { .homepage .header-search { display: none !important; } } @media(min-width: 992px) { .homepage .header-search-ct { min-height: 42px; } } .homepage .homepage-search { padding-top: 1.5rem; } .homepage .homepage-search .card { background-color: var(--clr-primary); margin-bottom: 0px; } .homepage .homepage-search .card-body { padding: 0px; } .homepage .homepage-search .content { padding: 25px; } .homepage .homepage-search h3 { font-weight: 900; text-transform: uppercase; color: var(--clr-secondary); margin-bottom: 0.8rem; } @media(min-width: 992px) { .homepage .homepage-search h3 { font-size: 2.5rem; } } .homepage .homepage-search .search-box-btn { background: var(--clr-ntrl-min); border-color: var(--clr-ntrl-min); font-size: 1.25rem; padding: 0.5rem 0.75rem !important; } .homepage .homepage-search #desktopSearch { border-color: var(--clr-ntrl-min); border-left-color: #E0E0E0; padding: 1.25rem; } .homepage .homepage-search #desktopSearch::placeholder { font-weight: 600; } .homepage .homepage-search .search-header .btn, .homepage .homepage-search .search-header .btn:disabled, .homepage .homepage-search .search-header .btn.disabled { background: var(--clr-ntrl-min); opacity: 1; } /* Icon Key Container */ .icon-key { display: flex; justify-content: space-between; } /* Icon Key List */ .icon-key ul { display: flex; flex-wrap: wrap; align-items: center; } .icon-key ul li { margin-right: 0.25rem; margin-bottom: 5px; } .icon-key ul li:last-child { margin-right: 0; } @media(min-width: 992px) { .icon-key ul li { margin-bottom: 0; } } /* Bulk Discounts Available */ .icon-key .bulk-ava { background: #22B154; color: #FFFFFF; padding: .25rem .5rem; font-weight: 700; display: inline-block; text-align: center; line-height: 1.5; border-radius: .25rem; font-size: .875rem; } .icon-key .items-found .value { color: #22B154; font-weight: 600; } .fa-star { color: var(--clr-secondary); } .fa-file-pdf { color: #A01A21; } .fa-youtube { color: #A01A21; } .fa-list-alt { color: #22B154; } .fa-info-circle { color: #2A405E; } .fa-check { color: #22B154; } .fa-ban { color: #A01A21; } .fa-times { color: #A01A21; } .fa-stack-ct { display: inline-block; position: relative; vertical-align: middle; font-size: 0.7em; height: 1.5em; width: 1.5em; line-height: 1.5em; } .fa-stack-cou { left: 0; position: absolute; text-align: center; width: 100%; font-size: 1.5em; } .fa-stack-cou + .fa-stack-1x { line-height: 1.5em; } /* Hazardous Icon */ .hazardous-icon { font-size: 0.875rem; } .hazardous-icon .fa-triangle { color: #FFC30B; } .hazardous-icon .fa-exclamation { color: #000000; } .hazardous-icon span { font-weight: 600; } .hazardous-icon .exclamation-mark { position: absolute;left: 50%;transform: translate(-50%, -50%); top: 50%; font-size: 1rem;display: block; font-size: .85rem !important; } @media (min-width: 1200px) { .hazardous-icon { font-size: 1.1rem; } .hazardous-icon .exclamation-mark { font-size: .85rem; } } @media (max-width: 1199.98px) { .hazardous-icon { font-size: 1.25rem; } } .btx-required { font-size: 0.875rem; } /* Common List */ .list { padding-left: 15px; } .list li, .list ol { margin: 0 0 .5rem; } /* List Margin Styling */ .list-mb-1 li:not(:last-child) { margin-bottom: .25rem; } /* Margin Bottom */ dl, ol, ul{ margin-bottom: 0px; } dl:not(:last-child), ol:not(:last-child), ul:not(:last-child){ margin-bottom: 0.3rem; } /* Generic Panel Styling */ .lr-panel { position: fixed; top: 0; padding: 0 3rem; display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: center; } @media(max-width: 991px) { .lr-panel { position: static; padding: 3rem; } } /* Login Panel */ .login-panel { background: #2A405E; left: 0; right: 40%; color: #FFFFFF; } .login-panel a { color: #22b154; } .login-panel h2 { color: #FFFFFF; } .login-panel .login-message { text-align: center; } .login-panel .logo { text-align: center; } .login-panel .logo img { width: 350px; max-width: 100%; } .login-panel .field-validation-error { color: #F7CECE; } /* Register Panel */ .register-panel { background: #FFFFFF; right: 0; left: 60%; text-align: center; } /* Mailing List Preferences on the registration page */ .mailing-list-pref th { background-color: #2A405E; color: #FFFFFF; } .mailing-list-pref td { background: #FFFFFF; } .mega-menu { position: absolute; background: #FFFFFF; z-index: 1000; padding: 1rem 0; left: 0; right: 0; } @media(max-width: 575px) { .mega-menu .mega-menu-content { max-width: 100%; } } /* Modal Two */ .modal-two .modal-header { background-color: rgba(var(--clr-tertiary-rgb), 0.2); color: var(--clr-tertiary); } .modal-two .modal-header .modal-title { color: var(--clr-tertiary); font-weight: 600; } /* Modal Backdrop */ .modal-backdrop.show { opacity: 0.75; } /* Modal Content */ .modal-content { border: none; border-radius: 0px; } /* Modal Header Styling */ .modal-header { background: #F2F2F2; border-radius: 0px; display: flex; align-items: center; padding: 1rem 1.75rem; } .modal-header .modal-title { font-size: 1.2rem; margin-bottom: 0px; } @media(min-width: 768px) { .modal-header .modal-title { font-size: 1.4rem; } } /* Modal Body */ .modal-body { font-size: 0.875rem; padding: 1.75rem; } .modal-title { color: #2A405E; } .modal-header .close{ padding: 0; margin: 0 0 0 auto; font-size: 2rem; font-weight: 700; order: 1; } .modal-header .close span{ font-weight: 700; } /* Modal Buttons */ .modal-buttons { display: flex; justify-content: flex-end; margin-top: 1rem; } /* XL Modals */ @media (min-width: 576px) { .modal-xl { max-width: 540px; } } @media (min-width: 768px) { .modal-xl { max-width: 690px; } } @media (min-width: 992px) { .modal-xl { max-width: 930px; } } @media (min-width: 1200px) { .modal-xl { max-width: 1140px; } } @media (min-width: 1500px) { .modal-xl { max-width: 1410px; } } /* Images Modal */ #imagesModal .modal-content { background: #FFFFFF; padding: 1rem; } #imagesModal .modal-body { padding: 0px; } #imagesModal img { max-height: 75vh; } #imagesModal .catalogue-item-primary-image { display: block !important; } #imagesModal #btnCloseImagesModal { position: absolute; right: 0px; top: 0px; transform: translateY(-100%); font-size: 1.7rem; background: none; } #imagesModal #btnCloseImagesModal i { color: #FFFFFF; } /* Zoom Modal */ #zoomModal.show { display: flex !important; } #zoomModal .modal-content { width: auto; } /* Notify Modal */ #notifyModal { padding: 30px; } #notifyModal .modal-dialog { max-width: 500px; } #notifyModal .modal-body { padding: 2rem; text-align: center; position: relative; min-height: 200px; display: flex; flex-direction: column; justify-content: center; } #notifyModal .modal-body .close-button { position: absolute; top: 15px; right: 15px; padding: 0px; background: none; } #notifyModal .modal-body .close-button:hover { cursor: pointer; } #notifyModal .modal-body .close-button i { color: #4C4C4C; } #notifyModal .modal-body h2 { font-size: 1.8rem; font-weight: 600; } #notifyModal .modal-body h2 i { display: none; } #notifyModal .modal-body p a { color: #4C4C4C; } @media (min-width: 768px) { #notifyModal .modal-body h2 i { display: inline-block; } } /* Scrollable Modal */ .modal-dialog-scrollable { display: -ms-flexbox; display: flex; max-height: calc(100% - 1rem); } @media (min-width: 576px) { .modal-dialog-scrollable { max-height: calc(100% - 3.5rem); } } .modal-dialog-scrollable .modal-body { overflow-y: auto; } /* Modal Footer */ .modal-footer { border-color: rgba(0,0,0,0.5); } /* Modal Body Large Padding */ @media(min-width: 768px) { .modal.lg-padding .modal-header, .modal.lg-padding .modal-footer { padding: 1rem 1.5rem; } .modal.lg-padding .modal-body { padding: 1.5rem; } } #myBasket { padding: 1rem 0; } #myBasket .my-basket-header { text-align: center; margin: 0 auto 1rem auto; font-size: 0.75rem; display: flex; align-items: center; } #myBasket .my-basket-header h1 { margin: 0px; } #myBasket .my-basket-header h1:not(:last-child) { margin-bottom: 0.5rem; } #myBasket .my-basket-header .no-order-amends .emphasis { font-weight: normal; } #myBasket .my-basket-header .sfl-reminder { margin-left: auto; text-align: right; } #myBasket .my-basket-header .sfl-reminder p { margin: 0; } #myBasket .my-basket-header .sfl-reminder .sfl-link { text-transform: uppercase; font-weight: bold; color: var(--clr-secondary); } #myBasket .my-basket-header .sfl-reminder .sfl-items-lbl { text-transform: lowercase; } @media(min-width:576px){ #myBasket .my-basket-header .sfl-reminder .s4l-you-have { text-transform: lowercase; } } @media(min-width: 992px){ #myBasket { padding: 2rem 0; } #myBasket .my-basket-header { font-size: 1rem; } #myBasket .my-basket-header .no-order-amends .emphasis { font-weight: bold; } } #myBasket .basket-items { margin-bottom: 2rem; } /* Unavailable Basket Items */ .unavailable-basket-items { font-size: 1rem; } /* Sort By */ #sortBasketItemsForm { width: 100%; } @media(min-width: 576px){ #sortBasketItemsForm { width: auto; } } /* Basket items */ #basketItems .atb-icon { display: none; } /* Saved for later items */ #savedForLaterItemsWrapper .my-basket-header { border-top: 1px solid rgba(0,0,0,0.1); padding-top: 2rem; } #savedForLaterItems .sfl-icon { display: none; } #savedForLaterItems .bulk-savings-ct .qty-discounts-sign, #savedForLaterItems .bulk-savings-ct .qty-discounts-view-offer { display: none; } #savedForLaterItems .bulk-savings-ct .qty-input .input-group-text { border-color: #E0E0E0; } #savedForLaterItems .bulk-savings-ct .qty-input input { border-color: #E0E0E0 !important; } #savedForLaterItems .sku-item .sku-list-quantity-container.bulk-savings-ct .qty-ct { border-color: #E0E0E0; } /* Job Ref */ #savedForLaterItems .edit-icon { opacity: 0.15; } /* Hide Recently Viewed on Basket Page */ .basket-page .recently-viewed { display: none; } /* Basket Summary */ #basketSummary { margin-bottom: 1rem; display: flex; align-items: flex-end; } #basketSummary.empty { display: none !important; } #myBasket .goto-sfl { border: 1px solid rgba(0,0,0,0.15); color: initial; font-weight: normal; } #myBasket .goto-sfl:hover { background: #FFFFFF; } /* Checkout */ .goto-checkout { display: flex; margin-left: auto; } .goto-checkout .basket-totals { display: flex; align-items: center; } .goto-checkout .basket-totals .basket-item-count { font-size: 0.9rem; font-weight: 600; } .goto-checkout .basket-totals .basket-item-count .basket-weight { display: block; margin-top: -3px; font-size: 0.8rem; font-weight: normal; } .total-value-wrapper { text-align: right; } .total-value-wrapper .total-value { line-height: 1.3em; font-family: "Lato", sans-serif; color: var(--clr-secondary); } .total-value-wrapper .total-value .total-value-currency { font-weight: 600; } .total-value-wrapper .total-value .total-value-amount { font-weight: 900; font-size: 1.4em; } .total-value-wrapper .total-value-plus-del { margin-top: -2px; display: block; font-size: 0.7em; text-transform: uppercase; } .goto-checkout .checkout-btn { width: auto; margin-left: 1rem; text-transform: uppercase; } .goto-checkout .checkout-btn[disabled]:hover { cursor: default; } @media(min-width: 500px){ .goto-checkout .basket-totals .basket-item-count { margin-right: 2rem; } .goto-checkout .checkout-btn { width: 175px; } } #basketSummary .goto-checkout { font-size: 1rem; } #basketSummary .goto-checkout .basket-totals { border: 1px solid rgba(0,0,0,0.2); padding: 0.5rem 0.75rem; } /* Sticky Checkout Bar */ #stickyCheckoutBar { border-top: 2px solid #22B154; background: #FFFFFF; padding: 1rem 0; position: fixed; bottom: 0px; left: 0px; right: 0px; box-shadow: 2px -2px 10px rgba(0,0,0,0.05); z-index: 1039; } #stickyCheckoutBar .my-basket-lbl { font-weight: 600; } #stickyCheckoutBar .goto-checkout .basket-item-count, #stickyCheckoutBar .btn { padding: .375rem 1rem; } #stickyCheckoutBar .goto-sfl { display: block; background: #FFFFFF; color: #4C4C4C; } #stickyCheckoutBar .unavailable-basket-items { margin-bottom: 0px; } /* Checkout */ #stickyCheckoutBar .my-basket-lbl { display: none; } #stickyCheckoutBar .basket-item-count { } /* Updating State */ #myBasket .updating { opacity: 0.1; } /* Adder Disabled Elements */ #myBasket .jobref-input input:disabled, #myBasket .qty-input input:disabled { background: #FFFFFF; border: 1px solid #CED4dA; } /* Checkout Section */ #checkoutSummary { position: relative; } #btnCheckoutBack { display: block; width: 100%; } @media(min-width: 576px){ #btnCheckoutBack { width: auto; display: inline-block; } } @media(min-width: 768px){ #btnCheckoutBack { margin-top: 10px; } } .checkout-section { border: 1px solid rgba(0,0,0,0.1); display: flex; flex-direction: column; } .checkout-section:not(:last-child) { margin-bottom: 1.5rem; } .checkout-sections .checkout-section { height: auto; } .checkout-section a, .checkout-section p a, .checkout-section a:hover, .checkout-section p a:hover { color: var(--clr-secondary); font-weight: 600; } .checkout-section label { font-weight: normal; } /* Generic Checkout Notice */ .checkout-section .checkout-notice { background: #F2F2F2; padding: 0.75rem; font-size: 0.9em; } .checkout-section .checkout-section-header { background: rgba(255,255,255,0.5); border-bottom: 1px solid rgba(0,0,0,0.1); padding: 1rem; display: flex; align-items: center; min-height: 50px; } .checkout-section .checkout-section-header h2 { margin: 0px; font-size: 1.1rem; font-weight: 600; } .checkout-section .checkout-section-header h2 i { margin-right: 0.25rem; } .checkout-section .checkout-section-content { padding: 1rem; font-size: 0.85rem; flex-grow: 1; background: #FFFFFF; } .checkout-section .no-order-amends { display: block; margin-bottom: 1rem; } .checkout-section .checkout-sub-section { position: relative; } .checkout-section .checkout-sub-section:not(:last-child) { margin-bottom: 1.25rem; padding-bottom: 1.25rem; } .checkout-section .checkout-sub-section:not(:last-child):after { content: ""; display: block; height: 1px; background: rgba(0,0,0,0.1); position: absolute; bottom: 0px; left: 12.5%; right: 12.5%; } .checkout-section .checkout-summary { font-size: 1.2rem; } .checkout-section .checkout-summary .checkout-summary-line { display: flex; } .checkout-section .checkout-summary .checkout-summary-line .checkout-summary-line-lbl .basket-item-count { font-weight: 600; } .checkout-section .checkout-summary .checkout-summary-line .checkout-summary-line-value { margin-left: auto; font-weight: 600; } .checkout-section .checkout-summary .checkout-summary-line .view-item-breakdown { font-size: 0.8rem; } .checkout-section .checkout-summary .processing-fees-icon { font-size: 0.8rem; } .checkout-section .po-reference { display: flex; align-items: center; } .checkout-section .po-reference input { background: #F2F2F2; margin-right: 1rem; } /* IOSS Notice */ .checkout-section .vat-scheme-notice { font-size: 0.85rem; } .checkout-section .vat-scheme-notice h3 { font-size: 0.85rem; font-weight: bold; margin-bottom: 0.5rem; } .checkout-section .vat-scheme-notice .scheme-number { display: block; margin-top: 0.25rem; } .checkout-section .vat-scheme-notice.no-qualify h3 { color: #A01A21; } .checkout-section .vat-scheme-notice.qualify h3 { color: #22B154; } @media(min-width: 1200px){ .checkout-section .vat-scheme-notice h3 i { display: none; } } @media(min-width: 1366px){ .checkout-section .vat-scheme-notice h3 i { display: inline-block; } } @media(min-width: 1500px){ .checkout-section .vat-scheme-notice .scheme-number { display: inline-block; margin-top: 0; margin-left: 0.5rem; } } /* Delivery Methods */ .checkout-section .checkout-delivery-methods { margin-bottom: 2rem; } .checkout-section .checkout-delivery-methods .delivery-method:not(:last-child) { margin-bottom: 2rem; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio { display: flex; align-items: center; margin-bottom: 0px; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label { display: flex; align-items: center; flex-grow: 1; padding-left: 0.25rem; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label::before, .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label::after { top: 50%; transform: translateY(-50%); } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label .carrier-logo { margin-right: 1rem; display: inline-block; text-align: center; flex: 0 0 65px; position: relative; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label .carrier-logo img { max-width: 100%; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label .carrier-info { display: flex; flex-grow: 1; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label .carrier-name-desc { margin-right: 1rem; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label .carrier-name { font-weight: 600; display: block; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label .carrier-description { font-size: 0.9em; line-height: 1rem; display: block; } .checkout-section .checkout-delivery-methods .delivery-method .custom-radio .custom-control-label .carrier-price { margin-left: auto; font-weight: 600; } /* Order Weight Summary */ .checkout-section .checkout-order-weight-summary p { margin: 0px; } .checkout-section .checkout-order-weight-summary .checkout-order-weight-value { font-weight: 600; } .checkout-section .checkout-order-weight-summary .checkout-order-weight-desc { } /* Total to Pay */ .checkout-section .checkout-order-total { margin-left: auto; } /* Payment Options */ .checkout-section .btx-notice { font-size: 0.9em; } .checkout-section .checkout-payment-options .payment-options-selector { display: flex; } .checkout-section .checkout-payment-options .payment-options-list { background: #F2F2F2; flex-grow: 1; position: relative; overflow: hidden; } .checkout-section .checkout-payment-options .payment-options-list > i { position: absolute; right: 0.5rem; top: 50%; transform: translateY(-50%); pointer-events: none; } .checkout-section .checkout-payment-options .payment-options-list .selected-payment-option .payment-option { background: #F2F2F2; } .checkout-section .checkout-payment-options .payment-options-list .selected-payment-option:hover { cursor: pointer; } .checkout-section .checkout-payment-options .payment-options-list .payment-option { font-weight: 600; background: #FFFFFF; padding: 0.75rem; } .checkout-section .checkout-payment-options .payment-options-list .payment-option i { margin-right: 0.5rem; } .checkout-section .checkout-payment-options .payment-options-list .payment-option.highlight { color: #22B154; } /* Payment Options Dropdown */ .checkout-section .checkout-payment-options .payment-options-list .payment-options-dd { position: absolute; top: 100%; left: 0px; right: 0px; z-index: 2; background: #FFFFFF; border: 1px solid #E0E0E0; border-top: none; } .checkout-section .checkout-payment-options .payment-options-list .payment-options-dd .payment-option:hover { cursor: pointer; background: rgba(0,0,0,0.025); } .checkout-section .checkout-payment-options .payment-options-list.open { outline: 2px solid #000000; overflow: visible; outline-offset: -2px; } .checkout-section .checkout-payment-options .payment-options-list.open .payment-options-dd { outline: 2px solid #000000; outline-offset: -2px; } .checkout-section .checkout-payment-options .payment-options-list.open .payment-options-dd { margin-top: -2px; } .checkout-section .checkout-payment-options .payment-options-list.open .payment-options-dd .payment-option:not(:last-child) { border-bottom: 2px solid #000000; } /* Billing/Delivery Address */ .checkout-section .checkout-address .checkout-address-detail { margin-right: 1.5rem; } .checkout-section .checkout-address .checkout-address-detail span { display: block; } .checkout-section .checkout-address .checkout-address-detail .checkout-address-lbl { font-weight: 600; } .checkout-section .checkout-address .checkout-address-detail .checkout-address-value { font-size: 1em; line-height: 1.3rem; } .checkout-section .checkout-address .checkout-address-change { margin-top: 1rem; } /* Pay Now Button */ #checkoutSummary .checkout-btn { margin-top: 1.5rem; } #checkoutSummary .checkout-btn button { padding: 1rem; } /* Terms & Conditions Validation */ .checkout-section .checkout-terms .input-validation-error ~ label, .checkout-section .checkout-terms .input-validation-error ~ label a { color: #A01A21; } .checkout-section .checkout-terms .input-validation-error ~ label:before { background: #F6E8E9; } /* Validation */ .checkout-section.validation-errors { outline: 2px solid #A01A21; outline-offset: -2px; } .checkout-section.validation-errors .checkout-section-header { background: #A01A21; color: #FFFFFF; } .checkout-section.validation-errors .checkout-section-header h2 { color: #FFFFFF; } .checkout-section.validation-errors .total-value-wrapper { color: #FFFFFF; } #checkoutConfirm .validation-summary-valid { display: none; } #checkoutConfirm .validation-summary-errors { font-size: 0.85rem; padding: 1rem; margin-top: 1.5rem; border: 2px solid #A01A21; background: #F6E8E9; color: #A01A21; font-weight: 600; } #checkoutConfirm .validation-summary-errors ul { margin: 0 0 0 1rem; padding: 0px; } /* Page Furniture */ .basket-page { padding-bottom: 84px; } .basket-page .recently-viewed { display: none; } .basket-page .footer-menu { display: none; } .basket-page #availabilityChecker { display: none; } .checkout-page .recently-viewed { display: none; } .checkout-page .footer-menu { display: none; } .checkout-page #availabilityChecker { display: none; } @media(min-width: 1500px){ .checkout-page { padding-bottom: 150px; } } /* Block UI */ .block-ui { position: relative; } .block-ui:before { content: ""; position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; background: rgba(238, 241, 246, 0.75); z-index: 2; } @media(min-width: 1200px) { #myBasket .sku-item .hazardous-icon { padding: 5px !important; width: 52px; display: flex; align-items: center; justify-content: center; text-align: center; } } /* Order Issue Modal */ #modalOrderIssue .modal-dialog { max-width: 500px; text-align: center; } #modalOrderIssue .modal-dialog .modal-header { justify-content: center; } #modalOrderIssue .modal-dialog .modal-body { padding: 2rem; line-height: normal; } #modalOrderIssueBodyMessage { margin-bottom: 1rem; } #modalOrderIssueBodyMessage.warning { font-size: 1.1rem; font-weight: 600; } /* Delivery Address Updated Modal */ #modalDeliveryAddressUpdated .modal-dialog { max-width: 550px; text-align: center; } #modalDeliveryAddressUpdated .modal-dialog .modal-header { justify-content: center; } #modalDeliveryAddressUpdated .modal-dialog .modal-body { padding: 2rem; line-height: 1.3rem; } #modalDeliveryAddressUpdated .modal-dialog .modal-body h2 { font-weight: 600; line-height: 1.9rem; max-width: 80%; margin: 0 auto 1.5rem auto; } #modalDeliveryAddressUpdatedBodyMessage { margin-bottom: 1rem; } #myFavourites .product-sku-container:not(:last-child) { margin-bottom: 30px; } /* New Product List Items */ #newItemListWrapper { position: relative; background: #FFFFFF; padding: 1.25rem; border-radius: .25rem; } #newItemList .associated-item { background: #FFFFFF; } /* New Lines Department Block */ #newLinesDepartments .department-block { display: flex; flex-direction: column !important; } /* New Lines Departments Content */ #newLinesDepartments .department-block .content {flex-direction: column; flex-grow: 1; justify-content: center; align-items: flex-start; } #newLinesDepartments .department-block .new-line-count { font-weight: 500; } section.new-in h1 { font-size: 2.5rem; padding: .25em .4em; white-space: normal; background: #A01A21; } #newItemsCT #leftHandFilters .filter-ct { background: #FFFFFF; border-radius: .25rem; border: none; } #newItemsCT #newItemList { margin-bottom: -0.5rem; } @media (min-width: 768px) { #newItemsCT #newItemList { margin-bottom: -1.5rem; } #newItemList .associated-item { border-top-color: #BBBBBB !important; border-left-color: #BBBBBB !important; border-right-color: #BBBBBB !important; } #newItemList .associated-item .price-info .price-uom .price-wrapper { display: block; } } @media (max-width: 767.98px) { #newItemList .associated-item { border-color: #BBBBBB !important; } } .notice-bar { position: fixed; top: 0; background: rgba(160,26,33,1) !important; color: #FFFFFF; width: 100%; font-weight: 600; font-size: 80%; text-align: center; padding: 0.9rem; z-index: 12; } /*@media(min-width: 768px) { .notice-bar { font-size: 100%; } }*/ /* Error/404/app_offline */ .notice { font-family: "Arial",Segoe UI,Helvetica Neue,Helvetica,Verdana,sans-serif; background: #2a405e; line-height: 1.5; color: #FFFFFF; margin: 100px auto; max-width: 90%; text-align: center; } .notice-ct { max-width: 710px; margin: 0 auto; } .notice h1, .notice h2, .notice h3, .notice h4, .notice h5, .notice h6 { color: #FFFFFF; } .notice .card-body h1, .notice .card-body h2, .notice .card-body h3, .notice .card-body h4, .notice .card-body h5, .notice .card-body h6 { color: inherit; } .notice h1 { margin: 30px 0; font-size: 1.7rem; } .notice ul { margin: 35px 0; list-style-position: inside; } .notice a:not(.btn) { color: #FFFFFF; text-decoration: underline; } .notice p:last-child { margin-bottom: 0px; } .notice img { max-width: 100%; height: auto; } /* Browser Notices */ .notice img.browser-logo { padding: 20px; background: #FFFFFF; margin-bottom: 15px; } .notice .compat-icon { display: inline-block; background: url('/content/common_legacy/images/layout/browsers/compat-mode-icon.jpg') no-repeat #FFFFFF center center; padding: 0px; margin: 0px; width: 9px; height: 12px; vertical-align: middle; padding: 2px; } /* Support Form */ #supportFormLoader { color: #2a405e; text-align: left; padding: 20px; } #supportFormLoader .support-answer-detail h2 { color: #2a405e; } #supportFormLoader .support-answer-detail h3 { margin-top: 0px; font-size: 2rem; color: #2a405e; } #supportFormLoader .support-answer-body p:first-child { display: none; } #supportFormLoader .form-group { margin-bottom: 10px; } #supportFormLoader .edrive-uploader.uploaded .message:before { display: none; } /* Support Form Loader */ #noticeForm a:not(.btn) { color: inherit; font-weight: bold; } #noticeForm .loader { display: none; height: 100%; align-items: center; width: 100%; justify-content: center; } #noticeForm .loader .loading-icon { font-size: 3rem; opacity: 0.25; } #noticeForm.loading .loader { display: flex; } .offcanvas { background: #FFFFFF; border: solid 1px #E0E0E0; border-radius: .25em; z-index: 1045; } /* Header */ .offcanvas-header { border-bottom: 1px solid rgba(0,0,0,.125); } .offcanvas-header .offcanvas-title-ct { background-color: #2A405E; display: flex; align-items: center; justify-content: space-between; padding: .75rem 1rem; color: #FFFFFF; } @media (min-width: 992px) and (max-width: 1199px) { .offcanvas-header .offcanvas-title-ct { padding: 1.25rem; } } .offcanvas-header a:not(.btn) { color: #FFFFFF; text-decoration: underline; } /* Close Button */ .offcanvas-header .close-btn { padding: 5px; } .offcanvas-header .close-btn i { color: #FFFFFF; } .offcanvas-title { margin-bottom: 0; font-weight: 600; color: #FFFFFF; flex-shrink: 0; } /* Body */ .offcanvas-body { flex-grow: 1; padding: 1.25rem 1.75rem; padding-bottom: 200px; overflow-y: auto; position: relative; } @media (min-width: 992px) and (max-width: 1199px) { .offcanvas-body { padding: 1.25rem; } } /* Offcanvas Footer */ .offcanvas-footer { padding: 1.25rem 1.75rem; border-top: solid 1px #E0E0E0; background: #FFFFFF; } @media (min-width: 992px) and (max-width: 1199px) { .offcanvas-footer { padding: 1.25rem; } } /* Responsive Offcanvas */ @media(max-width: 991.98px) { .offcanvas-lg { position: fixed; bottom: 0; display: flex; flex-direction: column; max-width: 85%; transition: transform 0.3s ease-in-out; } .offcanvas-lg.offcanvas-start { top: 0; left: 0; width: 400px; transform: translateX(-100%); } .offcanvas-lg.show { transform: translateX(0%); } } /* Offcanvas Backdrop */ .offcanvas-backdrop { visibility: hidden; position: fixed; top: 0; left: 0; z-index: 1039; width: 100vw; height: 100vh; background-color: #000; opacity: 0; transition: opacity .3s linear; } .offcanvas-backdrop.show { opacity: .75; visibility: visible; } /* Offer Flag Generic Styling */ .offer-flag { position: absolute; top: 10px; left: 10px; display: flex; align-items: center; font-size: 0.6875rem; color: #FFFFFF; font-weight: 700; text-transform: uppercase; line-height: 1em; font-family: "Lato", sans-serif; text-align: center; z-index: 1; } /* Offer Flag Text */ .offer-flag span { width: 100%; padding: 3px 5px; } /* Offer Flag Colours */ .offer-flag.price-drop { background-color: #E98900; } .offer-flag.best-seller { background-color: #24329D; } .offer-flag.special { background-color: #0A6797; } .offer-flag.new { background-color: #A01A21; } .offer-flag.new-look { background-color: #1F5200; } /* Online Catalogue Item */ .online-catalogue-item { display: block; border-bottom: solid 1px #E0E0E0; padding: 1rem; } /* Most Recent */ .online-catalogue-item.most-recent { background: #22B154; } .online-catalogue-item.most-recent .title { color: #FFFFFF; } /* Online Catalogue Title */ .online-catalogue-item .title-ct { } .online-catalogue-item .title { display: block; margin-bottom: 15px; } .online-catalogue-item .title-ct i { margin-right: 10px; } @media(min-width: 540px) { .online-catalogue-item .title { margin-right: 30px; margin-bottom: 0; } .online-catalogue-item .title-ct { display: flex; align-items: center; justify-content: space-between; } } /* Our Catalogues Page */ @media(min-width: 992px){ .our-catalogues h1 { font-size: 2.75rem; } } .our-catalogues .header { margin-bottom: 1.5rem; } @media(max-width: 1499.98px) { .our-catalogues .header { text-align: center; } } .our-catalogues .header h5 { font-weight: 600; margin-bottom: 5px; color: #192C46; } .catalogue-card { border: 10px solid #E0E0E0; border-radius: .5rem; margin-bottom: 0; } .catalogue-card .catalogue-body { padding: 2rem; } @media(max-width: 575.98px) { .catalogue-card .catalogue-body { text-align: center; } } /* Just Landed Badge */ .catalogue-card .just-landed-badge { width: 133px; max-width: 100%; margin-bottom: 25px; } /* Cover */ .catalogue-card .catalogue-cover { width: 130px; /*height: 296px;*/ } @media(max-width: 575.98px) { .catalogue-card .catalogue-cover { margin: 0 auto; } } .catalogue-card .catalogue-cover.noticeboard { background: #192C46; color: #FFFFFF; font-weight: 600; font-family: "Lato", sans-serif; display: flex; flex-direction: column; padding: 20px 15px; text-align: center; } .catalogue-card .catalogue-cover .cousins-logo { width: 70%; } @media(max-width: 575.98px) { .catalogue-card .catalogue-cover .cousins-logo { margin: 0 auto; } } /* Image */ .catalogue-card .catalogue-cover .cover-image { margin: 20% 0; } .catalogue-card .catalogue-cover .cover-image img { width: 65%; opacity: 0.2; } /* Title */ .catalogue-card .catalogue-cover .cover-title { margin-top: auto; line-height: 1rem; } .catalogue-card .catalogue-cover .cover-date { font-size: 14px; color: var(--clr-secondary); font-weight: 500; display: block; } /* Catalogue Content */ .catalogue-card .content { padding: 0 .75rem 0 1rem; } @media(min-width: 576px) { .catalogue-card .content { padding: 0 .75rem; } } .catalogue-card p { line-height: 1.1rem; } .catalogue-card .content.centre { display: flex; flex-direction: column; justify-content: center; height: 100%; } .catalogue-card .content .header { margin-bottom: 1rem; text-align: left; } @media(max-width: 575.98px) { .catalogue-card .content .header { text-align: center; } } .catalogue-card .content h4 { font-weight: 600; margin-bottom: .5rem; } .catalogue-card .content h6 { font-weight: 600; margin-bottom: 0px; } .catalogue-card .content h6:not(.warning) { color: #192C46; } .catalogue-card .content .link { background-color: #192C46; display: flex; align-items: center; justify-content: space-between; padding: 5px 20px; font-size: 14px; color: #FFFFFF; } .catalogue-card .link-alt { font-weight: 600; color: var(--clr-secondary); text-decoration: underline; font-size: 14px; font-weight: 500; } @media(max-width: 767.98px) { .catalogue-card .content .link:not(:last-child) { margin-bottom: 8px; } } /* Feature Noticeboard */ .catalogue-card.feature { border-color: var(--clr-secondary); } .catalogue-card.feature .content .link { background-color: var(--clr-secondary); } /* Previous Noticeboard */ .catalogue-card.previous { margin-bottom: 30px; } .catalogue-card.previous .catalogue-body { padding: 1rem; } .catalogue-card.previous .header { text-align: center; margin-bottom: .5rem; } .catalogue-card.previous .catalogue-body .header h6 { font-weight: 600; color: #192C46; } .catalogue-card.previous .catalogue-cover { width: 117px; /* height: 152px;*/ padding: 5px 10px 12px 10px; margin: 0 auto -35px auto; } @media(max-width: 599.98px) { .catalogue-card.previous .catalogue-cover { max-width: 100%; } } .catalogue-card.previous .catalogue-cover .cover-title { font-size: 10px; } /* Catalogue Department */ .catalogue-card .catalogue-department { border-width: 6px; border-style: solid; border-radius: .5rem; padding: .25rem; text-align: center; break-inside: avoid; display: block; } .catalogue-card .catalogue-department:not(:last-child) { margin-bottom: 8px; } .catalogue-card .catalogue-department .title { font-family: "Lato", sans-serif; letter-spacing: 0.25px; font-weight: 600; color: #192C46; font-size: 12px; display: block; } /* Full Catalogue */ .catalogue-card.full-cat { border-color: #192C46; } @media(min-width: 576px) { .catalogue-card.full-cat .full-cat-departments { column-count: 2; } } .catalogue-card.full-cat .catalogue-cover { margin-bottom: 1rem; width: 70%; } @media(min-width: 576px) { .catalogue-card.full-cat .catalogue-cover { width: 300px; } } @media(min-width: 768px) { .catalogue-card.full-cat .catalogue-content { width: 50%; } } .catalogue-card.full-cat .catalogue-content .price { margin-bottom: 1rem; } .catalogue-card.full-cat .catalogue-content .price .plus-delivery { display: block; line-height: 1.2em; } .catalogue-card.full-cat .content .header, .catalogue-card.full-cat .catalogue-body { text-align: center; } @media(min-width: 768px) { .catalogue-card.full-cat .content .header, .catalogue-card.full-cat .catalogue-body { text-align: left; } } /* Support Answer */ .support-answer { border: 1px solid #E0E0E0; padding: 1rem; border-radius: .25em; } .modal .support-answer { border: none; padding: 0px; } .support-answer h2 { font-weight: bold; color: var(--clr-secondary); } .support-answer .support-answer-title h3 { color: var(--clr-secondary); margin-bottom: 1.5rem; font-size: 1.3rem; } .support-answer a:not(.btn) { color: var(--clr-secondary); font-weight: bold; } .support-answer a:not(.btn):hover, .support-answer a:not(.btn):active, .support-answer a:not(.btn):visited { color: var(--clr-secondary); } /* content sections */ .support-answer .content-section:not(:last-child) { margin-bottom: 2rem; } .support-answer section { background: none; padding: 0px; } /* Support Topic Page */ .support-topic-page .support-answer { border: none; } /* Support Answer Videos */ .support-answer .video-player-wrapper { position: relative; margin-bottom: 20px; box-shadow: 1px 1px 5px rgba(0,0,0,0.2); } .support-answer .video-player { padding-top: calc((1080 / 1920) * 100%); } /* Horizontal Rules */ .support-answer hr { margin: 2rem 0; } /* Titles */ .support-answer h3 { margin-bottom: 0.5rem; font-size: 1.1rem; font-weight: 600; } .support-answer h3:not(:first-child) { margin-top: 30px; } .support-answer hr ~ h3 { margin-top: 0px !important; } /* Images */ .support-answer img { max-width: 100%; } /* Support Form Result */ .support-answer .support-request-result .fa-check { color: var(--clr-secondary) !important; margin-right: 0.25rem; } @media (min-width: 768px) { .support-answer .video-player-wrapper { margin: 0 0 40px 0; } } .modal .support-answer .video-player-wrapper { margin-bottom: 20px; width: 100%; } .modal .support-answer .video-player-wrapper iframe { width: 100%; } @media (min-width: 992px) { .support-answer { padding: 2.25rem; } .modal .support-answer .video-player-wrapper { margin: 0 0 20px; } .support-answer .support-answer-title h3 { font-size: 1.5rem; } .support-answer h3 { font-size: 1.25rem; } } /* Open Ticket Items */ .open-ticket-item { background-color: #F2F2F2; padding: 15px; } .open-ticket-item:not(:last-child) { margin-bottom: .5rem; } .open-ticket-item .type { font-weight: 700; } .open-ticket-item .type .sub-type { font-weight: 500; font-size: 1rem; } .open-ticket-item .sku-list-image .sku-thumbnail { order: 0; width: 70px; height: 70px; margin-right: 0.5rem; display: flex !important; align-items: center; justify-content: center; } .open-ticket-item .sku-list-image .sku-thumbnail > div { width: 62px; height: 62px; } .open-ticket-item .fa-envelope.unread { color: var(--clr-secondary); } @media(max-width: 1499.98px) { .open-ticket-item .type { font-size: 1.25rem; } } /* Help Boxes */ .online-support .help-box { color: inherit; border: 2px solid var(--clr-secondary); height: 100%; } .online-support .help-box:hover, .online-support .help-box.active { background: rgba(183, 150, 73, 0.15); border-color: var(--clr-secondary) !important; } .online-support .help-box h5 { font-weight: 900; margin-bottom: .25rem; text-transform: uppercase; color: var(--clr-secondary); letter-spacing: 0.25px; } .online-support .help-box i.fas, .online-support .help-box i.far { color: var(--clr-secondary); } .online-support .help-box .content-body { height: 100%; padding: 1rem; } @media(max-width: 767.98px) { .online-support .help-box h5 { font-size: 80%; } .online-support .help-box .content { font-size: 80%; display: block; } } /* Support Tree */ .support-tree-wrapper { padding-top: 40px; margin-top: 40px; border-top: 1px dotted rgba(0,0,0,0.25); } .support-tree h1 { font-size: 1.75rem; font-weight: normal; color: #192C46; } .support-tree .page-description strong { color: var(--clr-secondary); } .support-tree .form-group > label { color: var(--clr-secondary); } .support-tree.hide-parent-topics .support-topic-picker-fg:not(:last-child) { display: none; } /* Modal Support Tree */ .modal .support-tree h2 { font-size: 1.5rem; margin-bottom: 0.4rem; } .modal .support-tree .content-section:not(:last-child) { margin-bottom: 2rem; } .support-tree .support-topic-picker-fg { position: relative; } .support-tree .support-topic-picker-fg:last-child select { border-color: var(--clr-secondary); } .support-tree .support-topic-picker-fg:last-child::before { content: "\f054"; color: var(--clr-secondary); font-weight: bold; font-size: 1.25rem; font-family: "FontAwesome"; position: absolute; left: -15px; bottom: 5px; } .modal .support-tree .support-topic-picker-fg:last-child::before { display: none; } #paymentResult .content-body { padding: 2.5rem; } /* Bank Transfer Details (Order Confirmation Screen) */ .bank-transfer-instructions-wrapper { padding: 3rem 0; margin: 3rem 0; border-top: 1px dotted rgba(0,0,0,0.25); border-bottom: 1px dotted rgba(0,0,0,0.25); } .bank-transfer-instructions-wrapper #btnBankTransferNotification { display: none; } .bank-transfer-instructions-wrapper .bank-transfer-confirmation { } .bank-transfer-instructions-wrapper .payment-details { margin-right: 20px; } @media(min-width: 992px) { .order-issue-form .orders { background: #F2F2F2; padding: 1rem; } } @media(max-width: 992px) { .order-issue-form .order .card-body { padding: 0px; } } .order-issue-form .order:not(:last-child) { padding-bottom: 2rem; margin-bottom: 2rem; border-bottom: 1px solid rgba(0,0,0,0.1); } .order-issue-form .order .card { margin: 0px; } .order-issue-form .order .order-header { margin-bottom: 1rem; } @media(min-width: 992px) { .order-issue-form .order .order-header { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(0,0,0,0.1); } } .order-issue-form .order .order-header .order-ref { font-weight: 600; color: var(--clr-secondary); } @media(min-width: 992px) { .order-issue-form .order .order-header .order-ref { font-size: 1.2rem; } } .order-issue-form .order .order-header .order-address { font-size: 0.8rem; display: none; } @media(min-width: 992px) { .order-issue-form .order .order-header .order-address { display: block; } } .order-issue-form .order .order-item { font-size: 0.8rem; } @media(min-width: 992px) { .order-issue-form .order .order-item { font-size: 1rem; } } .order-issue-form .order .order-item:not(:last-child) { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(0,0,0,0.1); } .order-issue-form .order .order-item.selected { color: #22B154; } .order-issue-form .order .order-item .sku-thumbnail { width: 40px; height: 40px; } .order-issue-form .order .order-item .sku-thumbnail > img, .order-issue-form .order .order-item .sku-thumbnail > div { width: 36px; height: 36px; } .order-issue-form .order .order-item .item-name-wrapper .item-name { font-weight: 600; } .order-issue-form .order .order-item .missing-reason { font-size: 0.85rem; text-align: right; } .order-issue-form .order .order-item .missing-reason .on-backorder { font-weight: 600; } .order-issue-form .order .order-item .missing-reason .cancelled { font-weight: 600; } .order-issue-form .order .order-item .missing-reason .refunded { color: #22B154; } .order-issue-form .order .order-item .select-button-wrapper { text-align: right; } .order-issue-form .order .order-item .order-item-shipments { font-size: 0.8rem; border-top: 1px solid #F2F2F2; border-bottom: 1px solid #F2F2F2; padding: 1rem 0rem; } .order-issue-form .order .order-item .order-item-shipment:not(:last-child) { border-bottom: 1px solid #F2F2F2; margin-bottom: 0.25rem; padding-bottom: 0.25rem; } @media(min-width: 992px) { .order-issue-form .order .order-item .order-item-shipments { font-size: 0.9rem; } .order-issue-form .order .order-item .order-item-shipment { background: #F2F2F2; padding: 0.5rem 1rem !important; border-bottom: 0px; } } .order-issue-form .order .order-item .order-item-shipment .invoice-number { display: block; font-weight: 600; } .order-issue-form .order .order-item .order-item-shipment .invoice-date { display: block; } .order-issue-form .order .order-item .order-item-shipment .order-item-comment { font-size: 0.8rem; line-height: 1.1rem; margin-top: 0.5rem; font-weight: 600; color: #A01A21; } /* Show reduced items by default */ .order-issue-form #orderIssueSelectItemsStep .order { display: none; } .order-issue-form #orderIssueSelectItemsStep .order:nth-child(-n+2) { display: block; } /* Validation Summary */ .order-issue-form .field-validation-error { font-weight: 600; margin-bottom: 1rem; } /* Alerts */ .order-issue-form .alert { margin: 2rem 0; padding: 1.5rem; } .order-issue-form .alert h2 { margin-bottom: 1rem !important; } .order-issue-form .alert.alert-danger h2 { color: #A01A21; font-weight: bold; text-transform: uppercase; } /* Summary Prices */ .order-summary .summary-total { margin-bottom: 1.25rem; } .order-summary .summary-total div { display: flex; justify-content: space-between; margin-bottom: 0.25rem; } .order-summary .summary-total p { margin: 0; font-weight: 700; } /* Total To Pay */ .order-summary .total-to-pay { color: #22B154; } @media (min-width: 576px ) { .order-summary .total-to-pay { display: flex; align-items: center; justify-content: space-between; } } /* PO Number */ .order-summary .total-to-pay input { margin-bottom: 20px; margin-right: 20px; } @media (min-width: 576px ) { .order-summary .total-to-pay input { margin-bottom: 0; margin-right: 20px; } } .order-summary .total-to-pay .summary-price { font-size: 2rem; font-weight: 700; line-height: 1em; } .order-summary .total-to-pay span { display: block; } @media(min-width: 768px) { .order-summary .total-to-pay .po-number { width: 50%; } } .order-summary .sum-item { background: #F2F2F2; padding: 0.5rem; } /* Total Saving */ .order-summary .sum-item .discount-applied { white-space: nowrap; } /* Basket Terms & Conditions */ .order-summary .basket-terms { border-top: solid 1px #E0E0E0; border-bottom: solid 1px #E0E0E0; margin: 1rem 0; padding-top: 1rem; padding-bottom: 1rem; } .order-summary .basket-terms .form-check { margin: 0; } .order-summary .basket-terms a { text-decoration: underline; } /* Pay By Bank Transfer */ .order-summary .payment-option { text-align: center; } /* Payment Types */ .order-summary .payment-type { display: flex; flex-direction: column; justify-content: space-between; text-align: center; } /* No Order Amends */ .no-order-amends { color: #A01A21; } .no-order-amends .emphasis { font-weight: bold; text-transform: uppercase; } /* Pager Container */ .pager { } @media (min-width: 575px) and (max-width: 767.98) { .pager { display: flex; justify-content: space-between; } } @media (min-width: 1200px) { .pager { display: flex; justify-content: space-between; } } /* Pager span and FontAwesome i tags */ .pager .page-item span:not(.current-page-no) { display: none; } .pager .page-item.current-page-no span { display: block; } .pager .page-item i { display: block; } .pager .page-item.disabled { opacity: 1; } @media (min-width: 992px) { .pager .page-item span:not(.current-page-no) { display: block; } .pager .page-item i { display: none; } } /* Pager link buttons */ @media (min-width: 1200px) { .pager .page-item a { position: relative; display: block; padding: .5rem .75rem; margin-left: -1px; line-height: 1.25; color: #007bff; background-color: #fff; border: 1px solid #dee2e6; } .pager .page-item a, .pager .page-item .page-link { height: calc(2.25rem + 2px); align-items: center; display: flex; } } /* Pager current page number */ .pager .current-page { display: flex; align-items: center; padding: 0 1rem; } .pager .current-page:first-child { padding-left: 0px; } .pager .current-page:last-child { padding-right: 0px; } /* Alternative Pager Styling */ .pager.alt .page-item a, .pager.alt .page-link { color: inherit; padding: .65rem 1.2rem; height: auto; line-height: 1.25rem; } .pager.alt .page-item.active .page-link { background: #2A405E; border: none; color: #FFFFFF; } /* Auto Pager */ .auto-pager { position: relative; display: flex; align-items: center; justify-content: center; } .auto-pager::before { content: ""; position: absolute; top: 50%; left: 0; right: 0; height: 1px; background-color: rgba(0,0,0,0.2); /* Set your desired line color */ } .auto-pager span { z-index: 1; padding: 0 10px; background: #E1E9F4; font-size: 12px; } @media(min-width: 768px){ .auto-pager span { font-size: unset; } } .popover { background: #F6F4F5; border-color: #E0E0E0; font-family: "Arial",Segoe UI,Helvetica Neue,Helvetica,Verdana,sans-serif; max-width: 300px; overflow: hidden; } .popover[x-placement^="top"] .arrow::before { border-top-color: #E0E0E0; } .popover[x-placement^="top"] .arrow::after { border-top-color: #F6F4F5; } .popover[x-placement^="right"] .arrow::before { border-right-color: #E0E0E0; } .popover[x-placement^="right"] .arrow::after { border-right-color: #F6F4F5; } .popover[x-placement^="bottom"] .arrow::before { border-bottom-color: #E0E0E0; } .popover[x-placement^="bottom"] .arrow::after { border-bottom-color: #F6F4F5; } .popover[x-placement^="left"] .arrow::before { border-left-color: #E0E0E0; } .popover[x-placement^="left"] .arrow::after { border-left-color: #F6F4F5; } .popover .title { display: block; letter-spacing: 0.25px; font-weight: 700; margin-bottom: 10px; font-size: 1rem; white-space: nowrap; } /* Hazardous Message */ .popover.hazardous-message { background-color: #FFEDB6; border-color: #FFC30B; } .popover.hazardous-message[x-placement^="top"] .arrow::before { border-top-color: #FFC30B; } .popover.hazardous-message[x-placement^="top"] .arrow::after { border-top-color: #FFEDB6; } .popover.hazardous-message[x-placement^="right"] .arrow::before { border-right-color: #FFC30B; } .popover.hazardous-message[x-placement^="right"] .arrow::after { border-right-color: #FFEDB6; } .popover.hazardous-message[x-placement^="bottom"] .arrow::before { border-bottom-color: #FFC30B; } .popover.hazardous-message[x-placement^="bottom"] .arrow::after { border-bottom-color: #FFEDB6; } .popover.hazardous-message[x-placement^="left"] .arrow::before { border-left-color: #FFC30B; } .popover.hazardous-message[x-placement^="left"] .arrow::after { border-left-color: #FFEDB6; } /* Popover Overrides */ .popover-body { padding: 1.25rem; line-height: 1.2; } /* Popover Fadeout */ .popover-body .fade-cover { height: 640px; position: absolute; top: 0px; left: 0px; right: 0px; /* background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);*/ background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 80%, rgba(255,255,255,1) 90%); pointer-events: none; } /* Product Popover */ .prod-pop { max-width: 500px; border: none; box-shadow: 0 0 14px rgba(0, 0, 0, 0.4); } .prod-pop .sku-product-details { max-height: 600px; overflow: hidden; } .prod-pop .popover-title h2 { margin: 0px; } .prod-pop .popover-body { padding: 1.25rem; } /* SKU Hover */ .sku-hov { max-width: 60%; min-width: 50%; box-shadow: 0 0 14px rgba(0, 0, 0, 0.4); background-color: #FFFFFF; } .sku-hov .sku-product-details { max-height: 600px; overflow: hidden; } .sku-hov .sku-image { display: none; text-align: center; } @media (min-width: 992px) { .sku-hov { max-width: 70%; } .sku-hov .sku-image { display: block; } } @media (min-width: 1200px) { .sku-hov { max-width: 900px; min-width: 700px; } } .sku-hov .sku-title { font-size: 1.5rem; margin-bottom: 5px; font-weight: 600; } .sku-hov .sku-code { font-size: .75rem; font-weight: 700; color: #8d8d8d; line-height: 1.2em; } .sku-hov .sku-description-attributes h3 { font-size: 1.2rem; font-weight: 600; } .sku-hov .sku-description-attributes.has-description .sku-attributes { padding-right: 30px; border-right: 1px solid rgba(0,0,0,0.15); } /* Attributes */ .sku-hov .sku-attributes { font-size: 0.8rem; } .sku-hov .sku-description { } .sku-hov .sku-description ul { padding-left: 15px; } .sku-hov .sku-description ul li:not(:last-child) { margin-bottom: 2px; } /* More Info Available Message */ .sku-hov .alert-danger { background: #A01A21; color: #FFFFFF; } .sku-hov .alert-danger i { color: #FFFFFF; } /* Price Breaks */ .sku-hov .sku-image-price-breaks { order: 2; } .sku-hov .sku-product-details .bulk-saving-card { border: 1px solid rgba(0,0,0,0.075); margin-top: 0px !important; } .sku-hov .sku-product-details .bulk-saving-card .bulk-saving-header { display: none; } .sku-hov .sku-product-details .bulk-saving-card .bulk-saving-header h4 { } .sku-hov .sku-product-details .bulk-saving-card table { border: none; } .sku-hov .sku-product-details .bulk-saving-card table td { border: none; padding: 10px; } .sku-hov .sku-product-details .bulk-saving-card table tr:nth-child(odd) { background: rgba(0,0,0,0.035); } .sku-hov .sku-product-details .bulk-saving-card table tr:nth-child(even) { background: rgba(0,0,0,0.085); } /*Price Promise Banner */ .price-promise-header { display: flex; justify-content: space-between; background: #2A405E; padding: 1.25rem; align-items: flex-start; border-radius: 0.25rem 0.25rem 0 0; } .price-promise-header h2 { margin: 0; color: #FFF; font-weight: 700; padding-right: 30px; align-self: center; } .price-promise-details { display: flex; align-items: center; } .price-promise-details > div { line-height: 1em; } .price-promise-details p { margin: 0; } @media(max-width: 768px) { .price-promise-details { margin-top: 20px; } } /* Price Promise Popup */ .price-promise-form .price-promise-intro { display: flex; align-items: center; margin-bottom: 20px; } .price-promise-form .price-promise-intro p { margin: 0; } @media(max-width: 575.98px) { .price-promise-form .price-promise-intro { display: block; text-align: center; } } /* Price Promise Popup Item Details */ .price-promise-form .item-details { display: flex; border-bottom: 1px dashed #E0E0E0; border-top: 1px dashed #E0E0E0; margin-bottom: 20px; padding: 20px 0; } .price-promise-form .item-details .sku-image { margin-right: 15px; display: block; max-height: 45px; } .price-promise-form .item-details h5 { margin-bottom: 5px; } /* Price Promise Popup User Details */ @media(max-width: 450px) { .price-promise-form .user-details .web-link { display: block; margin-bottom: .5rem; } } /* Price Promise Instructions */ .price-promise-form .show-screenshot-instructions { white-space: normal; } .price-promise-form .screenshot-instructions { display: none; } .price-promise-form .screenshot-instructions .key { border: 1px solid #192c46; padding: 0 4px; border-radius: .3rem; white-space: nowrap; } /* Price Promise Icon */ .icon-key .price-promise-icon { line-height: 1.2em; } @media print { @page { margin: 0; } .no-print { display: none !important; } .invoice { border: none; box-shadow: none; padding: 0px; } /* Show Background Images */ * { -webkit-print-color-adjust: exact !important; /* Chrome, Safari, Edge */ color-adjust: exact !important; /*Firefox*/ } /* Site Container */ .site-container { margin-top: 0; } /* SKU Item */ .sku-item { margin-bottom: 5px !important; } .sku-item .badge { border: none; } /* Item Description */ .catalogue-item-overview { margin-bottom: 15px !important; background: none; border: none; } .catalogue-item-overview .content-body { padding: 0; } .catalogue-overview-content .catalogue-overview-content-inner { height: auto !important; } .catalogue-overview-content .catalogue-overview-content-inner h1 { margin-bottom: 0; } .catalogue-overview-content a.reveal { display: none !important; } } .prod-card { position:relative; background: #FFFFFF; border: solid 1px #E0E0E0; border-radius: .25rem; padding: 1.25rem; display: flex; flex-direction: column; margin-bottom: 30px; text-align: center; color: inherit; } .prod-card:hover { text-decoration: none; } .prod-card .prod-image { padding: 0px 50px; } .prod-card .title { color: #4C4C4C; font-size: 1rem; font-weight: 700; margin-bottom: 20px; } .prod-card .prod-details { border-top: solid 1px #E0E0E0; margin-top: 1.25rem; padding-top: 1.25rem; } .prod-card span { display: inline-block; } .prod-card .description { margin-bottom: 15px; font-size: 12.8px; } .prod-card .price { color: var(--clr-secondary); font-weight: 700; font-size: 80%; } .prod-card .added-today { color: #008AFF; font-weight: 700; } /* Zoom on hover */ .prod-card img { transition: ease-in-out .4s; } @media(max-width: 767.98px) { .prod-card { padding: .5rem; } .prod-card .title { font-size: 80%; } .prod-card .price { font-size: 80%; } .prod-card:hover img { transform: scale(1.05); } .prod-card .prod-details { margin-top: .5rem; padding-top: .5rem; } } @media(min-width: 1200px) { .prod-card .price { font-size: unset; } } .prod-card .price .price-wrapper { display: block; } .quick-links-ct { min-width: 1px; } .quick-links-ct .custom-scroll { white-space: nowrap; } .quick-links { border-bottom: 1px solid #E0E0E0; } .quick-links ul { margin-bottom: 0px; } .quick-links .nav-item.my-account { display: none; } #MainNavigationSwipeIn .quick-link-nav-item .nav-link { border-bottom: solid 1px rgba(255,255,255,0.1); color: #fff; font-weight: 600; text-transform: uppercase; padding: 16px 25px 16px 25px; } #MainNavigationSwipeIn .quick-link-nav-item .nav-link:before { content: ""; border-left-style: solid; border-left-width: 8px; position: absolute; left: 0; top: 0; height: 100%; border-color: rgba(255,255,255,.2); } #MainNavigationSwipeIn .quick-link-nav-item i { width: 20px; color: #FFFFFF; } /* New Items Link */ #MainNavigationSwipeIn .quick-link-nav-item .nav-link.new-item:before { border-color: #A01A21; } /* Contact & Services Link */ #MainNavigationSwipeIn .quick-link-nav-item .nav-link.contact-services:before { border-color: var(--clr-secondary); } #MainNavigationSwipeIn .quick-link-nav-item.contact-services-ct { display: block !important; } #MainNavigationSwipeIn .nav-items li:not(.quick-link-nav-item) i { display: none; } .logged-out .nav-item.logged-in-only { display: none; } .admin-user .nav-item.customer-only { display: none; } .quick-links { background: #FFFFFF; font-family: "Lato",sans-serif; font-size: 0.75rem; } .quick-links ul { display: flex; } .quick-links ul li:first-child .nav-link { padding-left: 0; } .quick-links ul li:last-child .nav-link { padding-right: 0; } @media(min-width: 1200px) { .quick-links ul { justify-content: space-between; flex-grow: 1; } } .quick-links ul li { flex-shrink: 0; margin-right: 0px; } .quick-links ul li a { color: #2A405E; padding: 15px 5px; font-weight: 600; } .quick-links ul li a:hover { text-decoration: underline; } .quick-links ul li i { margin-right: 6px; color: #2A405E; } .quick-links ul li:not(:first-child) { margin-left: .25rem; } @media(min-width: 370px) { .quick-links ul li:not(:first-child) { margin-left: 0.45rem; } } @media(min-width: 380px) { .quick-links ul li:not(:first-child) { margin-left: 0.8rem; } } @media(min-width: 390px) { .quick-links ul li:not(:first-child) { margin-left: 1.1rem; } } @media(min-width: 410px) { .quick-links ul li:not(:first-child) { margin-left: 1rem; } } @media(min-width: 420px) { .quick-links ul li:not(:first-child) { margin-left: 1.1rem; } } @media(min-width: 430px) { .quick-links ul li:not(:first-child) { margin-left: 0.45rem; } } @media(min-width: 470px) { .quick-links ul li:not(:first-child) { margin-left: 0.65rem; } } @media(min-width: 490px) { .quick-links ul li:not(:first-child) { margin-left: 0.75rem; } } @media(min-width: 500px) { .quick-links ul li:not(:first-child) { margin-left: 1rem; } } @media(min-width: 510px) { .quick-links ul li:not(:first-child) { margin-left: 1rem; } } @media(min-width: 530px) { .quick-links ul li:not(:first-child) { margin-left: 0.25rem; } } @media(min-width: 560px) { .quick-links ul li:not(:first-child) { margin-left: 0.45rem; } } @media(min-width: 580px) { .quick-links ul li:not(:first-child) { margin-left: 0.75rem; } } @media(min-width: 600px) { .quick-links ul li:not(:first-child) { margin-left: 1rem; } } @media(min-width: 630px) { .quick-links ul li:not(:first-child) { margin-left: 0.45rem; } } @media(min-width: 670px) { .quick-links ul li:not(:first-child) { margin-left: 0.75rem; } } @media(min-width: 710px) { .quick-links ul li:not(:first-child) { margin-left: 0.25rem; } .quick-links ul:not(.logged-in) { justify-content: center; flex-grow: 1; } } @media(min-width: 740px) { .quick-links ul li:not(:first-child) { margin-left: 0.45rem; } } @media(min-width: 770px) { .quick-links ul li:not(:first-child) { margin-left: 0.75rem; } } @media(min-width: 790px) { .quick-links ul li:not(:first-child) { margin-left: 0.45rem; } } @media(min-width: 810px) { .quick-links ul li:not(:first-child) { margin-left: 0.45rem; } } @media(min-width: 850px) { .quick-links ul li:not(:first-child) { margin-left: 0.75rem; } } @media(min-width: 890px) { .quick-links ul li:not(:first-child) { margin-left: 0.45rem; } } @media(min-width: 940px) { .quick-links ul li:not(:first-child) { margin-left: 0.75rem; } } @media(min-width: 960px) { .quick-links ul li:not(:first-child) { margin-left: 0.75rem; } } @media(min-width: 700px) { .quick-links ul.admin-user { justify-content: space-between; flex-grow: 1; } } @media(min-width: 992px) { .quick-links ul li:not(:first-child) { margin-left: 0.225rem; } .quick-links ul { justify-content: space-between !important; flex-grow: 1 !important; } } @media(min-width: 1200px) { .quick-links ul li:not(:first-child) { margin-left: 0.9rem; } } @media(min-width: 1400px) { .quick-links ul li:not(:first-child) { margin-left: 0.5rem; } } /* Code - Quantity Container */ .qs-finder .qs-code-qty { flex-grow: 1; } .qs-finder .qs-qty { flex: 0 0 105px; } @media (min-width: 576px) { .qs-finder .qs-qty { flex: 0 0 136px; } /* Make form inputs bigger on screens that are at least 576px */ .qs-finder .form-control, .qs-finder .input-group-text { padding: .5rem 1rem; font-size: 1.25rem; line-height: 1.5; } } /* Find Button */ .qs-finder .btn { display: block; width: 100%; } @media (min-width: 576px) { .qs-finder .btn { width: auto; } } /* Quickshop validation error */ /* Quickshop SKU List */ #quickShopItems .sku-list-quantity-container .jobref-input { width: 58%; visibility: hidden; } /* Quantity Box Alignment */ #quickShopItems .bulk-savings-ct .qty-discounts-view-offer { position: relative; bottom: unset; } .grecaptcha-badge { visibility: hidden; } .recaptcha-notice { font-size: 0.75rem; margin-top: 1.5rem; } /*.recently-viewed { padding: 1rem; border-radius: .25rem; } @media(min-width: 992px) { .recently-viewed { padding: 1.5rem; } }*/ .recently-viewed h5 { margin: 0; } /* No bottom margin needed due to slick carousel & Flex grow to help make them equal height */ .recently-viewed .content-card { margin-bottom: 0; flex-grow: 1; } .homepage .recently-viewed-ct { padding-top: 0px !important; } /* Revealer - tdl.jquery.revealer (Perhaps should move to 'Plugins') */ .revealer { position: relative; } .revealer.covered { overflow: hidden; } .revealer a.reveal { width: 100%; display: block; } .revealer a.reveal span { display: block; font-weight: 600; } .revealer a.reveal span.revealer-text { padding: 100px 0px 0px 0px; background-position: left center; background-repeat: no-repeat; background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%,rgba(255,255,255,1) 100%); /* W3C */ } .revealer a.reveal span.revealer-text:before { font-family: "FontAwesome"; font-style: normal; font-weight: normal; padding-right: 0.5rem; } @media(min-width: 768px) and (max-widyh: 991.98px) { .revealer a.reveal span.revealer-text { padding: 50px 0px 0px 0px; } } /* Revealer (Covered State) */ .revealer.covered a.reveal { position: absolute; bottom: 0px; left: 0px; } .revealer.covered a.reveal span.revealer-text:before { content: "\f078"; } /* Revealer (Revealed State) */ .revealer.revealed a.reveal span.revealer-text { background: none; padding: 10px 0 0 0; } .revealer.revealed a.reveal span.revealer-text:before { content: "\f077"; } .revealer.revealed a.reveal span.fade { display: none; } /* Search Page */ #searchResults .catalogue-items > .row { margin-bottom: -0.5rem; } @media (min-width: 768px) { #searchResults .catalogue-items > .row { margin-bottom: -1.5rem; } } #searchResults .search-product-group:not(:last-child) { margin-bottom: 1rem; } #searchResults .search-product-group .feature-title::before { border-radius: 0.25rem 0 0 0.25rem; } /* Related Card */ .search-results2 .search-related-card .sub-title { font-family: "Lato", sans-serif; font-size: 1.1rem; font-weight: 600; display: block; margin-bottom: 10px; } .search-results2 .search-related-card .card-header { background-color: #F2F2F2; } /* Related Card header */ .search-results2 .search-related-card .card-header a:hover { text-decoration: underline; } /* Related Groups */ .search-results2 .search-related-card .related-group .related-item, .search-results2 .search-related-card .related-group ul { margin-bottom: 0px; } .search-results2 .search-related-card .related-group ul.fa-ul { margin-left: 1.8rem; } .search-results2 .search-related-card .related-group li:not(:last-child) { margin-bottom: 10px; } .search-results2 .search-related-card .related-group a { color: inherit; } .search-results2 .search-related-card .related-group a span:hover { text-decoration: underline; } .search-results2 .search-related-card .related-group .related-item:last-of-type, .search-results2 .search-related-card .related-group a:last-of-type { margin: 0; } .search-results2 .search-related-card .related-group:not(:last-of-type) { border-bottom: solid 1px #E0E0E0; margin-bottom: 20px; padding-bottom: 20px; } .search-results2 .search-related-card .related-group.faq a:not(:last-of-type) { margin-bottom: 15px; padding-bottom: 15px; border-bottom: solid 1px #E0E0E0; } /* Price Promise */ .search-results2 .search-related-card .price-promise-title { color: #192c46; } /* Icons */ .search-results2 .search-related-card .fa-file-pdf { margin-top: 1px; margin-right: 8px; } .search-results2 .search-related-card .fa-question-circle { margin-top: 1px; margin-right: 8px; color: #2A405E; } .search-results2 .search-result-ranking > span { white-space: nowrap; color: #22B154; } .search-results2 .search-result-ranking .rank-label { color: rgba(0,0,0,0.5); } /* Search Result Items */ .search-item { border: 1px solid #BBBBBB; border-bottom-width: 1px; border-left-color: #BBBBBB !important; border-right-color: #BBBBBB !important; border-top-color: #BBBBBB !important; font-family: "Lato", sans-serif; border-radius: 0.25rem; position: relative; display: flex; padding: 8px; background-color: #FFFFFF; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; } @media(max-width: 767.98px) { .search-item { border-bottom-color: #BBBBBB !important; } } @media(min-width: 768px) { .search-item { flex-direction: column; padding: 0; border-bottom-width: 3px; padding: 0; } } .search-item .content-body { display: flex; flex-flow: column; padding: 0; min-width: 0; } @media(min-width: 768px) { .search-item .content-body { padding: 0 1rem 1rem 1rem; } } .search-item .rank { border-radius: 50%; color: #FFFFFF; display: block; width: 35px; height: 35px; position: absolute; top: -10px; left: -10px; font-size: 0.85rem; font-weight: bold; } .search-item .image { padding: 1rem; background: #FFFFFF; overflow: hidden; position: relative; border-radius: .25rem .25rem 0 0; } @media (max-width: 767.98px) { .search-item .image { width: 25%; display: flex; align-items: center; justify-content: center; margin-right: 15px; flex-shrink: 0; padding: 0; } } @media (max-width: 575.98px) { .search-item .image { width: 20%; } } @media(min-width: 768px) { .search-item .image .image-wrapper { width: 100%; padding-top: 60%; position: relative; } .search-item .image img { max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); transition: ease-in-out .4s; } } @media(max-width: 767.98px) { .search-item .image img { max-height: 70px; padding: 0 !important; max-width: 100%; height: auto; width: auto; } } .search-item .item-info .title-wrapper .item-title { font-weight: 600; line-height: 1.1rem; display: block; } @media(max-width: 767.98px) { .search-item .item-info .title-wrapper .item-title { font-size: 12px; line-height: 1.2; } } .search-item .title-wrapper { word-break: break-word; min-width: 0px; } @media(min-width: 768px) { .search-item .title-wrapper { width: 100%; } } .search-item .title-wrapper a { display: block; } .search-item .title-wrapper .date-added { display: block; font-size: 0.875rem; font-weight: 400; margin-bottom: 5px; } .search-item .item-code { font-size: 0.75rem; font-weight: bold; line-height: normal; color: #8D8D8D; display: flex; } .search-item .alternatives { font-size: 0.75rem; text-decoration: underline; } .search-item .order-only-stock-info { margin: 0.75rem 0; } .search-item .order-only-stock-info > span { display: block; } .search-item .stock { font-size: 0.75rem; line-height: 0.9rem; } @media(min-width:768px){ .search-item .stock { font-size: 0.9rem; } } .search-item .item-info { display: flex; align-items: center; flex-grow: 1; } @media(min-width: 768px) { .search-item .item-info { flex-direction: column; align-items: flex-start; } } .search-item .item-info .found-in { margin-left: 0.25rem; padding-left: 0.25rem; border-left: 2px solid rgba(0,0,0,0.25); } .search-item .item-info .breadcrumb-link { font-size: 0.75rem; font-weight: 600; margin-top: 0.25rem; } .search-item .item-info .breadcrumb-link ul { margin: 0; padding: 0; padding-left: 10px; list-style-type: none; } .search-item .item-info .breadcrumb-link ul li { list-style: disc; color: #4C4C4C; } .search-item .item-info .breadcrumb-link ul li a { text-decoration: underline; } /* Emulate fa-fw only for search Items */ .search-item .item-info .item-description { font-size: 0.875rem; position: relative; } .search-item .item-info .item-description.fade-description { max-height: 45px; overflow: hidden; } .search-item .price-info { margin-left: auto; width: 80px; flex-shrink: 0; } @media(min-width: 768px){ .search-item .price-info { margin-left: 0px; width: 100%; margin-top: auto; padding-top: 1rem; border-top: 1px solid rgba(0,0,0,0.25); } } .search-item .price-info .price-uom { font-weight: 700; } .search-item .price-info .price-uom span { display: block; } .search-item .price-info .price-uom .from, .search-item .price-info .price-uom .to { text-transform: uppercase; font-size: 0.65rem; line-height: 1rem; color: #8D8D8D; } .search-item .price-info .price-uom .price-lbl { font-size: 0.75rem; } .search-item .price-info .price-uom .price { font-size: 1.25rem; line-height: 1.3rem; flex-grow: 1; } @media(max-width: 575.98px) { .search-item .price-info .price-uom .price { font-size: 1rem; } } .search-item .price-info .price-uom .uom { font-size: 0.65rem; margin: 0; line-height: 1.2; text-transform: uppercase; color: #8D8D8D; font-weight: 600; } @media(min-width: 768px) { .search-item .price-info .price-uom .price { margin-right: 0.2rem; } } .search-item .btn { min-width: 100%; } @media(min-width: 768px) { .search-item .btn { min-width: 100px; } } /* Hazardous Item */ .search-item .hazardous-icon { visibility: visible !important; position: absolute; bottom: -3px; left: 50%; transform: translateX(-50%); } /* Search in the header */ .nav-header-content .search-header { background: #FFFFFF; border-radius: 4px; } .nav-header-content .search-header input, .nav-header-content .search-header input:focus { background: #F2F2F2; border: solid 1px #E0E0E0; border-right: 0px; } .nav-header-content .search-header input::placeholder { color: #6c757d; font-size: 95%; } .nav-header-content .search-header .search-box-btn { } .search-header .clear-search { border-left: 0px; pointer-events: none; } .search-header .clear-search i { visibility: hidden; } .search-header .clear-search.active { border-left: 1px solid #E0E0E0; pointer-events: auto; } .search-header .clear-search.active i { visibility: visible; } .search-header .ui-textinput { flex: 1 1 auto; } .search-header .ui-textinput input { height: 100%; } .search-header input:focus::placeholder { color: transparent; } /* Search Dropdown for smaller devices */ .search-dropdown { width: 100%; background: #FFFFFF; border-bottom: solid 1px #E0E0E0; } .search-dropdown input { background: #F2F2F2 !important; padding: .55rem .75rem; border-right: none; } .search-dropdown input, .search-dropdown input:focus { color: #4C4C4C; border-color: #E0E0E0; } /* Search Box Button */ .search-box-btn { min-height: 36px; padding: 0.5rem 0.75rem !important; background: #F2F2F2; border: solid 1px #E0E0E0; color: #4C4C4C; } .search-box-btn:hover { color: #2A405E; } /* Header */ .shop-by-brand .header { position: relative; } /* Shop By Brand Alphabet Box */ .shop-by-brand .alphabet-box, .shop-by-brand .alphabet-box:focus { background-color: #F5F5F5; border-radius: .25em; border: 2px solid transparent !important; padding: 4px; display: block; width: 100%; text-align: center; } .shop-by-brand .alphabet-box.active { background-color: #2A405E; color: #FFFFFF; } .shop-by-brand .alphabet-box[disabled] { opacity: 0.5; } .shop-by-brand .alphabet-box:not([disabled]):hover { border: 2px solid #2A405E; cursor: pointer; } @media(min-width: 992px) { /* Our Catalogues Page */ .shop-by-brand .header h1 { font-size: 2.75rem; } } /* Brand Links */ .brand-link a { background-color: #FFFFFF; display: block; border: solid 1px #E0E0E0; border-radius: .25em; padding: 10px; } /* Pager */ .shop-by-brand .pager a { display: block; } .shop-by-brand .pager .page-item-ellipses { display: none; } @media(min-width: 1200px) { .shop-by-brand .pager .page-item-ellipses { display: block; } } /* Back Button */ .shop-by-brand .back-button { position: absolute; left: 0px; top: 50%; transform: translateY(-50%); } /* Product Links */ @media(min-width: 992px){ .shop-by-brand .associated-item .price-info .price-uom .price-wrapper { display: block; } } @media(min-width: 1500px){ .shop-by-brand .associated-item .price-info .price-uom .price-wrapper { display: inline-block; } } .sku-attributes h3 { font-size: 1.2rem; font-weight: 600; } .sku-attributes table { width: 100%; } .sku-attributes table tr:not(:last-child) td { border-bottom: 1px solid rgba(0,0,0,0.15); } .sku-attributes table td { padding: 5px 0px; } .sku-attributes table td.attribute-name { font-weight: 600; padding-right: 1.5rem; } @media(min-width: 992px) { .sku-attributes table td.attribute-name { width: 50%; } } /* Carousel Container */ @media(max-width: 767.98px) { .sku-detail-slider { margin-bottom: 2rem; } } .sku-detail-slider .carousel-inner { margin: 0 auto; } /* Carousel Items */ .sku-detail-slider .carousel-items-ct { display: flex; flex-wrap: wrap; justify-content: center; } .sku-detail-slider .carousel-item.active { display: block; } .sku-detail-slider .carousel-item a { margin-right: 18px; } .sku-detail-slider .carousel-item a:last-of-type { margin-right: 0; } .sku-detail-slider .carousel-item img { border: solid 1px #E0E0E0; border-radius: .25em; } @media(max-width: 348.98px) { .sku-detail-slider .carousel-item a { margin-right: 12px; } } /* Carousel Controls */ .sku-detail-slider .carousel-control-next, .sku-detail-slider .carousel-control-prev { color: inherit; width: auto; } .sku-detail-slider .carousel-control-prev { left: -30px; } .sku-detail-slider .carousel-control-next { right: -30px; } @media(max-width: 575.98px) { .sku-detail-slider .carousel-control-prev { left: -20px; } .sku-detail-slider .carousel-control-next { right: -20px; } } /* SKU Details */ .sku-details h1 { margin: 0 0 5px 0; font-size: 1.7rem; color: #192C46; } .sku-details .code { color: #8d8d8d; font-weight: 700; } .sku-details .hazardous-icon i.fa { text-align: center; width: 1.25em; } /* Emulate fa-fw only for Sku Details View */ .sku-details .hazardous-label { display: inline-block !important; } /* SKU Image */ .sku-details-image { margin-bottom: 1.5rem; display: flex; justify-content: center } /* SKU Info */ .sku-details .description { margin-top: 20px; padding-top: 20px; border-top: solid 1px #E0E0E0; } /* SKU Pricing */ .sku-details .price { font-size: 2rem; line-height: 2rem; font-weight: 700; margin-right: 5px; color: var(--clr-secondary); } /* Bulk Savings */ .bulk-saving { font-weight: 700; color: #192C46; } /* sku Quantity - Job Ref - Stock */ .sku-details .price-lbl { display: block; } .sku-details .price-saving { border-bottom: solid 1px #E0E0E0; margin-bottom: 20px; padding-bottom: 20px; } .sku-details .basket-controls { margin-top: 20px; padding-top: 20px; border-top: solid 1px #E0E0E0; } .sku-details .basket-controls #itemBasketQuantityMessage { font-weight: 600; } /* Basket Adder Validation */ .basket-adder-validation { font-weight: 600; } /* Sku Status */ .sku-details .stock-info-container { font-size: 0.75rem; } .sku-details .stock-info-container .stock-status { font-size: 1.1rem; } .sku-details .stock-info-container .stock-status-ct .title { font-weight: 700; } .stock-info-container .alert { color: #4C4C4C; } /* SKU Attributes */ .sku-details .sku-attributes { margin-top: 20px; } /* Request Price */ .sku-details .request-price { } .sku-details .request-price .btn { display: block; width: 100%; } .sku-details .request-price .price-requested { font-weight: 600; } /* No Results Message */ .catalogue-items.filterable .no-results { text-align: center; padding: 4rem 0; background: #FFFFFF; } .catalogue-items.filterable .no-results h2 { font-size: 2rem; margin-bottom: 1rem; } .catalogue-items.filterable .no-results .lead { font-size: 1rem; margin: 0px; } @media(min-width: 768px){ .catalogue-items.filterable .no-results h2 { font-size: 3rem; font-weight: bold; } .catalogue-items.filterable .no-results .lead { font-size: 1.5rem; } } /* Grid Switcher */ .catalogue-items.filterable .switcher-icons { visibility: hidden; } @media(min-width: 1500px){ .catalogue-items.filterable .grid-view-switcher:not(.invisible) .switcher-icons { visibility: visible; } } /* ADD MIN WIDTH TO FLEX ITEMS AND ADD DIV AROUND ICONS AND IMAGES AND DIV AROUND SKU INFO */ /* Display / Hide product sky container once fontawesome has loaded */ .fontawesome-i2svg-active .product-sku-container { display: block; } .product-sku-container .sku-icons .pdf-icon, #myFavourites .sku-icons .pdf-icon { display: none !important; } /* Hide PDF column wheen there are no documents */ .product-sku-container .has-documents .sku-icons .pdf-icon, #myFavourites .has-documents .sku-icons .pdf-icon { display: flex !important; } /* Sku Items */ .sku-item { position: relative; background: #FFFFFF; border: solid 1px #E0E0E0; display: flex; text-align: left; border-radius: .25rem; } .sku-item:not(:last-child) { margin-bottom: .5rem; } @media (min-width: 576px) { .sku-item { display: flex; } } @media (min-width: 1200px) { .sku-item { align-items: stretch; } .sku-item:not(:last-child) { margin-bottom: 4px; } .sku-item > div { align-items: center; } .sku-item > div:not(.sku-list-quantity-container) { margin-right: 0; } } /* Has Alternatives */ .sku-item.has-alternatives .sku-list-quantity-container { display: none; } .sku-item.has-alternatives .pricing-ct { margin-right: 0; } .sku-item .content-ct { padding: 10px; flex-grow: 1; display: flex; } @media(min-width: 1200px) { .sku-item .content-ct { padding: 0; align-items: stretch; } } /* Generic padding & border */ @media (min-width: 1200px) { .sku-item .pad-bor { padding: 5px 10px; border-right: solid 1px #E0E0E0; } } /* Rank */ .sku-item .rank-container { position: absolute; top: 50%; left: 0px; transform: translate(-50%, -50%); z-index: 1; } .sku-item .rank-container .rank { background: var(--clr-secondary); border-radius: 50%; color: #FFFFFF; width: 22px; height: 22px; font-size: 0.65rem; border: 2px solid #FFFFFF; box-shadow: 2px 2px 2px rgba(0,0,0,0.25); } @media(min-width: 1200px) { .sku-item .rank-container { position: relative; top: auto; left: auto; transform: none; order: -1; padding-left: 1rem; } .sku-item .rank-container .rank { border: none; box-shadow: none; font-weight: bold; } } .sku-item .sku-list-image { position: relative; align-self: flex-start; } @media (min-width: 1200px) { .sku-item .sku-list-image { padding: 5px; } } @media(max-width: 1199.98px) { .sku-item .sku-list-image .pdf-icon { margin-top: 10px; text-align: center; } .sku-item .sku-list-image .pdf-icon .fa-file-pdf { color: #2A405E; } } /* Request Price */ .sku-item .request-price { font-size: .7rem; } .sku-item .request-price .btn { font-size: .7rem; } /* Sku Icons */ .sku-item .sku-icons { display: flex; align-items: center; justify-content: center; flex-shrink: 0; flex-direction: column; width: 50px; padding: 5px 10px; border-left: solid 1px #E0E0E0; } @media (min-width: 768px) { .sku-item .sku-icons { flex-direction: row; width: auto; padding: 10px; } } @media (min-width: 1200px) { .sku-item .sku-icons { padding: 0; border-left: none; } } @media(min-width: 1200px) { .sku-item .sku-icons .edit-icon { display: none; } .sku-item .sku-icons > div { padding: 5px !important; width: 52px; } .sku-item .sku-icons.action-icons .icon { border-left: solid 1px #E0E0E0; border-right: none; } } .sku-item .sku-icons .fa-file-pdf, .sku-item .sku-icons .fa-star { color: inherit; } .sku-item .sku-icons .icon-text { display: none; } @media(min-width: 576px) and (max-width: 1199.98px) { .sku-item .sku-icons .price-icons { width: 41px; } } .sku-item .hazardous-icon { visibility: visible !important; position: absolute; top: 38px; left: 50%; transform: translateX(-50%); z-index: 1; } @media(min-width: 1200px) { .sku-item .hazardous-icon { bottom: -2px; top: auto; } } .sku-item .hazardous-icon .fa-triangle { text-shadow: -1px -1px 0px #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF; } .sku-item .hazardous-icon.invisible > div { visibility: hidden; } .sku-item .hazardous-icon .hazardous-label .haz-ous { display: none !important; } .sku-item .sku-icons .icon-text { margin-top: -3px; } @media (min-width: 768px) { .sku-item .sku-icons .icon-text { display: block !important; } } @media (min-width: 1200px) { .sku-item .sku-icons.action-icons { padding-left: 0px; } .sku-item .sku-icons.action-icons .pad-bor:last-child { border-right: none; } .sku-item .sku-icons .icon-text { margin-top: 0px; } } .sku-item .sku-icons > div span { font-size: 10px; font-weight: 600; } .sku-item .sku-icons .info-icon { align-items: center; } @media(max-width: 767.98px) { .sku-item .sku-icons .info-icon { display: none; } } @media(min-width: 768px) { .sku-item .sku-icons .icon:not(:last-of-type) { margin-right: 15px; } .sku-item .sku-icons .icon.favourite-icon { width: 32px; } } @media(min-width: 1200px) { .sku-item .sku-icons .icon.favourite-icon { width: 52px; } } @media (max-width: 1199.98px) { .sku-item .sku-icons .icon.pdf-icon { margin-right: 0; } } @media (min-width: 576px) { .sku-item .sku-icons > div { text-align: center; display: flex; flex-direction: column; justify-content: center; } } @media (min-width: 1200px) { .sku-item .sku-icons { font-size: 1.1rem; align-items: stretch; } .sku-item .sku-icons:not(.action-icons) { order: -1; } .sku-item .sku-icons div { margin-right: 0px !important; } } .sku-item .code-uom-ct { display: flex; align-items: center; color: #8D8D8D; margin-bottom: 5px; flex-wrap: wrap; } .sku-item .code-uom-ct .separator { margin: 0 5px; } .sku-item .code-uom-ct .sku-list-code { margin-bottom: 0; } .sku-item .code-uom-ct .uom { font-size: 0.75rem; margin: 0; } /* Stock & Pricing Container */ @media (min-width: 576px) and (max-width: 1199.98px) { .sku-item .pricing-ct { text-align: right; } } @media(max-width: 575.98px) { .sku-item .pricing-ct .btn { font-size: .8rem; } } .sku-item .qty-price { flex: 0 0 97px; position: relative; } @media (min-width: 576px) { .sku-item .qty-price { flex: 0 0 110px; } } @media (min-width: 768px) { .sku-item .qty-price { display: flex; flex: 0 0 180px; align-items: center; } .sku-item .pricing-ct { display: flex; flex-basis: 45%; } } @media (min-width: 992px) { .sku-item .qty-price { flex: 0 0 190px; } } @media (min-width: 1200px) { .sku-item .qty-price { flex: 0 0 385px; align-items: stretch; } } /* Sku Code */ .sku-item .sku-list-code { font-size: 0.75rem; color: #8d8d8d; line-height: 1.2em; margin-bottom: 5px; } @media (min-width: 768px) { .sku-item .sku-list-code { margin-bottom: 0; } } /* Job Reference */ .sku-item .sku-list-jobref { font-size: 0.75rem; margin-top: 0.5rem; font-weight: normal; } /* Sku Title */ .sku-item .sku-list-title { font-weight: 700; font-size: 12px; margin-right: 10px; flex-grow: 1; } @media (min-width: 768px) { .sku-item .sku-list-title { display: flex; align-items: center; } } @media (min-width: 992px) { .sku-item .sku-list-title { margin-right: 25px; font-size: 14px; } } @media (min-width: 1200px) { .sku-item .sku-list-title { flex: 1 1 auto; display: flex; margin-right: 0; align-items: stretch; } } @media (min-width: 1500px) { .sku-item .sku-list-title { flex: 1 0 auto; } } .sku-item .sku-list-title .title-code-ct { flex-grow: 1; } .sku-item .sku-list-title .title-code-ct .product-flags { margin-bottom: 8px; } @media (min-width: 768px) { .sku-item .sku-list-title .title-code-ct .product-flags { margin-bottom: 0px; } .sku-item .sku-list-title .title-code-ct { flex: 0 0 55%; } } @media (min-width: 992px) { .sku-item .sku-list-title .title-code-ct { flex: 0 0 71%; } } @media (min-width: 1200px) { .sku-item .sku-list-title .title-code-ct { flex-basis: 73%; justify-content: center; display: flex; flex-direction: column; } } /* Badges */ .sku-item .sku-list-title .badge { font-size: 1em; } @media (min-width: 992px) { .sku-item .sku-list-title .badge { font-size: 0.75em; } } /* Sku Subtitle */ .sku-item .sku-list-subtitle { font-size: 0.75rem; font-weight: 700; margin-bottom: 3px; } .sku-item .sku-list-subtitle a { text-decoration: underline; } .sku-item .sku-list-title .sku-name { font-size: 12px; line-height: 1.2; display: block; } @media (min-width: 992px) { .sku-item .sku-list-title .sku-name { font-size: 14px; } } .sku-item .sku-list-title a { margin-bottom: 5px; display: inline-block; } @media(max-width: 1199.98px) { .sku-item .sku-list-title a { line-height: 1em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal; } } /* Sku Stock */ .sku-item .sku-list-stock { display: flex; align-items: flex-start; flex-wrap: wrap; } @media(min-width: 768px) { .sku-item .sku-list-stock { flex: 1 1 auto; margin-left: 25px; } } @media (min-width: 1200px) { .sku-item .sku-list-stock { align-items: center; height: 100%; margin-left: 0; } } /* Status Container */ .sku-item .sku-list-stock .stock-status-ct { width: 100%; } @media (min-width: 992px) { .sku-item .sku-list-stock .stock-status-ct { flex-grow: 1; } } @media (max-width: 767.98px) { .sku-item .sku-list-stock .stock-status-ct .empty-block { display: none !important; } } .sku-item .sku-list-stock .stock-status-ct .stock-info { display: none; font-weight: 500; color: #4C4C4C; font-size: 12px !important; } .sku-item .sku-list-stock .stock-status-ct .stock-info span { font-size: 12px !important; } .sku-item .sku-list-stock .stock-status-ct .fa-question-circle { color: #4C4C4C; } @media(max-width: 991.98px) { .sku-item .sku-list-stock .stock-status-ct .fa-question-circle { display: none; } } .sku-item .sku-list-stock .stock-status-ct a.available-request, .sku-item .sku-list-stock .stock-status-ct span:not(.small) { font-size: 12px; margin-bottom: 0; line-height: 1.1em; } @media (min-width: 992px) { .sku-item .sku-list-stock .stock-status-ct a.available-request, .sku-item .sku-list-stock .stock-status-ct span:not(.small) { font-size: 14px; } } @media(min-width: 992px) { .sku-item .sku-list-stock .stock-status-ct span.title { margin-bottom: 0px; } } @media (min-width: 1200px) { .sku-item .sku-list-stock .stock-status-ct { flex-grow: 1; } .sku-item .sku-list-stock .stock-status-ct a { margin-bottom: 0; } } .sku-item .sku-list-stock .stock-status-ct span.in-stock, .sku-item .sku-list-stock .stock-status-ct span.out-of-stock { margin-bottom: 0; } /* Show Alternatives */ .sku-item .sku-list-stock .show-alternatives { margin-top: 5px; } @media (min-width: 768px) { .sku-item .sku-list-stock .show-alternatives { margin-top: 0; } } /* Pricing Container */ .sku-item .pricing-ct { display: flex; } @media (max-width: 575.98px) { .sku-item .pricing-ct { text-align: right; } } @media (max-width: 1199.98px) { .sku-item .pricing-ct { justify-content: flex-end; } } @media (min-width: 768px) { .sku-item .pricing-ct { margin-right: 15px; flex-grow: 1; } } @media (min-width: 1200px) { .sku-item .pricing-ct { flex: 0 0 140px; align-items: center; margin-left: 0; margin-right: 0; } } /* Sku Price & Pricing Icons */ .sku-item .price-icons { display: flex; } @media (min-width: 1200px) { .sku-item .price-icons a { line-height: 1em; } } .sku-item .price-breaks { display: block; margin-top: 1rem; text-align: right; font-size: 0.75rem; line-height: 0.9em; } .sku-item .price-icons .price-breaks { display: none; } .sku-item .price-uom { align-items: center; line-height: 1.1; } @media (min-width: 1200px) { .sku-item .price-uom { flex-grow: 1; } } .sku-item .price { display: flex; justify-content: space-between; } .sku-item .price span { display: block; flex-grow: 1; } .sku-item .price .price-lbl { font-size: 0.8rem; margin-bottom: 3px; font-weight: 600; color: var(--clr-secondary); } .sku-item .price .sku-price { font-weight: 700; display: flex; align-items: baseline; font-size: 18px; } .sku-item .price .sku-price .value { color: var(--clr-secondary); font-family: "Lato", sans-serif; } .sku-item .pricing-ct.guide-price .price-icons { padding-top: 16px; } @media(min-width: 992px) { .sku-item .price .sku-price { font-size: 1.125rem; } } /* Login for price */ .sku-item .price-restricted { font-size: 14px; } @media (min-width: 1200px) { .sku-item .price-breaks { display: none; } } @media(max-width: 991.98px) { .sku-item .price-uom .sku-weight { display: none; } } /* UOM */ .uom { font-size: 0.85rem; margin-top: 2px; } .duty-label { font-size: 0.85rem; margin-top: 2px; display: block; } /* Job ref overlay */ .sku-item .job-ref-overlay { position: absolute; background: #FFFFFF; z-index: 9; width: 100%; left: 0; height: 100%; top: 0; border-radius: .25em; display: none; justify-content: center; align-items: center; } @media(min-width: 1200px) { .sku-item .job-ref-overlay { display: none !important; } .sku-item .jobref-input .save-jobref { display: none; } } .sku-item .job-ref-overlay .qty-price { flex: 0 0 75%; flex-direction: column; align-items: initial; } .sku-item .job-ref-overlay .sku-list-quantity-container { margin-bottom: 0; } .sku-item .job-ref-overlay .sku-list-quantity-container .jobref-input { display: flex; width: 100%; } .sku-item .job-ref-overlay .sku-list-quantity-container .jobref-input .job-ref { border-radius: 0px; } .sku-item .job-ref-overlay .sku-list-quantity-container .jobref-input .save-jobref { border-radius: 0 .25rem .25rem 0; } .sku-item .job-ref-overlay .sku-list-quantity-container .jobref-input .job-ref::placeholder { color: #4C4C4C; opacity: 0.5 } .sku-item .job-ref-overlay .sku-list-quantity-container .sku-list-quantity-container .qty-input { display: none; } /* Quantity - Job Ref */ .sku-item .sku-list-quantity-container { display: flex; justify-content: flex-end; margin-bottom: 5px; position: relative; white-space: nowrap; border-right: none !important; } @media(min-width: 768px) { .sku-item .sku-list-quantity-container { margin-bottom: 0px; order: 1; } } @media(min-width: 1200px) { .sku-item .sku-list-quantity-container { flex-grow: 1; } } .sku-item .sku-list-quantity-container .jobref-input { display: none; } .sku-item .sku-list-quantity-container .job-ref::placeholder { color: #4C4C4C; } .sku-list-quantity-container .qty-input { position: relative; } .sku-list-quantity-container .qty-input input { text-align: center; width: 56px; border-top: 0; border-bottom: 0; border-radius: 0; } .sku-list-quantity-container .qty-ct { flex-shrink: 0; border-radius: .25rem; border: solid 1px #E0E0E0; display: flex; } .sku-item .sku-list-quantity-container.bulk-savings-ct .qty-ct { border-color: #22B154; } .sku-item .sku-list-quantity-container .qty-input input { text-align: center; width: 35px; padding: .375rem; font-size: 12px; } @media(min-width: 992px) { .sku-item .sku-list-quantity-container .qty-input input { width: 56px; padding: .375rem .75rem; font-size: 1rem; } } .sku-item .sku-list-quantity-container.bulk-savings .qty-input { border-color: #22B154; } .sku-list-quantity-container .qty-input .qty-btn { width: 20px; color: #8D8D8D; font-size: 0.875rem; font-weight: 600; cursor: pointer; text-align: center; touch-action: manipulation; } .sku-list-quantity-container .qty-input .qty-btn:focus, .sku-list-quantity-container .qty-input .qty-btn:hover { text-decoration: none; background-color: #F2F2F2; } @media(min-width: 992px) { .sku-list-quantity-container .qty-input .qty-btn { width: 25px; } } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .sku-item .sku-list-quantity-container .job-ref { height: 100%; } } @media (min-width: 1200px) { .sku-item .sku-list-quantity-container { flex: 0 0 245px; margin-top: 0; align-items: center; } .sku-item .sku-list-quantity-container .qty-input { margin-left: 20px; } .sku-item .sku-list-quantity-container .jobref-input { display: block; flex-grow: 1; } } /* Button group inside job ref and qty container */ .sku-item .sku-list-quantity-container .button-group { margin-left: 20px; } /* Remove Icon */ .sku-item .remove { margin-left: 10px; align-self: center; } /* Job Ref Validation */ .sku-item .sku-list-quantity-container .jobref-input .field-validation-error { font-size: 0.8rem; font-weight: bold; white-space: nowrap; } @media (min-width: 1200px) { .sku-item .sku-list-quantity-container .jobref-input .field-validation-error { position: absolute; margin-top: 2px; } } /* SKU lists in modals */ .modal-body .sku-list { margin: -15px; } @media (min-width: 768px) { .modal-body .sku-list { margin: 0px; } } /* SKU Item Results */ @media (min-width: 1500px) { #results .sku-item .sku-list-title { flex: 1 1 auto; } } #results .sku-item .sku-list-title a { -webkit-line-clamp: 1; } @media (min-width: 992px) { #results .sku-item .sku-list-title .title-code-ct { flex-basis: 56%; } } @media (min-width: 1200px) and (max-width: 1365px) { #results .sku-item .sku-list-title .title-code-ct { flex-basis: 61%; } #results .sku-item .sku-list-image.alt { display: none !important; } } @media (min-width: 1500px) { #results .sku-item .sku-list-title .title-code-ct { flex-basis: 69%; } } #results .sku-item .sku-list-image { align-self: unset; } #results .sku-list .feature-title { border-bottom-color: #2A405E; z-index: 2; background: var(--clr-primary-lst-1); } #results .sku-list .feature-title:before { display: none; } #results .sku-list .feature-title .title { background: #2A405E; color: #FFFFFF; padding: calc(0.25rem + 2px) 0.75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 80%; font-size: 0.9rem; } #results .sku-list .feature-title:not(:first-child) { margin-top: 15px; } #results .feature-title:after { border-bottom-color: #2A405E; } @media(min-width: 992px){ #results .sku-list .feature-title .title { font-size: unset; } } #skuSearch { min-height: 1200px; } #skuSearch .instruction { text-align: center; } #skuSearch .search-box { width: 400px; } #skuSearch #searchResult { background: #FFFFFF; } #skuSearch #searchResult #noResultsFound { font-size: 1.7rem; } #skuSearch #searchResult #skuDetails .sku-details > ul { display: none; } /* SKU Thumbnail */ .sku-thumbnail { background: #FFFFFF; width: 55px; height: 55px; display: block; border: solid 1px #E0E0E0; position: relative; } .sku-thumbnail > img, .sku-thumbnail > div { display: block; background-color: #FFFFFF; width: 53px; height: 53px; } @media (min-width: 1200px) { .sku-thumbnail { width: 70px; height: 70px; border: none; } .sku-thumbnail > img, .sku-thumbnail > div { width: 70px; height: 70px; } } .sku-thumbnail > div { background-position: center center; background-size: contain; background-repeat: no-repeat; } /* SKU List Thumbnail */ .sku-list-image { margin: 0 10px 0 0; } @media (min-width: 1200px) { .sku-list-image { margin: 0; } } .sku-list-image img { border: solid 1px #E0E0E0; padding: 2px; width: 60px; height: auto; } @media (min-width: 1200px) { .sku-list-image { display: flex; align-items: center; } .sku-list-image .sku-thumbnail { order: 1; } } td.sku-list-image { display: table-cell; } /* Basket Specific Styling */ #myBasket .sku-list-image { display: flex; flex-direction: column; align-items: center; } #myBasket .sku-list-image .sku-thumbnail { border: 3px solid #FFFFFF; outline: 1px solid rgba(0,0,0,0.3); outline-offset: -1px; width: auto; height: auto; display: block; } @media (min-width: 1200px) { #myBasket .sku-list-image .sku-thumbnail { border: none; outline: none; } } /* Slick Slide */ .slick-slide { outline: none; } /* Slick Buttons Before */ .slick-prev, .slick-cm-prev, .slick-cm-next, .slick-next { height: 28px; z-index: 1; } /* Slick Buttons Before */ .slick-prev:before, .slick-cm-prev:before, .slick-cm-next:before, .slick-next:before { font-family: 'FontAwesome'; color: #4C4C4C; font-size: 28px; } .slick-prev:before, .slick-cm-prev:before { content: '\f053'; } .slick-next:before, .slick-cm-next:before { content: '\f054'; } /* Hide standard slick buttons on smaller screens */ @media (max-width: 1599.98px) { .slick-ct .slick-prev, .slick-ct .slick-next { display: none !important; } } /* Slick Header */ .slick-header { position: relative; text-align: left; } /* Center slick header when at 576px or more */ @media (min-width: 576px) { .slick-header.sh-xs { text-align: center; } } /* h1 allows space for slick buttons when below 1200 */ @media (max-width: 1199.98px) { .slick-header.sh-xl h1, .slick-header.sh-xl .mtr-head { width: calc(100% - 90px); } } /* Center slick header when at 1200px or more */ @media(min-width: 1200px) { .slick-header.sh-xl { text-align: center; } } /* Custom Slick buttons for smaller screens */ .slick-buttons { position: absolute; right: 0; top: calc(50% - 15px); } .slick-buttons .slick-arrow { background: #FFF; border: solid 1px #E0E0E0; border-radius: 8px; width: 30px; height: 30px; position: relative; font-size: 0; cursor: pointer; } .slick-buttons .slick-arrow:first-of-type { margin-right: 10px; } .slick-buttons .slick-arrow::before { font-size: 14px; } /* Hide slick buttons when at 576px or more */ @media (min-width: 576px) { .slick-buttons.sb-xs { display: none; } } /* Hide slick buttons when at 1200px or more */ @media(min-width: 1600px) { .slick-buttons.sb-xl { display: none; } } /* Slick Arrows - Change to Lines */ .slick-dots { bottom: -35px; } .slick-dots li { width: 25px; height: 3px; } .slick-dots li button { width: 25px; height: 3px; font-size: 0px; padding: 0; } .slick-dots li button::before { width: 25px; height: 3px; color: transparent; background: #B4B4B4; opacity: 1; font-size: 0; } .slick-dots li.slick-active button::before { opacity: 1; color: transparent; background: var(--clr-secondary); } /* Hide carousels by default so images don't show stacked to begin with, show after initialised */ .carousel { display: none; } .slick-hide-default { display: none; } .slick-initialized { display: block; } /* Slick buttons when in a modal */ .modal .slick-arrow { width: auto; height: auto; } .modal .slick-slide img { margin: 0 auto; max-width: 100%; } /* Large Images - Slick Buttons Before */ .modal .large-images .slick-arrow:before { color: #FFFFFF; font-size: 35px; text-shadow: none; opacity: 1; } .modal .large-images .slick-prev:before, .modal .large-images .slick-cm-prev:before { content: '\f137'; } .modal .large-images .slick-prev { top: 100%; left: 50%; transform: translate(-125%, 100%); } @media (min-width: 576px) { .modal .large-images .slick-prev { left: -80px; top: 50%; transform: translate(0, -50%); } } .modal .large-images .slick-cm-next:before, .modal .large-images .slick-next:before { content: '\f138'; } .modal .large-images .slick-next { top: 100%; left: 50%; right: auto; transform: translate(25%, 100%); } @media (min-width: 576px) { .modal .large-images .slick-next { right: -80px; left: auto; top: 50%; transform: translate(0, -50%); } } /* Equalise heights on items in a slick carousel */ .eq-slick .slick-track { display: flex; } .eq-slick .slick-slide { height: auto; } /* FlexBox Slick Carousel */ .flex-slick .slick-track { display: flex; align-items: center; } .flex-slick .slick-track .slick-slide { height: auto; padding: 0px; display: flex; flex-direction: column; } .eq-height-slick .slick-track { align-items: unset; } .eq-height-slick .slick-track .slick-slide > div { height: 100% !important; } .eq-height-slick .slick-track .slick-slide > div .content-card { height: 100% !important; } /* Social Wall */ .social-wall-wrapper .title-wrapper { text-align: center; margin-bottom: 2rem; } .social-wall-wrapper .title-wrapper h1 { margin: 0px; } .social-wall-wrapper .title-wrapper span { display: block; } .social-wall-wrapper .title-wrapper .instagram-handle { font-size: 1.4rem; margin-top: 10px; } .social-wall-wrapper .title-wrapper .instagram-handle a { color: var(--clr-secondary); } .pt-6 { padding-top: 4.5rem !important; } .special-offers-container { padding-top: .5rem; } /* Special Offers Product Card */ .special-offers-container .prod-card { margin-bottom: 5px; padding: 0; flex-grow: 1; } .special-offer .prod-card .prod-image { position: relative; padding-top: calc(2 / 3 * 100%) !important; overflow: hidden; padding: 0; } .special-offer .prod-card img { position: absolute; object-fit: contain; top: 0; background: #FFFFFF; transform: translateX(-50%); left: 50%; padding: 0.5rem; height: 100%; width: 100%; } @media(min-width: 992px) { .special-offer .prod-card img { padding: 1.5rem; } } .special-offers-container .prod-card .prod-image { margin: 0; } .special-offers-container .prod-card .catalogue-item-details { padding: 0.75rem 1rem; } .special-offers-container .prod-card .catalogue-item-details .description { margin-top: 10px; margin-bottom: 0; } .special-offers-container .catalogue-item-card-wrapper .date-added { margin-top: 5px; } .special-offers-container .noticeboard-card a { color: #4C4C4C; } .special-offer .prod-card .prod-details { padding: .5rem; margin: 0px; display: flex; flex-direction: column; flex-grow: 1; } .special-offer .prod-card .prod-details .price { margin-top: auto; } @media(min-width: 768px) { .special-offer .prod-card .prod-details { padding: 1.25rem; } } @media (max-width: 767.98px) { .prod-card .description { display: none; } } @media(min-width: 1200px) { .special-offers-container .noticeboard-card { margin-top: 6px !important; } } /* Offer Date */ .special-offers-container .offer-date { color: #8D8D8D; display: block; text-align: center; text-transform: uppercase; margin-top: auto; } .special-offers-container .offer-date.today { color: #008AFF; font-weight: 600; } @media (max-width: 575.98px) { .special-offers-container .offer-date { margin-bottom: 0; } } #specialOffersWrapper { transition: height 0.25s; display: none; } #specialOffersWrapper.initialised { display: block; } @media (max-width: 767.98px) { .prod-card.noticeboard-card .noticeboard-edition { font-size: 12px; padding: 4px; } .special-offers-container .offer-date { font-size: 70%; } } /* Noticeboard Promotion */ .prod-card.noticeboard-card { background: #FFFFFF; border: 10px solid var(--clr-secondary); overflow: visible; margin-top: 3%; } .prod-card.noticeboard-card:hover { border-color: var(--clr-secondary-lt); } .prod-card.noticeboard-card .just-landed-badge { margin: 0 auto 0.5rem auto; } .prod-card.noticeboard-card h3 { font-weight: bold; } .prod-card.noticeboard-card h4 { font-weight: bold; color: var(--clr-secondary); } .prod-card.noticeboard-card p { margin-bottom: 0.25rem; } .prod-card.noticeboard-card .noticeboard-link { color: var(--clr-secondary); text-decoration: underline; } .prod-card.noticeboard-card .noticeboard-cover { background: #192C46; color: #FFFFFF; font-weight: 600; font-family: "Lato", sans-serif; margin: 0 auto -35px auto; display: flex; flex-direction: column; } .prod-card.noticeboard-card .noticeboard-cover .cousins-logo { width: 60%; margin: 1rem; } .prod-card.noticeboard-card .noticeboard-cover .noticeboard-cover-image img { width: 50%; opacity: 0.2; } .prod-card.noticeboard-card .noticeboard-cover .noticeboard-cover-title { margin-top: auto; padding: 0.75rem; line-height: 0.8rem; } .prod-card.noticeboard-card .noticeboard-cover .noticeboard-cover-date { color: var(--clr-secondary); } .prod-card.noticeboard-card a { padding: 0.5rem; position: relative; } .prod-card.noticeboard-card img { transform: none; } .prod-card.noticeboard-card .month-edition { background-color: var(--clr-secondary); color: #FFFFFF; border-radius: 30px; width: 95%; position: absolute; top: 5px; left: 50%; transform: translate(-50%, -65%); margin: 0 auto; font-size: 0.813rem; line-height: .8em; } .prod-card.noticeboard-card .month-edition .month { display: block; font-weight: 600; margin-bottom: 2px; } .prod-card.noticeboard-card .just-landed-badge { width: 90%; position: absolute; top: 0px; left: 50%; transform: translate(-50%, -65%); margin-bottom: 0px; } .prod-card.noticeboard-card h3 { font-size: 0.75rem; display: none; } .prod-card.noticeboard-card h4 { font-size: 0.75rem; } .prod-card.noticeboard-card .dive-in { display: none; } .prod-card.noticeboard-card p { line-height: .85rem; font-size: 11px; } .prod-card.noticeboard-card .noticeboard-link { font-size: 0.625rem; } .prod-card.noticeboard-card .noticeboard-cover { display: none; font-size: 0.6rem; width: 100px; height: 130px; } @media(min-width: 420px){ .prod-card.noticeboard-card .dive-in { display: inline; } } @media(min-width: 460px){ .prod-card.noticeboard-card h3 { display: block; } } @media(min-width: 576px){ .prod-card.noticeboard-card .month-edition { top: 7px; } .prod-card.noticeboard-card p { display: none; } .prod-card.noticeboard-card h3 { font-size: 0.8rem; } } @media(min-width: 768px){ .prod-card.noticeboard-card .month-edition { width: 95%; line-height: 1.5; top: -1px; } .prod-card.noticeboard-card .month-edition .month { display: inline; margin-bottom: 0px; } .prod-card.noticeboard-card p { display: block; } } @media(min-width: 740px){ .prod-card.noticeboard-card .dive-in { display: inline; } } @media(min-width: 992px){ .prod-card.noticeboard-card h3 { font-size: 1rem; } .prod-card.noticeboard-card p { line-height: 1rem; font-size: 12px; } .prod-card.noticeboard-card .month-edition { font-size: 1rem; top: 0; } .prod-card.noticeboard-card .noticeboard-link { font-size: 1rem; } } @media(min-width: 1200px){ .prod-card.noticeboard-card { margin-bottom: 15px !important; margin-top: 12%; } .prod-card.noticeboard-card .just-landed-badge { width: 70%; } .prod-card.noticeboard-card h3 { display: none; } .prod-card.noticeboard-card p { line-height: .85rem; font-size: 11px; } .prod-card.noticeboard-card a { padding-top: 15px; } .prod-card.noticeboard-card .month-edition { width: 87%; } .prod-card.noticeboard-card .noticeboard-link { font-size: .85rem; margin-bottom: 1rem; } .prod-card.noticeboard-card .noticeboard-cover { display: block; font-size: 0.8rem; width: 130px; height: 175px; } } @media(min-width: 1366px){ .prod-card.noticeboard-card h3 { font-size: 1.2rem; } .prod-card.noticeboard-card h4 { font-size: 1rem; } .prod-card.noticeboard-card .noticeboard-cover { display: block; font-size: 0.8rem; width: 130px; height: 175px; } } /* Slick Overrides */ #specialOffersWrapper .slick-track { display: flex; } #specialOffersWrapper .slick-slide { padding: 0px 15px; height: auto; } #specialOffersWrapper .slick-slide > div { height: 100%; } #specialOffersWrapper .slick-slide .special-offer { height: 100%; display: flex !important; flex-direction: column; } #specialOffersWrapper .slick-slide .special-offer .prod-card { flex-grow: 1; } #specialOffersWrapper .slick-slide .special-offer .prod-card .prod-details { display: flex; flex-direction: column; flex-grow: 1; } #specialOffersWrapper .slick-slide .special-offer .prod-card .prod-details .price { margin-top: auto; } #specialOffersWrapper .slick-slide .special-offer .offer-date { margin: 0px; margin-top: auto;} #specialOffers .special-offer { display: flex; flex-direction: column; flex-shrink: 0; margin-bottom: 25px; } /* Adjust width of cards responsively */ #specialOffers .special-offer { width: 128px; } #specialOffers .special-offer:not(:last-child) { margin-right: 12px; } @media (min-width: 768px) { #specialOffers .special-offer { width: calc((100% - 24px)/3.5); } #specialOffers .special-offer:not(:last-child) { margin-right: 12px; } } @media (min-width: 1200px) { #specialOffers .special-offer { width: calc((100% - 80px)/4.5); } #specialOffers .special-offer:not(:last-child) { margin-right: 20px; } } /* Stock Finder Icon */ .stock-finder-icon { line-height: 2em; } .stock-finder-icon .fa-circle { color: var(--clr-secondary); } .stock-finder-icon .fa-stack-1x { font-size: 0.75em; line-height: 2em; } /* Stock Finder Sections */ .stock-finder-section h5 { font-weight: 600; color: var(--clr-secondary); } .stock-finder-section:not(:last-child) { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px dotted rgba(0,0,0,0.25); } /* In Stock */ .in-stock, .in-stock i { color: #22b154; } /* Out Of Stock */ .out-of-stock, .out-of-stock i { color: #AE262D; } /* Stock Expected */ .stock-expected, .stock-expected a, .stock-expected i { color: #AE262D; } /* Obsolete */ .obsolete, .obsolete i { color: #AE262D; } /* Available On Request */ .available-request, .available-request i { color: #22B154; } /* Navigation Wrapper */ .nav-wrapper { background: #2A405E; border-bottom: 1px solid rgba(255,255,255,0.1); } /* Nav links */ .nav-items li > a { color: inherit; } .nav-items > li > a { font-weight: 600; text-transform: uppercase; font-size: 0.65rem; flex-direction: row; } .nav-items .top-level { font-size: 1.1rem; padding: 0 15px; font-family: 'Nunito', sans-serif; font-weight: 600; color: #FFFFFF; } .nav-items .top-level:hover { color: #FFFFFF; } /* Navigation Sub Items */ .sub-nav > .sub-items > li a:hover { text-decoration: underline; } /*********** Swipe in Menu ***************/ /* Navigation Wrapper */ #MainNavigationSwipeIn { font-family: 'Lato', sans-serif; display: flex; position: fixed; width: 100%; max-width: 400px; transform: translateX(-100%); height: 100%; top: 0; left: 0; bottom: 0; padding: 0; z-index: 9999; color: #FFFFFF; transition: all .6s ease; } #quickNavigationWrapper { font-size: 0.8125rem; letter-spacing: 0.025rem; } @media(min-width: 992px) { #MainNavigationSwipeIn { transform: translateX(calc(-100% + 40px)); } } /* Shop By Category Button */ .navbar-left-swipe { cursor: pointer; display: flex; align-items: center; width: 40px; background: #55667E; box-shadow: 1px 1px 10px rgba(0,0,0,.2); font-weight: bold; } .navbar-left-swipe:hover { background: #66758b; } .navbar-left-swipe .content-ct { transform: rotate(-90deg) translateX(-50%); white-space: nowrap; transform-origin: left center; margin-left: 18px; } .navbar-left-swipe .content-ct span { font-family: 'Lato', sans-serif; letter-spacing: 1px; } /* Stop body scrolling when nav is open */ body.nav-open { height: 100vh; overflow-y: hidden; } /* Navigation Open */ body.nav-open #MainNavigationSwipeIn { transform: translateX(0px); } body.nav-open #MainNavigationSwipeIn i.fas { transform: rotate(180deg); } /* Remove container styling on smaller screen */ #MainNavigationSwipeIn .container { padding: 0px; margin: 0px; max-width: none; height: 100%; } /* Nav Items Container */ #MainNavigationSwipeIn .nav-items { display: block; position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; margin: 0 auto; height: auto; overflow-y: auto; } /* Nav Links */ #MainNavigationSwipeIn .nav-items a { padding: 16px 25px; position: relative; display: block; } #MainNavigationSwipeIn .nav-items a:hover { text-decoration: underline; } #MainNavigationSwipeIn .nav-items > li > a { padding-left: 45px; border-bottom: 1px solid rgba(255,255,255,0.1) !important; font-weight: 600; } #MainNavigationSwipeIn .nav-items > li { position: relative; } /* Parent Navigation Items */ #MainNavigationSwipeIn .dept-bar:before { content: ""; border-left-style: solid; border-left-width: 8px; position: absolute; top: 0; left: 0; height: 100%; } #MainNavigationSwipeIn .nav-items a.parent:after { position: absolute; left: 0px; content: ''; font-family: 'FontAwesome'; font-weight: 600; font-size: 0.75rem; } /* Switch to minus sign when active */ #MainNavigationSwipeIn .nav-items > li.active.parent > a { border-color: transparent !important; text-decoration: none; } #MainNavigationSwipeIn .nav-items li.active > .parent:after { content: ''; } #MainNavigationSwipeIn .nav-items > li.active > a { font-weight: 600; } /* First Level */ #MainNavigationSwipeIn .nav-items > li > .parent:after { left: 25px; } #MainNavigationSwipeIn .nav-items .sub-nav { background: rgba(0,0,0,0.15); display: none; overflow: hidden; padding-left: 40px; padding-top: 10px; padding-bottom: 10px; } #MainNavigationSwipeIn .nav-items li.active > a { font-weight: 600; } #MainNavigationSwipeIn .nav-items > li.active .sub-nav { display: block; overflow: auto; } #MainNavigationSwipeIn .nav-items > li:not(.quicklinks) li a { padding-top: 5px; padding-bottom: 5px; line-height: 1.4em; background: none; } #MainNavigationSwipeIn .nav-items > li:not(.quicklinks) li a:after { top: 5px; } /* Hide / Show Sub Items When Clicked */ #MainNavigationSwipeIn .nav-items li .sub-nav li .sub-items { max-height: 0px; overflow: hidden; padding-left: 25px; } #MainNavigationSwipeIn .nav-items li .sub-nav li.active > .sub-items { max-height: 100%; overflow: auto; } /******** Change icon colour when sub nav is open ********/ /* Batteries Department - Red */ #MainNavigationSwipeIn .dept-1 li.active > .parent:after { color: #E53123; } /* Books and Catalogues Department - Grey */ #MainNavigationSwipeIn .dept-9 li.active > .parent:after { color: #6D6B76; } /* Clockparts - Beige */ #MainNavigationSwipeIn .dept-8 li.active > .parent:after { color: #C0A86C; } /* Consumables - Pink */ #MainNavigationSwipeIn .dept-7 li.active > .parent:after { color: #CA176B; } /* Ear Piercing - Green */ #MainNavigationSwipeIn .dept-3 li.active > .parent:after { color: #6E9808; } /* Equipment - Teal */ #MainNavigationSwipeIn .dept-5 li.active > .parent:after { color: #287482; } /* Jewellery, Findings, Chains & Solders - Purple */ #MainNavigationSwipeIn .dept-2 li.active > .parent:after { color: #754C78; } /* Tools - Green */ #MainNavigationSwipeIn .dept-6 li.active > .parent:after { color: #287482; } /* Watch Movements - Light Brown */ #MainNavigationSwipeIn .dept-12 li.active > .parent:after { color: #7E6B4C; } /* Watch Parts & Watch Glasses - Brown */ #MainNavigationSwipeIn .dept-4 li.active > .parent:after { color: #704F26; } /* Watch Straps, Bracelets & Fittings - Orange */ #MainNavigationSwipeIn .dept-10 li.active > .parent:after { color: #FE8415; } /* Watch Straps, Bracelets & Fittings - Mint */ #MainNavigationSwipeIn .dept-14 li.active > .parent:after { color: #1EC988; } /* Hide scrollbar for Chrome, Safari and Opera */ ul#navItems::-webkit-scrollbar { display: none; } /* Hide scrollbar for IE and Edge */ ul#navItems { -ms-overflow-style: none; } /* Menu title and close icon */ .menu-header { position: relative; height: 60px; } .menu-header .menu-title { display: block; background: rgba(0,0,0,0.1); font-size: 1.1rem; padding: 0 45px 0 25px; line-height: 3.75rem; font-weight: 600; } .menu-header .close-menu { position: absolute; top: 0; right: 1px; border: none; background: none; color: inherit; height: 100%; align-items: center; display: flex; padding: 0 23px; } .menu-header .close-menu:hover { color: #DE232A; text-decoration: none; } .menu-header .close-menu, .menu-header .close-menu i.far { margin: 0; color: #FFFFFF } /* Shows scrollable navigation on smaller screens */ #MainNavigationSwipeIn nav { height: calc(100% - 60px); position: relative; } /* Loading Spinner */ #quickNavigationWrapper .loader { display: none; height: 100%; align-items: center; width: 100%; justify-content: center; } #quickNavigationWrapper .loader .loading-icon { font-size: 3rem; opacity: 0.25; } #quickNavigationWrapper.loading .loader { display: flex; } #quickNavigationWrapper.loading #quickNavigation { display: none; } @media(min-width: 992px) { /* Top Level Navigation */ #MainSiteNavigation .nav-items > li > a { padding: 12px 8px; -webkit-padding-start: 4.6px; -webkit-padding-end: 4.6px; position: relative; } #MainSiteNavigation .navbar-nav { width: 100%; flex-direction: row; z-index: 3; } /* Sub-Navigation */ #MainSiteNavigation .sub-nav { visibility: hidden; opacity: 0; transition: 0s ease-out 0s; background: rgba(0,0,0,0.75); height: calc(100vh - 132px); position: absolute; top: auto; left: 0px; right: 0px; z-index: 2; pointer-events: none; } #MainSiteNavigation .sub-nav .subitems-ct { max-height: calc(100vh - 132px); background: #FFFFFF; border: solid 1px rgba(255,255,255,.1); box-shadow: 0 10px 14px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.15) !important; overflow-y: auto; pointer-events: initial; } #MainSiteNavigation .sub-nav .sub-items { margin: 30px; -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; column-gap: 60px; } #MainSiteNavigation .sub-nav .sub-items > li:first-of-type { margin-top: 0; } #MainSiteNavigation .sub-nav .sub-items > li { line-height: 1.3em; margin: 12px 0; font-size: 0.85rem; font-family: "Arial",Segoe UI,Helvetica Neue,Helvetica,Verdana,sans-serif; page-break-inside: avoid; } #MainSiteNavigation .sub-nav .sub-items.no-cols { column-count: 1; } #MainSiteNavigation .sub-nav li > a:hover { text-decoration: underline; } /* Show mega menu on hover */ #MainSiteNavigation .nav-items li:hover .sub-nav { visibility: visible; opacity: 1; transition: 0s ease-in .2s; } /* Parent items to be 100% and aligned centre */ #MainSiteNavigation .nav-items > li > a.parent { font-family: "Lato", sans-serif; color: #FFFFFF; display: flex; height: 100%; align-items: center; text-align: center; } /*********** Hover effect for parent categories ***********/ /* Batteries Department - Red */ #MainSiteNavigation .nav-items > li.dept-1:hover > a.parent { background-color: #E53123; } /* Jewellery, Findings, Chains & Solders - Purple */ #MainSiteNavigation .nav-items > li.dept-2:hover > a.parent { background-color: #754C78; } /* Ear Piercing - Green */ #MainSiteNavigation .nav-items > li.dept-3:hover > a.parent { background-color: #6E9808; } /* Watch Parts/ Watch Glasses - Brown */ #MainSiteNavigation .nav-items > li.dept-4:hover > a.parent { background-color: #704F26; } /* Tools - Green */ #MainSiteNavigation .nav-items > li.dept-6:hover > a.parent { background-color: #287482; } /* Consumables - Pink */ #MainSiteNavigation .nav-items > li.dept-7:hover > a.parent { background-color: #CA176B; } /* Clockparts - Beige */ #MainSiteNavigation .nav-items > li.dept-8:hover > a.parent { background-color: #C0A86C; } /* Books and Catalogues Department - Grey */ #MainSiteNavigation .nav-items > li.dept-9:hover > a.parent { background-color: #6D6B76; } /* Watch Straps, Bracelets & Fittings - Orange */ #MainSiteNavigation .nav-items > li.dept-10:hover > a.parent { background-color: #FE8415; } /* Watch Movements - Light Brown */ #MainSiteNavigation .nav-items > li.dept-12:hover > a.parent { background-color: #7E6B4C; } /* Clearance - Mint */ #MainSiteNavigation .nav-items > li.dept-14:hover > a.parent { background-color: #1EC988; } } @media(min-width: 1200px) { #MainSiteNavigation .nav-items > li > a.parent { font-size: 0.7rem; } } @media(min-width: 1366px) { /* Watch Parts & Watch Glasses */ #MainSiteNavigation .nav-items > li.dept-4 > a { max-width: 150px !important; } } @media(min-width: 1500px) { #MainSiteNavigation .sub-nav .sub-items { -webkit-column-count: 4; -moz-column-count: 4; column-count: 4; } #MainSiteNavigation .nav-items > li > a.parent { max-width: 220px; font-size: 0.85rem; } #MainSiteNavigation .nav-items > li > a { padding: 18px 8px; position: relative; } /* Watch Parts & Watch Glasses */ #MainSiteNavigation .nav-items > li.dept-4 > a { max-width: 175px !important; } _::-webkit-full-page-media, _:future, :root #MainSiteNavigation .nav-items > li > a { padding: 18px 6.9px; } } /*IE11 Fixes*/ @media (min-width: 992px) and (-ms-high-contrast:none) { #MainSiteNavigation .nav-item { width: 100%; } *::-ms-backdrop, #MainSiteNavigation .nav-items > li > a.parent { font-size: 0.65rem; justify-content: center; } .top-nav .nav-header .logo { max-width: 170px; height: auto !important; } /* IE11 */ } /*IE Edge Fixes*/ @media(min-width: 992px) and (max-width: 1199.98px) { @supports (-ms-ime-align:auto) { #MainSiteNavigation .nav-items > li > a { padding: 13.2px 8px; } #MainSiteNavigation .nav-items > li > a.parent { font-size: 0.65rem; } } } /* Swipe Up Navigation (for problematic screen resolutions) */ @media(min-width: 992px) and (max-width: 1092px), (min-width: 1200px) and (max-width: 1300px), (min-width: 1366px) and (max-width: 1466px), (min-width: 1500px) and (max-width: 1600px) { #MainNavigationSwipeIn { flex-direction: column; transform: translateY(calc(100% + -46px)); } #MainNavigationSwipeIn > .container { order: 2; } #MainNavigationSwipeIn .navbar-left-swipe { order: 1; padding: 13px; width: auto; } #MainNavigationSwipeIn .navbar-left-swipe > .content-ct { margin: 0 auto; transform: none; } #MainNavigationSwipeIn .navbar-left-swipe .content-ct i.fas { transform: rotate(180deg); } body.nav-open #MainNavigationSwipeIn .navbar-left-swipe .content-ct i.fas { transform: none; } #MainNavigationSwipeIn .menu-header { display: none; } } /* Update Browser */ .support-answer .update-browser { } .support-answer .update-browser .warning { font-weight: 600; color: #A01A21; } .support-answer .update-browser .update-browser-instructions { border-top: 1px dotted rgba(0,0,0,0.25); padding: 1.5rem 0; } .support-answer .update-browser .update-browser-instructions .browser-update-instruction { margin-bottom: 1rem; } .support-answer .update-browser .update-browser-instructions .browser-update-instruction h3 { font-size: 1rem; } .support-answer-detail + .support-form { padding-top: 2rem; margin-top: 2rem; border-top: 1px dotted rgba(0,0,0,0.25); } .support-answer-detail.d-none + .support-form { padding-top: 0px; margin-top: 0px; border-top: none; } /* Support Form Alert */ .support-form-alert { margin: 30px 0px; border: 2px solid #A01A21; } .support-form-alert h3 { font-size: 1.4rem; text-transform: uppercase; font-weight: bold; margin-bottom: 5px; color: #A01A21; } .support-form-alert p { color: #A01A21; } .table { border: solid 1px #E0E0E0; } .table td, .table th { border-top: 1px solid #E0E0E0; } .table thead th { border-bottom: 1px solid #E0E0E0; } /* Navigation Tabs Item */ .nav-tabs .nav-item:not(:last-of-type) { margin-right: 10px; } @media(min-width: 768px) { .nav-tabs .nav-item { margin-right: 15px; } } /* Navigation Tab Links */ .nav-tabs .nav-link { background: #E0E0E0; font-weight: 600; color: inherit; } .nav-tabs .nav-link span { opacity: 0.5; } .nav-tabs .nav-link span span { opacity: 1; } .nav-tabs .nav-link i { color: inherit; } @media(min-width: 768px) { .nav-tabs .nav-link i { display: none; } } @media(min-width: 992px) { .nav-tabs .nav-link { font-size: 1.25rem; } } /* Navigation Tab Active Links */ .nav-tabs .nav-link.active span { opacity: 1; } .nav-tabs .nav-link.active { color: #192C46; } /* Tab Content Container */ .tab-content { background: #fff; padding: 1.25rem; border: solid 1px #E0E0E0; border-top: none; border-radius: 0 .25em .25em .25em; } /* Alternative Styling - Tabbed Content */ .alt-tabs .tab-content { padding: 0px; border-left: none; border-right: none; border-bottom: none; background: none; } @media(min-width: 768px) { .alt-tabs .tab-content { padding: 1.25rem 0 0 0; border-top: solid 9px #2A405E; } } /* Alternative Styling - Header Nav Links */ .alt-tabs .nav-tabs { border-bottom: none; display: flex; } .alt-tabs .nav-tabs .nav-item { margin-bottom: 0; margin-right: 10px; } .alt-tabs .nav-tabs .nav-item:last-of-type { margin-right: 0; } .alt-tabs .nav-tabs .nav-link { background: rgba(42,64,94,0.5); color: #FFFFFF; font-weight: 700; border: none; font-family: "Lato", sans-serif; } .alt-tabs .nav-tabs .nav-link.active { background: #2A405E; color: #FFFFFF; } @media(min-width: 576px) { .alt-tabs .nav-tabs .nav-link i { display: none; } } @media(min-width: 1200px) { .alt-tabs .nav-tabs .nav-item { margin-right: 20px; } } @media(min-width: 992px) { .alt-tabs .nav-tabs .nav-link { padding: 0.75rem 1.25rem; } } /* Alternative Styling - Button Group Styling */ .alt-tabs .button-group-sml { flex-basis: 58%; margin: 0; flex-wrap: wrap; align-items: center; justify-content: flex-end; } .alt-tabs .button-group-sml a:not(:last-of-type) { margin-bottom: 0; } .alt-tabs .button-group-sml h5 { margin: 0 20px 0 0; } @media(min-width: 1500px) { .alt-tabs .button-group-sml { flex-basis: 65%; } } @media(max-width: 991.98px) { .alt-tabs .button-group-sml { flex-basis: auto; } .alt-tabs .button-group-sml h5 { display: none; } } /* Alternative Styling - Department Blocks */ .alt-tabs-item.department-block { display: block; } /* Timeline */ .js .cd-h-timeline { opacity: 0; transition: opacity 0.2s } .js .cd-h-timeline--loaded { opacity: 1 } .js .cd-h-timeline__container { position: relative; height: 100px; } /* Timeline Captions */ .js .cd-h-timeline .caption { font-size: 80%; width: 0px; padding: 0 10px; text-align: center; min-width: 100%; display: block; margin-top: 5px; } /* Timeline Date */ .js .cd-h-timeline__date { position: absolute; bottom: 0; z-index: 2; text-align: center; padding-bottom: 10px; user-select: none; text-decoration: none; font-weight: 600; color: #4C4C4C; } .js .cd-h-timeline__date::after { content: ''; position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: -5px; height: 12px; width: 12px; border-radius: 50%; border: 2px solid #CED4DA; background-color: #FFFFFF; transition: background-color 0.3s, border-color .3s } .js .cd-h-timeline__date:hover::after { background-color: var(--clr-secondary); border-color: var(--clr-secondary); } .js .cd-h-timeline__date--selected { pointer-events: none } .js .cd-h-timeline__date--selected::after { background-color: var(--clr-secondary); border-color: var(--clr-secondary); } .js .cd-h-timeline__date--older-event::after { border-color: #CED4DA; } /* Timeline Date before/after gradient */ .js .cd-h-timeline__dates { position: relative; height: 100%; margin: 0 40px; overflow: hidden } /* Timeline Fill Lines */ .cd-h-timeline__line { position: absolute; z-index: 1; transition: transform 0.4s, -webkit-transform 0.4s; left: 0; top: 49px; height: 2px; background-color: #CED4DA; } .js .cd-h-timeline__filling-line { position: absolute; z-index: 1; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--clr-secondary); -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; transition: -webkit-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s } /* Navigation Buttons */ .js .cd-h-timeline__navigation { position: absolute; z-index: 1; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); height: 38px; width: 38px; border-radius: 50%; background-color: var(--clr-secondary); border: solid 2px #FFFFFF; transition: border-color 0.3s } .js .cd-h-timeline__navigation::after { content: ''; position: absolute; height: 19px; width: 19px; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); background: url(/content/common/images/timeline/cd-arrow.svg) no-repeat 0 0 } .js .cd-h-timeline__navigation:hover { border-color: #FFFFFF; } .js .cd-h-timeline__navigation--prev { left: 0; -webkit-transform: translateY(-50%) rotate(180deg); -ms-transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg) } .js .cd-h-timeline__navigation--next { right: 0 } .js .cd-h-timeline__navigation--inactive { cursor: not-allowed; opacity: 0.5; } /* Timeline Event */ .js .cd-h-timeline__events { position: relative; width: 100%; overflow: hidden; transition: height .4s } .js .cd-h-timeline__event { position: absolute; z-index: 1; width: 100%; left: 0; top: 0; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); opacity: 0; -webkit-animation-duration: 0.4s; animation-duration: 0.4s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } .js .cd-h-timeline__event--selected { position: relative; z-index: 2; opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } @media(min-width: 992px) { .js .cd-h-timeline__event { padding: 0px 4%; } } /* Event Animation */ .js .cd-h-timeline__event--enter-right, .js .cd-h-timeline__event--leave-right { -webkit-animation-name: cd-enter-right; animation-name: cd-enter-right } .js .cd-h-timeline__event--enter-left, .js .cd-h-timeline__event--leave-left { -webkit-animation-name: cd-enter-left; animation-name: cd-enter-left } .js .cd-h-timeline__event--leave-right, .js .cd-h-timeline__event--leave-left { animation-direction: reverse } /* Keyframes */ @keyframes cd-enter-right { 0% { opacity: 0; -webkit-transform: translateX(100%); transform: translateX(100%) } 100% { opacity: 1; -webkit-transform: translateX(0%); transform: translateX(0%) } } @-webkit-keyframes cd-enter-left { 0% { opacity: 0; -webkit-transform: translateX(-100%); transform: translateX(-100%) } 100% { opacity: 1; -webkit-transform: translateX(0%); transform: translateX(0%) } } @keyframes cd-enter-left { 0% { opacity: 0; -webkit-transform: translateX(-100%); transform: translateX(-100%) } 100% { opacity: 1; -webkit-transform: translateX(0%); transform: translateX(0%) } } /* Hide jQuery UI elements */ .ui-loader { display: none; } /* Default Nav Styling */ .top-nav { display: block; padding: 0; z-index: 4; position: relative; } .top-nav-wrapper { z-index: 12; top: auto; } .top-nav-wrapper.fixed-top { top: 0; border-bottom: solid 1px #E0E0E0; box-shadow: rgba(33, 35, 38, 0.3) 0px 10px 10px -10px; } @media(max-width: 1499px) { .top-nav-wrapper { width: 100%; z-index: 1030; } .top-nav { padding: 0; } } /* Nav Header */ .top-nav .nav-header-content { padding: 0.875rem 0; } .top-nav .nav-header { background: #FFFFFF; position: relative; z-index: 2; } .top-nav .nav-header .logo { height: 29px; max-width: none; image-rendering: -webkit-optimize-contrast; } .top-nav .nav-header p { color: rgba(255,255,255,0.6); font-size: 13px; } @media(max-width: 1499.98px) { .top-nav .nav-header p { display: none; } } @media(max-width: 767.98px) { .top-nav .container { max-width: 100%; } } /* Nav Items */ @media(max-width: 991.98px) { #topNavWrapper.open #topNav { display: none; } } .top-nav .nav-content { z-index: 1; position: relative; } .top-nav .nav-content-block { background: #192c46; flex-grow: 1; } @media(min-width: 768px) { .top-nav-wrapper.open .nav-content { display: flex !important; } .top-nav-wrapper.open .navbar-nav { flex-direction: row; display: flex; } } @media(max-width: 767.98px) { .top-nav .nav-content-block { background: #192c46; min-height: 100vh; } } /* Account Navigation */ .account-nav { display: flex; padding: 0; margin: 0; justify-content: flex-end; align-items: center; } .account-nav a { color: #212529; display: block; position: relative; } .account-nav a:hover { color: #212529; } .account-nav span { display: block; } .account-nav i { font-size: 1em; } .account-nav .title { font-weight: 600; font-size: .75rem; } .account-nav .summary { font-size: 0.75rem; } .account-nav button { padding: 0; border: none; line-height: 1.3; color: #212529; cursor: pointer; } @media(min-width: 768px) { .account-nav li { margin-right: 2.5rem; } } @media(min-width: 992px) { .account-nav i { font-size: 1.25rem; margin-right: 10px; } .account-nav li:not(:last-child) { margin-right: 2.5rem; } .top-nav .nav-header-content { padding: 0.25rem 0 0.875rem 0; } } /* Navigation Links */ .top-nav .navbar-nav { position: relative; } .top-nav .nav-item { margin-right: 1.3rem; font-family: "Lato",sans-serif; } .top-nav .nav-link { color: #2A405E; font-weight: 700; padding: 0.5rem .5rem; } .top-nav .feature-link { color: var(--clr-secondary); } @media (min-width: 768px) { .top-nav .nav-item:last-of-type { margin: 0; } } .top-nav .mega-menu .department-block i { color: #FFFFFF; } @media(max-width: 767.98px) { .top-nav .nav-item { position: relative; margin: 0 -15px 0 -15px; } .top-nav .nav-item img { display: none; } .top-nav .nav-link { display: flex; line-height: 1.3; padding: .5rem 1.5rem; min-height: 64px; align-items: center; justify-content: space-between; border-bottom: solid 1px rgba(255,255,255,.1); } .top-nav .nav-link:before { content: ""; border-left-style: solid; border-left-width: 8px; border-color: rgba(255,255,255,0.2); position: absolute; left: 0; height: 100%; } .top-nav .feature-link:before { border-color: var(--clr-secondary); } /* Top Navigation Mega Menu */ .top-nav .mega-menu-parent { margin: 0; } .top-nav .mega-menu { background: #192c46; position: relative; display: block !important; padding: 0; } .top-nav .mega-menu .container { padding: 0; } .top-nav .mega-menu ul { margin-top: 0; } .top-nav .mega-menu li { padding: 0 !important;; } .top-nav .mega-menu .department-block { margin-bottom: 0; border-bottom: solid 1px rgba(255,255,255,0.1); } .top-nav .mega-menu .department-block:before { content: ""; border-left-style: solid; border-left-width: 8px; position: absolute; left: 0; height: 100%; } .top-nav .mega-menu .department-block .content { background: none; padding: 0.5rem 1.5rem; width: 100%; } /* AZ Index */ .top-nav .mega-menu .department-block.az-index { display: none; } } /* Admin Login Header Notifications */ .admin-notifications { padding: 0; margin: 0 15px 0 0; flex-direction: row; display: flex; align-items: center; } .admin-notifications li { position: relative; min-width: 42px; margin: 0 !important; text-align: center; } .admin-notifications li i { color: #4C4C4C; } .admin-notifications li i.superuser-star { color: var(--clr-secondary); } .admin-notifications li i.deputy-star { color: #4C4C4C; } .admin-notifications .badge-pill { position: absolute; top: 50%; left: 51%; margin-top: -20px; margin-left: 0; } .admin-notifications .badge { font-size: 10px; } .admin-notifications .badge.my-not { background: #A01A21; } .admin-notifications .badge.ops-team-not { background: #FF800D; } .admin-notifications .badge.managers-not { background: #FFFFFF; outline: 1px solid #2A405E; outline-offset: -1px; color: #2A405E; text-shadow: none; } .admin-notifications .badge.deputy-not { background: #22B154; } .admin-notifications .badge.ant-not { background: var(--clr-secondary); } .admin-notifications .badge.star { background: #E1E9F4; color: #2A405E; text-shadow: none; } .admin-notifications .badge.sup-not { background: #6CCDEA; } .admin-notifications .badge.plain { background: rgba(255,255,255,0.3); z-index: -1; color: initial; text-shadow: none; } .nav-header-content .admin-notifications { display: none; } .sub-notifications { margin: 0; padding: 1.5rem 0.75rem 0.75rem 0.75rem; background: #FFFFFF; display: flex; justify-content: center; z-index: 9; width: 100%; position: relative; border-top: solid 1px #E0E0E0; } .sub-notifications.fixed-nav { position: fixed; top: 55px; border-bottom: solid 1px #E0E0E0; } .homepage #mobileNav:not(.fixed-nav) { display: none !important; } #mobileNav.fixed-nav { position: fixed; top: 57px; z-index: 9; width: 100%; } .account-nav .search-toggler { background: none; } @media (min-width:576px) { .admin-notifications { margin: 0 24px 0 0; } } @media (min-width:768px) { .admin-notifications { margin: 0 15px 0 0; } .nav-header-content .admin-notifications { display: flex; } .sub-notifications { display: none; } } /* Navigation Drop Down Menu */ .accoouunt-menu { box-shadow: 0 3px 16px rgba(0,0,0,.1); } .account-menu a { color: inherit; } @media(min-width: 992px) { .d-topnav-block { display: block !important; } .d-topnav-inline-block { display: inline-block !important; } .navbar-expand-topnav .toggler-ct { display: none; } .navbar-expand-topnav .navbar-nav { flex-direction: row; } .d-topnav-none { display: none !important; } .top-nav .nav-header .logo { height: 55px; } } /* Basket Notification */ #basketNotification { transition: opacity 200ms ease, transform 200ms ease; } #basketNotification.invisible { opacity: 0; } #basketNotification.visible { opacity: 1; } @media(max-width: 991.98px) { .basket-notification-ct .notifications { position: absolute; left: -10px; top: -14px; } } /* Stick Sub Nav */ .sticky-sub-nav { background: rgba(42,64,94,0.95); text-align: center; color: #FFFFFF; } .sticky-sub-nav a:not(.btn) { color: #FFFFFF; padding: 0.5rem 1rem; display: block; } .sticky-sub-nav-inner { padding: 10px 15px; } @media(min-width: 1500px) { .top-nav .nav-header .logo { height: 65px; } } /* Generic Traffic Light Icons */ .traffic-light { margin: 0px; } .traffic-light.green { color: #8BBF88; } .traffic-light.amber { color: #F9A63A; } .traffic-light.red { color: #A01A21; } .traffic-light.blue { color: #6CCDEA; } .traffic-light.purple { color: #782584; } /*.twitter-typeahead { } .twitter-typeahead input { width: 100%; }*/ /* * typehead.js-bootstrap3.less * @version 0.2.3 * https://github.com/hyspace/typeahead.js-bootstrap3.less * * Licensed under the MIT license: * http://www.opensource.org/licenses/MIT */ .has-warning .twitter-typeahead .tt-input, .has-warning .twitter-typeahead .tt-hint { border-color: #8a6d3b; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } .has-warning .twitter-typeahead .tt-input:focus, .has-warning .twitter-typeahead .tt-hint:focus { border-color: #66512c; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b; } .has-error .twitter-typeahead .tt-input, .has-error .twitter-typeahead .tt-hint { border-color: #a94442; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } .has-error .twitter-typeahead .tt-input:focus, .has-error .twitter-typeahead .tt-hint:focus { border-color: #843534; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; } .has-success .twitter-typeahead .tt-input, .has-success .twitter-typeahead .tt-hint { border-color: #3c763d; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } .has-success .twitter-typeahead .tt-input:focus, .has-success .twitter-typeahead .tt-hint:focus { border-color: #2b542c; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168; } .input-group .twitter-typeahead:first-child .tt-input, .input-group .twitter-typeahead:first-child .tt-hint { border-bottom-left-radius: 4px; border-top-left-radius: 4px; width: 100%; } .input-group .twitter-typeahead:last-child .tt-input, .input-group .twitter-typeahead:last-child .tt-hint { border-bottom-right-radius: 4px; border-top-right-radius: 4px; width: 100%; } .input-group.input-group-sm .twitter-typeahead .tt-input, .input-group.input-group-sm .twitter-typeahead .tt-hint { height: 30px; padding: 5px 10px; /*font-size: 12px;*/ line-height: 1.5; border-radius: 3px; } select.input-group.input-group-sm .twitter-typeahead .tt-input, select.input-group.input-group-sm .twitter-typeahead .tt-hint { height: 30px; line-height: 30px; } textarea.input-group.input-group-sm .twitter-typeahead .tt-input, textarea.input-group.input-group-sm .twitter-typeahead .tt-hint, select[multiple].input-group.input-group-sm .twitter-typeahead .tt-input, select[multiple].input-group.input-group-sm .twitter-typeahead .tt-hint { height: auto; } .input-group.input-group-sm .twitter-typeahead:not(:first-child):not(:last-child) .tt-input, .input-group.input-group-sm .twitter-typeahead:not(:first-child):not(:last-child) .tt-hint { border-radius: 0; } .input-group.input-group-sm .twitter-typeahead:first-child .tt-input, .input-group.input-group-sm .twitter-typeahead:first-child .tt-hint { border-bottom-left-radius: 3px; border-top-left-radius: 3px; border-bottom-right-radius: 0; border-top-right-radius: 0; } .input-group.input-group-sm .twitter-typeahead:last-child .tt-input, .input-group.input-group-sm .twitter-typeahead:last-child .tt-hint { border-bottom-left-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: 3px; border-top-right-radius: 3px; } .input-group.input-group-lg .twitter-typeahead .tt-input, .input-group.input-group-lg .twitter-typeahead .tt-hint { height: 46px; padding: 10px 16px; /*font-size: 18px;*/ line-height: 1.33; border-radius: 6px; } select.input-group.input-group-lg .twitter-typeahead .tt-input, select.input-group.input-group-lg .twitter-typeahead .tt-hint { height: 46px; line-height: 46px; } textarea.input-group.input-group-lg .twitter-typeahead .tt-input, textarea.input-group.input-group-lg .twitter-typeahead .tt-hint, select[multiple].input-group.input-group-lg .twitter-typeahead .tt-input, select[multiple].input-group.input-group-lg .twitter-typeahead .tt-hint { height: auto; } .input-group.input-group-lg .twitter-typeahead:not(:first-child):not(:last-child) .tt-input, .input-group.input-group-lg .twitter-typeahead:not(:first-child):not(:last-child) .tt-hint { border-radius: 0; } .input-group.input-group-lg .twitter-typeahead:first-child .tt-input, .input-group.input-group-lg .twitter-typeahead:first-child .tt-hint { border-bottom-left-radius: 6px; border-top-left-radius: 6px; border-bottom-right-radius: 0; border-top-right-radius: 0; } .input-group.input-group-lg .twitter-typeahead:last-child .tt-input, .input-group.input-group-lg .twitter-typeahead:last-child .tt-hint { border-bottom-left-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: 6px; border-top-right-radius: 6px; } /*.twitter-typeahead { width: 100%; float: left; }*/ .input-group .twitter-typeahead { display: flex !important; } .twitter-typeahead .tt-highlight { color: #22b154; } .twitter-typeahead .tt-hint { color: var(--clr-secondary) !important; } .twitter-typeahead .tt-input { z-index: 2; } .twitter-typeahead .tt-input[disabled], .twitter-typeahead .tt-input[readonly], fieldset[disabled] .twitter-typeahead .tt-input { cursor: not-allowed; background-color: #eeeeee !important; } .tt-dropdown-menu, .tt-menu { position: absolute; top: 100%; left: 0; z-index: 9999 !important; min-width: 160px; width: 100%; padding: 0; margin: 2px 0 0; list-style: none; /*font-size: 14px;*/ background-color: #F2F2F2; border: 1px solid #cccccc; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0px; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); background-clip: padding-box; *border-right-width: 2px; *border-bottom-width: 2px; } .tt-dropdown-menu .tt-suggestion, .tt-menu .tt-suggestion { display: block; padding: .5rem; clear: both; font-weight: normal; line-height: 1.42857143; color: #333333; border-top: 1px solid rgba(0,0,0,0.05); font-size: 0.75rem; background: #FFFFFF; } @media(min-width: 992px){ .tt-dropdown-menu .tt-suggestion, .tt-menu .tt-suggestion { padding: .75rem; font-size: 1rem; } } .tt-dropdown-menu .tt-suggestion:first-child, .tt-menu .tt-suggestion:first-child { border-top: none; } .tt-dropdown-menu .tt-suggestion.tt-cursor, .tt-menu .tt-suggestion.tt-cursor, .tt-dropdown-menu .tt-suggestion:hover, .tt-menu .tt-suggestion:hover { cursor: pointer; text-decoration: none; outline: 0; background-color: #FFFFFF; color: #262626; } .tt-dropdown-menu .tt-suggestion.tt-cursor a, .tt-menu .tt-suggestion.tt-cursor a, .tt-dropdown-menu .tt-suggestion:hover a, .tt-menu .tt-suggestion:hover a { color: #262626; } .tt-dropdown-menu .tt-suggestion p, .tt-menu .tt-suggestion p { margin: 0; } /* TDL - Fix flex issues on smaller screen resolutions */ .input-group > .twitter-typeahead { flex: 1 1 auto; width: 1%; } /* Header Search (Smaller Screen Resolutions) */ .search-header input { border-radius: 0px; } .search-header .twitter-typeahead .tt-input, .search-header .input-group-append .btn, .search-header .input-group-prepend .btn { z-index: 0; } /* Browser Notice */ .browser-notice { display: none; background: #2A405E !important; color: #FFFFFF; border-top: solid 1px rgba(255,255,255,0.2) } @media (min-width: 1200px) { .browser-notice { display: block; } } /* Browser Notice Content */ .browser-notice .browser-content { display: flex; } .browser-notice p { margin: 0; } .browser-notice .lead { color: #FFFFFF; color: #B79649; } /* Browser Notice Icons */ .browser-notice ul { margin: 0; } .browser-notice ul li { display: block; float: left; margin: 0 0 0 15px; } .browser-notice ul li.browser a { display: block; height: 58px; width: 58px; background: url(data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==) no-repeat; } .browser-notice ul li.ie a { background-position: -116px 0px; } .browser-notice ul li.firefox a { background-position: -174px 0px; } .browser-notice ul li.chrome a { background-position: -58px 0px; } .browser-notice ul li.safari a { background-position: 0px 0px; } .useful-links-banner { display: inline-block; position: relative; color: var(--clr-ntrl-min); } .useful-links-banner .title { position: absolute; top: 50%; transform: translateY(-50%); text-align: center; font-weight: 700; width: 100%; } .useful-links-banner:hover { color: var(--clr-secondary); } @media(min-width: 768px) { .useful-links-banner .title { font-size: 20px; } } @media(min-width: 1200px) { .useful-links-banner .title { font-size: 28px; } } /* User Agent Override (Admin Only) */ #userAgentOverride { display: none; } .admin-user #userAgentOverride { display: block; } /* Display Classes */ .noshow { display: none; } .off { opacity: .25; } /* Font Weights */ .bold { font-weight: 600; } /* Disabled */ .disabled { opacity: .15; cursor: default; } /***** TEXT CLASSES *****/ /* Red Warning Text */ .warning { color: #A01A21; } .warning-bg { background: #A01A21; color: #FFFFFF; } /* Gold Text */ .gold-text { color: var(--clr-secondary); } /* Blue Text */ .blue-text { color: #2A405E; } /* Success Messages */ .success { color: #22b154; } .success-bg { background: #22b154; color: #FFFFFF; } /* Light BG */ .light-bg { background: #F2F2F2; } /* Highlight */ .highlight { background: yellow; color: #4C4C4C; padding: 0.125rem; } /* Width Auto */ .w-auto { width: auto; } /* Show Text After 768px */ .show-text-md { display: none; } @media (min-width: 768px) { .show-text-md { display: inline-block; } } /* Show Text After 576px */ .show-text-sm { display: none; } @media (min-width: 576px) { .show-text-sm { display: inline-block; } } /* White BG */ .white-bg { background: #FFFFFF; } .input-validation-error { background: #F7CECE !important; border-color: #F7CECE !important; } .input-validation-error[type='radio'] + label.custom-control-label:before { outline: 2px solid #A01A21; outline-offset: -2px; } .field-validation-error { display: block; margin-top: 10px; color: #A01A21; font-weight: 600; } .field-validation-error:before { font-family: FontAwesome; content: '\f06a'; margin-right: 8px; } /* Video Department */ .video-department { margin-bottom: 30px; } .video-department .department-title { color: #AE262D; } /* Video Category */ .video-categories h2 { margin-bottom: 20px; } .video-categories h2, .video-categories h3 a { color: #AE262D; } .video-category { background: #F2F2F2; padding: 10px 15px; margin: 2px 0; } .video-category.active { background: #AE262D; color: #FFFFFF; } .video-category.active a { color: #FFFFFF; } .video-section .video-player { display: none; padding-bottom: 56.66% !important; margin-bottom: 30px; } .video-section .video { margin-bottom: 20px; } @media (max-width: 767.98px) { .video-section .videos { margin-bottom: 30px; border-bottom: solid 1px #E0E0E0; padding-bottom: 30px; } } /* Video Player */ .video-player { position: relative; padding-top: 35px; height: 0 !important; overflow: hidden; } .video-player iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* Videos */ .video-container { position: relative; } .video-container i { position: absolute; top: 50%; left: 50%; font-size: 1.25rem; color: #fff; margin-left: -10px; margin-top: -5px; } .video .video-title { display: block; margin-top: 10px; } /* Videos Modal */ #videoModal .video-player { padding-bottom: 51.7% !important; } #videoModal .videos { margin-top: 30px; } #videoModal .videos .video { margin-bottom: 20px; } #videoModal .videos .video a { display: block; } @media(min-width: 1500px) { /* Enlarge size of container when screen width is at least 1500px */ .container { max-width: 1500px; } /* XXL column base styling */ .col-xxl, .col-xxl-1, .col-xxl-2, .col-xxl-3, .col-xxl-4, .col-xxl-5, .col-xxl-6, .col-xxl-7, .col-xxl-8, .col-xxl-9, .col-xxl-10, .col-xxl-11, .col-xxl-12, .col-xxl-auto { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; } /* XXL column widths */ .col-xxl { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .col-xxl-1 { -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%; } .col-xxl-2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%; } .col-xxl-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-xxl-4 { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; } .col-xxl-5 { -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%; } .col-xxl-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-xxl-7 { -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%; } .col-xxl-8 { -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%; } .col-xxl-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-xxl-10 { -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333%; } .col-xxl-11 { -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667%; } .col-xxl-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .col-xxl-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none; } /* XXL Display Flex */ .d-xxl-flex { display: -ms-flexbox !important; display: flex !important; } .d-xxl-none { display: none !important; } .d-xxl-inline-block { display: inline-block !important; } .d-xxl-block { display: block !important; } /* Navbar Extend */ .navbar-expand-xxl { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; flex-direction: row; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .navbar-expand-xxl .navbar-collapse { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -ms-flex-preferred-size: auto; flex-basis: auto; } /* Margin Right 2 */ .mr-xxl-2 { margin-right: 0.5rem !important; } /* Margin Left 5 */ .ml-xxl-5, mx-xxl-5 { margin-left: 3rem !important; } /* Margin Bottom 0 */ .mb-xxl-0, .my-xxl-0 { margin-bottom: 0 !important; } /* Margin Bottom 2 */ .mb-xxl-2, .my-xxl-2 { margin-bottom: 0.5rem !important; } /* Margin Bottom 4 */ .mb-xxl-4, .my-xxl-4 { margin-bottom: 1.5rem !important; } /* Margin Right 0 */ .mr-xxl-0, mr-xxl-0 { margin-right: 0px !important; } } .zoom-link { background: #192C46; padding: 0.5rem 0.75rem; position: absolute; right: 10px; bottom: 10px; color: #FFFFFF; border-radius: .25em; }