.w-25 { width: 25% !important; } .w-50 { width: 50% !important; } .w-75 { width: 75% !important; } .w-100 { width: 100% !important; } .w-100 img { width: 100% !important; } .w-auto { width: auto !important; } .large p { font-size: 1.3em; padding: 0 20px; } /* general page margin */ hr { border: 0; border-top: 1px solid #e6e6e6; margin-bottom: 1em; margin-top: 1em; display: inline-block; width: 100%; } .spacer { border: 0; margin-bottom: 1em; margin-top: 1em; display: inline-block; width: 100%; } /* 5 columns */ .col-xs-5ths, .col-sm-5ths, .col-md-5ths, .col-lg-5ths { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } .col-xs-5ths { width: 20%; float: left; } .list-inline li { display: inline-block; padding-left: 5px; padding-right: 5px; } .page-content h2 { padding-top: 20px; padding-bottom: 20px; } /* buttons style for list and details - stock and chat etc */ .prod-code .label, .defaultbtn, .in-stock, .out-stock { border: solid 1px; border-radius: 11px; padding: 7px 17px !important; cursor: pointer; font-size: 85%; font-weight: 700; line-height: 1; display: flex; justify-content: center; align-items: center; width: fit-content; gap: 3px; } .prod-code .label::selection { color: #60269d; background: #e3e3e3; } .checkstock-btn { color: #623390 !important; white-space: normal; display: inline-block; font-size: 0.9em !important; } .out-stock, .out-stock-chat, .out-stock-pre-chat, .stock-due, .out-stock-chat-checkstock, .fabric-chat, .btn-basic, .socialspaceschat, .checkstock-btn, .chatbtn { color: #62339e !important; } .out-stock small { font-size: 100%; } .live-inventory-v2-wrapper { /* change order of stock so on list page it comes after the title */ order: 2; } .chatbtn svg, .out-stock svg, .out-stock-chat svg { width: 16px; margin-right: 5px; vertical-align: middle; } /* staticdelivery */ .staticdelivery-details .deliverytext { font-size: 100%; } /* Search results */ .noresultsshow { display: none; } .noprodutctfound .alert.alert-warning { display: none; } .noresultsshow h1 { font-size: 1.75em !important; color: inherit !important; font-weight: 300 !important; } /* accordion */ .panel-heading .accordion-toggle::after { /* symbol for "opening" panels */ font-family: "Glyphicons Halflings"; /* essential for enabling glyphicon */ content: "\e114"; /* adjust as needed, taken from bootstrap.css */ float: right; /* adjust as needed */ color: #62339e; /* adjust as needed */ } .panel-heading .accordion-toggle.collapsed::after { /* symbol for "collapsed" panels */ content: "\e080"; /* adjust as needed, taken from bootstrap.css */ } .panel.panel-default { border-bottom: solid 2px #fff; } .panel-title { margin-top: 0; font-size: 1.5em; } a.accordion-toggle { text-decoration: none; } /* contact page */ .call-us { background: url("https://eu.evocdn.io/dealer/1048/content/media/Content_Pages/Contact/Contact-page-call-banner.jpg"); } .chat-to-us { background: url("https://eu.evocdn.io/dealer/1048/content/media/Content_Pages/Contact/Contact-page-chat-banner.svg"); } .raise-a-ticket { background: url("https://eu.evocdn.io/dealer/1048/content/media/Content_Pages/Contact/Contact-page-ticket-banner.jpg"); } .chat-to-us, .raise-a-ticket { padding: 20px; height: 227px; margin: 20px 0; cursor: pointer; border-radius: 0; border: solid 1px transparent; background-size: cover; } .call-us { padding: 20px; height: 227px; margin: 20px 0; border-radius: 0; border: solid 1px transparent; background-size: cover; } .chat-to-us:hover, .raise-a-ticket:hover { border: solid 1px #fff; cursor: pointer; } #doublebanner_194065 .banner1:hover { /* bulk order on school furniture */ cursor: pointer; } .call-us h2, .chat-to-us h2, .raise-a-ticket h2 { font-size: 2em !important; line-height: 1em !important; /* text-transform: uppercase; */ font-weight: 600 !important; color: #fff !important; } .call-us h3, .chat-to-us h3, .raise-a-ticket h3 { font-size: 1.7em; line-height: 1em; font-weight: 400; color: #fff; } .call-us .text, .chat-to-us .text, .raise-a-ticket .text { position: absolute; bottom: 40px; left: 40px; width: 62%; } .call-us p, .chat-to-us p, .raise-a-ticket p { font-size: 1.3em; line-height: 1em; font-weight: 400; color: #fff; } /* PRODUCT LIST - LIST VIEW FIXES */ /* height on product name is fixed - looks strange */ .gridlist-list .product-name { height: inherit !important; } /* .product-summary .productdetails { display: inline-flex; align-items: baseline; } .product-summary .productdetails div { padding: 0 10px 0 0; } */ /* Office Desks */ .blog-posts-grid-view .tile, .catalog-grid .tile { /* fix the lines */ max-width: none; } .officev2 .row { margin-bottom: 20px; } .officev2 .full { text-align: center; } .officev2 .border { border: solid 1px #e5e5e5; height: 100%; } .officev2 .border img { border-bottom: solid 1px #e5e5e5; } .officev2 .colours .colour-qty { font-size: 0.8em; color: #808080; } .officev2 .cost { position: absolute; bottom: 0; right: 0; background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/office-desks-cost.svg"); background-size: cover; color: #fff; padding: 5px 10px 5px 45px; font-size: 1.5em; } .officev2 .view { background: #10d1c9; font-size: 0.9em; padding: 5px 10px !important; margin: 0 0 20px; min-height: 30px; } .officev2 .cost .from { font-size: 0.7em; display: block; } .officev2 .title { padding: 10px 0; } .officev2 .title h2 { font-size: 1em !important; font-weight: bold !important; display: inline-block; } .officev2 .title h3 { font-size: 1em !important; font-weight: normal !important; display: inline-block; } .officev2 .colours .colour { padding: 0 8px !important; font-size: 0.7em; color: #808080; text-align: center; } .officev2 .colours { margin: 0 auto; text-align: center; } .officev2 .colours .colour::before { content: ""; height: 20px; width: 20px; display: block; margin: 0 auto; position: relative; } .officev2 .colours .whitecircle::before { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/colour-white.png"); background-size: contain; background-repeat: no-repeat; background-position: center; } .officev2 .colours .walnut::before { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/colour-walnut.png"); background-size: contain; background-repeat: no-repeat; background-position: center; } .officev2 .colours .oak::before { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/colour-oak.png"); background-size: contain; background-repeat: no-repeat; background-position: center; } .officev2 .colours .maple::before { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/colour-maple.png"); background-size: contain; background-repeat: no-repeat; background-position: center; } .officev2 .colours .beech::before { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/colour-beech.png"); background-size: contain; background-position: center; } .officev2 .colours .whiteoak::before { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/colour-white-Oak1.png"); background-size: contain; background-position: center; } .officev2 .colours .darkoak::before { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/colour-dark-oak.png"); background-size: contain; background-position: center; } .officev2 .colours .americanwalnut::before { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/Office Desks/colour-walnut.png"); background-size: contain; background-position: center; } .bannerstext .col-sm-6, .bannerstext .col-sm-3 { position: relative; display: block; margin: 0 0 20px; } .bannerstext .top { position: absolute; top: 10px; left: 0; } .bannerstext .top h2 { position: relative; } .bannerstext .top h3 { position: relative; color: #fff; font-weight: 400; left: 25px; } .bannerstext h1 { padding: 20px 0; font-size: 2.5em; position: relative; z-index: 0; } .bannerstext h2 { position: absolute; bottom: 0; left: 25px; color: #fff !important; font-size: 2.8em !important; font-weight: bold !important; } .bannerstext h2 span.from { font-size: 20px; display: block; margin: 0; line-height: 1em; } .bannerstext h2.cost { font-size: 2.1em !important; pointer-events: none; } /* desk finder */ .ex-category .contentblock_container { /* removes background on .contentblock_container h1 */ background-color: inherit !important; } .deskfinder .gridtools { display: none; } .deskfinder .catalog-name { font-size: 2.4em !important; color: #9d9d9c !important; padding: 20px 0 10px; } .deskfinder .tileparent .tile:hover, .officedeskbrands .tileparent .tile:hover { background: rgb(227 227 227); } .deskfinder .whitearrow, .officedeskbrands .whitearrow { display: inline-block; text-indent: -20000px; width: 30px; height: 30px; background: url(https://eu.evocdn.io/dealer/1048/content/media/Categories/Desk%20Finder/darkarrow.svg); background-size: cover; margin: 20px 0; } .deskfinder .tileparent, .deskfinder .listtoolsbottom { border-bottom: 0 solid #9e5cbf; padding: 0 0.5em; } .deskfinder .cat-tiles a p { margin-top: 20px; } .deskfinder .step2 .cat-tiles a p { text-align: center; width: 100%; } .deskfinder .sit-stand.step2 .cat-tiles a p { text-align: center; width: 100%; } .sitorstanddesks.deskfinder .step1 .cat-tiles a p { text-align: center; width: 100%; } .deskfinder .sit-stand.step2 .cat-tiles a p { text-align: center; width: 100%; } .deskfinder h1 { font-size: 4.5em; color: #61279e; } .deskfinder h2 { font-size: 2.4em; color: #9d9d9c; font-weight: 400; padding: 20px 0 30px; } .deskfinder .mainh2 h2 { font-size: 2.4em !important; color: #9d9d9c !important; padding: 20px 0 10px; } /* Form Wizard */ .bs-wizard { padding: 0 0 40px; margin: -20px 0 20px; } .bs-wizard > .bs-wizard-step { padding: 0; position: relative; } .bs-wizard > .bs-wizard-step .bs-wizard-stepnum { color: #fff; font-size: 40px; font-weight: bold; top: 39px; left: 25px; position: relative; z-index: 1; pointer-events: none; } .bs-wizard > .bs-wizard-step .bs-wizard-info { color: #999; font-size: 14px; } .bs-wizard > .bs-wizard-step > .bs-wizard-dot { position: absolute; width: 80px; height: 80px; display: block; background: #b8b8b8; background: -webkit-gradient( linear, left top, left bottom, from(#e3e3e3), to(#b8b8b8) ); background: linear-gradient(top, #e3e3e3, #b8b8b8); background: linear-gradient(top, #e3e3e3, #b8b8b8); background: linear-gradient(top, #e3e3e3, #b8b8b8); background: linear-gradient(top, #e3e3e3, #b8b8b8); top: 45px; left: 50%; margin-top: -15px; margin-left: -15px; border-radius: 50%; } .bs-wizard > .bs-wizard-step > .bs-wizard-dot::after { content: " "; width: 65px; height: 65px; /* background: #01a69f; */ background: #048f88; background: -webkit-gradient( linear, left top, left bottom, from(#03ded3), to(#048f88) ); background: linear-gradient(top, #03ded3, #048f88); background: linear-gradient(top, #03ded3, #048f88); background: linear-gradient(top, #03ded3, #048f88); background: linear-gradient(top, #03ded3, #048f88); text-shadow: rgb(0 0 0 / 30%) 0 1px 0; box-shadow: inset 2px 3px 4px 0 rgb(0 0 0 / 20%); box-shadow: inset 2px 3px 4px 0 rgb(0 0 0 / 20%); box-shadow: inset 2px 3px 4px 0 rgb(0 0 0 / 20%); border-radius: 50px; position: absolute; top: 7px; left: 7px; } .bs-wizard > .bs-wizard-step > .progress { position: relative; border-radius: 0 !important; height: 8px !important; box-shadow: none; margin: 10px 0 40px !important; background: #e3e5e4; } .bs-wizard > .bs-wizard-step > .progress > .progress-bar { width: 0; box-shadow: none; background: #e3e5e4; } .bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar { width: 100%; } .bs-wizard > .bs-wizard-step.active > .progress > .progress-bar { width: 50%; } .bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar { width: 0%; } .bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar { width: 100%; } .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot { background-color: #e3e5e4; } .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot::after { background: #b8b8b8; /* opacity: 0; */ } .bs-wizard > .bs-wizard-step:first-child > .progress { left: 50%; width: 50% !important; } .bs-wizard > .bs-wizard-step:last-child > .progress { width: 50% !important; } /* office chairs */ /* ---- sortchairs ---- */ .sortchairs .chair { padding: 0 20px 20px; min-height: 500px; } .sortchairs .border img { padding: 5px; max-height: 330px; } .officev2 .chair .title h3 { font-size: 1em !important; font-weight: 400 !important; display: block; margin: 0; padding: 0 10px; height: 35px; } .sortchairs .chair .options { display: flex; padding: 0 0 0 10px; } .sortchairs .chair .options ul { list-style-type: none; padding: 0; } .sortchairs .chair .options li { margin: 0 0 4px; text-align: left; font-size: 0.6em; } .sortchairs .chair .options li { background: url("https://eu.evocdn.io/dealer/1048/content/media/Categories/tick-bullet.svg") no-repeat left center; background-size: 14px; padding-left: 20px; } /* clear fix */ .sortchairs::after { content: ""; display: block; clear: both; } .ex-category-officechairs .chair .border { overflow: hidden; position: relative; } .ex-category-officechairs .chair .discontinuedribbon { position: absolute; background: #777; color: #fff; transform: rotate(-45deg); text-align: center; top: 32px; left: -32px; width: 145px; z-index: 1; } .circle { height: 20px; width: 20px; background-color: #bbb; border-radius: 50%; display: inline-block; } .circle.whitecircle { background: #fff; border: solid 1px #bbb; } .circle.grey { background: #999; border: solid 1px #999; } .circle.cblack { background: #000; border: solid 1px transparent; } .circle.brown { background: #9b583a; border: solid 1px transparent; } .circle.darkblue { background: #284e97; border: solid 1px transparent; } .circle.lightblue { background: #3a88b2; border: solid 1px transparent; } .circle.lightgreen { background: #6e9748; border: solid 1px transparent; } .circle.yellow { background: #eeb63f; border: solid 1px transparent; } .circle.lightorange { background: #f29f39; border: solid 1px transparent; } .circle.orange { background: #d25c27; border: solid 1px transparent; } .circle.red { background: #e30613; border: solid 1px transparent; } .circle.hotpink { background: #ae4a76; border: solid 1px transparent; } .circle.burgundy { background: #800020; border: solid 1px transparent; } .circle.charcoal { background: #36454f; border: solid 1px transparent; } .circle.tan { background: #d2b48c; border: solid 1px transparent; } .circle.mandarin { background: #f37a48; border: solid 1px transparent; } .officev2 .reset { display: inline-block; position: relative; bottom: 5px; left: 10px; } .officev2 .no-results { text-align: center; font-size: 1.2em; } /* ui group */ .officev2 .filters { padding: 20px 0; position: sticky; top: 40px; background: #fff; width: 100%; z-index: 10; } .ui-group { display: inline-block; margin: 0 5px 10px; background: #f2f2f2; padding: 0 5px 5px; border-radius: 5px; } .ui-group .filter-select { width: 100%; } .ui-group h3 { display: block; margin-right: 0.2em; font-size: 14px; font-weight: 500; } .ui-group .button-group { display: inline-block; margin-right: 20px; } /* Buying Guide */ .guide .guiderow p { color: #9d9d9c; padding: 5px 0; } .guide .guideright p { color: #fff; } .guiderow { padding: 20px 0; } .guiderow .col-sm-4 img { margin: 0 auto 20px; } .guide .s3 { width: 70%; } .guide .s2 { width: 80%; } .guide .s1 { width: 90%; } .guideright { background: #35495c; padding: 10px; text-align: center; border-radius: 8px; margin: 0 0 20px; } .guideright img { padding: 10px 0; } .guide .guideright a.arrow, a.whitearrow { display: inline-block; text-indent: -20000px; width: 30px; height: 30px; background: url(https://eu.evocdn.io/dealer/1048/content/media/Categories/Buying%20Guides/Whitearrow.svg); background-size: cover; } .guide .guiderow a.arrow, a.arrow { display: inline-block; text-indent: -20000px; width: 26px; height: 26px; background: url(https://eu.evocdn.io/dealer/1048/content/media/Categories/Buying%20Guides/Purplearrow.svg); background-size: cover; } .guide .red { background: #d9155c; border-radius: 10px; padding: 10px; color: #fff; text-align: center; margin: 30px 0 40px; display: inline-table; } .guide .red a { color: #fff; } .guide .red h2 { background: none !important; color: #fff !important; } .guide .red h3 { background: none; color: #fff; } .paper-greenarrow { width: 30px; left: 30px; position: relative; } .guidebluebox p { padding: 10px 0; } .guide .check { width: 40px; } .guide .sticker { margin: 20px 0; top: 20px; position: relative; display: flex; align-items: center; justify-content: center; } .guide .sticker img { position: absolute; z-index: 0; } .guide .sticker p { position: relative; z-index: 0; text-align: center; color: #fff; padding: 10px; font-size: 14px; } .guide .labelletters { padding: 5px; height: 325px; } .guidetable .link { width: 40px; display: inline-block; margin: 0 5px 0 0; } .guide .guidebluebox { /* width: 100%; */ /* clear: both; */ font-size: 12px; /* height: 190px; */ border: solid 2px #3a99d8; display: inline-block; border-radius: 10px; margin: 0 0 10px; } .guide .guidebluebox h2 { background: #3a99d8; padding: 5px 10px; margin: 0; border-radius: 5px 5px 0 0; color: #fff; text-transform: uppercase; font-weight: bold; } .guidebluebox img { padding: 10px; } /* tabs */ .nav-tabs { border-bottom: 2px solid #ddd; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover { border-width: 0; } .nav-tabs > li > a { border: none; color: #fff; background: #62269e; } .nav-tabs > li.active > a, .nav-tabs > li > a:hover { border: none; color: #62269e !important; background: #fff; } .nav-tabs > li > a::after { content: ""; background: #62269e; height: 2px; position: absolute; width: 100%; left: 0; bottom: -1px; transition: all 250ms ease 0s; transform: scale(0); } .nav-tabs > li.active > a::after, .nav-tabs > li:hover > a::after { transform: scale(1); } .tab-nav > li > a::after { background: #62269e none repeat scroll 0% 0%; color: #fff; } .tab-pane { padding: 15px 0; } .tab-content { padding: 20px; border: solid 1px #ccc; } /* contact form */ .form { border: solid 5px #ddd; display: inline-block; margin: 20px 0; padding: 5px; } .form h3 { text-align: center; padding: 10px; background: #b1b1b1; color: #fff; margin: 20px 0; clear: both; } .stickyform { padding: 20px 0; position: sticky; top: 40px; background: #fff; width: 100%; z-index: 10; } .stickyform .inline-group { display: inline-block; margin: 0 5px 10px; padding: 0 5px 5px; } /* switch and save */ .switchPage { border: solid 5px #f2f2f2; background: #f2f2f2 !important; padding: 40px 20px; border-radius: 20px; display: inline-block; } .switchPage .input-group-addon { background: #5f269e; color: #3af2b9; } .switchPage .form .col-sm-12, .switchPagebackground { background: #f2f2f2 !important; padding: 40px 20px; } .switchPagethankyou .switchPagebackground { text-align: center; } .switchPage .page-content .btn { margin: 20px 0; } .switchPage .g-recaptcha { display: inline-block; } .switchPage img.arrow { width: 60px; margin: 30px 0 0; } .switchleft p { font-size: 1.2em; padding: 0 20px; } .switchright { padding: 0 20px; } .switchPage #step-2 .col-sm-6.text-center { border-left: solid 3px #5f269e; } .switchPage .page-content h2 { font-size: 2.75em !important; color: #61279e !important; font-weight: 600 !important; } .switchPage h4 { font-weight: 500 !important; font-size: 1.3em !important; } .simpleinputs .form-control { border-radius: 0; border: 1px solid #fff; } .switchPage .textmiddle { position: absolute; top: 50%; transform: translateY(-50%); transform: translateY(-50%); transform: translateY(-50%); } .switchPage #overlay { position: absolute; left: 0; top: 0; bottom: 0; right: 0; background: #fff; opacity: 1; z-index: 1; text-align: center; padding: 20px; } .switchPage #overlay .fa { color: #000; position: absolute; top: 50%; /* position the top edge of the element at the middle of the parent */ left: 50%; /* position the left edge of the element at the middle of the parent */ transform: translate(-50%, -50%); /* This is a shorthand of */ } .switchPage #loading { width: 50px; height: 57px; position: absolute; top: 50%; left: 50%; margin: -28px 0 0 -25px; } /* boardroom */ .boardroom .box { padding: 20px 0; border: solid 1px #61279e; text-align: center; height: 240px; } .boardroom .boxfull { padding: 60px 0 20px; border: solid 1px #10d0c8; background: #10d0c8; text-align: center; height: 240px; } .boardroom h2, .boardroom h3 { color: #61279e !important; } .boardroom h2 { text-align: left; margin: 0; padding: 0 0 20px; font-size: 2.75em !important; color: #61279e; font-weight: 300; } .boardroom .box img { padding: 20px; height: 100px; } .boardroom a.arrow { display: block; margin: 0 auto; } .boardroom .box { padding: 20px 0; border: solid 1px #61279e; text-align: center; height: 240px; } .boardroom .boxfull { padding: 60px 0 20px; border: solid 1px #10d0c8; background: #10d0c8; text-align: center; height: 240px; } .boardroom .boxfullheight { padding: 60px 0 20px; border: solid 1px #10d0c8; background: #10d0c8; text-align: center; height: 100%; } .boardroom .boxfull h3, .boardroom .boxfull h4, .boxfullheight h3, .boxfullheight h4 { color: #fff !important; } .boardroom .boxes { padding-bottom: 20px; } .boardroom .boxes-bottom h3, .boardroom .boxes-bottom h2 { color: #fff !important; padding: 0; font-size: 1.75em !important; } .boardroom .boxes-bottom { position: absolute; bottom: 20px; left: 15px; color: #fff; padding: 5px 10px 5px 20px; width: 100%; z-index: 1; } .boardroom .boadroom-curve .curve { position: absolute; bottom: 0; left: 0; padding: 20px 15px; } .boardroom .boadroom-curve .responsive.image { width: 100%; } .boardroom .boxes-bottom .from { color: #10d0c8; font-weight: 300; } .boardroom .boxes-bottom .cost { font-weight: 600; } .boadroom-chat { cursor: pointer; } /* brands */ .ourbrands .catalog-grid h2, .ourbrands .page-content .catalog-grid h2, .ourbrands .brands h3, .ourbrands .best h3 { color: #61279e !important; } .ourbrands .brands img { padding: 20px; } .ourbrands a.arrow { display: block; margin: 0 auto; } .ourbrands .brands { padding: 20px 0; border: solid 1px #ececec; } .ourbrands .material { background: #35495c; padding: 20px 0 0; color: #fff; text-align: center; } .ourbrands .material h3 { margin-top: 20px; color: #fff !important; font-size: 1em !important; } .ourbrands .material img { margin: auto; vertical-align: middle; max-height: 80px; max-width: 80px; display: inline-block; } /* Business services */ .business .imagebackground { position: relative; } .business .content.topleft { top: 0; left: 0; width: 50%; } .content.topright { top: 0; right: 0; width: 50%; } .business .content.bottomright { bottom: 0; right: 0; width: 50%; } .business .content.bottomleft { bottom: 0; left: 0; width: 50%; } .business .imagebackground .content { margin: 0 auto; position: absolute; padding: 40px; color: #fff; } .business .imagebackground .content h2 { color: #85754e !important; } .business .imagebackground .content p { color: #fff; } .business .bluebackground { background: #3a99d8; color: #fff; border-right: 15px solid #fff; border-left: 15px solid #fff; } .business .bluebackground .content h2 { color: #fff !important; font-size: 2.5em; text-align: center; } .business .bluebackground .content { position: absolute; top: 50%; transform: translateY(-50%); transform: translateY(-50%); transform: translateY(-50%); color: #fff; } .business img.icon { width: 28px; position: absolute; left: 20px; } ul.checklist li::before { content: ""; display: inline-block; height: 20px; width: 30px; background-image: url(https://eu.evocdn.io/dealer/1048/content/media/Content_Pages/Check.svg); background-repeat: no-repeat; } ul.checklist li { font-size: 1.3em; font-weight: 300; list-style: none; } .secure-shredding .alt-background .row:nth-child(odd) { background: #f2f2f2; } /* workwear */ .workwear .workwearchat:hover { cursor: pointer; } .workwearform .container { position: relative; } .workwearform::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.6; } .workwearform h3 { color: #fff; font-size: 2.4em; font-weight: 700; padding: 0 0 20px; } .workwearform h3 span { color: #10cfc9; font-size: 0.75em; font-weight: 500; text-align: right; float: right; padding: 5px 0 0; } .workwearform .btn { background: #10d0c9; } .workwear .cost { background: #fff; color: #000; position: absolute; right: 0; bottom: 20px; width: 68px; height: 68px; display: flex; border-radius: 34px; text-align: center; font-weight: 600; justify-content: center; align-items: center; z-index: 1; } .workwear .cost p { padding-left: 5px; padding-right: 5px; text-align: center; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; } .workwear .cost .from { font-weight: 500; text-transform: uppercase; font-size: 0.8em; } .workwear .btn { background: #fff; color: #000; padding: 10px; font-size: 1em; text-transform: uppercase; font-weight: 600; } .workwear .product img { max-height: 250px; margin: 0 auto; } .product .relative { text-align: center; } .workwear .title { min-height: 60px; } .workwear .title h3 { text-transform: uppercase; font-size: 1.2em; color: #fff; } .workwear .product { background: url(https://eu.evocdn.io/dealer/1048/content/media/Content_Pages/Workwear/workwear-Purple-gradient-background.jpg); background-repeat: no-repeat; background-size: cover; padding: 20px; } .workwearform { background: url(https://eu.evocdn.io/dealer/1048/content/media/Content_Pages/Workwear/workwear-warehouse.jpg); background-repeat: no-repeat; background-size: cover; position: relative; padding: 40px 0; } /* black friday */ .black-friday-category-banners { display: none; } /* cyber monday */ .cyber-monday-category-banners { display: none; } /* ink page */ .inktonerfinderwidget { margin: 0; } .inktonerfinder section.zonetop { margin-bottom: 15px; background: url("https://eu.evocdn.io/dealer/1048/content/media/Ink--Toner-page-header.jpg"); background-size: cover; display: none; padding: 40px 0; } .inktonerfinder_wrapper .fa-print::before { content: ""; display: inline-block; position: absolute; z-index: 0; width: 26px; height: 26px; border-radius: 13px; border-radius: 13px; border-radius: 13px; background-color: #fff; } .inktonerfinder_wrapper .fa-print::after { /* content: ''; background: url("/dealer/1048/content/media/printer-icon.svg"); */ height: 1em; padding-left: 1.3em; content: ""; display: inline-block; background-size: contain; background-repeat: no-repeat; top: 5px; left: 5px; position: relative; background-image: url(https://eu.evocdn.io/dealer/1048/content/media/printer-icon.svg); } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 41px; position: absolute; top: 1px; right: 1px; width: 20px; } .inktonerfinder .row-breadcrumb { display: none; } .inkfinder-right { color: #fff; background-color: rgb(92 51 139 / 75%); padding: 20px; border-radius: 0; display: inline-block; width: 100%; margin: 0; } .inkfinder-right h2, .inkfinder-right h3, .inkfinder-right p { color: #fff; } .inkfinder-right img { position: absolute; z-index: 1; left: 0; /* top: 42px; */ width: 200px; } /* brand pages */ .officefurnitureelev8mono .officefurniture-brands .bannerstext h2, .officefurnitureelev8touch .officefurniture-brands .bannerstext h2 { /* font-size: 1.4em !important; background: #3a99d9; margin: 0 0 0 0; padding: 0 20px 0; right: 15px; left: 65%; */ font-size: 1.4em !important; top: 30px; bottom: 0; right: 15px; left: 15px; padding: 0 20px 0 0; margin: 0; text-align: right; background: rgb(92 51 139 / 70%); } .officefurniture-brands h2 { font-size: 2.5em; text-align: center; padding: 20px 0 40px; color: #35495c; } .officefurniture-brands .box h2 { font-size: 1.6em !important; color: #35495c !important; } .officefurniture-brands .bluebox p { color: #fff; } .officefurniture-brands .bluebox h2 { padding: 10px 0 0; font-size: 2em !important; color: #fff !important; } .officefurniture-brands .pink h2 { font-size: 1.6em !important; color: #fff !important; } .officefurniture-brands .greybackground { background: #9d9d9c; padding: 0; margin: 40px 0; } .officefurniture-brands .greybackground p { color: #fff; padding: 20px 10px; } .bluebox { display: inline-block; background: #3a99d8; margin: 20px 0 30px; padding: 20px 0; color: #fff; } .bluebox h2, .bluebox p, .bluebox .box h2 { color: #fff !important; } .bluebox h2 { padding: 10px 0 0; font-size: 2em; } .greybox { display: inline-block; background: #ededed; margin: 20px 0 30px; padding: 20px 0; /* color: #fff; */ } .greybox h2, .greybox .box h2 { color: #61279e !important; } .greybox h2 { padding: 10px 0 0; font-size: 2em; } .orangebox { display: inline-block; background: #e44e27; margin: 20px 0 30px; padding: 20px 0; color: #fff; } .orangebox h2, .orangebox p, .orangebox .box h2 { color: #fff !important; } .orangebox h2 { padding: 10px 0 0; font-size: 2em; } .bluebigbox div { background: #3a99d8; } .bluebigbox img { max-height: 240px; margin: 0 auto; text-align: center; display: inherit; padding: 20px; } .bluebigbox h2 { color: #fff; font-size: 1.8em; } .pink div { background: #d9155c; color: #fff; } .pink img { max-height: 240px; margin: 0 auto; text-align: center; display: inherit; padding: 20px; } .pink h2 { color: #fff; font-size: 1.8em; } .finish { color: #60279e; } .finish h2 { text-align: center; color: #60279e; font-weight: 300; font-size: 1.8em; } .griddivs { display: grid; grid-gap: 10px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } .furniture-banner img { width: 100%; position: relative; } .furniture-banner { position: relative; } .furniture-banner .container { position: relative; width: inherit; bottom: 0; right: 0; text-align: right; } .furniture-banner .container h2, .furniture-banner .container h1 { float: right; text-align: right; margin: -78px 0 0; z-index: 1; position: relative; color: #fff; background: #3a98d9; width: fit-content; font-size: 3em; padding: 10px; } /* founditcheaper - rollover the product title to show text */ .founditcheaper { display: none; position: absolute; z-index: 1000; width: 350px; padding: 5px; box-shadow: 0 5px 10px rgb(0 0 0 / 30%); transition: top 0.3s ease-in-out, opacity 0.5s ease; background: #9f5cbf; border-radius: 8px; } .product-name::selection ~ .founditcheaper { display: block !important; } .founditcheaper::after { content: ""; height: 0; width: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid #9f5cbf; position: absolute; top: -12px; left: 66px; margin: 0; z-index: 100; } .founditcheaper .fa { margin: 0 10px 0 0; font-size: 2.3em; float: left; } .founditcheaper p { background: white; padding: 15px; line-height: 1.5; } .founditcheaper span { vertical-align: middle; } .founditcheaper h4 { color: white; font-size: 1.2em; font-weight: 600; padding: 5px 10px; line-height: 1.3em; } /* carousel */ .carousel { position: relative; overflow: hidden; } .carousel-inner { position: relative; overflow: hidden; width: 100%; } .carousel-inner > .item { display: none; position: relative; transition: 0.6s ease-in-out left; transition: 0.6s ease-in-out left; } .carousel-inner > .item > img, .carousel-inner > .item > a > img { line-height: 1; } .carousel-inner > .active, .carousel-inner > .next, .carousel-inner > .prev { display: block; } .carousel-inner > .active { left: 0; } .carousel-inner > .next, .carousel-inner > .prev { position: absolute; top: 0; width: 100%; } .carousel-inner > .next { left: 100%; } .carousel-inner > .prev { left: -100%; } .carousel-inner > .next.left, .carousel-inner > .prev.right { left: 0; } .carousel-inner > .active.left { left: -100%; } .carousel-inner > .active.right { left: 100%; } .carousel-control { position: absolute; top: 0; left: 0; bottom: 0; width: 15%; opacity: 0.5; filter: alpha(opacity=50); font-size: 20px; color: #000; text-align: center; text-shadow: 0 1px 2px rgb(0 0 0 / 60%); } .carousel-control.right { left: auto; right: 0; } .carousel-control:hover, .carousel-control:focus { outline: 0; color: #000; text-decoration: none; opacity: 0.9; filter: alpha(opacity=90); } .carousel-control .icon-prev, .carousel-control .icon-next, .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right { position: absolute; top: 50%; z-index: 5; display: inline-block; } .carousel-control .icon-prev, .carousel-control .glyphicon-chevron-left { left: 50%; } .carousel-control .icon-next, .carousel-control .glyphicon-chevron-right { right: 50%; } .carousel-control .icon-prev, .carousel-control .icon-next { width: 20px; height: 20px; margin-top: -10px; margin-left: -10px; font-family: serif; } .carousel-control .icon-prev::before { content: "\2039"; } .carousel-control .icon-next::before { content: "\203a"; } .carousel-indicators { position: absolute; bottom: 10px; left: 50%; z-index: 15; width: 60%; margin-left: -30%; padding-left: 0; list-style: none; text-align: center; } .carousel-indicators li { display: inline-block; width: 10px; height: 10px; margin: 1px; text-indent: -999px; border: 1px solid #fff; border-radius: 10px; cursor: pointer; background-color: #000 \9; background-color: rgb(0 0 0 / 0%); } .carousel-indicators .active { margin: 0; width: 12px; height: 12px; background-color: #fff; } .carousel-caption { position: absolute; left: 15%; right: 15%; /* bottom: 20px; */ z-index: 10; padding-top: 20px; padding-bottom: 20px; color: #fff; text-align: center; text-shadow: 0 1px 2px rgb(0 0 0 / 60%); } /* Slider */ .slick-slide { margin: 0 20px; } .slick-slider { width: 100%; } .slick-slide img { width: 100%; } /* interiors header */ body.interiors { color: #878787; font-family: Montserrat, sans-serif !important; } .interiors h1, .interiors h2, .interiors h3, .interiors h4, .interiors h5, .interiors p, .interiors li, .interiors .btn { font-family: Montserrat, sans-serif !important; } .interiors .navbar-brand { padding: 35px 20px 10px 0; line-height: 1em; height: auto; } .interiors .navbar-brand img { max-width: 200px; width: 100%; } .interiors .nav.navbar-nav { padding: 20px 0; } .interiors .navbar { padding: 0; margin: 0; background: #45474b; min-height: inherit; border-color: #45474b; } .interiors .navbar-nav { float: right; } .interiors .navbar-nav li a { padding: 20px 10px; text-transform: uppercase; color: #fff; } .interiors .dropdown-menu li a { color: #45474b; } .interiors .navbar-nav .active a { color: #00c6b1; background-color: transparent; } .interiors .navbar-nav .active a:hover { color: #00c6b1; background-color: transparent; } .interiors .navbar .headerbtn { margin: 7px 0 0; display: inline-block; text-transform: uppercase; } .tel-interiors { padding: 15px 20px 0 10px; } .tel-interiors .fa-circle { color: #5f279e; } .interiors .navbar ul li { margin: 0; color: #fff; } .interiors .full { width: 100%; } /* banner */ .interiors-banner { position: relative; background: url("https://eu.evocdn.io/dealer/1048/content/media/interiors-banner2.jpg") no-repeat; background-size: cover; padding: 40px 0; } .interior-project-slider-nav { margin: 20px 0; } .interior-project-slider-for .slick-slide, .interior-project-slider-nav .slick-slide { margin: 0 5px; } @media screen and (max-width: 992px) { .interiors-banner { position: relative; background-size: cover; padding: 10px 0; margin: 0; } /* .interior-project-slider-nav .slick-slide img { max-width: 992px; } .interior-project-slider-for .slick-slide img { max-width: 992px; } */ } .interiors-banner .content { position: relative; /* width: 70%; bottom: 40px; left: 0; */ text-align: left; /* top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); */ z-index: 3; } .interiors-banner img { width: 100%; position: relative; } .interiors-banner::before { content: ""; position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: rgb(94 93 92 / 80%); z-index: 2; } .interiors-banner .container { background: 0 0; } .interiors .interiors-banner h1 { font-weight: 400; font-size: 3em; color: #fff; margin: 20px 0 0; } .interiors .interiors-banner h2 { font-weight: 600; font-size: 3em; color: #fff; } .interiors .interiors-banner h3 { font-weight: 400; font-size: 1.8em; color: #fff; } .interiors .quote p { font-style: italic; font-size: 1.2em; } .interiors .quote p::before { /* content: open-quote; font-size: 4em; line-height: 0.1em; margin-right: 0.18em; vertical-align: -0.4em; */ content: "\201C"; position: absolute; top: -40px; left: 50%; transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 3rem; height: 2rem; font: 8em/1.08em "PT Sans", sans-serif; color: inherit; text-align: center; } .interiors .quote p::after { visibility: hidden; content: close-quote; /* content: close-quote; */ } /* interior button */ .interiors .btn { border-radius: 0; font-size: 14px; font-weight: 600; padding: 10px; } .interiors .btn-primary { min-height: inherit; text-transform: uppercase; } .interiors .btn-default { min-height: inherit; text-transform: uppercase; } .interiors .content.topleft { position: absolute; top: 50%; transform: translateY(-50%); transform: translateY(-50%); transform: translateY(-50%); left: 0; width: 40%; } .interiors .imagebackground .content h2 { color: #fff !important; font-size: 3em; font-weight: 600; } .interiors .breadcrumb { display: none; } .interiors .target { margin: 0 auto; max-width: 50%; } .interiors .targets h3 { font-size: 1.4em !important; color: #59348a; font-weight: 400; padding: 0 30px; } /* general styles - interiors */ .interiors .spacer { padding: 40px 0 0; } .interiors .innerspacer { padding: 40px 0; } .interiors .text-primary { color: #00c6b1 !important; } .interiors .purpleheader { color: #59348a !important; } .interiors .purplebackground { background: #59348a; color: #fff; } .interiors .greenbackground { background: #00c6b1; color: #fff; } .interiors .greentext { color: #00c6b1; } .interiors .greybackground { background: #45474b; color: #fff; } .interiors .whitebackground { background: #fff; color: #f7f7f7; } .interiors .well { text-align: center; color: #fff; font-size: 2em; font-weight: 600; border-radius: 0; margin: 0; padding: 40px 0; border: none; } .interiors h1, .interiors h2, .interiors h3 { font-weight: 600; } .interiors p { color: inherit; } .grey-text { color: #292c2e; } .interiors .middle { position: relative; top: 50%; transform: translateY(-50%); transform: translateY(-50%); transform: translateY(-50%); } .interiors .footer-links li { list-style: none; } .interiors .footer-links li a { color: inherit; } .interiors .catalog-grid .container-full { max-width: 100%; margin: 0 auto; width: 100%; padding: 0; } .interiors .centre { display: block; vertical-align: middle; text-align: center; height: 100%; padding: 0 120px !important; } .flex-middle { display: flex; align-items: center; padding: 0; } .flex-middle .col-sm-6 { padding: 0; } .interiors h2 { font-size: 3em !important; color: inherit; } .interiors h3 { font-size: 2em !important; color: inherit; } /* form */ .interiors .form-control { border-radius: 0; border: #ddd solid 1px; } .interiors .contact-form h2 { font-size: 2.6em !important; color: inherit; } .interiors .contact-form h3 { font-size: 2.6em !important; color: inherit; } .interiors input { text-transform: none; } .interiors ::input-placeholder { /* WebKit browsers */ text-transform: uppercase; } .interiors :placeholder { /* Mozilla Firefox 4 to 18 */ text-transform: uppercase; } .interiors ::placeholder { /* Mozilla Firefox 19+ */ text-transform: uppercase; } .interiors :input-placeholder { /* Internet Explorer 10+ */ text-transform: uppercase; } .interiors ::placeholder { /* Recent browsers */ text-transform: uppercase; } /* interior footer */ .interiors .interiors-footer { background: #222; border-top: none; color: #fff; padding: 40px 0; } .interiors .footer-links { padding: 0; } .interiors section.zonebottom { display: none; } .interiors .site-footer h2 { font-size: 1.3em !important; text-transform: uppercase; } .interiors .site-footer h3 { font-size: 1em !important; text-transform: uppercase; } .interiors #loyaltylion { display: none; } .interiors .contact-form { /* background: url("https://eu.evocdn.io/dealer/1048/content/media/interiors-form-background.jpg"); background-repeat: no-repeat; background-size: cover; */ margin: 0 auto; padding: 80px 0; /* color: #fff; */ } .interiors .contact-form .left { text-align: center; } .interiors .contact-form .left h2 { color: #5f279e; } .interiors .contact-form .left h3 { color: #5f279e; } .interiors .carousel { background: url("https://eu.evocdn.io/dealer/1048/content/media/interiors-testimonial-background_1.jpg"); background-repeat: no-repeat; background-size: cover; margin: 0 auto; padding: 50px 0; } .interiors #interiorTestimonialCarousel { position: relative; } .interiors #interiorTestimonialCarousel::before { content: " "; position: absolute; width: 100%; height: 65px; top: 0; z-index: 1; background: #fff; } .interiors .container { background: transparent; } .interiors .carousel .carousel-inner { z-index: 2; position: relative; padding: 0 100px; /* width: 600px; */ margin: 0 auto; } .interiors .carousel .item { color: #fff; font-size: 14px; text-align: center; overflow: hidden; min-height: 290px; } .interiors .carousel .item .img-box { width: 135px; height: 135px; margin: 0 auto; background: #fff; border: solid 1px #ccc; overflow: hidden; border-radius: 50%; display: inline-flex; text-align: center; vertical-align: middle; } .interiors .carousel .img-box img { margin: 0 auto; padding: 10px; width: 100%; } .interiors .carousel .testimonial-large { padding: 30px 0 10px; color: inherit; font-size: 2em; font-weight: 600; } .interiors .carousel .testimonial { padding: 0 0 10px; } .interiors .carousel .overview { font-style: italic; } .interiors .carousel .overview b { text-transform: uppercase; color: inherit; display: block; font-weight: 600; } .interiors .carousel .carousel-control { width: 40px; height: 40px; margin-top: -20px; top: 50%; background: none; } .interiors .carousel-control i { font-size: 68px; line-height: 42px; position: absolute; display: inline-block; color: #fff; } .interiors .carousel .carousel-indicators { bottom: 20px; } .carousel-control.left.carousel-control-prev { left: 100px; } .carousel-control.right.carousel-control-next { right: 100px; } .interiors .carousel-indicators li, .interiors .carousel-indicators li.active { width: 10px; height: 10px; margin: 1px 3px; border-radius: 50%; } .interiors .carousel-indicators li { background: #999; border-color: transparent; box-shadow: none; } .interiors .carousel-indicators li.active { background: #00c6b1; box-shadow: none; } @media (max-width: 1200px) { .interiors .navbar .headerbtn { display: none; } } @media (max-width: 990px) { .interiors .navbar-brand img { max-width: 140px; } .interiors .navbar-nav li a { padding: 20px 7px; } .interiors h2 { font-size: 2em !important; } .interiors h3 { font-size: 1.4em !important; } .interiors .centre { padding: 20px !important; } .interiors .quote p::before { top: -5px !important; } .interiors .quote p { font-size: 1em; } .interiors .contact-form h2 { font-size: 2em !important; } .interiors .contact-form h3 { font-size: 1.8em !important; } .interiors .carousel .carousel-inner { padding: 0 !important; } } @media (max-width: 770px) { .interiors .navbar-nav { float: none !important; } .interiors .navbar-brand { padding: 15px 20px 10px !important; } .interiors .navbar-toggle { position: relative; float: right; margin-right: 15px; padding: 10px; margin-top: 8px !important; margin-bottom: 8px; background-color: transparent; background-image: none; border: 1px solid transparent; border-radius: 0; } .interiors .nav.navbar-nav { padding: 0 0 20px; text-align: center; } .interiors-banner .content { position: absolute; width: 100%; left: 0; text-align: left; } .interiors .interiors-banner h1 { font-size: 1.5em !important; } .interiors .interiors-banner h2 { font-size: 1.3em !important; } .interiors .interiors-banner h3 { font-size: 1em !important; } .interiors .quote p::before { top: -5px !important; } .interiors .centre { padding: 40px 20px !important; } .flex-middle { display: inline-block; align-items: center; padding: 0; } .carousel-control.left.carousel-control-prev { left: 0; } .carousel-control.right.carousel-control-next { right: 0; } } /* ink page */ .inktonerfinder_wrapper { background-color: rgb(92 51 139 / 75%); margin: 0; padding: 20px; border-style: none; border-radius: 0 !important; } .infinder-links { background-color: rgb(92 51 139 / 75%); margin: 10px 0; padding: 20px; border-radius: 0; /* display: inline-block; */ width: 100%; } .infinder-links div { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); grid-auto-rows: 20px; grid-gap: 5px; margin: 0; padding: 0 0 20px; } .infinder-links img { width: 16px; margin: 0 16px 0 0; left: 5px; position: relative; z-index: 1; } .inklink { text-align: left; padding: 5px 10px; margin: 0 10px; min-height: 36px; background-color: #8c50af; } a.inklink:hover { background: #8c50af; } .inktonerfinder i.fa.fa-print { position: relative; top: -3px; } a.inklink::before { content: ""; display: inline-block; position: absolute; z-index: 0; width: 26px; height: 26px; border-radius: 13px; border-radius: 13px; border-radius: 13px; background-color: #fff; } .inktonerfinder_wrapper h5 { color: #fff; font-size: 1.15em; } .inktonerfinder .btn[disabled] { color: #fff; background: #9f5bc0; } .inkselectform .btn { width: 100%; } .inktonerfinderwidget { margin: 0; } .inktonerfinder section.zonetop { margin-bottom: 15px; background: url("https://eu.evocdn.io/dealer/1048/content/media/Ink--Toner-page-header.jpg"); background-size: cover; padding: 40px 0; } .inktonerfinder_wrapper .fa-print::before { content: ""; display: inline-block; position: absolute; z-index: 0; width: 26px; height: 26px; border-radius: 13px; border-radius: 13px; border-radius: 13px; background-color: #fff; } .inktonerfinder_wrapper .fa-print::after { /* content: ''; background: url("/dealer/1048/content/media/printer-icon.svg"); */ height: 1em; padding-left: 1.3em; content: ""; display: inline-block; background-size: contain; background-repeat: no-repeat; top: 5px; left: 5px; position: relative; background-image: url(https://eu.evocdn.io/dealer/1048/content/media/printer-icon.svg); } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 41px; position: absolute; top: 1px; right: 1px; width: 20px; } .inktonerfinder .row-breadcrumb { display: none; } .inkfinder-right { color: #fff; background-color: rgb(92 51 139 / 75%); padding: 20px; border-radius: 0; display: inline-block; width: 100%; margin: 0; } .inkfinder-right h2, .inkfinder-right h3, .inkfinder-right p { color: #fff; } .inkfinder-right img { position: absolute; z-index: 1; left: 0; /* top: 42px; */ width: 200px; }